@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@100;400;700&display=swap');

body {
  font-family: 'Poppins', sans-serif;

}


#map {
  position: fixed;
  top: 0;
  left:0;
  bottom: 0;
  width: 100%;
  height: 100%;
}

.popup{
  font-family: 'Poppins', sans-serif;
 
}

.mapboxgl-popup-content{
 background-color:#080a0d;
 min-width:350px;
 padding:25px;

   /* These are technically the same, but use both */
  overflow-wrap: break-word;
  word-wrap: break-word;

  -ms-word-break: break-all;
  /* This is the dangerous one in WebKit, as it breaks things wherever */
  word-break: break-all;
  /* Instead use this non-standard one: */
  word-break: break-word;

  /* Adds a hyphen where the word breaks, if supported (No Blink) */
  -ms-hyphens: auto;
  -moz-hyphens: auto;
  -webkit-hyphens: auto;
  hyphens: auto;
}

.propPopA{

  font-size:14px;
text-transform:uppercase;
line-height:16px;
  color: #808186;
  margin-bottom:15px;
}

.propPopB{

   margin-bottom:16px;
  margin-top:0px;
  font-size:11px;
  color: #c0c1cd;
 line-height:13px;
  font-weight:500;

}

.link{
  color: #8588af;
}

.propPopC{

   margin-bottom:14px;
  margin-top:0px;
  font-size:12px;
 text-transform:uppercase;
 font-weight:bold;
  color: #7d8fb5;
 line-height:13px;
  font-weight:500;

}


.mapboxgl-popup-anchor-top .mapboxgl-popup-tip,
.mapboxgl-popup-anchor-top-left .mapboxgl-popup-tip,
.mapboxgl-popup-anchor-top-right .mapboxgl-popup-tip {
  border-bottom-color: #080a0d;
}
.mapboxgl-popup-anchor-bottom .mapboxgl-popup-tip,
.mapboxgl-popup-anchor-bottom-left .mapboxgl-popup-tip,
.mapboxgl-popup-anchor-bottom-right .mapboxgl-popup-tip {
  border-top-color: #080a0d;
}
.mapboxgl-popup-anchor-left .mapboxgl-popup-tip {
  border-right-color: #080a0d;
}
.mapboxgl-popup-anchor-right .mapboxgl-popup-tip {
  border-left-color: #080a0d;
}

.searchtab{
  position:absolute;
 width:10%;
 left:45%;
 top:40px;
 
}

#mySelect1{


padding-left:10px;
   background: #343b49;
  color:#ffffff;
  border-radius: 5px;
 border-color:transparent;
 text-transform:uppercase;
   height: 30px;
  font-size:13px;
}

#left-tab{
 border-radius:10px;
 top:20px;
 padding:30px;
 position:absolute;
  background-color:#080a0d;
 transition: left 0.8s ease-in-out;
}

#legend{

 padding:5px 0px 0px 28px;
 width:660px;
 position:fixed;
 background-color:#000000e3;

 bottom:50px;
 border-radius:10px;
}

.imglink{
 width:30px;
 margin-right:10px;
 float:left;
 margin-top:9px;
padding-bottom:10px;
}

.mapboxgl-popup-content >.imglink{
 width:100%;
margin-bottom:10px;
}

.box-leg{
 width:70px;

float:left;
 
}

.box-leg >.propPopA{
 font-size:9px;
color:#fff;
 width:70px;
 text-align:center;
 line-height:12px;
 margin-left:-19px;
}

.title{
 margin-top:10px;
 margin-bottom:10px;
 font-size:15px;
color:#fff;
 text-transform:uppercase;
}