:root{
    --dark: #33333F;
    --dark-grey: #3F3F4A;
    --disabled: ;
    --white: #ffffff;
    --light: #ced4da;
    --primary: #C44742;
  }
  
  body{
    background-color: var(--dark);
    font-family: 'Roboto', sans-serif;
    color: var(--white);
  }

.remove-border {
    border: none;
    box-shadow: none;
    background-color: #33343e;
}

.result{
    padding: 10px 15px;
    border-bottom: 1px solid transparent;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
}

.fa-arrow-down{
    color: chartreuse;
}

.fa-arrow-up{
    color: cornflowerblue;
}

.status-button {
    opacity: 1.0 !important; 
    color: white !important;
    background-color: #33343e !important;
}
.ads{
    background-color: gray;
    padding: 20px;
}

p{
text-align: justify;
}

.align-right{
float: right;
}

.form-control{
background-color: transparent !important;
color: var(--white) !important;
}

.btn-outline{
border: 1px solid var(--light);
background-color: transparent;
width: 150px;
color: var(--light);
}

.btn-outline:hover{
background-color: var(--white);
color: var(--dark);
}

.btn-fill{
border: 1px solid var(--light);
background-color: var(--light);
width: 150px;
}

.btn-fill:hover{
background-color: var(--white);
}

.thin{
font-weight: 100;
}

.navbar-brand{
font-size: 2em !important;
font-weight: 100;
}

.nav-link{
color: var(--white) !important;
font-size: 1.125em;
}

.nav-link:hover{
border-bottom: 2px solid var(--primary);
}

.nav-active{
border-bottom: 2px solid var(--primary);
}

.main{
padding: 32px 0 64px 0;
}

.big-label{
font-size: 1.125em;
font-weight: 700;
padding-left: 15px;
padding-right: 15px;
}

.big-value{
font-size: 3em;
}

.reg-label{
font-size: .875em;
font-weight: 700;
padding-left: 15px;
padding-right: 15px;
}

.reg-value{
font-size: 1.5em;
}

.footer-bg{
background-color: var(--dark-grey);
color: var(--white);
}

.s-hide{
display: none;
}

.alert{
position: absolute !important;
bottom: 30px;
left: 30px;
z-index: 999;
}

.alert-hide{
display: none;
}


#serverInfo{
    font-size:  1rem !important;
} 

#gmap_canvas {
    width: 100%;
}

.hidden {
    display: none;
}

.inline{
    display: inline;
}

.custom-width{
    width: 40%;
}

.padding {
    padding: 10px 15px;
}

/* captive window */
.captive{
  display: none;
}

.non-captive{
  display: block;
}

.inline-ads{
  display: inline-block;
}

@media screen and (max-height: 70px){
  
  .captive{
    display: block;
    overflow-y: hidden;
    overflow-y: -moz-hidden-unscrollable;
  }

  .non-captive{
    display: none;
  }

}


@media (min-width: 1200px) {
    .s-hide{
        display: block;
    }
}

@media (max-width: 768px) {
    .display-4{
        font-size: 1.2em !important;
    }

    .big-value{
        font-size: 2em;
    }

    .reg-value{
        font-size: 1.2em;
    }

    .custom-width{
        width: 100%;
    }
}