[v-cloak] {
  display: none;
}

.logo {
  max-width: 10%;
}

/*color picker */
div .color-picker {
  border-left: 1px solid #000;
  border-top: 1px solid #000;
  position: absolute;
  left: 0px;
  top: 0px;
  padding: 0px;

  & ul {
    list-style: none;
    padding: 0px;
    margin: 0px;
    float: left;

    li {
      display: block;
      width: 15px;
      height: 15px;
      border-right: 1px solid #000;
      border-bottom: 1px solid #000;
      margin: 0px;
      float: left;
      cursor: pointer;
    }
  }
}

#clr_color-picker,
#clr2_color-picker {
  z-index: 5000;
}

.content {
  min-height: calc(100vh - 180px);
}
.map-content {
  max-height: 86vh;
  overflow-y: scroll;
}
.videodetail-content {
  max-height: calc(100vh - 115px);
  overflow-y: scroll;
  overflow-x: hidden;
}
.share-content {
  max-height: 86vh;
  overflow-y: scroll;
}

.tableHeightRetention {
  min-height: calc(100vh - 350px);
  max-height: calc(100vh - 350px);
}
.tableHeight {
  max-height: 74vh;
  overflow-y: scroll;
}
.tableHeightCases {
  max-height: 53vh;
}
.tableHeightBranches {
  max-height: 68vh;
}
.tableHeightSyncDevices {
  max-height: 71vh;
}
.tableHeightOperators {
  max-height: 41vh;
}
.tableHeightConfig {
  max-height: 69vh;
}
.tableHeightTags {
  max-height: 65vh;
}
.tableHeightWaps {
  max-height: 66vh;
}
.tableHeightCloudTriggerEvents {
  max-height: 45vh;
}
.tableHeightRedact {
  min-height: calc(100vh - 400px);
  max-height: calc(100vh - 400px);
  overflow-y: auto;
}
.tableHeightVideoSearch {
  /*min-height: fit-content;*/
  max-height: 54vh;
  overflow-y: auto;
}
.tableHeightVideoSearchHidden {
  min-height: 75vh;
  max-height: 75vh;
  overflow-y: auto;
}
.tableHeightVideoRequests {
  min-height: calc(100vh - 405px);
  max-height: calc(100vh - 405px);
  overflow-y: auto;
}
.tableHeightSecurity {
  min-height: calc(100vh - 320px);
  max-height: calc(100vh - 320px);
  overflow-y: auto;
}
.noTable {
  min-height: calc(100vh - 185px);
  max-height: calc(100vh - 185px);
  overflow-y: auto;
}
.tableHeightCase {
  min-height: calc(100vh - 430px);
  max-height: calc(100vh - 430px);
  overflow-y: auto;
}
.tableHeightCaseTagHistory {
  max-height: calc(100vh - 330px);
  overflow-y: auto;
}
.tableHeightTabs {
  min-height: calc(60vh);
  max-height: calc(60vh);
  overflow-y: auto;
}

.tableHeightTabs2 {
  min-height: calc(100vh - 170px);
  max-height: calc(100vh - 170px);
  overflow-y: auto;
}
.tab-pane:focus {
  outline: none;
}

.page-link {
  color: #17a2b8;
}

.page-item .active .page-link {
  background-color: #17a2b8;
  border-color: #17a2b8;
  color: #fff;
}

/* loading animation mc*/
.loading-spinner {
  border: 10px solid white;
  border-top: 10px solid #3498db;
  border-radius: 50%;
  width: 50px;
  height: 50px;
  animation: spin 1s ease-in-out infinite;
}

.loading-spinner-sm {
  border: 5px solid white;
  border-top: 5px solid #3498db;
  border-radius: 50%;
  width: 25px;
  height: 25px;
  animation: spin 1s ease-in-out infinite;
}

.loading-spinner-xs {
  border: 2px solid white;
  border-top: 2px solid #3498db;
  border-radius: 50%;
  width: 12px;
  height: 12px;
  animation: spin 1s ease-in-out infinite;
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.temp-highlight {
  animation-name: highlight;
  animation-duration: 2s;
  animation-iteration-count: 4;
  animation-timing-function: ease-in-out;
}
@keyframes highlight {
  0% {
  }
  50% {
    outline: solid 4px white;
  }
  100% {
  }
}

/* form and table */
.evoTable {
  position: sticky;
  top: 0;
  z-index: 1;
}

.input-group > .input-group-prepend {
  flex: 0 0 30%;
}
.input-group .input-group-text {
  width: 100%;
  justify-content: center;
}

.input-group-light {
  border: 1px solid #6c757d;
  border-radius: 0.25rem;
  color: #6c757d;
}

.input-group-light > .input-group-prepend {
  border-radius: 0.25rem;
  color: #6c757d;
}

.input-group-dark {
  border-color: #17a2b8;
  border-radius: 0.25rem;
  color: #17a2b8;

  & > .input-group-prepend {
    border-radius: 0.25rem;
    color: #17a2b8;

    & > .input-group-text {
      color: #17a2b8;
    }
  }
}

.heatmap > ul {
  background-color: rgb(69, 77, 84);
  color: white;
}

#modal1___BV_modal_header_ {
  padding-left: 36%;
  width: 100%;
}
.card-body {
  padding-top: 5px;
  padding-left: 5px;
  padding-right: 5px;
  padding-bottom: 5px;
}

.text-warning {
  color: #f0ad4e;
}
.text-green {
  color: green;
}

/* Map Editing */
#mapContainer {
  width: 100%;
  height: 75vh;
}

/*  Start of Footer  */

.footer {
  background-color: #383b40;
  padding-block: var(--space-m);
}

.footer ul {
  list-style-type: none;
}

.footer ul li {
  font-size: var(--step--1);
  color: #ffffff;
  margin-block-start: 0.5em;
}

.footer ul li a {
  color: #ffffff;
  text-decoration: none;
  font-size: var(--step--1);
}

.footer-items {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
}

.footer-items ul li:first-child {
  margin-block-end: 1.5em;
}

.footer-items > * {
  margin-block-start: 1.5em;
}

.branding {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.copyright {
  margin-block-start: 2em;
  padding: 0;
  display: flex;
  justify-content: center;
}

.icons {
  display: flex;
  align-items: center;
}

.icons li + li {
  margin-left: var(--flow-space, 1em);
}

.icons li a {
  transition: all 0.3s ease-in-out;
}

.icons li a:hover {
  color: #81be41;
}

hr {
  height: 0;
  border-top: 1px solid rgba(0, 0, 0, 0.1);
  border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}

@media only screen and (max-width: 600px) {
  .footer .footer-items {
    justify-content: center;
    flex-direction: column;
    margin-inline: auto;
  }
}

/* End of Footer */

/* Navigation */

.navbar-light {
  background-color: #2b2e33;
  padding-block: 0.8em;
}

.navbar-content > * {
  margin-inline-start: 1.5em;
}

.navbar-text {
  color: hsl(219, 30%, 91%) !important;
}

.navbar-light .navbar-nav .nav-link {
  color: hsl(219, 30%, 91%);
}

.navbar-light .navbar-nav .nav-link:hover {
  color: hsl(219, 30%, 91%);
}

.badge-danger {
  font-variant: small-caps;
  text-transform: lowercase;
  font-family: var(--font-primary);
  padding: 0.5em;
}

.navbar-content {
  display: none;
}

/* End of Navigation */

/* Buttons */

.btn {
  max-width: fit-content;
}

/* meida queries */
@media (min-width: 76.88rem) {
  .navbar-content {
    display: flex;
  }
}

/* End of  meida queries */