@import url(//fonts.googleapis.com/css?family=Titillium+Web);

@import url(//fonts.googleapis.com/css?family=Josefin+Slab:300);

@import url(//fonts.googleapis.com/css?family=Droid+Serif);
@import url(https://fonts.googleapis.com/earlyaccess/droidarabickufi.css);
/*------  ------*/
* {font-family: 'Titillium Web', sans-serif;}
body {
  background: #151515;
  font: 200 13px 'Titillium Web', sans-serif;
  line-height: 20px;
}
.nav-collapse.collapse {
  text-transform: none;
}
#webSiteLoader {
  position: fixed;
  width: 100%;
  height: 100%;
  background: #151515 url(../img/web_site_loader.gif) center no-repeat;
  z-index: 1023;
  top: 0;
}
#pageLoader {
  position: fixed;
  width: 72px;
  height: 72px;
  top: 50%;
  right: 50%;
  margin: -36px -36px 0 0;
  background: url(../img/bg_loader.png) 0 0 no-repeat;
  z-index: 1000;
  padding: 3px;
  display: none;
}
#pageLoader > div {
  margin: 9px 10px;
  background: url(../img/web_page_loader.gif) 0 0 no-repeat;
  width: 46px;
  height: 46px;
}
#back-top {
  position: fixed;
  bottom: 10px;
  left: 10px;
  width: 50px;
  height: 50px;
  background: url("../img/up-arrow.png") center 12px no-repeat;
  z-index: 1000;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  display: none;
  cursor: pointer;
}
.animate,
.animate:hover {
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
}
.styleHolder {
  position: absolute;
  top: 50%;
  right: 0;
  z-index: 800;
}
.styleHolder ul {
  margin: 0;
}
.styleHolder ul > li {
  margin-bottom: -2px;
  width: 35px;
  height: 63px;
}
.styleHolder a {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
}
.extra_wrap {
  overflow: hidden;
}
/*------ header ------- */
header {
  position: absolute;
  width: 100%;
  z-index: 5;
  margin: 0 auto;
  top: 0;
}
.line_header {
  position: absolute;
  display: inline-block;
  width: 100%;
  height: 2px;
  top: 125px;
  right: 0;
}
.line2_header {
  position: absolute;
  display: inline-block;
  width: 100%;
  height: 1px;
  bottom: 0;
  right: 0;
}
h1 {
  text-align: center;
}
h2 {
  margin: 7px 0 24px;
}
h3 {
  margin: 13px 0 5px;
}
h4 {
  line-height: 22px;
}
.marg_1 {
  margin-top: 80px;
}
.marg_2 {
  margin-bottom: 7px;
}
.marg_3 {
  margin-bottom: 2px;
}
.marg_4 {
  margin-bottom: 20px;
}
.marg_5 {
  margin-bottom: 10px;
}
.marg_6 {
  margin-bottom: 15px;
}
.text_1 {
  line-height: 31px;
  margin: 98px 0 29px;
}
.text_2 {
  font-size: 16px;
  line-height: 22px;
  margin-bottom: 25px;
}
.pad_1 {
  padding-bottom: 30px!important;
}
.pad_2 {
  padding-bottom: 77px!important;
}
.corr_1 {
  right: 756px!important;
}
.corr_2 {
  padding-bottom: 25px!important;
}
.corr_3 {
  padding-right: 12px!important;
}
.corr_4 {
  padding-right: 6px!important;
}
.corr_5 {
  left: 360px!important;
}
.corr_6 {
  right: 659px!important;
}
.navbar-inner {
  text-shadow: none!important;
}
#logo {
  display: inline-block;
  position: relative;
  background: url('../img/logo.png') 0 0 no-repeat;
  width: 300px;
  height: 60px;
  text-indent: -9999px;
  margin: 10px 0 0;
}
#logo:hover {
  text-decoration: none;
}
.socialHolder {
  position: relative;
  display: inline-block;
  float: right;
  margin-top: -39px;
  z-index: 200;
}
.social-icon {
  margin: 0;
  float: right;
}
.social-icon > li {
  display: inline-block;
  float: right;
  margin-right: 7px;
}
.social-icon > li > a {
  position: relative;
  display: inline-block;
}
.social-icon > li {
  cursor: pointer;
}
.icon1,
.icon2,
.icon3 {
  position: relative;
  display: inline-block;
  width: 27px;
  height: 26px;
}
/*--- menu ------*/
.menuMov {
  position: relative;
  width: 100%;
  height: 51px;
  margin: 0 auto;
  /* margin-top: 0; */
  text-align: center;
  z-index: 10;
}
.menu {
  position: relative;
  z-index: 1;


  display: inline-block;
}
.sf-menu {
  z-index: 3;
  position: relative;
  display: inline-block;
  margin-right: 0;
}
.sf-menu > li {
  position: relative;
  color: #383636;
  display: inline-block;
  float: left;
  height: 51px;
}
.sf-menu > li > a {
  display: inline-block;
  position: relative;
  height: 51px;
  overflow: hidden;
  padding: 0 14px;
}
.sf-menu > li > a:hover {
  text-decoration: none;
}
.sf-menu > li.active > a {
  text-decoration: none;
}
.submenu_1 {
  position: absolute;
  top: 52px;
  right: -7px;
  width: 100px;
  padding: 20px 0 17px 0;
  z-index: 5;
  margin: 0;
}
.submenu_1 li {
  position: relative;
  text-align: right;
  list-style: none;
  text-align: center;
  margin-bottom: 5px;
}
.submenu_1 a {
  font-size: 16px;
  position: relative;
  display: inline-block;
  padding: 1px !important 1px  0;
  text-decoration: none;
  z-index: 1;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
}
.submenu_2 {
  position: absolute;
  width: 100px;
  right: 102px;
  top: -7px;
  z-index: 10;
  margin: 0;
  padding: 7px 0 7px;
}
.submenu_2 .marTop {
  margin: 10px 0 0;
}
.submenu_2 .marBot {
  margin: 0 0 0px;
}
.submenu_2 a {
  color: #2d2d2d;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
}
.submenu_2 a:hover {
  color: #43c5e9 !important;
}
.submenu_2 li > a:hover,
.submenu_2 li.sfHover > a {
  color: #43c5e9 !important;
}
.mText {
  font-size: 16px;
  position: absolute;
  width: 100%;
  z-index: 1;
  text-align: center;
  right: 0;
  padding-top: 12px;
}
.mTextOver {
  font-size: 16px;
  position: relative;
  width: 100%;
  z-index: 3;
  text-align: center;
  top: -100px;
}
._area {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  z-index: 5;
  right: 0;
  display: block;
}
._overPl {
  position: absolute;
  width: 100%;
  height: 51px;
  bottom: 100px;
  z-index: 2;
  right: 0;
  display: block;
  background: none;
}
._overLine {
  position: absolute;
  width: 100%;
  height: 4px;
  top: 0;
  z-index: 10;
  right: 0;
  display: none;
  background: #43c5e9;
  opacity: 0;
}
/*--- menu end ------*/
/*--- header end ------*/
/*------ content ------- */
#wrapper .containerHolder {
  position: relative;
  width: 100%;
  z-index: 2;
  top: 180px;
}
#wrapper section > div {
  position: relative;
}
#wrapper section {
  position: relative;
  width: 100%;
  height: 100%;
}
#wrapper > section > div {
  position: relative;
}
.container {
  position: relative;
  z-index: 1;
}
.cont_inner {
  margin-left: 23px;
  margin-right: 18px;
}
.cont_inner2 {
  padding-left: 23px;
}
.dynamicContent {
  position: absolute;
  width: 100%;
  top: 0;
}
.cont_bg {
  position: relative;
}
.bg_right {
  position: absolute;
  top: 16px;
  left: 555px;
  width: 2px;
  height: 98%;
}
.img-polaroid {
  padding: 5px;
  border: none;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
}
.slog {
    font: 24px/31px 'Droid Serif', serif;
    color: #ffffff;
    position: relative;
    display: inline-block;
    float: right;
    text-align: right;
    margin-right: 10px;
}
.slog span {
  position: relative;
  display: inline-block;
  padding-right: 38px;
}
.banner {
  position: relative;
  display: inline-block;
  height: 103px;
}
.banner a {
  position: absolute;
  display: inline-block;
  width: 100%;
  height: 100%;
  z-index: 50;
  background: url('../img/hit_false.png') 0 0 repeat;
}
.banner .badge {
  font: 400 36px/31px 'Josefin Slab', serif;
  position: absolute;
  padding: 0;
  margin-right: 24px;
  float: left;
  border-radius: 0;
  width: 59px;
  height: 72px;
  padding-top: 33px;
  top: -1px;
  left: -1px;
  text-align: center;
  text-shadow: 1px 1px 0 rgba(247, 132, 9, 0.4);
  background: #fda822;
  z-index: 10;

}

.banner .extra_wrap {
  position: relative;
  margin-left: 70px;
  padding-right: 17px;
  z-index: 5;
}
.banner h4 {
  margin: 16px 0 5px;
}
.banner .over_bg {
  position: absolute;
  display: inline-block;
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
  z-index: 0;
  opacity: 0;
}
.cont_bg {
  position: relative;
  display: inline-block;
  width: 100%;
  height: 100%;
}
.inner {
  position: relative;
  display: inline-block;
  padding: 6px 0 20px;
}

.about {
  margin: 0;
}
.about .style_1 {
  padding-bottom: 15px;
  margin-bottom: 23px;
}
.about li {
  list-style: none;
}
.about li h4 {
  margin-bottom: 2px;
}
.about li img {
  float: left;
  margin-right: 13px;
}
.link_2,
.link_3,
.link_4 {
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
}
.link_2:hover,
.link_3:hover,
.link_4:hover {
  text-decoration: none;
}
.block_1 {
  position: relative;
  display: inline-block;
}
.block_1 img {
  float: right;
  margin: 5px 0 0 19px;
}
.list_1 {
  position: relative;
  display: block;
  /* overflow: hidden; */
  margin: 17px 0 0;
  list-style: none;
}
.list_1 .last {
  margin-bottom: 8px!important;
}
.list_1 li {
  width: 98%;
  /* position: relative; */
  /* display: inline-block; */
  float: left;
  background: url('../img/marker.jpg') left 1px top 8px no-repeat;
  padding: 0 0 0 17px;
  min-height: 18px;
  margin: 0  6px 0;
}
.list_1 a {
  text-decoration: none;
}
.thumbnails {
  position: relative;
  display: inline-block;
  margin-bottom: 0;
  margin-top: 3px;
}
.thumbnails li {
  margin-right: -3px;
  margin-bottom: 4px;
}
.thumbnail {
  display: block;
  width: 249px;
  padding: 5px 5px 7px;
  line-height: 20px;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
}
.thumbnail img {
  margin-bottom: 12px;
}
.thumbnail .caption {
  padding: 0;
}
.thumbnail .caption h4 {
  margin-bottom: 6px;
}
.thumbnail .caption p {
  margin-bottom: 0;
}
.block_2 {
  position: relative;
  display: inline-block;
}
.block_2 h4 {
  margin-bottom: 7px;
}
.block_2 p {
  margin-bottom: 6px;
}
.g_map {
  max-width: 302px;
  width: 302px;
  float: right;
  margin: 4px 0 25px;
}
iframe {
  position: relative;
  border: none;
  display: inline-block;
  outline: none;
  width: 302px;
  height: 249px;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
  margin-bottom: -6px;
}
.width1 {
  display: inline-block;
  width: 80px;
}
.address {
  position: relative;
  display: inline-block;
  margin-bottom: 7px;
}
/* ============================= forms ============================= */
#form1 {
  position: relative;
  display: inline-block;
  text-align: left;
  margin: 18px 0 0;
}
label {
  margin: 0!important;
}
#form1 input {
  text-transform: none;
  margin: 0;
  padding: 5px 11px;
  width: 316px;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
  min-height: 20px;
}
#form1 textarea {
  text-transform: none;
  resize: none;
  margin: 0;
  padding: 5px 11px;
  width: 545px;
  height: 251px;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
  min-height: 20px;
}
#form1 label {
  position: relative;
  display: inline-block;
  min-height: 38px;
}
#form1 .error,
#form1 .empty {
  position: absolute;
  top: 2px;
  right: 4px;
  display: none;
  font-size: 11px;
  line-height: 10px;
  text-transform: none;
}
.btns {
  position: relative;
  display: inline-block;
  margin: 14px 0 0;
  float: right;
}
.btns a {
  /* float: left; */
  /* margin: 0 16px 0 0; */
}
#form1 .message .error,
#form1 .message .empty {
  position: absolute;
  bottom: -10px;
  display: none;
  font-size: 11px;
  line-height: 9px;
  text-transform: none;
}
.success {
  position: absolute;
  width: 100%;
  text-align: center;
  z-index: 1;
  border: none;
  background: #ffffff;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
  padding: 14px 0;
  margin-top: 0;
}
/* ============================= end forms ============================= */
.pic_err {
  position: relative;
  display: inline-block;
  width: 492px;
  height: 256px;
  margin: 98px 38px 0 0;
}
/* ============================= search ============================= */
#search input:focus {
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
}
#search input {
  display: inline-block;
  float: right;
  width: 249px;
  padding: 5px 18px;
  margin-bottom: 26px;
  margin-left: 8px;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
}
.search_result {
  color: #ff9c00;
}
.search_title {
  margin-bottom: 5px;
  font-weight: 400;
}
.search_title a {
  color: #545353;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
}
.search_title a:hover {
  color: #ffffff;
  text-decoration: none;
}
.search_list {
  margin-top: 30px;
}
.search_list .search {
  font-size: 25px;
  color: #ff9c00;
}
#searchButton {
  margin-top: 3px;
}
/*--- content end ------*/
/*------ footer ------- */
footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 50px;
  z-index: 600;
}
footer .line_footer {
  position: absolute;
  display: inline-block;
  width: 100%;
  height: 1px;
  top: 0;
  right: 0;
}
.footer_info {
  font-size: 14px;
  position: relative;
  color: #777;
  padding: 16px 0 0;
  /* float: right; */
  text-align: center;
}
.link_1 {
  color: #bcbcbc;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
}
.link_1:hover {
  color: #fea519;
  text-decoration: none;
}
/*--- footer end ------*/
/*Core variables and mixins*/
.clearfix {
  *zoom: 1;
}
.clearfix:before,
.clearfix:after {
  display: table;
  content: "";
  line-height: 0;
}
.clearfix:after {
  clear: both;
}
.hide-text {
  font: 0/0 a;
  color: transparent;
  text-shadow: none;
  background-color: transparent;
  border: 0;
}
.input-block-level {
  display: block;
  width: 100%;
  min-height: 30px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.logo{
  text-align:center;
}
.arabic{font-weight:bold; font-family: "Droid Arabic Kufi",Tahoma;}
.eng{font-weight:bold; font-family: 'Titillium Web', sans-serif;}

/*----- media queries ------*/
@media (min-width: 1200px) {
  
}
@media (min-width: 768px) and (max-width: 979px) {
  
}
@media (max-width: 767px) {
.span1, .span2, .span3, .span4, .span5, .span6, .span7, .span8, .span9, .span10, .span11, .span12{
        width: 95%;
        display: block;
        float: none;
    }
.container, .navbar-static-top .container, .navbar-fixed-top .container, .navbar-fixed-bottom .container {
    width: 100%;
}	
.socialHolder {
    display: inline-block;
    float:none;
    margin-top: 0px; 
    z-index: 200;
}
.row {
    margin-left: 0px;
    *
    zoom: 1;
}
.thumbnail {
    width: 100%;
    margin: 5px auto;
}
[class*=span] {
    margin-right: 0px;
    margin: 10px;
}

#wrapper{
overflow:auto!Important;
}
#form1 textarea {
    width: 316px;
}
}
@media (max-width: 480px) {
  
}


.menu-button, .menu-close{display:none;}
/*-----------------
RESPONSIVE
-----------------*/
@media (max-width: 1220px) {
	body{min-width:0;}
	#wrapper{overflow:visible !important;}
	.container, .navbar-static-top .container, .navbar-fixed-top .container, .navbar-fixed-bottom .container,
	.span12{
		width:930px;
	}
	.span8{
		width:600px;
	}
	.span6{
		width:450px;
	}
	.span4{
		width:300px;
	}
	.span3{
		width:210px;
	}
	.banner{
		width:auto;
		/* height:210px; */
	}
	
	.bg_right{left:455px;}
	
	.att-photo{
		float:none;
		text-align:center;
	}
	.att-data{
		margin-left:0;
		clear:both;
	}
	.corr_1{
		left:620px!important;
	}
	.corr_5{left:310px !important;}
	.offset1{margin-left:90px;}
}
@media (max-width: 980px) {
	#logo{ width:350px; }
	.container, .navbar-static-top .container, .navbar-fixed-top .container, .navbar-fixed-bottom .container,
	.span12{
		width:720px;
	}
	.span3{
		width:345px;
		margin-bottom:20px;
	}
	.span4, .span6, .span8{
		width:auto;
		float:none;
		margin-bottom:0px;
		/* padding:20px; */
	}
	.banner{
		width:auto;
		/* height:120px; */
	}
	.marg_1{margin-top:200px;}
	
	.cont_inner, .cont_inner2{padding:0;}
	.bg_right{display:none;}
	.img-polaroid{/* width:100%; */margin-left: 0px;}
	
	.att-photo{
		float:left;
		text-align:center;
	}
	.att-data{
		margin-left:250px;
		clear:none;
	}
	
	.g_map{width:auto;float:none;margin:0;}
	.g_map iframe{width:100%;float:none;}
	.pic_err{margin-top:10px;margin-left:0;}
	.text_1{margin-top:40px;}
}
@media (max-width: 780px) {
	body{min-height:0 !Important;}
	#logo{/* width:auto; */float:none;margin-top:20px;}
	.line_header{top:auto;bottom:0;}
	.container, .navbar-static-top .container, .navbar-fixed-top .container, .navbar-fixed-bottom .container,
	.span12{
		width:470px;
	}
	[class*="span"]{
		/* margin-left:0; */
	}
	.span3{
		width:100%;
		margin-bottom:20px;
	}
	.row{margin-left:0;}
	.banner{
		width:auto;
		/* height:auto; */
	}
	header, footer{position:relative;}
	#wrapper .containerHolder{position:relative;top:0;margin-top:40px;margin-bottom:20px;}
	.marg_1{margin-top:80px;}
	.slog{font-size:20px;line-height:28px;}
	.slog span{padding-right:10px;}
	.menu-close{
		position:fixed;
		z-index:999;
		top:20px;
		right:20px;
		height:30px;
		width:30px;
		text-align:center;
		color: #1e67b2;
		font-size:30px;
		line-height:30px;
		font-weight:700;
	}
	.menu-button{
		position:absolute;
		top: 50px;
		right: 10px;
		height: 18px;
		width:30px;
		border-top: 4px solid #f7941e;
		border-bottom: 4px solid #f7941e;
		display:block;
	}
	.menu-button:before{
		content:"";
		width:38px;
		height:38px;
		display:block;
		position:absolute;
		top:-10px;
		left:-5px;
		border:1px solid #555;
	}
	.menu-button span{
		position:relative;
		height:4px;
		background: #f7941e;
		top:7px;
		text-indent:-999px;
		display:block;
		overflow:hidden;
	}
	.menu-button:hover{border-color:#FDA822;}
	.menu-button:hover span{background:#FDA822; }
	.menu-close:hover{
		text-decoration:none;
		color:#FDA822;
	}
	.menu-wrapper, .menu-close{display:none;}
	body.fixed-me .menu-close{display:block;}
	.menu-wrapper{
		position:fixed;
		top:0;
		bottom:0;
		height:auto;
		margin:0;
		padding:40px 20px;
		background: rgb(239, 239, 239);
		left:0;
		right:0;
		z-index:998;
		overflow:scroll;
	}
	.menu-wrapper-show{
		display:block;
	}
	.menuMov{
		height:auto;
		margin-top:20px;
	}
	.sf-menu > li{
		display:block;
		float:none;
		border-bottom:1px solid #333;
	}
	.sf-menu > li > a{
		display:block;
	}
	.socialHolder{
		margin:0 auto;
		width:142px;
		float:none;
		display:block;
	}
	.social-icon > li{
		margin:0 10px;
	}
	.call_us{
		display:block;
		margin:10px auto 20px;
		float:left;
		width:354px;
	}
	footer{/* height:auto; */}
	.footer_info{
		text-align:center;
		float:none;
	}
	
	.att-photo{
		float:none;
		text-align:center;
		padding:10px;
		background:#111;
	}
	.att-photo img{
		display:block;
		margin:0 auto;
	}
	.att-data{
		margin-left:0;
		clear:both;
	}
	.accordian-wrap{
		margin-left:0;
	}
	#form1 input, #form1 textarea{padding-left:2%;padding-right:2%;}
}
@media (max-width: 480px) {
	h2{font-size:32px;}
	.container, .navbar-static-top .container, .navbar-fixed-top .container, .navbar-fixed-bottom .container,
	.span12{
		width:300px;
	}
	#wrapper .containerHolder{margin-top:20px;}
	.span6{padding:10px;}
	.logo-box{float:none;}
	#logo{width:auto;}
	.call_us{width:auto;margin-top:0;}
	.bigger_call{font-size:18px;margin-top:0;}
	.small_call{clear:both;margin-left:0;font-size:12px;}
	.slog span{padding-right:0;}
	.menu-button{top:105px;right:5px;}
	
	.att-box h2{font-size:28px;}
	#search input[type="text"], #search input[type="submit"]{width:200px;padding:5px 20px;}
}