:root{
  --dark: #33333F;
  --dark-grey: #3F3F4A;
  --disabled: #707070;
  --white: #ffffff;
  --light: #ced4da;
  --primary: #C44742;
}

*{
  -moz-appearance: none !important;
  -webkit-appearance: none !important;
}

body{
  background-color: var(--dark);
  font-family: 'Roboto', sans-serif;
  color: var(--white);
}

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);
}

.link{
  text-decoration: none;
  color: var(--light);
}

.link:hover{
  text-decoration: none;
  color: var(--white);
}

.main{
  padding: 32px 0 64px 0;
}

.big-label{
  font-size: 1.125em;
  font-weight: 700;
}

.big-value{
  font-size: 3em;
}

.reg-label{
  font-size: .875em;
  font-weight: 700;
}

.reg-value{
  font-size: 1.5em;
}

.ad-horizontal-mobile{
  /* height: 50px;
  width: 300px; */
  text-align: center;
}

.app-inhouse-ad{
  width: 320px;
  height: 50px;
}

.inhouse-ad{
  width: 300px;
  height: 300px;
}

.display-ads{
  display: block;
  margin: auto;
}

.footer-bg{
  background-color: var(--dark-grey);
  color: var(--white);
}

.s-hide{
  display: none;
}

.alert{
  position: absolute !important;
  bottom: 30px;
  left: 30px;
}

.alert-hide{
  display: none;
}

#loading{
  position: absolute;
  left: 50%;
  top: 50%;
  height: 64px;
  width: 64px;
  margin: -32px 0 0 -32px;
}

#loader-container{
  position: absolute;
  height: 100vh;
  width: 100%;
  background-color: var(--white);
  z-index: 9999;
}

#gmap_canvas {
    width: 100%;
}

/* Download Page */
.download-btn{
  height: 56px;
}

.brand-name-app{
  margin: 0;
  position: absolute;
  top: 50%;
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

.brand-bg img{
  width: 100%;
  max-width: 400px;
}

.brand-app-bg img{
  width: 100%;
  max-width: 64px;
}

.bottom-seperator{
  border-bottom: 1px solid;
  border-color: #707070;
}

/* captive window */
.captive{
  display: none;
}

.non-captive{
  display: block;
}

.inline-ads{
  display: inline-block;
}

#ip-issue-link {
  font-size: 0.8rem;
  color: #d3d3d3;
}

#ip-issue-link:hover {
  color: #fff;
}

@media screen and (max-height: 70px){
  
  .captive{
    display: block;
    overflow-y: hidden;
    overflow-y: -moz-hidden-unscrollable;
  }

  .non-captive{
    display: none;
  }

  body{
    overflow: hidden;
  }

}

@media (min-width: 1200px) {
  .s-hide{
    display: block;
  }
}

@media (max-width: 768px) {
  .display-4{
    font-size: 2.2em !important;
  }

  .big-value{
    font-size: 2em;
  }

  .reg-value{
    font-size: 1.2em;
  }
 
  .main{
    padding: 10px 0 10px 0;
  }
}