html, body {
    height: 100%;
    margin: 0px;
    padding: 0px
}

#map-canvas
{
	width:100%;
  height:100%;
	z-index:1;
	margin:0 auto;
	padding-top:50px;
}

/*
li {
    margin: 2px;
    position: relative;
    padding: 4px 0;
    cursor: pointer;
    float: left;
    list-style: none;
}
*/

button {
    margin-top: 5px;
    margin-right: 5px;
}

span.ui-icon {
    float: left;
    margin: 0 4px;
}

#listTable td {
    padding: 5px;
}

.ui-widget-header {
    display: inline-block;
}

.ui-corner-all {
    display: inline-block;
}

.search_position{
    float: left;
    padding: 4px 0;
}

.search_position_2 {
    float: left;
    padding: 2px 0;
}

.ui-state-default {
    padding: 1px 0;
}


#submit {
    position: absolute;
    left: 433px;
    z-index: 10;
    top: 0px;
}


#search_bar {
    float: left;
    padding: 1px 0;
}

#map_selector {
    position: absolute;
    bottom: 0px;
    right: 3%;
    z-index: 10;
    padding: 0 0;
}

.ui-autocomplete {
    font: 62.5% "Trebuchet MS", sans-serif;
    margin: 50px;
    max-width: 140px;
    height: 200px; 
    overflow-y: scroll; 
    overflow-x: hidden;
}

#tool_bar_tabs {
    font: 62.5% "Trebuchet MS", sans-serif;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 10;
}


#layer_control {
    width: 150px;
}

#layer_control_button {
    position: absolute;
    top: 0;
    right: 0;
    font: 82.5% "Trebuchet MS", sans-serif;
    background: #ff0000;
}

#welcome {
    height: 350px;
    width: 350px;
    z-index: 10;
    text-align: center;
    position: absolute;
    left: 35%;
    top: 25%;
    font: 82.5% "Trebuchet MS", sans-serif;
    
}

#welcome_title {
    width: 340px;
    height: 50px;
    padding: 4px 0;
}

#welcome_close {
    width: 345px;
    position: relative;
    right: 0;
    top: 0;
}

#search_spatial {
    position: absolute;
    top: 0;
    right: 15%;
    font: 82.5% "Trebuchet MS", sans-serif;
    display: inline-block;
    height: 30px;
    padding: 2.5px 0;
}

#set_distance {
    position: absolute;
    right: 0;
    top: 0;
}

#hide {
    position: absolute;
    bottom: -35px;
}

#plot {
    position: absolute;
    bottom: -350px;
    left:10px;
}


.dropdown-menu {
    max-height: 225px;
    overflow-x: hidden;
}

.dropdown-menu-right {
    max-height: 225px;
    overflow-x: hidden;
}

.dropdown-menu li {
    width: 100%;
}

.input-append .btn.dropdown-toggle {
    float: none;
}

#layer_control_container {
    position: fixed;
    top: 5%;
    left: 2%;
    width: 20%;
    height: 20%;
    z-index: 10;
}

#filter 
{
    position: relative; 
    visibility: hidden;
    z-index: 10;
    padding-left: 2px;
}

#filterBtn 
{
    position: relative; 
    padding-left: 2px;
    background-color: lightblue;
    font-size: 14px;
    color: black;
    z-index: 10;
}

#legendBtn 
{
    position: relative;
    background-color: lightgreen;
    width: 100%;
    font-size: 14px;
    color: black;
    padding-left: 2px;
}

#legend 
{
    position: relative;
    visibility: hidden;
    background-color: lightgreen;
    font-size: 16px;
    padding-left: 2px;
    color: black;
}

@media only screen and (max-width: 100px) 
{
 #legend 
   {
    max-height: 40vh;
    left: 0px;
    background-color: white;
    font-size: 10px;
    color: purple;
   }
}

#drawrow {
    position: static; 
    text-decoration:underline;
    background-color: white;
    font-size: 16px;
    padding-left: 2px;
}


#ToggleUI {
    position: absolute; 
    width: 300px; 
    bottom: 0px;
    right: 25%;
    left: 50%;
    margin-left:-150px;
}

#datelabel {
    position: absolute;
    top: 1px;
    left: 1px;
    z-index: 10;
    padding-left: 0px;
    padding-top: 0px;
    font-size: 17px;
}

#mainlabel { font-size: 18px; }