main {
    animation: fadein 0.7s;
    -moz-animation: fadein 0.7s; /* Firefox */
    -webkit-animation: fadein 0.7s; /* Safari and Chrome */
    -o-animation: fadein 0.7s; /* Opera */
}
@keyframes fadein {
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-moz-keyframes fadein { /* Firefox */
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-webkit-keyframes fadein { /* Safari and Chrome */
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-o-keyframes fadein { /* Opera */
    from {
        opacity:0;
    }
    to {
        opacity: 1;
    }
}

html {
  overflow-y: overlay;
  xoverflow: scroll;
  xoverflow-x: hidden;
}

header, main, footer {
  xmargin-top: -55px;
}
  
@media only screen and (max-width : 599px) {
  header, main, footer {
    xmargin-top: -62px;
    margin-top: -8px;
  }
}

.navbar-fixed {
  height: 64px;
}

::-webkit-scrollbar {
  width: 5px;
  height: 5px;
  background: transparent;
}

::-webkit-scrollbar-thumb {
  background: rgba(175, 175, 175, 0.6);
  border-radius: 15px;
}

::-webkit-scrollbar-thumb:hover {
  background: rgb(141, 141, 141, 0.6);
  border-radius: 15px;
}

::-webkit-scrollbar-track {
   margin: 10px;
   background: rgba(255, 0, 0, 0);
}

body::-webkit-scrollbar-track {
  margin-top: 74px;
}

@media only screen and (max-width : 599px) {
  body::-webkit-scrollbar-track {
    margin-top: 66px;
  }
}

::-webkit-scrollbar-thumb:active {
  background: rgb(141, 141, 141, 0.6);
}
::-webkit-scrollbar-corner {
  background: transparent;
}

body {
  height: 100vh;
  background-color: #F3F3FB;

}

@media only screen and (min-height : 510px) {
  .login-box {
  height: calc( 95vh - 100px );
  }
}

@media only screen and (min-height : 660px) {
  .reg-box {
  height: calc( 95vh - 100px );
  }
}

.logo {
  float: left;
  height: 65px;
  padding: 18px;
}

.xdropdown-trigger {
  margin-right: 15px;
}
  
ul.select-dropdown,
ul.dropdown-content {
  width: auto !important;
    li > span {
    white-space: nowrap;
    }
}
  
.dropdown-content li > a {
  color:black;
}
  
.dropdown-menu-nav {
  top: -64px;
  margin-right: 7px !important;
  border-radius: 0 0 8px 8px !important;
}
  
@media only screen and (max-width : 599px) {
  .dropdown-menu-nav {
    top: -56px;
    right: 6px;
    left: -7px;
    margin-right: 0px !important;
  }
}
  
.card {
  overflow: hidden;
  xbackground-color: rgba(255, 255, 255, 0.85);
}

.xsidenav {
  background-color: rgba(255, 255, 255, 0.6) !important;
}

.xnavbar-wrapper {
  background-color: rgba(255, 255, 255, 0.6) !important;
}
  
.card-adapt {
  min-height: 115px;
  height: calc(25% - 34px);
  margin-right: -4px;
  margin-left: -4px;  
}

.card-live-4 {
  min-height: 115px;
  height: calc(25% - 50px);
  margin-right: -4px;
  margin-left: -4px;  
}

@media only screen and (max-width : 599px) {
  .card-live-4 {
      height: 115px;
  }
}
  
@media only screen and (max-width : 599px) {
  .card-adapt {
      height: 115px;
      xheight: calc(20% - 38px);
  }
}
  
.card-double {
  min-height: 244px;
  height: calc(50% - 53px);
  margin-right: -4px;
  margin-left: -4px; 
}
  
.card-single {
  min-height: 244px;
  height: calc(100% - 91px);
  margin-right: -4px;
  margin-left: -4px; 
}

.card-value2 {
  margin-top: -7px;
  white-space: nowrap;
}
  
.card-gaugevalue2 {
  white-space: nowrap;
  position: relative;
  xtop: 40%;
  top: calc(50% - 6px);
  color: white;
  padding-left: 12px;
  padding-right: 12px;
}
  
.gauge-linear {
  margin-top: -20px;
  height: calc(100% - 66px);
  xheight: calc(20vh - 90px);
  xmin-height: 64px;
}
  
.card-title {
  white-space: nowrap;
  overflow: hidden;
}

.modal {
  overflow: visible;
}

.reduced-margin {
  margin-top: 5px;
  margin-bottom: 5px;
}

.dropdown-content {
  overflow-y: overlay;
  position: absolute;
  position: fixed !important;
}

nav{
  background-color: black;
}