/* misc */
.break {clear: both;}

/* map */
#map-canvas {clear: left; width: 66%; height: 520px; position: relative; float: left; background-color: silver; border: solid 1px gray; margin-bottom: 20px; float: left;}

/* buttons */
a.clear, a.clear:visited, button#exedout, button.clear{display: inline-block; background-color: blue; color: white; padding: 5px 10px; margin: 10px 10px 5px 0; text-decoration: none; border: none;cursor: pointer; height: auto; font-size: 16px; font-family: arial, 'sans-serif'; line-height: 1}
a.clear:hover, a.clear:focus, button#exedout:hover, button#exedout:focus, button.clear:hover, button.clear:focus { background-color: green; color: white;  text-decoration: none;}

/* search box */
.boxedsearch {width: 33%; height: 520px; position: relative; float: right; BACKGROUND-COLOR: silver; padding: 20px; text-align: center; margin-bottom: 20px; color: black; text-align: left;}

.boxedsearch form {margin-bottom: 10px;}
.boxedsearch label .fas {font-size: 18px;}
.boxedsearch label img {position: relative; top: 10px;}
.boxedsearch p {margin: 5px 0;}
.boxedsearch label, .boxedsearch legend {font-size: 14px; white-space: normal; width: 100%; border: none; padding: 0}
legend {margin-bottom: 5px;}
.boxedsearch h3 {margin: initial; text-align: left}
.boxedsearch span {font-size: 18px;}
.boxedsearch input[type="text"], .boxedsearch select { padding: 2px 10px; margin-bottom: 5px}
.svgpin {height: 32px;}

/* legend */
.legend {width: 100%; BACKGROUND-COLOR: silver; padding: 10px 20px; text-align: center; margin-bottom: 20px; text-align: center; }
.legend_label {height: auto; display: inline-block; }
.legend_label { text-align: left; padding: 5px 0; }
.legend_label .fas, .legend_label .far, .legend_label .fa {font-size: 20px; padding: 0 5px 0 20px;}
label.blocked {width: 36%; display: inline-block;}

/* listing */
.loc_list {width: 50%; position: relative; float: left; margin-bottom: 20px;}

.listbox {padding: 10px 0 10px 42px; border-bottom: solid 1px gray; width: 88%; position: relative;  }
.listbox p {margin: 0;}
.listbox blockquote{margin: 0 20px;}

.icons span {padding: 0 5px; font-size: 20px;}

.pinned {position: absolute; top: 20px; left: 0px; width: 32px; padding: 0 4px;}
.pinned div.label {position: absolute; top: 0px; left: 0px; width: 32px; text-align: center; font-family: arial; font-size: 18px; font-weight: bold; z-index: 10 }
.pinned img {max-height: 32px;}
.legend_map_pin {width: 14px; height: 20px;  position: relative; top: 2px; margin-right: 4px;}

.locicons span {padding: 0 10px 0 0; font-size: 18px;}
.cuname {color: #005baa; font-weight: 700px; font-size: 18px;}

/* infowindow*/
input.go{background-color: blue; color: white; border: none; padding: 4px 10px; font-size: 14px; margin-left: 5px;}
.infonote{font-style: italic;}

/* directions*/
#directionsPanel{}
button#exedout {display: none;}

/* error messages */
.note {color: red; font-size: 16px;}


@media only screen and (max-width: 1100px) {
	#map-canvas, .boxedsearch {width: 100%;}
	.boxedsearch {height: 380px;}
	.boxedsearch fieldset {width: 33%;position: relative; float: right; top: -150px}
	#directionsPanel{position: absolute; top: 550px; left: 2%; width: 96%; background-color: white;z-index: 99;}
	#exedout {position: absolute; top: 515px; left: 2%;-webkit-box-shadow: 0 0 5px 0 rgba(0,0,0,.5); box-shadow: 0 0 5px 0 rgba(0,0,0,.5);}
}

@media only screen and (max-width: 800px) {
	.boxedsearch fieldset {width: 100%; float: none; top: 0}
	.boxedsearch {height: auto;}
	.loc_list {width: 100%; float: none; margin-bottom: 20px;}
	.listbox { width: 100%; }

}