/* RESIZE THE WEBPAGE TO SEE THE AFFECT */

/* With Autoprefixer Applied */

html {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

*, *:before, *:after {
  -webkit-box-sizing: inherit;
  -moz-box-sizing: inherit;
  box-sizing: inherit;
}

html, body {
  height: 100%;  
  padding: 0;
  margin: 0;
  display: block;
  background-color: #111 !important;
}

.container {
 height: 100%;
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 -webkit-box-orient: vertical;
 -webkit-box-direction: normal;
     -ms-flex-direction: column;
         flex-direction: column;
  background-color: #111 !important;
}

.header {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  padding: 0 1rem;
}
h2,h3,h4{
  color:#6fd2e2;
}
div.container{
  
  color: #CCC;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  
  
}
.form-signin {
  width: 100%;
  max-width: 330px;
  padding: 15px;
  margin: 0 auto;
  background-color: #111;
  color: #CCC;
}
.form-signin .checkbox {
  font-weight: 400;
}
.form-signin .form-control {
  position: relative;
  box-sizing: border-box;
  height: auto;
  padding: 10px;
  font-size: 16px;
}
.form-signin .form-control:focus {
  z-index: 2;
}
.form-signin input[type="email"] {
  margin-bottom: -1px;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}
.form-signin input[type="password"] {
  margin-bottom: 10px;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

.icon-box:hover {
  transform: scale(1.08);
}



.card-img-top {
  width: 100%;
  height: 65vw;
  object-fit: cover;
}

.btn {
  font-size: 0.75rem !important;
}


.map-container {
  height: 100%;
  /* Fallback for vmin */
  padding: 0px 1rem 1rem 1rem;
  padding: 0px 1vmin 1vmin 1vmin;
}

.map-frame {
  height: 100%;
  width: 100%;
/*   We use outline over border as has issues in some cases */
  outline: 1px solid black;
}

#map-id { 
  height: 100%;
}

/* 
Support for browsers that DON'T support Flexbox uses 100% height on the map-container defined above.
Map will at least render, for the small amount of browsers that DON'T support flexbox. Users will just have to scroll abit ¯\_(ツ)_/¯
*/
@supports (display: flex) {
  .map-container {
    height: 0;
    -webkit-box-flex: 1;
        -ms-flex: 1 0 auto;
            flex: 1 0 auto;
  }

  .map-frame {
    -webkit-box-flex: 1;
        -ms-flex: 1 0 auto;
            flex: 1 0 auto;
  }
}


.leaflet-popup-close-button {
  display: none;
}

.myDivIcon {
  text-align: center;
  /* Horizontally center the text (icon) */
  line-height: 20px;
  /* Vertically center the text (icon) */
}