/*screen_width_and_mobile*/
@media all and (max-width: 1250px) {
  #largeMapTitle{
    width: 250px;
  }
}
@media all and (max-width: 1100px) {
  body{
    position: absolute;
    width: 100vw;
    height: 100%;
    min-height: 100%;
  }

  /*Footer Changes*/
  #footer{
    height: 85px;
    z-index: 8;
    background-color: white;
  }
  #share{
    display: none;
  }
  .right-footer{
    display: none;
  }
  .footer-button{
    width: 45%;
    text-align: center;
    display: inline-block;
    margin-right: 2%;
    margin-left: 2%;
  }
  #methodology{
        width: 13%;
  }
  #introduction{
    width: 30%;
  }
  #resources{
    width: 30%;
  }

  .centered-footer{
    width:100%;
    margin-left: 0px;
    height: 100%;
    z-index: 20;
    left:50%;
    margin-top: 0px;
  }
  #openSideBar{
    display: block;
  }

  /*Sidebar Change*/
  .sidebar{
    width:100%;
    top: 0px;
    border-top-width: 1px;
    border-top-style: solid;
    border-top-color: black;
    border-right:none;
    height: 100%;
    z-index: 9;
    display: none;
  }
  #miniMenu-1{
    margin-top: 30px;
  }
  #after-tooltip-menu7{
    top:50px;
  }
  #after-tooltip-menu1{
    top: 70px;
  }
  #closeB{
    display: inline-block;
  }

  /* Map Header CHanges*/
  #header{
    left: 0px;
    width: 100%;
    background-color: white;
    z-index: 2;
    padding-top: 7px;
    height: 200px;
  }
  #mobileModal{
    display: none;
  }
  /* Map CHanges*/
  .map{
    width: 100%;
    height: 600px;
  }

  /* header Elements*/
  .polygonLegend{
    position: static;
    float: right;
    width: 285px;
    padding-top: 8px;
  }
  .pointLegend{
    position: absolute;
    top: 90px;
    left: 10px;
    right:auto;
  }

  #pointLegendhHeader{
    width: 100px;
  }
  #legendLabelID-Bottom{
    position: absolute;
    /* bottom: 58px; */
    right: 150px;
    bottom: 22px;
    left: auto;
  }

  #largeMapTitleContainer{
    width:100%;
    margin-left: 0px;
    padding-left: 20px;
    padding-right: 20px;
  }
  #largeSubHeader{
    width: 100%;
  }
  #largeMapTitle{
    width: 100%;
  }
  #map > div.leaflet-control-container > div.leaflet-top.leaflet-right > div{
        display: none;
  }

  /*Modals*/
  #countyDetail{
    width:95%;
  }
  #modalBottomWrapper{
    padding-left: 10px;
    padding-right: 10px;
    width: auto;
    top:155px;
  }
  .modalRight{
    display: none;
  }
  .modal-content{
    width: 95%;
  }
  .modal-content-text{
    width:90%;
  }

}