/* latin */
@font-face {
  font-family: 'Fredoka One';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local('Fredoka One'), local('FredokaOne-Regular'), url(/lib/font/Fredoka_One.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* bengali */
@font-face {
  font-family: 'Galada';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local('Galada Regular'), local('Galada-Regular'), url(/lib/font/Galada_Regular.woff2) format('woff2');
  unicode-range: U+0964-0965, U+0981-09FB, U+200C-200D, U+20B9, U+25CC;
}
/* latin */
@font-face {
  font-family: 'Galada';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local('Galada Regular'), local('Galada-Regular'), url(/lib/font/Galada_Regular_2.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin */
@font-face {
  font-family: 'Monoton';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local('Monoton'), local('Monoton-Regular'), url('/lib/font/Monoton.woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin-ext */
@font-face {
  font-family: 'Fira Code';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(lib/font/fira.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
  font-family: 'Fira Code';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(lib/font/fira2.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

#mainTop {
  height: 3.7rem;
  width: 100%;
  background-color: #0288d1;
  color: #b0bec5;
  position: fixed;
  top: 0;
  left: 0
}
.leftMenu {
  width: 18rem;
}
.leftMenuSmall > .leftMenu {
  width: 4.75rem;
}
#slogan {
  font-family: 'Fredoka One', cursive;
  font-size: 2.25rem;
  position: relative;
  top: 0.31rem;
  left: 3.5rem
}
#menuSmall {
  float: right;
  position: relative;
  top: 0.875rem
}
#switchButton, #loginButton, #logoutButton {
  top: 0.625rem;
  right: 0.625rem;
}
#burgerMenu {
  top: 0.4375rem;
  left: 0.625rem;
}
#head_title {
  position: absolute;
  font-family: 'Fredoka One', cursive;
  font-size: 2.25rem;
  left: 22rem;
  top: 0.31rem;
}
#user_name {
  position: absolute;
  font-family: 'Fredoka One', cursive;
  font-size: 1.75rem;
  right: 4rem;
  top: 0.9rem;
}
.leftMenuSmall > #head_title {
  left: 7rem;
}
#client_area {
   position: fixed;
   top: 3.7rem;
   width: 100%;
   min-height: calc( 100% - 3.7rem );
}

/* Clock */
#mod_clock_outer {
  height: 257px;
  width: 600px;
  position: absolute;
  left: calc( ( 100% - 600px ) / 2);
  top: calc( ( 100% - 250px ) / 2);
}
.mod_clock_circle {
  height: 200px;
  width: 200px;
  position: absolute;
  top:0;
}
#mod_clock_hour {
  left: 0;
}
#mod_clock_minute {
  left: 200px;
}
#mod_clock_second {
  left: 400px;
}
.mod_clock_number {
  position: absolute;
  top: 41px;
  right: 49px;
  font-family: 'Fredoka One', cursive;
  font-weight: 600;
  font-size: 90px;
}
.mod_clock_text {
    font-family: 'Fredoka One', cursive;
    font-weight: 600;
    font-size: 35px;
    position: absolute;
    height: 50px;
    width: 100%;
    text-align: center;
    left: 0;
}
#mod_clock_date {
    top: 200px;
}
#mod_clock_week {
    top: 260px;
}