html, body, #map_canvas {
  height: 100%;
  width: 100%;
  margin: 0;
  padding: 0;
  font-family: Arial, Helvetica, sans-serif;
}
#top-bar, #bottom-bar, .table-container, .table-container table { 
  width: 100%; 
}
#top-bar {
  border-bottom: 1px solid #8e8e8e;
}
#bottom-bar {
  border-top: 1px solid #8e8e8e;
}
.table-container { font-size: 0.9em; }
.table-container td { text-align: center; border-bottom: 10px solid #efefef; font-weight: bold; color: #818181; }
.table-container a { color: #a5a5a5; }
#bottom-bar td { display: none; border: none; }
.tdctrl { height: 30px; opacity: 1; }
.tdctrl:hover { opacity: 0.3; }
#q {
  width: 45%;
  border: 2px solid #DDDDDD;
  font-size: 1em;
  padding: 0.2em;
}
#q-container {
  margin-left: 0.7em;
  margin-bottom: 0.5em; 
}
input[type="submit"] {
  border: 2px solid #DDDDDD;
  cursor: pointer;
  padding: 0.2em 0.3em;
  font-size: 1em;
  font-weight: bold;
  border-left: none;
}
#title {
  color: #b8b8b8;
  font-size: 2em;
  font-weight: bold;
  text-shadow: 1px 1px 1px #8F8F8F;
}
.leaflet-left .leaflet-control {
  margin-left: 0;
}
.leaflet-top .leaflet-control {
  margin-top: 0;
}
.share {
  padding-left: 10px;
}
.share img { border-radius: 4px; background-color: #fff; box-shadow: 0 1px 5px rgba(0, 0, 0, 0.65); }