@charset "utf-8";
/* CSS Document */

body {background:#FFF; margin:0 auto !important;
min-width:1145px;}


@font-face
{
font-family: "GE SS Two Light.otf";
src: url(GESSTwoLight.otf);
}

/********/

.header-one {width:100%;
height:70px;
background:#313131 url(images/header-colors2.png) repeat-x top;
-webkit-box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.18);
box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.18);
}


.header-content-one {width:1024px;
margin:0 auto;
padding-top:5px;}

.logo-one {padding-top: 9px; float:left;}


.menu-one {float:right;
display:block;
padding-top:13px;}

ul#cm-nav ,
ul#cm-nav ul {
 list-style-type: none;
 margin: 0px;
 list-style-image: none;
 padding: 0px
}

ul#cm-nav li {
 position: relative;
 list-style-type: none;
 margin: 0px;
 width: auto;
 float: right;
 list-style-image: none;
 padding: 0px
}

@-webkit-keyframes rotateInUpRight {
  0% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(-10deg);
    transform: rotate(-10deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

@keyframes rotateInUpRight {
  0% {
    -webkit-transform-origin: right bottom;
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(-10deg);
    -ms-transform: rotate(-10deg);
    transform: rotate(-10deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: right bottom;
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

ul#cm-nav li li { -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  background:#313131;


  -webkit-animation-name: rotateInUpRight;
  animation-name: rotateInUpRight;
 width: auto;
 float: right;
}

#cm-nav a {
border-bottom: black 1px solid;
border-left: black 1px solid;
display: block;
font-family: "GE SS Two Light.otf";
src: url(GESSTwoLight.otf);
white-space: nowrap;
background: #d6d5f0;
font-size: 14px;
border-top: black 1px solid;
border-right: black 1px solid;
text-decoration: none;
padding: 27px 8px 5px 8px;
-webkit-transition: color 0.5s ease-in;
-moz-transition: color 0.5s ease-in;
-ms-transition: color 0.5s ease-in;
-o-transition: color 0.5s ease-in;
transition: color 0.5s ease-in;
}



#cm-nav a:focus {
 outline-style: none;
 outline-color: invert;
 outline-width: medium
}

#cm-nav a.no-click {cursor: default}

#cm-nav li a {margin: -1px -1px 0px 0px;}

#cm-nav li li a {color:#999999;width:140px; text-align: justify !important; padding-top:10px !important;
border-bottom:2px solid #999999;
background:#313131;
}

#cm-nav li li a:hover{color:#00bdff; background:#313131;
border-bottom:2px solid #00bdff;


}


@-webkit-keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-20px);
    -ms-transform: translateY(-20px);
    transform: translateY(-20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

 .submenu {	  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
  
 -webkit-animation-duration: 0.5s;
  animation-duration: 0.5s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;}
  
  
  
#home a {
background:url(images/home.png) no-repeat top center;}

#home a:hover {background: url(images/home-ho.png) no-repeat top center;}


#about a {
background: url(images/about.png) no-repeat top center;}

#about a:hover {background: url(images/about-hover.png) no-repeat top center;}


#services {
background: url(images/services.png) no-repeat top center;}

#services:hover {background: url(images/services-ho.png) no-repeat top center;
}
#worksour {
background: url(images/brush.png) no-repeat top center;}

#worksour:hover {background: url(images/brush_ho.png) no-repeat top center;
}

#agreement a{
background: url(images/shake.png) no-repeat top center;}

#agreement a:hover {background: url(images/shake-hover.png) no-repeat top center;}

#agents-icon {
background: url(images/parteners.png) no-repeat top center;}

#agents-icon:hover {background: url(images/parteners-h.png) no-repeat top center;
}

#jobs-icon {
background: url(images/hiring.png) no-repeat top center;}

#jobs-icon:hover {background: url(images/hiring-h.png) no-repeat top center;
}



#contact a{
background: url(images/phone54.png) no-repeat top center;}

#contact a:hover {background: url(images/phone-ho.png) no-repeat top center;}

#agents-icon a{
background: url(images/agents.png) no-repeat top center;}

#agents-icon a:hover {background: url(images/agents-h.png) no-repeat top center;}


#cm-nav li ul ,
#cm-nav li:hover ul ul ,
#cm-nav li:hover ul ul ul ,
#cm-nav li:hover ul ul ul ul ,
#cm-nav li:hover ul ul ul ul ul ,
#cm-nav li:hover ul ul ul ul ul ul ,
#cm-nav li:hover ul ul ul ul ul ul ul ,
#cm-nav li:hover ul ul ul ul ul ul ul ul ,
#cm-nav li:hover ul ul ul ul ul ul ul ul ul ,
#cm-nav li:hover ul ul ul ul ul ul ul ul ul ul ,
#cm-nav li:hover ul ul ul ul ul ul ul ul ul ul ul ,
#cm-nav li:hover ul ul ul ul ul ul ul ul ul ul ul ul ,
#cm-nav li:hover ul ul ul ul ul ul ul ul ul ul ul ul ul ,
#cm-nav li:hover ul ul ul ul ul ul ul ul ul ul ul ul ul ul ,
#cm-nav li:hover ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ,
#cm-nav li:hover ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ,
#cm-nav li:hover ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ,
#cm-nav li:hover ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ,
#cm-nav li:hover ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ,
#cm-nav li:hover ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ,
#cm-nav li:hover ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul ul {
 z-index: 999;
 position: absolute;
 display: none
}

#cm-nav li:hover ul {display: block}

#cm-nav li li:hover ul ,
#cm-nav li li li:hover ul ,
#cm-nav li li li li:hover ul ,
#cm-nav li li li li li:hover ul ,
#cm-nav li li li li li li:hover ul ,
#cm-nav li li li li li li li:hover ul ,
#cm-nav li li li li li li li li:hover ul ,
#cm-nav li li li li li li li li li:hover ul ,
#cm-nav li li li li li li li li li li:hover ul ,
#cm-nav li li li li li li li li li li li:hover ul ,
#cm-nav li li li li li li li li li li li li:hover ul ,
#cm-nav li li li li li li li li li li li li li:hover ul ,
#cm-nav li li li li li li li li li li li li li li:hover ul ,
#cm-nav li li li li li li li li li li li li li li li:hover ul ,
#cm-nav li li li li li li li li li li li li li li li li:hover ul ,
#cm-nav li li li li li li li li li li li li li li li li li:hover ul ,
#cm-nav li li li li li li li li li li li li li li li li li li:hover ul ,
#cm-nav li li li li li li li li li li li li li li li li li li li:hover ul ,
#cm-nav li li li li li li li li li li li li li li li li li li li li:hover ul ,
#cm-nav li li li li li li li li li li li li li li li li li li li li li:hover ul {
 display: block;
 margin-left: 100%
}

#cm-nav li:hover ul {margin-left: 0px;
}

#cm-nav ul ul {
top: 1px;
right: 157px;
}
#cm-nav li {top: -1px}

#cm-nav a ,
#cm-nav li:hover > a {background-color: transparent;
}

#cm-nav a {border-color: transparent}

#cm-nav a {color: #999999}


#cm-nav li:hover > a {color: #00bdff;
}


/****************************************/

@font-face{font-family:Droid Sans Arabic; 
src: url("DroidSansArabic.ttf") /* TTF file for CSS3 browsers */}

@font-face{font-family: zahra arabic; 
src: url("zahra-arabic.otf") /* TTF file for CSS3 browsers */}

@font-face
{
font-family: "DroidSansArabic";
src: url(DroidSansArabic.ttf);
}

@font-face{font-family: Hacen Promoter Lt; src: url(Hacen_Promoter_Lt.ttf) /* TTF file for CSS3 browsers */}


@font-face
{
font-family: "GE SS Text Light";
src: url(GE_SS_Text_Light.ttf);
}


@font-face{font-family: Hacen Promoter Md; src: url("Hacen_Promoter_Md.ttf") /* TTF file for CSS3 browsers */}


@font-face
{
font-family: "font";
src: url(font.ttf);
}

::selection {
	background:#fff; /* Safari */
	}
::-moz-selection {
	background: #fff; /* Firefox */
}
	
.selection {color:#fff;}


.menu {	 	 animation: fadein 2s;
    -moz-animation: fadein 2s; /* Firefox */
    -webkit-animation: fadein 2s; /* Safari and Chrome */
    -o-animation: fadein 2s; /* Opera */
	
	background:#3d3d3d;
width:100%;
height:37px;}


#header{
	

	
	width:100%;
height:478px;

border-bottom: 1px solid #DADADA;

background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPHJhZGlhbEdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgY3g9IjUwJSIgY3k9IjUwJSIgcj0iNzUlIj4KICAgIDxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9IiNmZWZlZmUiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjZGFkYWRhIiBzdG9wLW9wYWNpdHk9IjEiLz4KICA8L3JhZGlhbEdyYWRpZW50PgogIDxyZWN0IHg9Ii01MCIgeT0iLTUwIiB3aWR0aD0iMTAxIiBoZWlnaHQ9IjEwMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-radial-gradient(center, ellipse cover,  #fefefe 0%, #dadada 100%); /* FF3.6+ */
background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,#fefefe), color-stop(100%,#dadada)); /* Chrome,Safari4+ */
background: -webkit-radial-gradient(center, ellipse cover,  #fefefe 0%,#dadada 100%); /* Chrome10+,Safari5.1+ */
background: -o-radial-gradient(center, ellipse cover,  #fefefe 0%,#dadada 100%); /* Opera 12+ */
background: -ms-radial-gradient(center, ellipse cover,  #fefefe 0%,#dadada 100%); /* IE10+ */
background: radial-gradient(ellipse at center,  #fefefe 0%,#dadada 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fefefe', endColorstr='#dadada',GradientType=1 ); /* IE6-8 fallback on horizontal gradient */

}

@keyframes fadein {
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-moz-keyframes fadein { /* Firefox */
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-webkit-keyframes fadein { /* Safari and Chrome */
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-o-keyframes fadein { /* Opera */
    from {
        opacity:0;
    }
    to {
        opacity: 1;
    }
}

.logo {width:668px; margin:auto !important;
padding-top:40px;
background:url(images/header-bg.png) no-repeat center top;height: 437px;





	 animation: fadein 5s;
    -moz-animation: fadein 5s; /* Firefox */
    -webkit-animation: fadein 4s; /* Safari and Chrome */
    -o-animation: fadein 5s; /* Opera */}
.logo img { margin:0 auto;}

.blue-border {height:2px;
width:29%;
background:#00b4ff;
float:left;}


.pink-border {height:2px;
width:29%;
background:#ff72d6;
float: right;}


.main {
width: 100%;
position: absolute;}

.numbers {
width: 692px;
margin: 34px auto 0 auto !important;
position: relative;}

.numbers div { width:230px; float:left;
margin:0 auto !important;
text-align: center;}
.numbers h1,h2,h3 { font-size:75px;
font-family: "font";
text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.56);
src: url(font.ttf);}


.one { color:#ffa4e5 !important}
.two { color:#cfe98b !important}
.three { color:#83daff !important}


/**slider**/

#slider { width:100%; height: 365px;
background: url(images/slider-bg2_01.png) repeat-x bottom;}

.left-border {
height: 1px;
width: 40%;
background: #00b4ff;
float: left;
}


.right-border {height:1px;
width:40%;
background:#00b4ff;
float: right;
}

.start a {
text-decoration: none !important;
font-size: 36px;
font-weight: lighter;
font-family: 'hacen_samraregular';
text-shadow: none !important;
width: 19.2%;
float: left;
text-align: center;
line-height: 1;
margin: -24px auto 0px auto;
background: #fff url(images/br.png) bottom center no-repeat;
color: #00b4ff;
border-right: 4px solid #00b4ff;
border-left: 4px solid #00b4ff;
}

#works {
width: 100%;
height: 520px;
background: #faf3ea url(images/works-bg.png) repeat;
margin-top: -11px;
}

.works-content {width:1040px;
margin:0px auto !important;}


.works-text {
float: left;
padding-top: 37px;
width: 480px;
}



.works-text h2 {
font-family: 'hacen_samraregular';
font-size: 42px;
text-shadow: none;
color: #e77200;
text-align:center;
}


.why { width:480px;
height:40px;
margin:0 auto;
padding:10px;
background:url(images/why.png) no-repeat center;}

.works-text p {
font-family: 'zahra_arabicregular';
font-size: 24px;
text-align: justify;
line-height: 1.8;
color: #282828;
}

.works-img {background:url(images/united.png) no-repeat right bottom;
width:544px;
height:294px;
float:right;
padding-top:64px;}

.works-bt {width:97px; padding-top:20px;
margin:0 auto;}





.brush { margin-top:-55px;
width: 100%;
height: 293px;
background:url(images/brush-bg_01.png) left center no-repeat, url(images/brush-bg-right.png) right center no-repeat, url(images/brush-bg_02.png) center repeat-x;
}

.brush-content {width:950px;
margin:0 auto;}


.brush p {
float: right;
width: 542px;
height: 211px;
padding: 82px 0px 0px 0px;
font-family: 'zahra_arabicregular';
font-size: 22px;
text-align: justify;
line-height: 1.4;
color: #282828;
}

.brush span {
text-align: center !important;
font-family: 'zahra_arabicregular';
font-size: 29px;
/* font-weight: bold; */
color: #ce3c09;
text-shadow: 1px 1px 0px rgba(255, 255, 255, 0.55);
}


#services-images { width:100%;
height:600px; background:url(images/services-bg.png) no-repeat center left; }

#img-one {margin: 103px 0px 0px 171px; position:absolute;}

#img-two {margin: 186px 0px 0px 25px;
position: absolute;

}

#img-three {
margin: 270px 0px 0px 176px;
position: absolute;
}


#img-four {
margin: 264px 0px 0px 464px;
position: absolute;
}

#img-five {
margin: 197px 6px 0px 327px;
position: absolute;
}

#services-images .hover {   opacity: 0.5;
   transition: opacity .30s ease-in-out;
   -moz-transition: opacity .25s ease-in-out;
   -webkit-transition: opacity .25s ease-in-out;}
   
   
#services-images .hover:hover {
opacity: 1;}



.services-content {width:1024px;
margin:0 auto;
padding-top:98px;}

.services-text {width:529px;
float:right;}

.services-text span {
color: #C20089;}

.services-text p {opacity: 0.6;
   transition: opacity .30s ease-in-out;
   -moz-transition: opacity .25s ease-in-out;
   -webkit-transition: opacity .25s ease-in-out;}
   
.services-text p:hover {
opacity: 1;}

.services-text p {
font-family: 'zahra_arabicregular';
font-size: 22px;
text-align: justify;
line-height: 1.3;
color: #000;
}

.services-text h2 {
font-family: 'zahra_arabicregular';
font-size: 39px;
text-align: right;
text-shadow: none !important;
font-weight: lighter;
/* line-height: 1.4; */
color: #e140b2;
background: url(images/br-pink.png) no-repeat left bottom;
}


.services-text h3 {
font-family: 'zahra_arabicregular';
font-size: 38px;
text-align: left;
text-shadow: none !important;
font-weight: lighter;
/* line-height: 1.2; */
color: #444444;
}

.services-text h4 {
font-family: Droid Sans Arabic;
src: url("DroidSansArabic.ttf");
font-size: 31px;
text-align: left;
text-shadow: none !important;
font-weight: lighter;
line-height: 1.2;
color: #444444;
}


#footer {width:100%;
height:275px;
margin:0 0 !important;
background: #3e3e3e url(images/footer-bg.png) repeat-x bottom left;}

.top-footer {width:100%;
height:14px;
background: url(images/footer-top-bg_02.png) no-repeat top left;}

.footer-content {width:1024px;
margin: 0 auto;
}

#footer ul {list-style:none; float:right; 
padding: 19px 17px 20px 17px;}

#footer ul li {
}

#footer a {font-family: Droid Sans Arabic;
src: url("DroidSansArabic.ttf");
font-size: 13px;
text-align: right;
text-decoration:none !important; 
line-height: 2.1;
color: #6e6e6e;}

#footer a:hover { color:#fff;}


#last {color:#fff !important; font-size:14px !important; font-family:"droid Sans Arabic";line-height: 1.7;

}

#last a {color:#afafaf; font-size:14px; font-family: Verdana, Geneva, sans-serif;}

#newsletter_form {float:right !important;}

.footer-bt-one {
    font-size: 13px;
    font-weight: lighter;
    padding: 3px 7px;
    margin: 0 4px;
    border: 1px solid #1FAED8;
    -webkit-transition: background-color 0.3s ease-in;
    -moz-transition: background-color 0.3s ease-in;
    -ms-transition: background-color 0.3s ease-in;
    -o-transition: background-color 0.3s ease-in;
    transition: background-color 0.3s ease-in;
}
	
	.footer-bt-one:hover {background-color: #0498C4;
    color: #FFF !important;
	-webkit-transition: background-color 0.3s ease-in;
-moz-transition: background-color 0.3s ease-in;
-ms-transition: background-color 0.3s ease-in;
-o-transition: background-color 0.3s ease-in;
transition: background-color 0.3s ease-in;
	}

* Grow styles
 */
.grow li {
	-webkit-transition: all 600ms ease;
	   -moz-transition: all 600ms ease;
	    -ms-transition: all 600ms ease;
	     -o-transition: all 600ms ease;
	        transition: all 600ms ease;

	-webkit-transform-origin: 50% 50%;
	   -moz-transform-origin: 50% 50%;
	    -ms-transform-origin: 50% 50%;
	     -o-transform-origin: 50% 50%;
	        transform-origin: 50% 50%;
}
	.grow li.past {
		-webkit-transform: scale( 0.01 );
		   -moz-transform: scale( 0.01 );
		    -ms-transform: scale( 0.01 );
		     -o-transform: scale( 0.01 );
		        transform: scale( 0.01 );
	}
	.grow li.future {
		-webkit-transform: scale( 0.01 );
		   -moz-transform: scale( 0.01 );
		    -ms-transform: scale( 0.01 );
		     -o-transform: scale( 0.01 );
		        transform: scale( 0.01 );
	}