body{ /* CSS for BODY transition when menu is set to push BODY content. */
	left:0px!important; right:0px!important; font-family:'pt_sansregular', Arial, sans-serif;
	margin:0px; padding:0px;
	height:100%; overflow:hidden;
	}
 
iframe {height:100%;}

.GoogleMapFrame{ height:100%;} /* Firefox used */


h2.Logo, h2.Logo em { text-align:center; font-family:'code_boldregular', Arial, sans-serif; font-size: 22px}
h2, p { text-align:center; font-family:'pt_sansregular', Arial, sans-serif;}
h2 em { color:#F00; font-style:normal;}


/* Internet Explorer 10 in Windows 8 and Windows Phone 8 Bug fix */
@-webkit-viewport {width: device-width;}
@-moz-viewport {width: device-width;}
@-ms-viewport {width: device-width;}
@-o-viewport {width: device-width;}
@viewport {width: device-width;}


#ToggleBtn { position: relative; top:380px; left:370px; height: 0px;}
#ToggleBtn button{background:#F00; padding: 0px 5px 7px 0px; margin:0px; border:0px; color:#fff; font-size:20px;
width: 47px;
height: 44px;
-webkit-border-radius: 0px 10px 10px 0px ;
-moz-border-radius: 0px 10px 10px 0px ;
border-radius: 0px 10px 10px 0px ;
box-shadow:3px 2px 6px rgba(174, 174, 174, .8);
}
#ToggleBtn button:hover {padding: 0px 0px 7px 10px;}

.sidetogglemenu{ /* shared class for side toggle menus */
	border-right: 5px solid #FF2400;
	background-color: white;
	width: 370px; /* default menu width */
	height: 100%;
	position: fixed;
	top: -100%;
	clear: both;
	display: none;
	visibility: 'hidden';
	box-shadow: 5px 0 5px rgba(174, 174, 174, .8);
	-moz-transition: all 500ms ease-in-out; /* change 100ms to slide in animation time */
	-webkit-transition: all 500ms ease-in-out;
	transition: all 500ms ease-in-out;
	visibility:hidden;
}

.sidetogglemenu ul{ border-top:1px solid #C0C0C0;padding: 0;margin: 0;list-style: none;overflow: auto;overflow-x: hidden; height: 310px;}
.sidetogglemenu ul li { padding:0px; margin:0px;}
.sidetogglemenu ul li.active a {color:#fff; background: #333 url('../images/sidetogglemenu_active.png') no-repeat center right;}
.sidetogglemenu ul li a{
	font:cursor:pointer; cursor:hand;
	padding: 10px;
	display: none;
	color: #595959;
	text-decoration: none;
	border-bottom:1px solid #DDDDDD; overflow: hidden;
}
.sidetogglemenu ul li a:hover{background-color:#333;color:#fff;}

/* #######  Responsive Menu related CSS  ####### */

div#smallscreentoggler{ /* CSS for small screen menus toggler, shown when device width is below specified */
	width:100%;
	height:40px;
	/*width:40px;
	height:40px;*/
	z-index: 10000;
	color: white;
	position: relative;
	float: right;
	overflow: hidden;
	background: #F00;
	font: normal 1.8em Arial;
	margin-bottom: 0px;
	text-align: right;
	cursor: pointer;
	display: none;
	padding: 3px 8px 0px 0px;

	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;

}

div#smallscreentoggler:hover{background:#333;color:#fff;}
/*div#smallscreentoggler span {
	width: 0;
	height: 0;
	border-left: 13px solid transparent;
	border-right: 13px solid transparent;
	border-top: 13px solid #fff;
	display: block;
	margin: 10px auto;

	}*/


/* Results */
#results .distance-box { overflow:hidden; display:none; background:#EBEBEB; border-top: 1px solid #ccc; padding: 4px 0px 0px 0px;}
#results .distance-units {overflow: hidden; width:122px; margin: 0 auto; display: block;}
#results .distance-units label.km,
#results .distance-units label.miles { width:60px; display: none;float: left; text-transform: uppercase; font-size: 13px;}
#results .distance-units label input {position: relative;top:2px; margin-right: 2px;}
#results .Number {float: left; padding: 3px 7px;background: #F00; color: #fff; margin-right: 6px;
-webkit-border-radius: 7px;
-moz-border-radius: 7px;
border-radius: 7px;
}

#results .ListName {font-weight: normal; float: left; display: none; overflow: hidden; width: 100%;}
#results .Name{font-weight: bold; float: left;}
#results .Address {font-weight: normal;}
#results .distance { float:right; padding:2px 5px; margin-top:3px; border-radius:7px; clear:both; display:none;  color:#1E8B03; font-style:italic;}

/* Direction */
#GetDirection { padding:0px;}
#GetDirection h2 {background: #E2E2E2 url('../images/h2_bg_arrowdown.png') repeat-x center bottom; width:100%; max-width: 100%!important; padding-left:0px; padding-right:0px; padding-top:7px; padding-bottom:14px}
#GetDirection form { padding:10px;}

#DirectionList { padding:0px;}
#DirectionList h2 {background: #E2E2E2 url('../images/h2_bg_arrowdown.png') repeat-x center bottom; width:100%; max-width: 100%!important; padding-left:0px; padding-right:0px; padding-top:7px; padding-bottom:14px}





@media screen and (max-width: 80px){ /* CSS when device width is 480px or less */
  #ToggleBtn { display:none;}
  div#smallscreentoggler{
		display: none;
		/* show small screen menus toggler */
	}
	.sidetogglemenu{ /* Set position of menus to static */
		position: static;
		border-width: 0;
		border-top-width: 1px;
		width: 100% !important;
		height: auto;
		box-shadow:none!important;
		margin:52px 0px 10px 0px;
		display: none;


	}
	#GetDirection .btn {padding: 6px 6px!important;}
}


/* Map Area */
/* Google Map Popup */
//اهنا الصورة بلنكليزي
.maps_popup { overflow: auto;    }
.maps_popup .img { float: right; padding:5px; border:0px solid #ccc; width:150px; width:150px; margin:10px 0 5px 5px; background: #fff;}
.maps_popup h1 {font-size:14px; font-weight: bold; border-bottom: 1px solid #ccc; padding:5px 0px; margin:0 0 5px 0;}
.maps_popup h2 { font-size: 12px; padding:0; margin:0 0 5px 0;}
.maps_popup p { text-align:left; padding:0; margin:10px 0px 5px 0;}
.maps_popup div { text-align:left; font-weight:bold;padding:0; margin:10px 0px 5px 0;}
.maps_popup .BtmLinks { margin-bottom: 12px;display: block;overflow: hidden; text-align:left;border-top: 1px solid #ccc;padding-top: 10px;}
.maps_popup .EmailBtn { display: block;padding: 7px 0px;margin: 0px;}
.gm-style-iw {  }

 //اهنا الصورة
.maps_popup_rtl{ float: right; direction:rtl; unicode-bidi:bidi-override; overflow: auto;}
.maps_popup_rtl .img { float: left; padding:1px; border:0px solid #ccc; width:150px; width:150px; margin:10px 0 5px 5px; background: #fff;}
.maps_popup_rtl h1 { float: right; direction:rtl; unicode-bidi:bidi-override;font-size:14px; font-weight: bold; border-bottom: 1px solid #ccc; padding:5px 0px; margin:0 0 5px 0;}
.maps_popup_rtl h2 {  direction:rtl; unicode-bidi:bidi-override;font-size:14px; padding:0; margin:0 0 5px 0;}

.maps_popup_rtl p {  float: center; direction:rtl; unicode-bidi:bidi-override;text-align:right;font-size:14px; padding:0; margin:10px 0px 5px 0;}
.maps_popup_rtl div {  float: center; direction:ltr; font-weight:bold; unicode-bidi:bidi-override;text-align:right;font-size:14px; padding:0; margin:10px 0px 5px 0;}

.maps_popup_rtl .BtmLinks { direction:rtl; margin-bottom: 12px;display: block;overflow: hidden; text-align:right;border-top: 1px solid #ccc;padding-top: 10px;}
.maps_popup_rtl .EmailBtn { direction:rtl;  display: block;padding: 7px 0px;margin: 0px;}
.gm-style-iw_rtl { }



#map_canvas {
  clear:right;
  float: left;
  width:100%; height:100%;
  -webkit-box-shadow: 0px 0px 10px #888;
  -moz-box-shadow: 0px 0px 10px #888;
  -o-box-shadow: 0px 0px 10px #888;
  box-shadow: 0px 0px 10px #888;
}

.smallscreentoggle{
 visibility: hidden !important;
}

.sidetogglemenu{
 visibility: hidden !important;
}