/****************
* /BREAKPOINTS *
****************/
/**********
 * SPACES *
**********/
/**********
 * WIDTHS *
**********/
/**************
 * FONTS *
**************/
/**********
 * MIXINS *
**********/
/**************
 * FONT SIZES *
**************/
/********************
 * MOBILE VARIABLES *
********************/
/***************
 * BOX SHOADOW *
***************/
.statusbox-block.hide {
  display: none;
}
.statusbox-block .statusbox-wrapper {
  display: flex;
  flex-flow: row wrap;
  gap: 16px;
  justify-content: space-between;
  align-items: center;
  background: #122655;
  padding: 10px 10px;
  margin-left: -12px;
  width: calc(100% + 24px);
}
.statusbox-block .statusbox-wrapper.open {
  background: #067d68;
}
.statusbox-block .statusbox-wrapper.closed {
  background: #bb2d2b;
}
.statusbox-block .statusbox-wrapper .info-wrapper {
  flex: 1 0 auto;
  width: calc(100% - 80px);
  color: #ffffff;
}
.statusbox-block .statusbox-wrapper .info-wrapper h2 {
  color: #ffffff;
}
.statusbox-block .statusbox-wrapper .info-wrapper .h6 {
  color: #ffffff;
}
.statusbox-block .statusbox-wrapper .info-wrapper .h6.loading {
  color: #d7d7d7;
  animation: pulse 1s infinite;
}
@keyframes pulse {
  0% {
    opacity: 0.25;
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 0.25;
  }
}
.statusbox-block .statusbox-wrapper .button-wrapper {
  width: auto;
  text-align: right;
  flex: 1 0 auto;
}

@media only screen and (min-width: 720px) {
  .statusbox-block .statusbox-wrapper {
    padding: 16px 32px;
  }
  .sidebar .statusbox-block .statusbox-wrapper {
    margin-left: 0px;
    width: 100%;
    padding: 10px 16px !important;
  }
}/*# sourceMappingURL=statusbox.css.map */