* {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border-spacing: 0;
    font-family: 'Roboto', 'Roboto Condensed';
    -webkit-tap-highlight-color: transparent;
}

.maincontainer {width:100%; position:relative;}
#map {width:100%; height: 510px; position: absolute !important; top:0; left:0;}
.overlay {position:relative;margin: 0 auto;}
.locale_ar .overlay {left:auto; right:-360px;}
.header {position:absolute; top:50px; left:15px; width:350px; height:130px; background: #1465a5 url("../img/mapicon.png") top left no-repeat;}
.locale_ar .header {background-position: top right;}
.title, .subtitle {margin-left:130px; color:white; }
.locale_ar .title, .locale_ar .subtitle {margin-left:0; margin-right:130px;}
.title {margin-top:50px; font-size:larger; font-weight: bold;}
.selectorform {position:absolute; top:200px; padding: 0 0 30px 0; text-align:center; left:15px; width:350px; height: 250px; background:rgba(245,250,255, 0.83);}
.selectorform h2 {float:left; display:block; width:300px; padding: 10px; margin: 0 !important; text-align: left; color: #06365d !important;}
.locale_ar .selectorform h2 {float:right; text-align:right;}
.fullwidthcontainer {width:100%; float: left;}
.locale_ar .fullwidthcontainer {float:right;}
.placeholder {margin:0 15px; float:left; }
.locale_ar .placeholder {float:right;}
.dd-select {border-radius: 0; border:1px solid white;}
.dd-selected {padding: 0; height: 39px; line-height: 2.6; font-weight:normal;text-align: left;margin: 0 30px 0 10px;}
.locale_ar .dd-selected {text-align: right;}
.dd-selected label{   cursor:pointer;}
.dd-selected:hover {text-decoration:none !important; }
.dd-options {border-top: solid 1px #ccc; text-align:left;}
.locale_ar .dd-option {text-align: right; padding-right:30px}
.dd-option-selected {background: #f5faff}
.dd-option:hover {background: #f5faff;text-decoration: none !important;}
a.locateme {width:200px; height:40px; float: right; margin: 0 15px 0 0; background: #f99d28; color:white; line-height: 2.5; font-weight: bold; cursor:pointer;}
.locale_ar a.locateme {float:left; margin: 0 0 0 15px;}
a.locateme:hover {color:white; text-decoration: none !important;}
.selectorform input[type=checkbox] {
	visibility: hidden;
}
.styledChk {
	width: auto;
	margin: 20px 10px;
	position: relative;
	display:inline;
	cursor:pointer;
}
.styledChk span img {width:18px;position:relative; top:-4px;}

.styledChk label {
	cursor: pointer;
	position: absolute;
	width: 20px;
	height: 20px;
	top: -2px;
	float: left;
	left: -5px;
	background: #fff;
}

.locale_ar .styledChk label {left:auto; right:-5px}

.styledChk label:after {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	filter: alpha(opacity=0);
	opacity: 0;
	content: '';
	position: absolute;
	width: 9px;
	height: 5px;
	background: transparent;
	top: 4px;
	left: 4px;
	border: 3px solid #333;
	border-top: none;
	border-right: none;

	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

.styledChk label:hover::after {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
	filter: alpha(opacity=30);
	opacity: 0.5;
}



.styledChk input[type=checkbox]:checked + label:after {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	opacity: 1;
}

.poslist {position:relative; max-width: 1000px; margin:0 auto;}
.poslist h2 { margin: 0 !important; text-align: left; font-size: 20px !important;color: #06365d !important;padding-bottom: 0 !important;padding-top: 40px !important;}
.locale_ar .poslist h2 {text-align:right;}
.poslist .pos {width:100%;float:left; font-size: small;transition: background 0.5s;}
.column {width:33%;float:left; padding: 5px 0; text-align:left;}
.locale_ar .column {float:right;text-align: right;}
.poslist .column  div, .poslist h2 {padding: 15px; margin:0}
.poslist .addresscolumn,.poslist .telcolumn,.poslist .timescolumn {width:30%; padding: 15px;float:left;}
.poslist .pos.odd{background:#f5faff;}
.spacer {clear: both; padding-bottom: 60px;}



@media (max-width:1070px) {
 #map {position: relative !important;height:300px; width:100%; margin:0 auto;}
 .overlay, .locale_ar .overlay {position:relative; left:0; right:0; width:100%;height: 400px;}
 .header, .selectorform {left:0px;}
 .header, .selectorform {width:100%;}
 .esriSimpleSliderTL {
    top: 425px;
    left: 97.1%;
}
}
@media (max-width:700px) {
  .poslist .column {width:50%;float:left;}
  .poslist .times {float:right;}
  .locale_ar .poslist .column {width:50%;float:right;}
  .locale_ar .poslist .times {float:left;}


}
@media (max-width:470px) {
  .poslist .column {width:100%;float:left;}
  .poslist .times {float:left;}
  .locale_ar .poslist .column {width:100%;float:right;}
  .locale_ar .poslist .times {float:right;}
  .placeholder, .locale_ar .placeholder {float:none;}
  .placeholder .dd-container {margin: 0 auto;}
  a.locateme {float:none; display: block; margin: 0 auto 0;}
  .locale_ar a.locateme {float:none; display: block; margin: 0 auto 0;}
  .overlay, .locale_ar .overlay {height: 510px;}
}

@media (max-width:410px) {
  .selectorform .column {width:100%; float:left; margin:10px;}
  .locale_ar .selectorform .column {width:100%; float:right;}
  .overlay, .locale_ar .overlay {height: 640px;}
}