html, body {
  overflow: auto;
  height: 100%;
}

#app {
  height: 100%;
  background-color: #d8d8d8;
}
#app .page {
  min-height: 100%;
}
#app .main {
  min-height: 100%;
}
#app .theme-desktop-light {
  background-color: #d8d8d8 !important;
}
#app .theme-mobile-dark {
  background-color: #212121 !important;
}
#app .b-layout.b-layout-root {
  height: 100%;
}
#app .navbar-dark .navbar-nav .dropdown-menu a.nav-link {
  color: #1e2b37;
}
#app .navbar-dark .navbar-nav .dropdown-menu a.nav-link:active {
  color: #fff;
}
#app label {
  display: block;
}
#app .btn {
  margin-right: 5px;
}
#app .btn-group, #app .btn-group-vertical {
  display: flex;
}
#app textarea {
  margin-top: 15px;
}
#app .table th, #app .table td {
  border-top: 0;
}
#app .mi-header {
  background-color: #fff;
  border-bottom: 1px solid #c7c7c7;
}
#app .mi-subnav .btn {
  margin-right: 1.25rem;
}
#app .mi-subnav .navbar {
  padding-left: 0;
  padding-right: 0;
}
#app .card {
  margin-bottom: 15px;
}
#app .card .card .card-header:before {
  display: none !important;
}
#app div.card:not(.bg-dark) .card-header {
  background-color: #fff;
  position: relative;
  overflow: hidden;
}
#app div.card:not(.bg-dark) .card-header:before {
  display: block;
  content: "";
  width: 100px;
  height: 60px;
  position: absolute;
  right: -62px;
  top: -35px;
  background-color: #729749;
  transform: rotate(40deg);
}
#app .btn-primary:not(:disabled):not(.disabled):active, #app .btn-primary:not(:disabled):not(.disabled).active, #app .show > .btn-primary.dropdown-toggle, #app a.btn-primary:not(:disabled):not(.disabled):active, #app a.btn-primary:not(:disabled):not(.disabled).active, #app a.show > .btn-primary.dropdown-toggle {
  background-color: #1e2b37;
}
#app .collapse.show .card-body .card-body {
  background-color: #f3f3f3;
}
#app .mw-callout-form .form-group {
  padding-top: 10px;
  padding-bottom: 20px;
}
#app .mw-callout-form .mw-callout-row-dark {
  background-color: #1e2b37 !important;
  color: #fff !important;
  padding-left: 20px;
  padding-right: 20px;
}
#app .custom-switch .custom-control-input.custom-control-input-md + .custom-control-label {
  vertical-align: top;
}
#app .modal.url-display-modal .modal-dialog.modal-xl {
  height: 95%;
}
#app .tui-full-calendar-vlayout-area {
  height: auto !important;
}
#app .tui-full-calendar-vlayout-area div[data-auto-height=true] {
  height: auto !important;
}
#app input[type=file] {
  font-size: 1rem;
  line-height: 1.5;
  font-weight: 400;
  border: 1px solid transparent;
  border-radius: 0.25rem;
  padding: 0.375rem 0.75rem;
  color: #FFFFFF;
  background-color: #004563;
  border-color: #004563;
}
#app input[type=file]:hover {
  cursor: pointer;
}
#app .signature-modal hr {
  display: none;
}
#app .signature-modal .signature-pad {
  box-shadow: none;
  background-color: rgba(0, 0, 0, 0.05);
}
#app .signature-modal .signature-pad .signature-pad--body canvas {
  background-color: white;
}
@media (max-width: 768px) {
  #app .steps .custom-steps-nav .step {
    margin: auto;
  }
  #app .steps .custom-steps-nav:first-child {
    margin-left: 0;
  }
}
#app .step-container {
  width: 7rem;
  min-width: 7rem;
  max-width: 7rem;
}
#app .step-container .step-circle {
  margin: auto;
}
#app .step-container .step-circle::before {
  width: 6.5rem;
}
@media (max-width: 768px) {
  #app .step-container {
    padding-right: 0;
  }
  #app .step-container .step-circle::before {
    display: none;
  }
}
.grey-card .card-body {
  background-color: #f3f3f3;
}
/*this is a workaround for a Datepicker bug - https://github.com/Megabit/Blazorise/issues/4818 */
.flatpickr-calendar.static {
    top: unset !important;
}