/*!***********************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./assets/scss/clock.scss ***!
  \***********************************************************************************************************************************************************/
@import url(https://fonts.googleapis.com/css2?family=Roboto+Mono:wght@700&display=swap);
/*!***************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./assets/scss/clock.scss (1) ***!
  \***************************************************************************************************************************************************************/
/*
Shared

Contains all the functions, mixins and variables used globally
across all style entries

!important May not contain any css
*/
.page-clock {
  height: 100%;
  background: rgb(0, 57, 124) !important;
}
.page-clock .page-wrap,
.page-clock .page-main {
  height: 100%;
  min-height: 0;
}
.page-clock .page-main {
  border: 16px solid transparent;
  border-top-width: 32px;
}
.page-clock .navbar {
  font-weight: 700;
  background-color: rgb(0, 164, 228);
}
.page-clock .navbar-brand {
  color: #fff !important;
}
.page-clock .navbar-brand-img {
  margin-right: 8px;
}
.page-clock .footer {
  background: none;
}
.page-clock .footer-logo {
  height: auto;
  width: 200px;
  width: clamp(200px, 50%, 400px);
}
.page-clock .tooltip {
  opacity: 1;
}
.page-clock .tooltip-inner {
  border: 6px solid rgb(0, 164, 228);
  max-width: 320px !important;
  background: #fff;
  padding: 16px;
  font-size: 16px;
  color: rgb(0, 57, 124);
  border-radius: 12px;
  font-weight: 700;
}
.page-clock .tooltip .arrow {
  overflow: hidden;
  width: 40px;
  height: 15px;
}
.page-clock .tooltip .arrow::before {
  background: #fff;
  width: 20px;
  height: 20px;
  transform: rotate(45deg);
  position: absolute;
  left: 50%;
  top: 0;
  margin: -10px;
  border: 6px solid rgb(0, 164, 228);
}
.page-clock .bs-tooltip-top, .page-clock .bs-tooltip-auto[x-placement^=top],
.page-clock .bs-tooltip-bottom, .page-clock .bs-tooltip-auto[x-placement^=bottom] {
  padding: 9px 0;
}
.page-clock .bs-tooltip-left, .page-clock .bs-tooltip-auto[x-placement^=left],
.page-clock .bs-tooltip-right, .page-clock .bs-tooltip-auto[x-placement^=right] {
  padding: 0 9px;
}
.page-clock .pnotify-container.is-online-status {
  min-height: 64px !important;
  align-items: center !important;
}
.page-clock.is-offline {
  background-color: rgb(114.4, 27.56, 35.88) !important;
}
.page-clock.is-offline .code-svg {
  color: rgb(248, 214.6, 217.8) !important;
}
.page-clock.is-offline .navbar {
  background-color: rgb(248, 214.6, 217.8) !important;
}
.page-clock.is-offline .tooltip-inner {
  color: rgb(114.4, 27.56, 35.88) !important;
}
.page-clock.is-offline .tooltip-inner,
.page-clock.is-offline .tooltip .arrow::before {
  border-color: rgb(248, 214.6, 217.8) !important;
}
@media screen and (orientation: landscape) and (max-height: 480px) {
  .page-clock .footer {
    padding: 12px 0 12px;
  }
  .page-clock .footer-logo {
    width: auto;
    height: 48px;
  }
}
@media screen and (orientation: landscape) and (max-height: 320px) {
  .page-clock .navbar {
    display: none;
  }
  .page-clock .footer-logo {
    height: 36px;
  }
}

.clock-svg {
  width: 100%;
  height: 100%;
  fill: currentColor;
  color: #fff;
}
.clock-svg-txt {
  font-family: Roboto Mono, Open Sans, sans-serif;
}
.clock-svg-info {
  cursor: help;
}