/* CSS Document */

body{margin:0px; padding:0px; font-family:Arial, Helvetica, sans-serif; font-size:12px; background:url(../img/body_bg2.png) repeat-x left top;}
body#temp{margin:0px; padding:0px; font-family:Arial, Helvetica, sans-serif; font-size:12px; background:url(../img/body_bg1.png) repeat-x left top;}
h1, h2, h3, h4, h5, h6, h7, p, form, input, ul, li{padding:0px; margin:0px; font-weight:normal;}
p{line-height:16px}
ul,ol,li {list-style:none;}
input, select, textarea{font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#000;}
a{text-decoration:none; outline:none;}
a:hover{text-decoration:underline; outline:none;}
a img{border:0px; outline:none;}
.clear{clear:both; font-size:0px; height:0px; line-height:0px; display:block; background:#fff;}
.fleft{float:left;}
.fright{float:right;}

/* ======================================== Master Styles ============================================ */
.Master_div{width:1000px; margin:0px auto;}
/* ======================================== Header Styles ============================================ */
.header{width:1026px; margin:0px auto; background:url(../img/header_bg.png) no-repeat left top; height:130px;}
.header1{width:1026px; margin:0px auto; background:url(../img/header_bg1.png) no-repeat left top; height:130px;}
.logo{width:559px; margin:20px 20px 0px 0; float:right;}
.nav{position: absolute;
margin: 0px;
width: 1003px;
top: 137px;
z-index: 3;
font-size: 16px;}
.nav li{float: right;
padding-right: 90px;}
/*.nav li:first-child{padding-right:0px;}*/
.nav li a{font-size:18px; color:#fff; text-decoration:none; text-decoration: none;
-ms-text-shadow: 0px 0px 12px #000;-moz-text-shadow: 0px 0px 12px #000;-o-text-shadow: 0px 0px 12px #000;-webkit-text-shadow: 0px 0px 12px #000; text-shadow: 0px 0px 12px #000;}
/* ======================================== Container Styles ============================================ */
.container{width:1024px; margin:0px auto; background:url(../img/cont_bg.png) repeat-y left top; line-height:0px; font-size:0px;}	
.content1{width:1003px; margin:0px auto; position:relative; padding-top:1px;}
.content2{width:1003px; margin:0px auto; position:relative; height:220px; padding-top:1px; padding-left:4px;}

.navigation{width:750px; position:absolute; top:10px; left:150px;}
.navigation ul{margin:0px; padding:0px;}
.navigation li{float:left; padding:0 20px;}
.navigation li a{float:left; padding:0 0px; color:#d8d8d8; font:normal 18px NarkisShulamitMF;}
.navigation li img{margin:8px 0 0 0; float:left;}

.M_content{width:1024px; margin:0px auto; background:url(../img/cont_btm_bg.png) no-repeat left top; }
.I_content{width:1024px; margin:0px auto; background:url(../img/cont_btm_bg1.png) no-repeat left top; }

/* ======================================== Home Page Styles ============================================ */
.form{width:360px; background:url(../img/cen_shad.png) no-repeat right top; padding:0 0 0 50px; float:left; direction:rtl;}
.form h1{float:left; padding:0 0px; color:#000; font:normal 24px Arial, Helvetica, sans-serif; width:285px; padding:20px 0 0 0; text-align:right;}
.form label{float:left; padding:0 0px; color:#000; font:normal 12px Arial, Helvetica, sans-serif; text-align:right; width:35px; margin:20px 0px 0px 0;}
.form input,.form textarea{float:left; padding:0 0px; color:#000;  width:216px; background-color:#fff; border:1px solid #000; font:normal 13px NarkisShulamitMF; padding:3px 0 3px 10px; margin:15px 25px 0px 0;}
.form input.grey{background-color:#fefefe;}
.form input.submit{background:url(../img/submit.png) no-repeat left top; width:94px; height:24px; margin:20px 25px 20px 0; border:0px; cursor:pointer;}

.F_right{width:520px; float:right; padding:0 60px 0 0;}
.F_right img{float:right; margin:20px 0 0 0;}
.F_right p{float:left; padding:0 0px; color:#000; font:normal 12px Arial, Helvetica, sans-serif; width:520px;  text-align:right;}

/* ======================================== News Page Styles ============================================ */
.N_cont_L{width:630px; float:left; background:url(../img/cen_shad1.png) no-repeat right top; padding:30px 70px 0 0;}
.N_cont_L div.contentt{float:right; padding:0px 0px; color:#0a0a0a; font:normal 12px Arial, Helvetica, sans-serif; width:500px;  text-align:right; direction:rtl;}

.N_cont_R{width:250px; float:right; padding:30px 25px 0 0;}
.N_cont_R h1{float:right; padding:0px 0px; color:#0a0a0a; font:bold 24px NarkisShulamitMF; width:200px;  text-align:right;}
.N_cont_R p{float:right; padding:0px 0px; color:#000; font:normal 12px Arial, Helvetica, sans-serif; text-align:right;}
.N_cont_R a{float:right; padding:10px 0 0px 0px; color:#2b519b; font:bold 13px NarkisShulamitMF; width:230px; text-align:right;}

.N_cont_R1{width:250px; float:right; padding:30px 45px 0 0; text-align:right; direction:rtl;}

/* ======================================== Contact Page Styles ============================================ */
.contact_L{width:782px; float:left; padding:0 60px 0 0; direction:rtl;}
.contact_L h1{float:right; padding:0px 0px; color:#25468a; font:bold 24px NarkisShulamitMF; width:200px;  text-align:right; padding:20px 0px 40px 0;}
.contact_L div.con{float:right; padding:0px 0px; color:#000; font:normal 12px Arial, Helvetica, sans-serif; text-align:right;}

.C_form{width:490px; float:left; padding:0 0 0 70px; direction:rtl;}
.C_form h2{float:right; padding:0px 0px 10px 0; color:#000; font:normal 12px Arial, Helvetica, sans-serif; text-align:right; direction:rtl;}
.C_form textarea{float:left; color:#000; font:normal 12px Arial, Helvetica, sans-serif; text-align:right; width:203px; text-align:right; height:61px; background:url(../img/textaera_bg.png) repeat-x left top; border:1px solid #51b8e6;  margin:0 60px 20px 0; padding:0 10px 0 0; overflow:auto;}
.C_form input{float:right; color:#000; font:normal 12px Arial, Helvetica, sans-serif; text-align:right; width:189px; text-align:right; background:url(../img/input_bg.png) repeat-x left top; border:1px solid #51b8e6; padding:3px 10px 3px 0px; margin:0 0 15px 0;}
.C_form input.cap_input{float:left; color:#000; font:normal 12px Arial, Helvetica, sans-serif; text-align:right; width:89px; text-align:right; background:url(../img/input_bg.png) repeat-x left top; border:1px solid #51b8e6; padding:3px 10px 3px 0px; margin:0 0 15px 5px;}
.C_form input.C_submit{float:left; width:139px; height:21px; cursor:pointer; background:url(../img/C_submit.png) repeat-x left top; border:0px;}
.C_form img{float:left;}

.contact_R{width:171px; float:left; background:#3a474b url(../img/cen_shad1.png) no-repeat left top; line-height:0px; font-size:0px; height:405px; margin-top:1px;}
.contact_R img{margin:5px 0 20px 19px;}
.contact_R ul{margin:0px; padding:0px;}
.contact_R li{float:left;  background:url(../img/nav_bg.png) no-repeat left top; width:170px;}
.contact_R li a{float:left; padding:0 0px; color:#fff; font:normal 15px Arial, Helvetica, sans-serif; text-align:center; width:170px; padding:10px 0px 9px 0; text-decoration:none;}

.contact_R li.sel{float:left; padding:0px 0px 0px 0; background:url(../img/nav_sel_bg.png) no-repeat left top; width:170px;}
.contact_R li a:hover{background:url(../img/nav_sel_bg.png) no-repeat left top; width:170px; }

/* ======================================== Gallery Page Styles ============================================ */
.gallery_L{width:842px; float:left; padding:0 0px 0 0;}
.gallery_L h1{float:right; padding:20px 60px 30px 0; color:#000000; font:bold 24px Arial, Helvetica, sans-serif; text-align:right;}

.G_imgs{width:800px; margin:0 0 0 80px;}
.G_imgs img{margin:0 15px 18px 0;}

/* ======================================== Projects Page Styles ============================================ */
.Projects{width:415px; float:left; margin:20px 0 0 40px;}
.Projects h1{float:left; padding:0px 0px 10px 0; color:#2b519c; font:normal 22px Arial, Helvetica, sans-serif; text-align:right; width:250px; direction:rtl;}
.Projects p{float:left; padding:0px 0px 0px 0; color:#0a0a0a; font:normal 12px Arial, Helvetica, sans-serif; width:250px; text-align:right; direction:rtl;}
.Projects img{float:right;  margin:0px 0 0 0;}

/* ======================================== Technical Page Styles ============================================ */
.Technical_L{width:842px; float:left; padding:0 0 70px 0;}
.Technical_L h1{float:right; padding:30px 60px 0px 0; color:#25468a; font:bold 24px Arial, Helvetica, sans-serif; text-align:right;}
.T_top{width:842px; float:left; padding:0 0px 10px 0;}
.T_top img{margin:-8px 0 0 150px; float:left;}

.Tec_nav{width:185px; border-top:1px solid #000; float:right; margin:20px 60px 0px 0; padding:10px 0 0 0;}
.T_top ul{margin:0px; padding:0px;}
.T_top li{padding:0px 0px 0px 0; color:#000; font-size:10px; background:url(../img/T_square.png) no-repeat right 8px; float:left; width:180px;}
.T_top li a{float:left; padding:2px 0 0px 0px; color:#000; font:normal 12px Arial, Helvetica, sans-serif; text-align:right; width:170px;}

.T_cen{width:842px; float:left; padding:0px 0px 0 0;}
.T_maps{width:724px; margin:15px auto;}
.map1{width:130px; float:left; margin:0 0px 0 51px;}
.T_maps h3{float:left; padding:10px 8px 0px 25px; color:#25468a; font:normal 12px Arial, Helvetica, sans-serif;}
.T_maps img{float:left; margin:10px 0 0 0;}
/* ======================================== Footer Styles ============================================ */
.footer{width:920px; margin:0px auto; padding-bottom:50px;}
.footer img{margin:0 0 10px 0;}
.footer p{float:left; padding:0 0px; color:#000; font:normal 12px Arial, Helvetica, sans-serif;}
.footer ul{margin:0px; padding:0px; float:right; width:520px;}
.footer li{float:right; padding:0 0px 0px 30px; }
.footer li a{padding:0 0px; color:#000; font:normal 12px Arial, Helvetica, sans-serif;}

.E_media{width:110px; margin:0px auto;}
.E_media img{margin:20px auto;}

.mediathumb {
	display:block;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#000;
	margin-bottom:10px;
}

.mediathumb b {
	color:#666;
	font-weight:normal;
}

.mediathumb:hover {
	text-decoration:none;
}

.newsthumb {
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#000;
}

.newsthumb:hover {
	text-decoration:none;
}


.C4_right h2{color:#fff; font:normal 12px Arial, Helvetica, sans-serif; line-height:16px; text-align:right; padding:25px 0px 0 0; float:right; direction:rtl;}
.C4_right form{width:217px; float:right;}
.C4_right input{width:205px; float:right; border:1px solid #000000; background-color:#fff; color:#000; font:normal 12px Arial, Helvetica, sans-serif; text-align:right; padding:5px 10px 5px 0; margin:5px 0;}
.C4_right textarea{width:205px; float:right; border:1px solid #000000; background-color:#fff; color:#000; font:normal 12px Arial, Helvetica, sans-serif; text-align:right; padding:5px 10px 20px 0; margin:5px 0; overflow:auto;}
.C4_right input.captcha{width:91px; float:left; border:1px solid #000000; background-color:#fff; color:#000; font:normal 12px Arial, Helvetica, sans-serif; text-align:right; padding:5px 10px 1px 0; margin:5px 5px 10px 0;}
.C4_right img{ margin:10px 0px 0 0;}
.C4_right input.submit{width:205px; float:left; border:0px; background:url(../img/submit.png) no-repeat left top; color:#000; font:normal 12px Arial, Helvetica, sans-serif; text-align:right; padding:5px 10px 5px 0; margin:5px 0; height:23px;}

.contentdesc {
	padding-right:60px;
	padding-left:70px;
	margin-top:10px;
	text-align:right;
	direction:rtl;
}

.evolvelogo {
	background-image:url(../img/evolve_media.png);
	width:94px;
	height:13px;
	display:block;
	margin-top:23px;
}

.gallerythumb {
	display:block;
	border:3px solid #52bdec;
	width:220px;
	height:130px;
	padding:0px;
	margin:0px;
	position:relative;
	margin-bottom:14px;
}

.gallerythumb img {
	position:absolute;
	left:0px;
	top:0px;
}

.dirathumb span {
	display:block;
	margin-top:5px;
}


        /**
 * See: http://www.css-101.org/articles/ken-burns_effect/css-transition.php
 */
/**
 * Styling the container (the wrapper)
 * 
 * position is used to make this box a containing block (it becomes a reference for its absolutely positioned children). overflow will hide part of the images moving outside of the box.
 */

#slideshow,#slideshow-inner {
    position:relative;
    width:1003px;
    height:400px;
    overflow:hidden;    
}
#slideshow-inner { 
    width:1001px;          
    height:219px;           
}

/**
 * Styling the images
 *
 * position:absolute is to put all images in a stack. Dimensions are set to increase the size of these images so their edges do not appear in the parent box when we move them inside the said box.
 * Because the images are now larger than their parent container, we use top, left and margin values to align them in the center of the box.
 * Finally, we set the transition (property and duration). Note that duration values are different for opacity and transform as we want the "fade-in" effect to be faster than the "panning" effect.
 */

#slideshow img,#slideshow-inner img {
    position:absolute;
    width:1003px;
    height:400px;
    top:50%;
    left:40%;
    margin-left:-401px;
    margin-top:-200px;
    opacity:0;
    -webkit-transition-property: opacity, -webkit-transform;
    -webkit-transition-duration: 3s, 10s;
       -moz-transition-property: opacity, -moz-transform;
       -moz-transition-duration: 3s, 10s;
        -ms-transition-property: opacity, -ms-transform;
        -ms-transition-duration: 3s, 10s;
         -o-transition-property: opacity, -o-transform;
         -o-transition-duration: 3s, 10s;
            transition-property: opacity, transform;
            transition-duration: 3s, 10s;
}

#slideshow-inner img { 
    width:1001px;
    height: auto;
top: 9%;
left: 40%;
margin-left: -400px;
}

/**
 * We change the point of origin using four corners so images do not move in the same direction. 
 * This technique allows us to create various paths while applying the same translate() values to all images (see the 'fx' class further below).
 */

#slideshow img,#slideshow-inner img  {
    -webkit-transform-origin: bottom left;
       -moz-transform-origin: bottom left;
        -ms-transform-origin: bottom left;
         -o-transform-origin: bottom left;
            transform-origin: bottom left;
}

#slideshow :nth-child(2n+1),#slideshow-inner :nth-child(2n+1) {
    -webkit-transform-origin: top right;
       -moz-transform-origin: top right;
        -ms-transform-origin: top right;
         -o-transform-origin: top right;
            transform-origin: top right;
}

#slideshow :nth-child(3n+1),#slideshow-inner :nth-child(3n+1){
    -webkit-transform-origin: top left;
       -moz-transform-origin: top left;
        -ms-transform-origin: top left;
         -o-transform-origin: top left;
            transform-origin: top left;
}
#slideshow :nth-child(4n+1),#slideshow-inner :nth-child(4n+1) {
  -webkit-transform-origin: bottom right;
     -moz-transform-origin: bottom right;
      -ms-transform-origin: bottom right;
       -o-transform-origin: bottom right;
          transform-origin: bottom right;
}

/**
 * Because of the stacking context, we need to make sure that the first image (in source) is not hidden by the last one. 
 * The rule below moves all images past the second one down the stack. 
 * This is because the second image needs to show on top of the first one when it transitions in.
 */

#slideshow .fx:first-child + img ~ img, #slideshow-inner .fx:first-child + img ~ img {
    z-index:-1;
}

/**
 * Because images are styled with a different point of origin, the following rule will create different panning effects.
 */

#slideshow .fx,#slideshow-inner .fx {
    opacity:1;
    -webkit-transform: scale(1.3);
       -moz-transform: scale(1.3);
        -ms-transform: scale(1.3);
         -o-transform: scale(1.3);
            transform: scale(1.3);
}

