.row {
    display: flex;
}

.cols {
    flex: 50%;
    height: 75vh;
}

.navbar {
    background-color: #e3f2fd;
    border-color: #ffffff;
    box-shadow: 2px 2px 4px rgba(0,0,0,0.5);
    padding: 1px 0px 0px 0px;
    font: bold 16px 'Roboto';
  }

  .nav-item{
    padding-left: 20px;
  }
  

#map1 {
    border-right: 2px solid grey;
}


.form-check{
    padding-bottom: 10px;
    
}
  
.submit-btn1,.submit-btn2 {
background-color: green;
color: white;
border-color: green;
box-shadow: 2px 2px 4px rgba(0,0,0,0.5);
}

.clear-btn1,.clear-btn2 {
background-color: grey;
color: white;
border-color: grey;
box-shadow: 2px 2px 4px rgba(0,0,0,0.5);
margin: 3px 0px 3px 0px;
}


.per-label{
    font: 14px 'Roboto';
}

#threshold_range{
    font: 14px 'Roboto';
}

.form-select{
    box-shadow: 2px 2px 4px rgba(0,0,0,0.5);
    margin-bottom: 4px;
}
.threshold-text{
    padding-left: 13px;
    font-size: 14px;
}

.form-group{
    
    z-index: 1000;
    font-family: 'Roboto';
}

.legend {
    position: absolute;
    bottom: 10px;
    right: 10px;
  }
.nav-item:hover {
    background-color:  rgba(204, 204, 204, 0.5);
  }