html, body {
  height: 100%; }

body.adminBody {
  padding-top: 3.5em; }

.clickable {
  cursor: pointer;
  color: blue; }

.hide {
  display: none !important; }

a {
  -webkit-user-drag: none;
  -khtml-user-drag: none;
  -moz-user-drag: none;
  -o-user-drag: none;
  user-drag: none; }

.doorControlFlex {
  display: flex;
  flex-wrap: wrap;
  margin-right: -1em; }
  .doorControlFlex .box {
    border: solid #b8daff;
    border-radius: 1em;
    width: 25em;
    margin-right: 1em;
    margin-bottom: 1em;
    display: flex;
    flex-direction: column;
    justify-content: space-between; }
    .doorControlFlex .box .description {
      font-weight: bold;
      font-size: 125%;
      margin: 1em; }
    .doorControlFlex .box .controls {
      display: flex; }
      .doorControlFlex .box .controls .custom-switch {
        padding-left: 3.25rem; }
        .doorControlFlex .box .controls .custom-switch .custom-control-label::before {
          left: -3.75rem;
          width: 2.75rem;
          border-radius: 0.75rem;
          height: 1.5rem; }
        .doorControlFlex .box .controls .custom-switch .custom-control-label::after {
          left: calc(-3.7rem + 2px);
          width: calc(1.5rem - 4px);
          height: calc(1.5rem - 4px);
          border-radius: 50%; }
        .doorControlFlex .box .controls .custom-switch .custom-control-input:checked ~ .custom-control-label::before {
          border-color: #218838;
          background-color: #218838; }
        .doorControlFlex .box .controls .custom-switch .custom-control-input:checked ~ .custom-control-label::after {
          -webkit-transform: translateX(1.15rem);
          transform: translateX(1.15rem); }
      .doorControlFlex .box .controls .left {
        padding: 0.4em 1em 0 1em;
        flex-grow: 1;
        background: #cce5ff;
        border-radius: 0 0 0 .85em; }
      .doorControlFlex .box .controls .right {
        color: #007bff;
        padding: 1em 2em;
        background: #d4edda;
        border-radius: 0 0 .85em 0; }
      .doorControlFlex .box .controls .right.pressed {
        color: white;
        background: #28a745; }

.admin_users_edit .rolesFlex {
  display: flex;
  flex-wrap: wrap; }
  .admin_users_edit .rolesFlex label {
    padding-right: 2em; }

.admin_logs_view .dateRow {
  text-align: center;
  font-weight: bold; }
.admin_logs_view tr.even {
  background-color: #f0f0f0; }

.admin {
  padding: 1rem; }
  @media (min-width: 768px) {
    .admin {
      padding: 2rem; } }
  @media (min-width: 1024px) {
    .admin {
      padding: 3rem; } }

.doorHeader {
  background: #007bff;
  display: flex;
  color: white;
  justify-content: space-between;
  align-items: center;
  position: sticky;
  top: 0;
  z-index: 100; }
  .doorHeader .doorTitle {
    font-size: 120%;
    padding: 1rem; }
  .doorHeader .doorHelp, .doorHeader .doorSchedule {
    color: #cccccc;
    padding: 1rem;
    cursor: pointer; }
  .doorHeader .doorSchedule {
    margin-left: auto; }
  .doorHeader .doorHelp.pressed, .doorHeader .doorSchedule.pressed {
    color: white; }

.doorPage {
  padding: 1rem; }
  @media (min-width: 768px) {
    .doorPage {
      padding: 2rem; } }
  @media (min-width: 1024px) {
    .doorPage {
      padding: 3rem; } }

#doorHelpWindow, #doorScheduleWindow {
  position: fixed;
  display: flex;
  flex-direction: column;
  top: 60px;
  width: 100vw;
  height: calc(100vh - 60px);
  background: #d1ecf1;
  border-radius: 0 0 1em 1em;
  padding: 0 0.5em 0.5em 0.5em;
  box-sizing: border-box;
  transition: top 0.5s;
  z-index: 90; }
  #doorHelpWindow .content, #doorScheduleWindow .content {
    height: 100%;
    width: 100%;
    background: white;
    overflow-y: auto;
    padding: 0.5em;
    box-sizing: border-box; }
  #doorHelpWindow .windowRow, #doorScheduleWindow .windowRow {
    width: 100%;
    margin-top: 0.5em;
    display: flex;
    justify-content: center; }

#doorHelpWindow.closed, #doorScheduleWindow.closed {
  top: -100vh !important; }