#map {
 width: 100%;
 position:absolute;
 top:0; 
 bottom:0; 
}

/*fix zoom bar distortion problem*/
#map *, #map *:before, #map *:after {
    -moz-box-sizing: content-box!important;
    -webkit-box-sizing: content-box!important;
    box-sizing: content-box!important;  
}

#map img {
  max-width: none;
}

#map label {
  width: auto;
  display: inline;
}

.search-form {
	position:fixed;
	z-index:1;
	right:10px;
	top:10px
}

pre.ui-output {
  display:block;
  position:absolute;
  bottom:10px;
  left:10px;
  padding:5px 10px;
  background:rgba(0,0,0,0.5);
  color:#fff;
  font-size:11px;
  line-height:18px;
  border-radius:3px;
  max-height:50%;
  max-width:25%;
  overflow:auto;
  word-wrap: break-word;
  white-space:pre-wrap;
  }
  pre.ui-output:empty { padding:0; }

.filter-ui {
  background:#fff;
  position:absolute;
  top:10px;
  right:10px;
  z-index:100;
  padding:10px;
  border-radius:3px;
  }
#map {
 width: 100%;
 position:absolute;
 top:0; 
 bottom:0; 
}

/*fix zoom bar distortion problem*/
#map *, #map *:before, #map *:after {
    -moz-box-sizing: content-box!important;
    -webkit-box-sizing: content-box!important;
    box-sizing: content-box!important;  
}

#map img {
  max-width: none;
}

#map label {
  width: auto;
  display: inline;
}

.search-form {
	position:fixed;
	z-index:1;
	right:10px;
	top:10px
}

.filter-ui {
  background:#fff;
  position:absolute;
  top:10px;
  right:10px;
  z-index:100;
  padding:10px;
  border-radius:3px;
  }

#menu {
  left: 20px;
}
Remove pre-ui styling, its already included with mapbox, add styling for position for menu
Remove pre-ui styling, its already included with mapbox, add styling for position for menu
