#map{
  overflow: hidden;
  font-family: 'Avenir LT W01 65 Medium', sans-serif;
  cursor:pointer;
}

.map_overlay_left, .map_overlay_center, .map_overlay_right{
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  cursor: default;
}
.map_overlay_left{
  z-index: 100;
  position: absolute;
  left: 20px;
  background-color: rgb(255, 255, 255);
  background-color: rgba(255,255,255, 0.9);
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#E6151515, endColorstr=#E6151515);
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#E6151515, endColorstr=#E6151515)";
  color: #fff;
  padding: 10px;
  width: 200px;
}

.addressbox{
  top: 40px;
}
.addressbox input{
  vertical-align: middle;
}
.addressbox img{
  vertical-align: middle;
  cursor: pointer;
}
.layerbox{
  /* top: 128px; */
  display: none;
}
fieldset{
  border-bottom: none;
  border-left: none;
  border-right: none;
}
legend{
  text-transform: uppercase;
  margin-left: -9px;
  color: #003C50;
}
#address{
  background: #eeeeee;
  color: #003c50;
  border: none;
  padding: 4px;
  width: 70%;
}

::-webkit-input-placeholder { /* WebKit browsers */
    color:    rgb(72, 72, 72);
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color:    rgb(72, 72, 72);
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
    color:    rgb(72, 72, 72);
}
:-ms-input-placeholder { /* Internet Explorer 10+ */
    color:    rgb(72, 72, 72);
}

.layer{
  vertical-align: middle;
  color: rgb(101, 101, 101);
  font-weight: bold;
  margin-top: 5px;
  cursor: pointer;
}
.layer span{
  vertical-align: middle;
}
.layer img{
  vertical-align: middle;
  width: 24px;
}
.layerlabel{
  margin-left: 8px;
}
.layerlabelselect{
  color: #00a6b4 !important;
}
.filterbox{
  display: block;
  top: 248px;
  /* top: 128px; */
  padding-bottom: 0px;
}
.filterselect-style{
  background: url(https://www.bostonplans.org/Map/static/BlueDropdown.png) no-repeat top right #eeeeee;
  padding: 2px 4px;
  border: 1px solid #fff;
  color: #003c50;
  margin: auto auto 10px auto;
}
select.filterselect, select.useselect{
  background: none;
  background: transparent;
  color: #003c50;
  -webkit-appearance: none;
  -moz-appearance: window;
  -ms-appearance: none;
  -o-appearance: none;
  appearance: none;
  width: 100%;
  border: none;
  outline: none;
}

select.filterselect:focus, select.useselect:focus{
  outline: none;
}

.filter{
  margin: 10px 0px;
  cursor: pointer;
  padding: 2px 0px;
  font-size: 9pt;
}
.filter:hover{
  /*background: rgb(45, 45, 45);*/
  background: white;
  color: #003c50;
}
.filter-select{
  background: #eeeeee;
}
.filter-select:hover{
  background: #d6d6d6;
}
.filter-symbol{
  visibility: hidden;
  display: inline;
  padding: 4px 5px 4px 0;
}
.filter-select .filter-symbol{
  visibility: visible;
}
#intent.filter-symbol, .intent{
  background: #00BDCD;
  color: #00BDCD;
}
#review.filter-symbol, .review{
  background: #FEBE10;
  color: #FEBE10;
}
#approved.filter-symbol, .approved{
  background: #92C83E;
  color: #92C83E;
}
#construction.filter-symbol, .construction{
  background: #EE283B;
  color: #EE283B;
}
#complete.filter-symbol, .complete{
  background: #7B0165;
  color: #7B0165;
}
.filter-label{
  margin-left: 5px;
  color: #003c50;
}
.leaflet-label{
  z-index: 800;
  background-clip: padding-box;
  border-radius: 4px;
  border-style: solid;
  border-width: 4px;
  background-color: #565656;
  background-image: -ms-linear-gradient(top, #666666 0%, #464646 100%);
  background-image: -moz-linear-gradient(top, #666666 0%, #464646 100%);
  background-image: -o-linear-gradient(top, #666666 0%, #464646 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #666666), color-stop(1, #464646));
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#666666', endColorstr='#464646');
  background-image: -webkit-linear-gradient(top, #666666 0%, #464646 100%);
  background-image: linear-gradient(to bottom, #666666 0%, #464646 100%);
  border-color: #565656;
  white-space: normal;
}
.leaflet-popup{
  cursor: pointer;
}
.leaflet-popup-tip{
  background-color: #464646;
}
.leaflet-popup-content-wrapper{
  z-index: 800;
  width:261px;
  background-clip: padding-box;
  background-color: #565656;
  background-image: -ms-linear-gradient(top, #666666 0%, #464646 100%);
  background-image: -moz-linear-gradient(top, #666666 0%, #464646 100%);
  background-image: -o-linear-gradient(top, #666666 0%, #464646 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #666666), color-stop(1, #464646));
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#666666', endColorstr='#464646');
  background-image: -webkit-linear-gradient(top, #666666 0%, #464646 100%);
  background-image: linear-gradient(to bottom, #666666 0%, #464646 100%);
  border: none;
}
a.popup-back-button {
  /*border:none;*/
  position: relative;
  top: 1px;
  /*right: 36px;*/
  /*padding: 4px 4px 0 0;*/
  text-align: center;
  width: 18px;
  height: 14px;
  font: 14px/14px Tahoma, Verdana, sans-serif;
  color: #c3c3c3;
  text-decoration: none;
  font-weight: bold;
  background: transparent;
  }
a.popup-back-button:hover {
  color: #999;
  }

a.popup-next-button {
  /*border:none;*/
  position: relative;
  top: 1px;
  left:10px;
  /*right: 18px;*/
  /*padding: 4px 4px 0 0;*/
  text-align: center;
  width: 18px;
  height: 14px;
  font: 14px/14px Tahoma, Verdana, sans-serif;
  color: #c3c3c3;
  text-decoration: none;
  font-weight: bold;
  background: transparent;
  }
a.popup-next-button:hover {
  color: #999;
  }
/*fadein animation for swiching between pages*/
.popup-container{
  overflow: scroll;
  overflow-x: hidden;
  max-height: 400px;
  width:225px;
  margin-left: 4px;
/*  margin: 5px;*/
      -webkit-animation: fadein 1s; /* Safari, Chrome and Opera > 12.1 */
       -moz-animation: fadein 1s; /* Firefox < 16 */
        -ms-animation: fadein 1s; /* Internet Explorer */
         -o-animation: fadein 1s; /* Opera < 12.1 */
            animation: fadein 1s;
            -ms-overflow-style: none;  /* IE 10+ */
              overflow: -moz-scrollbars-none;  /* Firefox */
}
.popup-container::-webkit-scrollbar {
    width: 0px;  /* remove scrollbar space */
    background: transparent;  /* optional: just make scrollbar invisible */
}
/* optional: show position indicator in red */
.popup-container::-webkit-scrollbar-thumb {
    background: #FF0000;
}
@keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Firefox < 16 */
@-moz-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Internet Explorer */
@-ms-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}
.hamburger{
  width: 35px;
    height: 5px;
    background-color: black;
    margin: 6px 0;
}
.map_overlay_left_menu{
  z-index: 100;
  position: absolute;
  left: 20px;
  background-color: rgb(255, 255, 255);
  background-color: rgba(255,255,255, 0.9);
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#E6151515, endColorstr=#E6151515);
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#E6151515, endColorstr=#E6151515)";
  color: #fff;
  padding: 10px;
  cursor:pointer;
}

/* Opera < 12.1 */
@-o-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}
/*fadein animation for swiching between pages END*/

.leaflet-label img, .leaflet-popup img{
  width: 216px;
  height: 146px;
}
.leaflet-label li, .leaflet-popup li{
  background: none;
  background: transparent;
  margin-left: -10px;
}
.leaflet-label h4, .leaflet-popup h4{
  text-transform: uppercase;
  margin-bottom: -15px;
  color: #ff784b;
  padding-left: 4px;
  padding-right: 4px;
  width: 216px;

}
.leaflet-label p, .leaflet-popup p{
  color: rgb(218, 218, 218);
  padding-left: 4px;
  padding-right: 4px;
  word-wrap: break-word;
  font-size: 9pt;
}

.map_overlay_right{
  z-index: 100;
  position: absolute;
  right: -10px;
  top: 80px;
  color: #fff;
  padding: 10px;
  text-align: center;
}
#mapviewtab{
  z-index: 101;
}
#mapselect{
  z-index: 102;
  position: absolute;
  right: -500px;
  top: 90px;
  color: #000;
  background: rgb(247, 255, 255);
  vertical-align: middle;
  padding-right:20px;
  border-top: 5px solid rgb(236, 78, 36);
  border-bottom: 5px solid rgb(236, 78, 36);
  display: none;
}
#mapselect img.tab, #mapselect div{
  vertical-align: middle;
  display: inline-block;
  text-align: center;
  zoom: 1;
  *display: inline;
}
#mapselect div{
  margin-right: 10px;
}
#mapselect img{
  margin-top: 14px;
}
#mapselect img, #mapselect p{
  cursor: pointer;
}
.maptype img{
  height: 65px;
  width: 65px;
  border: 3px solid rgb(247, 255, 255)
}
img.activemaptype{
  border: 3px solid rgb(236, 78, 36);
}
.maptypelabel{
  text-transform: uppercase;
}
#mapselect .tab{
  background: none;
  margin-left: -40px;
  margin-right: 10px;
  margin-top: -5px;
  margin-bottom: -5px;
}
.zoomtool{
  margin-left: 2px;
  margin-top: -31px;
  padding-top: 41px;
  background: rgb(247, 255, 255);
}
.zoomtool.shadowed{
  box-shadow: -3px 2px rgba(100, 100, 100, 0.3);
}
#zoomslide{
  margin-top: -8px;
  margin-bottom: -5px;
}
.zoombtn, #mapviewtab{
  cursor: pointer;
}
.title-overlay{
  color: #000;
  font-size: 8pt;
  white-space: nowrap;
  text-shadow: 1px 1px #fff, 1px -1px #fff, -1px 1px #fff, -1px -1px #fff;
  text-shadow: 1px 1px rgba(255,255,255,0.6), 1px -1px rgba(255,255,255,0.6), -1px 1px rgba(255,255,255,0.6), -1px -1px rgba(255,255,255,0.6);
}
.listviewbutton{
  z-index: 100;
  position: absolute;
  background-color: #000;
  color: #fff;
  margin-left: 45%;
  width: 10%;
  min-width: 80px;
  padding: 5px 0px;
  cursor: pointer;
}
.dot {
    display: inline-block;
    width:6px;height:6px;
    margin-left: 6px;
    margin-right: 6px;
    border-radius:6px;
    background-color:#999;
}
.dot_highlight {
    display: inline-block;
    width:6px;height:6px;
    margin-left: 6px;
    margin-right: 6px;
    border-radius:6px;
    background-color: #c3c3c3;
}
.dots_container{
  width: 225px;
  text-align : center;
}
.nvgt{
  position:absolute;
  top: 120px;
  height: 50px;
  width: 30px;
  opacity: 0.6;
}
.nvgt:hover{
  opacity: 0.9;
}
#prev{
  background: url('http://www.bostonplans.org/Map/static/prev.png') no-repeat center;
  left: -4px;
  top: 27%;
}
#next{
  background: url('http://www.bostonplans.org/Map/static/next.png') no-repeat center;
  right: -3px;
  top: 27%;
}


/* Minification failed (line 377, error number 1049): Browser hack generates invalid CSS */