@import url(http://fonts.googleapis.com/earlyaccess/droidarabicnaskh.css);
body {
	color: #555555;
	background: #fff ;
	font-family: 'Droid Arabic Naskh', serif;
	font-size:  100%;
    margin : 0 ;
    background: url(../images/bg.png) repeat 0 0 ;
}
ul{
  margin: 0;
  padding: 0;
  list-style: none;
}
h1,h2,h3,h4,h5,h6 {
  margin: 0;
  padding: 0 ;
}

a {
  text-decoration: none;
}
.clear {
  clear: both;
}
 /******************** Header ****************************/
 #header {
    background: url(../images/header.jpg) repeat-x 0 0 ;
    height: 170px;
}
#header .header {
    background: url("../images/logo.png") no-repeat scroll 0 3px rgba(0, 0, 0, 0);
    height: 159px;
    margin: 0 auto;
    position: relative;
    width: 1160px;
}
#header .logo{
   float: right;
   height: 165px;
   width: 218px;
}

/********************End Hrader*************************/
/******************** Menu *****************************/
 #menu {
   background: url(../images/menu.png) repeat-x 0 0 ;
    height: 96px;
}
.menu{
    height: 36px;
    margin: 0 auto;
    width: 1000px;
}
.menu ul{
  list-style: none;
}
.menu ul li{
  float: right ;
  margin-right: 7px;
   padding-top: 25px;
   color : #163844;
   line-height: 25px;

}
.menu ul li.no_style, .menu ul li.no_style:hover {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0);
    padding-top: 35px;
    width: 1px;
}
.menu ul li a {
    color: #163844;
    display: block;
    font-size: 13px;
    font-weight: bold;
    height: 36px;
    line-height: 37px;
    padding: 0 5px;
    text-align: center;
    text-decoration: none;
}

.menu ul li:hover a ,.menu ul li.active a{
   background: url("../images/menu2.png") repeat-x scroll 0 3px rgba(0, 0, 0, 0);
   border-radius: 10px;
}
/********************End Main Menu*************************/
/******************** Page & Main*************************/

#main {
  width: 1160px;
  min-height: 265px;
  margin: 0 auto ;
  overflow: hidden;
}

h2.title {
  background: url(../images/h2_title.png) no-repeat right center ;

}
h2.title span {
    color: #f74f11;
    padding: 0 20px;
    font-size: 15px;
}

#fullwidth {
  width: 100%;
  margin-top: 30px;
}

a.readmore {
    background: none repeat scroll 0 0 #F74F11;
    border: 1px dotted #D8D8D8;
    border-radius: 6px;
    color: #FFFFFF;
    float: left;
    font-size: 14px;
    font-weight: bold;
    padding: 0 10px;
}
a.readmore:hover {
  background: none repeat scroll 0 0 #d8d8d8;
    color: #F74F11;
}

/********************* Three ****************************/
#three {
    float: right;
    padding-top: 30px;
    width: 46%;
}
.hekma {
    background: url("../images/hekma.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
    font-size: 13px;
    font-weight: bold;
    height: 126px;
    margin-right: 41px;
    padding: 24px 15px 0;
    width: 433px;
}
.hekma span {
    background: url("../images/h2_title.png") no-repeat scroll right center rgba(0, 0, 0, 0);
    padding-right: 17px;
}
/********************* End Three ****************************/
/********************* One ****************************/
#one {
    float: left;
    min-height: 470px;
    position: relative;
    width: 54%;
}
#one .link1{
  left: 0;
    position: absolute;
    top: 95px;
}
#one .link2{
  left: 0;
    position: absolute;
    top: 222px;
}
#one .link3{
  left: 79px;
    position: absolute;
    top: 323px;
}
#one .link4{
   left: 206px;
    position: absolute;
    top: 352px;
}
/********************* End One ****************************/
/******************** End Page & Main*************************/
/******************** Footer *************************/
#footer {
 background: url("../images/footer.png") repeat-x scroll 0 3px rgba(0, 0, 0, 0);
    height: 107px;
}
.footer {
 background: url(../images/map.png) no-repeat center left ;
 width : 1000px;
 margin: 0 auto ;
}
.footer .div1 {
    width: 30%;
}
.footer .div2{
  color: #b48754 ;
  width: 50%;
}

.footer .div3 {
    width: 20%;
}
.footer div {
 float: right;
 margin-top: 38px;
}

.footer div ul{
    float: right;
}

.footer div ul li {
    float: right;
    margin: 0 15px;
}
.footer div ul li a{
  color: #FFFFFF;
    font-family: tahoma;
    font-size: 12px;
}


#bottomfooter {
background: none repeat scroll 0 0 #464646;
    height: 35px;
}
/******************** Footer *****************************/
/********************End Footer Menu*************************/
/******************** End Footer *************************/

/****************************** Pages In ******************/

.news {
    border: 2px solid #163844;
    border-radius: 15px;
    min-height: 179px;
    margin-bottom: 10px;
    overflow: hidden;
    padding: 1%;
    width: 96%;
}
.news h4 {
  color: #F74F11 ;
}

img.photos {
    border: 1px solid #195C7C;
    border-radius: 10px;
    float: right;
    height: 164px;
    margin: 5px;
    max-height: 400px;
    max-width: 98%;
    padding: 5px;
    width: 200px;
}
/****************************** End Pages In ******************/
/****************************** Contact Us ******************/
.contactForm {
 border: 2px solid #195C7C;
    border-radius: 10px;
    margin: 10px;
    padding: 10px;
    width: 96%;
}
.contactForm .input{
 color: #195C7C;
    font-weight: bold;
    margin: 6px;
    padding: 5px;
    width: 500px;
}
.contactForm #comment{
 color: #195C7C;
    font-weight: bold;
    margin: 6px;
    padding: 5px;
    width: 500px;
}
.note {
  font-size: 13px;
  font-family: Tahoma;
  font-weight: bold;
}
.submit a{
   background: none repeat scroll 0 0 #195C7C;
    border-radius: 6px;
    color: #FFFFFF;
    padding: 0 10px;
    border: 1px dotted #d8d8d8 ;
    font-weight: bold;
    font-size: 14px;
}

/****************************** End Contact Us ******************/
.rights {
  color: #FFFFFF;
    font-size: 11px;
    font-weight: bold;
    line-height: 35px;
}

.rights a {
    color: #FFFFFF;
    left: 0;
    position: absolute;
    top: 0;
}

img.newsimg,img.photos {
  display: block;
}
img.d2 {
  float: right;
}

.urgent {
    background: none repeat scroll 0 0 #9B0E0E;
    border-radius: 10px;
    margin-bottom: 10px;
    text-align: center;
}

.urgent a {
    color: #FFFFFF;
    font-size: 18px;
    font-weight: bold;
}
.fs-container {
    -moz-box-sizing: content-box;
    height: 300px;
    margin: 20px auto 50px;
    max-width: 700px;
    min-width: 300px;
    padding: 0 15%;
    position: absolute;
    right: 0;
    top: 0;
    width: 40%;
}
.fs-container:before {
	content: '';
	position: absolute;
	bottom: -40px;
	background: transparent url(../images/shadow.png) no-repeat center center;
	height: 90px;
	width: 90%;
	left: 5%;
	opacity: 0.8;
	-webkit-background-size: 100% 100%;
	-moz-background-size: 100% 100%;
	background-size: 100% 100%;
}

.fs-wrapper {
	width: 100%;
	height: 100%;
	position: relative;
	-webkit-perspective: 1000px;
	-moz-perspective: 1000px;
	-o-perspective: 1000px;
	-ms-perspective: 1000px;
	perspective: 1000px;
}

.fs-slider{
	width: 100%;
	height: 100%;
	position: absolute;
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	-o-transform-style: preserve-3d;
	-ms-transform-style: preserve-3d;
	transform-style: preserve-3d;
	pointer-events: none;
}

.fs-block {
	margin: 0;
	position: absolute;
	width: 70%;
	height: 100%;
	left: 15%;
	pointer-events: auto;
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-o-transition: all 1s ease;
	-ms-transition: all 1s ease;
	transition: all 1s ease;
}

.fs-block:nth-child(1) {
	-webkit-transform-origin: top right;
	-webkit-transform: translateX(-100%) rotateY(-35deg);
	-moz-transform-origin: top right;
	-moz-transform: translateX(-100%) rotateY(-35deg);
	-o-transform-origin: top right;
	-o-transform: translateX(-100%) rotateY(-35deg);
	-ms-transform-origin: top right;
	-ms-transform: translate(-100%);
	transform-origin: top right;
	transform: translateX(-100%) rotateY(-35deg);
}
.no-touch .fs-block:nth-child(1):hover {
	-webkit-transform: translateX(-100%) rotateY(-30deg);
	-o-transform: translateX(-100%) rotateY(-30deg);
	transform: translateX(-100%) rotateY(-30deg);
}

.fs-block:nth-child(2) {
	z-index: 100;
}

.fs-block:nth-child(3) {
	-webkit-transform-origin: top left;
	-webkit-transform: translateX(100%) rotateY(35deg);
	-moz-transform-origin: top left;
	-moz-transform: translateX(100%) rotateY(35deg);
	-o-transform-origin: top left;
	-o-transform: translateX(100%) rotateY(35deg);
	-ms-transform-origin: top left;
	-ms-transform: translate(100%);
	transform-origin: top left;
	transform: translateX(100%) rotateY(35deg);
}

.no-touch .fs-block:nth-child(3):hover {
	-webkit-transform: translateX(100%) rotateY(30deg);
	-o-transform: translateX(100%) rotateY(30deg);
	transform: translateX(100%) rotateY(30deg);
}

.fs-block:after{
	content: '';
	position: absolute;
	width: 100%;
	height: 100%;
	z-index: 1000;
	pointer-events: none;
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
	border-left: 1px solid rgba(119,119,119,1);
	border-right: 1px solid rgba(119,119,119,1);
	left: -1px;
}

/* Borders are only needed if we have the 3d look */
.no-csstransforms3d .fs-block:after {
	border: none;
}

.fs-block:nth-child(1):after {
	background: -moz-linear-gradient(left, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0.2) 100%);
	background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(0,0,0,0.65)), color-stop(100%,rgba(0,0,0,0.2)));
	background: -webkit-linear-gradient(left, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0.2) 100%);
	background: -o-linear-gradient(left, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0.2) 100%);
	background: -ms-linear-gradient(left, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0.2) 100%);
	background: linear-gradient(to right, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0.2) 100%);
}

.fs-block:nth-child(2):after {
	opacity: 0.8;
	background: -moz-linear-gradient(left, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.12) 21%, rgba(0,0,0,0.03) 31%, rgba(0,0,0,0) 50%, rgba(0,0,0,0.03) 70%, rgba(0,0,0,0.12) 81%, rgba(0,0,0,0.5) 100%);
	background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(0,0,0,0.5)), color-stop(21%,rgba(0,0,0,0.12)), color-stop(31%,rgba(0,0,0,0.03)), color-stop(50%,rgba(0,0,0,0)), color-stop(70%,rgba(0,0,0,0.03)), color-stop(81%,rgba(0,0,0,0.12)), color-stop(100%,rgba(0,0,0,0.5)));
	background: -webkit-linear-gradient(left, rgba(0,0,0,0.5) 0%,rgba(0,0,0,0.12) 21%,rgba(0,0,0,0.03) 31%,rgba(0,0,0,0) 50%,rgba(0,0,0,0.03) 70%,rgba(0,0,0,0.12) 81%,rgba(0,0,0,0.5) 100%);
	background: -o-linear-gradient(left, rgba(0,0,0,0.5) 0%,rgba(0,0,0,0.12) 21%,rgba(0,0,0,0.03) 31%,rgba(0,0,0,0) 50%,rgba(0,0,0,0.03) 70%,rgba(0,0,0,0.12) 81%,rgba(0,0,0,0.5) 100%);
	background: -ms-linear-gradient(left, rgba(0,0,0,0.5) 0%,rgba(0,0,0,0.12) 21%,rgba(0,0,0,0.03) 31%,rgba(0,0,0,0) 50%,rgba(0,0,0,0.03) 70%,rgba(0,0,0,0.12) 81%,rgba(0,0,0,0.5) 100%);
	background: linear-gradient(to right, rgba(0,0,0,0.5) 0%,rgba(0,0,0,0.12) 21%,rgba(0,0,0,0.03) 31%,rgba(0,0,0,0) 50%,rgba(0,0,0,0.03) 70%,rgba(0,0,0,0.12) 81%,rgba(0,0,0,0.5) 100%);
}

.fs-block:nth-child(3):after {
	background: -moz-linear-gradient(left, rgba(0,0,0,0.2) 0%, rgba(0,0,0,0.65) 100%);
	background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(0,0,0,0.2)), color-stop(100%,rgba(0,0,0,0.65)));
	background: -webkit-linear-gradient(left, rgba(0,0,0,0.2) 0%,rgba(0,0,0,0.65) 100%);
	background: -o-linear-gradient(left, rgba(0,0,0,0.2) 0%,rgba(0,0,0,0.65) 100%);
	background: -ms-linear-gradient(left, rgba(0,0,0,0.2) 0%,rgba(0,0,0,0.65) 100%);
	background: linear-gradient(to right, rgba(0,0,0,0.2) 0%,rgba(0,0,0,0.65) 100%);
}

.fs-block figure {
	width: 100%;
	height: 100%;
	margin: 0;
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
	z-index: 1;
}

.fs-block figure:first-child{
	z-index: 10;
}

.fs-block figure img {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
}

.fs-block figcaption {
	padding: 0 10px;
	margin: 0;
	position: absolute;
	width: 93%;
	top: 0;
	background: rgba(0,0,0,0.4);
	overflow: hidden;
	height: 0%;
	opacity: 0;
	text-align: center;
	-webkit-transition: all 700ms cubic-bezier(0, 0, .15, 1);
	-moz-transition: all 700ms cubic-bezier(0, 0, .15, 1);
	-o-transition: all 700ms cubic-bezier(0, 0, .15, 1);
	-ms-transition: all 700ms cubic-bezier(0, 0, .15, 1);
	transition: all 700ms cubic-bezier(0, 0, .15, 1);
}

.fs-block figcaption.fs-transition {
	height: 60px;
	opacity: 1;
}

.fs-block figcaption h3 {
	font-size: 40px;
	line-height: 40px;
	margin: 0;
	padding: 20px 0;
	color: #fff;
	text-shadow: 1px 1px 1px rgba(0,0,0,0.3);
	font-family: 'Prata', serif;
	font-weight: normal;
}
.fs-block figcaption p {
    color: #FFFFFF;
    font-weight: bold;
    height: 60px;
    line-height: 20px;
    margin: 0;
}
.fs-block figcaption p a {
   color: #fff;
   text-decoration: underline ;
}
.fs-navigation {
	position: absolute;
	z-index: 2000;
	bottom: 10px;
	right: 15%;
	margin-right: 15px;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.fs-navigation span {
	float: left;
	width: 26px;
	height: 26px;
	border-radius: 4px;
	text-indent: -90000px;
	cursor: pointer;
	opacity: 0.6;
	margin-right: 3px;
	background: rgba(0,0,0,0.4) url(../images/arrow.png) no-repeat 50% 50%;
	-webkit-transition: all 0.3s linear;
	-moz-transition: all 0.3s linear;
	-o-transition: all 0.3s linear;
	-ms-transition: all 0.3s linear;
	transition: all 0.3s linear;
	pointer-events: auto;
}

.fs-navigation span:nth-child(2) {
	-webkit-transform: rotate(180deg);
	-moz-transform: rotate(180deg);
	-o-transform: rotate(180deg);
	-ms-transform: rotate(180deg);
	transform: rotate(180deg);
}

.fs-navigation span:hover{
	opacity: 1;
}

/* Transitions */
.fs-block:nth-child(1) figure {
	-webkit-transition: width 900ms cubic-bezier(0, 0, .15, 1) 600ms;
	-moz-transition: width 900ms cubic-bezier(0, 0, .15, 1) 600ms;
	-o-transition: width 900ms cubic-bezier(0, 0, .15, 1) 600ms;
	-ms-transition: width 900ms cubic-bezier(0, 0, .15, 1) 600ms;
	transition: width 900ms cubic-bezier(0, 0, .15, 1) 600ms;
}
.fs-block:nth-child(2) figure {
	-webkit-transition: width 900ms cubic-bezier(0, 0, .15, 1) 300ms;
	-moz-transition: width 900ms cubic-bezier(0, 0, .15, 1) 300ms;
	-o-transition: width 900ms cubic-bezier(0, 0, .15, 1) 300ms;
	-ms-transition: width 900ms cubic-bezier(0, 0, .15, 1) 300ms;
	transition: width 900ms cubic-bezier(0, 0, .15, 1) 300ms;
}
.fs-block:nth-child(3) figure {
	-webkit-transition: width 900ms cubic-bezier(0, 0, .15, 1);
	-moz-transition: width 900ms cubic-bezier(0, 0, .15, 1);
	-o-transition: width 900ms cubic-bezier(0, 0, .15, 1);
	-ms-transition: width 900ms cubic-bezier(0, 0, .15, 1);
	transition: width 900ms cubic-bezier(0, 0, .15, 1);
}

/* Media Queries */

@media screen and (max-width: 1024px) {
	.fs-block figcaption h3 {
		font-size: 26px;
	}
}

@media screen and (max-width: 768px) {
	.fs-block figcaption {
		padding: 0 10px;
	}
	.fs-block figcaption h3 {
		font-size: 16px;
		padding: 10px 0;
	}
	.fs-block figcaption p {
		font-size: 13px;
	}
}