/*--------------------------------------------------
BODY
--------------------------------------------------*/
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section {display:block; }
audio, canvas, video {display:inline-block; *display:inline; *zoom:1; }
audio:not([controls]) {display:none; }
[hidden] {display:none; }
html {font-size:100%; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; }
html, button, input, select, textarea {font-family: 'Open Sans Hebrew', Arial, Helvetica, sans-serif; color:#2b2b2b; }

body {margin:0; padding:0; background:#fff; font-size:1em; line-height:1.3;}
::-moz-selection {background:#72a9bd; color:inherit; text-shadow:none;}
::selection {background:#72a9bd; color:inherit; text-shadow:none; }
img::selection {background:transparent;}
img::-moz-selection {background:transparent;}
a{outline: none; }
a{ color: #2F2F2F; }
a:hover{ color: #666666; }
img {border: none;}
.f-left{float: left;}
.f-right{float: right;}
.left{text-align: left;}
.right{text-align: right;}
.center{text-align: center;}
.clear{ clear: both;}
.ib{display: inline-block;}
.rtl{direction:rtl;}
body{
	-webkit-font-smoothing: subpixel-antialiased !important;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility:    hidden;
    -ms-backface-visibility:     hidden;

}



/*--------------------------------------------------
Non-Semantic Helper Classes
--------------------------------------------------*/
.ir {display:block; border:0; text-indent:-999em; overflow:hidden; background-color:transparent; background-repeat:no-repeat; text-align:left; direction:ltr; *line-height:0;}
.ir br {display:none;}
.hidden {display:none !important; visibility:hidden;}
.visuallyhidden {border:0; clip:rect(0 0 0 0); height:1px; margin:-1px; overflow:hidden; padding:0; position:absolute; width:1px;}
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus {clip:auto; height:auto; margin:0; overflow:visible; position:static; width:auto;}
.invisible {visibility:hidden;}
.clearfix:before, .clearfix:after, .cf:before, .cf:after  {content:""; display:table;}
.clearfix:after, .cf:after {clear:both;}
.clearfix, .cf {*zoom:1;}
::-webkit-input-placeholder {   color: #35383d;}
:-moz-placeholder { /* Firefox 18- */   color: #35383d;}
::-moz-placeholder {  /* Firefox 19+ */    color: #35383d;}
:-ms-input-placeholder {   color: #35383d;}
.full{width:100%;}
.mob{display:none;}

/*--------------------------------------------------
Typography
--------------------------------------------------*/
h1{	margin: 0;	padding: 0; font-size: 1.5em; font-weight: bold; color: #104885; }
h2{font-size:1.2em; font-weight: bold;  margin: 0; color: #104885;}
h3{	margin: 0;	padding: 0; font-size: 1.5em;font-weight: normal; }
h4{	font-size: 1.3em; font-weight: normal; }
h5{	font-size: 1em; font-weight: normal; text-align: right; margin: 0;  padding-top:1%; }

/*--------------------------------------------------
Basic
--------------------------------------------------*/
#wrapper{
   width: 80%;
   text-align: center;
   margin:0 auto;

}
#holder{ width: 100%; margin: 0 auto;padding-bottom:2%; padding-top:2%; border-top:2px solid #231f20; margin-top:1.5%; clear: both;}


/*--------------------------------------------------
header
--------------------------------------------------*/
#header{
 width:100%;
  margin:0 auto;
  height: 100%;
}
#logo{
  float:right;
	width:35%;
	text-align: center;
    padding-right:4.5%;
}
#logo img{width:100%;}
#phone,#phone_mob{ float:left; width: 15%;  padding-top:5%;}
#phone_mob{display:none;width:100%;padding-top:0;}
#phone a,#phone_mob a{display:block; text-decoration: none; font-size: 1.7em; color: #104885; font-weight: bold;  }
#logo_mob{
	display: none;
    width:95%;
	text-align: center;
	margin: 0 auto;


}
#logo_mob img{ width: 100%; }

#main_gall {
 float: left;
 width: 70%;
 }
 #main_menu{ float: right; width: 43%; padding-top:4.5%;}

 #main_cont{ width: 29%; float: left; margin-left:1%; }
 #logo_pnim{
	width:20%;
	text-align: center;
	position: absolute;
	right:0;
	top:10%;
	padding:1% 2%;
	background: rgb(255, 255, 255);
  background: rgba(255, 255, 255, 0.9);
  z-index: 999;

}
#logo_pnim img{width:100%;}
#slogan_pnim{
	width:70%;
	text-align: right;
	direction: rtl;
	position: absolute;
	left:0;
	top:30%;
	padding:1% 2%;
    z-index: 998;

	text-shadow: 1px 1px 2px rgba(0, 0, 0, .8);
 }

 #slogan_pnim h1{ color: #FFFFFF; font-size: 3em; font-weight:  900;  }

#top_left{  float: right; width: 10%; text-align: left; }
#lang{ padding-top:1em;}
#lang a{ padding:0 2%; text-decoration: none; }
#lang a:hover{ color: #114984;}

#top_logos{   }
.styled-select select{
   background: #fff;
   width: 100%;
   padding: 3%;
   line-height: 1;
   border: 1px solid #c5c5c5;
   border-radius: 0;
   direction: rtl;
   font-size: 1em;

   }
.styled{
   background: #fff;
   width: 100%;
   padding: 5px;
   line-height: 1;
   border: 1px solid #c5c5c5;
   border-radius: 0;

   }
.info_title{ text-align: right;}
/*--------------------------------------------------
top_menu
--------------------------------------------------*/
#top_menu,#top_menu_mob{
  width: 100%;
  float: left;
  padding:0;

}
#top_menu_mob{display:none;}
#mobile_menu{ display: none; }

.top_soc{ float: left; text-align: center; padding-top:2%;padding-right:3%; }
.top_soc img{ position: relative; top:10px;padding-left:3%; }
.top_soc a{ text-decoration: none }

/*--------------------------------------------------
HOVER EFFECT CSS
--------------------------------------------------*/
.view-first img {
   -webkit-transition: all 0.2s linear;
   -moz-transition: all 0.2s linear;
   -o-transition: all 0.2s linear;
   -ms-transition: all 0.2s linear;
   transition: all 0.2s linear;
}
.view-first .mask {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   background-color: rgba(0,0,0, 0.6);
   -webkit-transition: all 0.4s ease-in-out;
   -moz-transition: all 0.4s ease-in-out;
   -o-transition: all 0.4s ease-in-out;
   -ms-transition: all 0.4s ease-in-out;
   transition: all 0.4s ease-in-out;
}
.view-first h2 {
   -webkit-transform: translateY(0px);
   -moz-transform: translateY(0px);
   -o-transform: translateY(0px);
   -ms-transform: translateY(0px);
   transform: translateY(0px);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   -webkit-transition: all 0.2s ease-in-out;
   -moz-transition: all 0.2s ease-in-out;
   -o-transition: all 0.2s ease-in-out;
   -ms-transition: all 0.2s ease-in-out;
   transition: all 0.2s ease-in-out;
}
.view-first p {
   -webkit-transform: translateY(0px);
   -moz-transform: translateY(0px);
   -o-transform: translateY(0px);
   -ms-transform: translateY(0px);
   transform: translateY(0px);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   -webkit-transition: all 0.2s linear;
   -moz-transition: all 0.2s linear;
   -o-transition: all 0.2s linear;
   -ms-transition: all 0.2s linear;
   transition: all 0.2s linear;
}
.view-first:hover img {
   -webkit-transform: scale(1.1,1.1);
   -moz-transform: scale(1.1,1.1);
   -o-transform: scale(1.1,1.1);
   -ms-transform: scale(1.1,1.1);
   transform: scale(1.1,1.1);
}
.view-first a.info {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   -webkit-transition: all 0.2s ease-in-out;
   -moz-transition: all 0.2s ease-in-out;
   -o-transition: all 0.2s ease-in-out;
   -ms-transition: all 0.2s ease-in-out;
   transition: all 0.2s ease-in-out;
}
.view-first:hover .mask {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
}
.view-first:hover h2,
.view-first:hover p,
.view-first:hover a.info {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transform: translateY(-100px);
   -moz-transform: translateY(-100px);
   -o-transform: translateY(-100px);
   -ms-transform: translateY(-100px);
   transform: translateY(-100px);
}
.view-first:hover p {
   -webkit-transition-delay: 0.1s;
   -moz-transition-delay: 0.1s;
   -o-transition-delay: 0.1s;
   -ms-transition-delay: 0.1s;
   transition-delay: 0.1s;
}
.view-first:hover a.info {
   -webkit-transition-delay: 0.2s;
   -moz-transition-delay: 0.2s;
   -o-transition-delay: 0.2s;
   -ms-transition-delay: 0.2s;
   transition-delay: 0.2s;
}








.view {
   width: 32.5%;
   margin: .5% 1% .5% 0;
   float: left;
   overflow: hidden;
   position: relative;
   text-align: center;
   cursor: default;
   /*border:1px solid #fff;  */

}
.view:nth-child(3){ margin-right:0; }

.view .mask,.view .content {
   width: 100%;
   height: 210px;
   position: absolute;
   overflow: hidden;
   top: 0;
   left: 0;
   background-image: url(pics/tiltan.png);
    background-repeat: no-repeat;
	background-position: bottom left;
}

.view img {
   display: block;
   position: relative;
   left:0; top:0;
   width: 100%;
}
.view h2 a{ text-decoration: none; color: #fff; display: block; padding:18% 0;  }
.view h2 {
   color: #fff;
   text-align: center;
   position: relative;
   font-size:150%;

   /*background: rgba(0, 0, 0, 0.8);   */
   margin:0;
}
.view p {

   position: relative;
   color: #fff;
   padding: 10px 20px 20px;
   text-align: center;
}
.view a.info {
   display: inline-block;
   text-decoration: none;
   padding: 7px 14px;
   background: #000;
   color: #fff;
   text-transform: uppercase;
   -webkit-box-shadow: 0 0 1px #000;
   -moz-box-shadow: 0 0 1px #000;
   box-shadow: 0 0 1px #000;
}
.view a.info: hover {
   -webkit-box-shadow: 0 0 5px #000;
   -moz-box-shadow: 0 0 5px #000;
   box-shadow: 0 0 5px #000;
}



/*--------------------------------------------------
home page
--------------------------------------------------*/
#projects_home{ position: absolute; width: 80%; left:10%; bottom:-8%; z-index: 997; }




#main_title{ margin: 0 auto; width: 90%; padding-top:1%; }
#main_title img{width: 100%; }
#page{ margin-top:3%; margin-bottom:3% }
#wide_side { width:74.2%; float: left; text-align: right; padding-top:0%; }
#right_side{ width:24.2%; float: right; text-align: right; }
.pages_row{margin-bottom:1%;}
.pages_row_img{width:100%;}
#middle_side{ width:90%; padding:0 1.5%; text-align: right;  direction: rtl; padding-top:2%; margin: 0 auto; }
#left_side{width:24.2%; float: left; padding-top:3%; }
 .video-container {
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	overflow: hidden;
}
.freetext{ direction: rtl; text-align: right; }
.video-container iframe,
.video-container object,
.video-container embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.order{ padding:4.1% 8%; width: 84%; background-color: #E4E4E4; }
.order form{ padding-top:3%; }
.order input,.order select,.order textarea{ margin-top:3% }
.order input[type="text"] { border:1px solid #C5C5C5; width: 98%; padding:1%;text-align: right; font-size: 1em; }
.order textarea { border:1px solid #C5C5C5; width: 98%; padding:1%;text-align: right; font-size: 1em; }
.order input[type="submit"]{
	margin-top:3% ;
	background-color:  #2B2B2B;
	color: #FFFFFF;
	font-size: 1.2em;
	font-weight:bold;
	width: 100%;
	padding:3%;

	border: none;
    transition:all 0.5s linear;
	-moz-transition:all 0.5s linear;
	-o-transition:all 0.5s linear;
	-webkit-transition:all 0.5s linear;
 }
 .order input[type="submit"]:hover{
	background-color: #104885;

 }
 #promo_button{
 	width: 92%;
	padding:6% 4% 2% 4%;
	border-radius: 5px;
	background-color: #B45132;
	margin-top:5%;
	text-align: center;
	transition:all 0.5s linear;
	-moz-transition:all 0.5s linear;
	-o-transition:all 0.5s linear;
	-webkit-transition:all 0.5s linear; }

	#promo_button:hover{background-color:  #231f20;}






.sel_cl{ border: 1px solid #000; color: #fff; background: #2f2f2f; padding: 10px; width: 100%; text-align: right; direction: rtl; }
.opt{ padding:5px; margin: 20px; }
.sel_cl option{ height:50px; direction: rtl; }


.main_text{ width: 100%; }
.main_pic{  width:100%;}
.main_pic img{width: 100%; }


#menu_side ul{ margin: 0 0 2% 0; padding:0; }
#menu_side li{
 list-style-type: none;
 direction: rtl;
 margin-bottom: 1px;
}
#menu_side li:hover{}
#menu_side li a{
 background-color: #E4E4E4;
 padding:2%;
 color: #2B2B2B;
  font-size: 120%;
 	transition:all 0.3s linear;
	-moz-transition:all 0.3s linear;
	-o-transition:all 0.3s linear;
	-webkit-transition:all 0.3s linear;
	text-decoration: none;
	display: block;
	font-weight: bold;

 }
#menu_side li a:hover{ background-color: #114984; color: #FFFFFF; }

/*--------------------------------------------------
CONTACT PAGE
--------------------------------------------------*/
#maps{
	width: 35%;
	float: right;
	margin-top:2%;
	text-align: right;
	padding:2%;
	background-color: #E4E4E4;
	}
.cont_pic{ float: left; width: 60%; position: relative; }
.cont_pic img{position: absolute; left:0; top:-35px; }
#contact{ width: 50%;  position: absolute; margin-top:4%; text-align: right;padding: 0 5%; padding-bottom:3%; text-align: right; direction: rtl;right:0; top:6%; }

#contact input[type="text"]{
  width: 96%;
  background: rgb(255, 255, 255);
  background: rgba(255, 255, 255, 0.6);
  border: 1px solid #333;
  padding:5px;
  color: #333;
  outline: 0;
  font-size: 1em;
}

#contact input[type="submit"]{
 padding:3%;
 width: 99%;
 background-color: #2B2B2B;
 color: #FFFFFF;
 border: 1px solid #2B2B2B;
 font-size: 1em;
 font-weight: bold;
 cursor: pointer;
 transition:all 0.5s linear; -moz-transition:all 0.5s linear; -o-transition:all 0.5s linear; -webkit-transition:all 0.5s linear; white-space:nowrap; cursor:pointer;
}
#contact input[type="submit"]:hover{
 background-color: #114984;
 color: #fff;
 border:1px solid #114984;
}

#contact textarea{
  width: 96%;
  background: rgb(255, 255, 255);
  background: rgba(255, 255, 255, 0.6);
  border: 1px solid #333;
  padding:5px;

  color: #333;
  resize: none;
  outline: 0;
  font-size: 1em;
}

#address{ width: 46%; float: left; margin-top:4%; text-align: left; }

#address a{
  color: #333;
  text-decoration: none;
  font-size: 1em;
}
#address a:hover{
  color:  #666666;
  text-decoration: underline;
  font-size: 1em;
}
#cont_icons{ direction: rtl; font-size: 1.1em; padding-top:3%; }
#cont_icons .icon{ width:5%; float: right; margin-left:5%; margin-bottom:1%; }
#cont_icons img{padding-left:3%; width: 100%; }
/*--------------------------------------------------
FOOTER
--------------------------------------------------*/
#footer{

   font-size:100%;;
   text-align: center;
   direction: rtl;
   text-align: right;
   clear: both;
   border-top:2px solid #231f20;
   padding-top:1%;
   width: 100%; margin: 0 auto;


}
#footer_address{ font-size:1.2em; direction: rtl; text-align: right; width: 80%; float: right; }
#footer_top{ background-color: #f1f1f1; padding:1.5% 10%;  }
#footer_middle{background-color: #e4e4e4; padding:1.5% 10%; }
#footer_bottom{ background-color: #c7050d; color:#fff;padding:1%; text-align: center;  }

#facebook_lb{ float: left; width: 25%; }
#footer_links{
  float: right;
  width: 70%;
  padding-left:5%;


}
#footer_links ul{
 text-align: right;
 margin: 0 auto;
 width: 25%;
 float: right;
 padding:0;

}
#footer_links li{
  list-style-type: none;
  padding-left:5px;
}
#footer a{
   color: #333;
   text-decoration:none;
   line-height: 1.5em;
}
#footer a:hover{
   color:#000;
   text-decoration:underline;
}

#credit{ text-align: center; padding-top:2%; }
#credit a{ color:#333; padding:10px;}
#credit a:hover{ color:#000;}

#footer_social { text-align: left; float: left; width: 20%; margin-top:-1%; }
#footer_social img {margin:1%; opacity: 0.8; }
#footer_social img:hover { opacity: 1; }
#footer_icons a{ margin:1%; }

/*--------------------------------------------------
media query
--------------------------------------------------*/
@media screen and (min-width:100px) and (max-width:559px) {
.mob{display:block;}
.no-mob{display:none;}
#holder,#header,#footer{ width: 100%; clear:both; padding:0;}
#wrapper{width:100%;}
/*#top_menu{ width: 100%;display:none;}*/
#top_menu{ width: 100%;}
/*#top_menu_mob{display:block;}*/
#phone{display:none;}
#phone_mob{display:block;}

#main_menu{width:100%;padding-top:0;}
#example li{width:100%;}
#logo_pnim{ display: none; }
#logo{ width:100%;}
#logo_mob{ display:block}
#main_cont{width: 100%;margin-left:0;margin-top:1%;}
#main_gall{ width: 100%; }
#top_left{ width: 100%; }
.top_soc{ float: right; position: static; }
#lang{ width: 50%; font-size: 1.2em; font-weight: bold; }
.ff-items li{  width: 48.2%; }
#middle_side { width: 96%; margin: auto; float: none; }
#right_side { width: 96%;margin: auto; float: none; clear: both; }
#wide_side  { width: 96%;margin: auto; float: none; }
#maps{ width: 96%;margin: auto; float: none;  }
#contact { width: 92%;margin: auto; float: none;  }
#slogan{ width: 85%; top:10%; }
#slogan h1{ font-size: 1.5em; }
#projects_home{ position: static; width: 96%; margin: 0 auto; padding:2% 0; }
.view{ width: 32%; }
.view h2{ font-size: 100%; }
.view h2 a{ padding:6% 0; }
.main_text{ width: 100%; }
.main_pic{ width: 100%; }
#footer_social {
text-align: center; float: none;width: 100%; }
#footer_address {font-size: 1.5em;text-align: center;width: 100%; float: none;padding: 2% 0;}
#slogan_pnim{ width: 96%; top:25%; }
#slogan_pnim h1{ font-size: 1em; }
#contact{ width: 88%; margin-top:3%; }
.cont_pic{ width: 100%; float:left; height: 570px; top:40px;  }
.cont_pic img{ width: 100%; top:100px;}
}

@media screen and (min-width:560px) and (max-width:959px) {
#top_menu{ width: 100% }
#top_left{ width: 20%; }
#logo{ width: 30%; top:5% }
.view{ width: 32.3%; }
#holder,#header,#footer{ width: 92%; }
#slogan{ width: 88%; top:44%; }
#slogan h1{ font-size: 2em; }
.main_text{ width: 100%; }
.main_pic {
float: none;
width: 100%;
height: 250px;
overflow: hidden;
}
.view h2{ font-size: 100%; }
#middle_side{ width: 97%; margin-bottom:3%; }
#right_side{ width: 100%; }
#wide_side { width: 100%; }
#maps{ width: 97%; }
#contact{ width: 88%; margin-top:3%; }
.cont_pic{ width: 100%; float:left; height: 570px; top:40px;  }
#logo_pnim{ width: 40%; }
#slogan_pnim{ width: 90%; top:60% }
#slogan_pnim h1{ font-size: 2.2em; }
/*
#header{width: 100%;}
#logo {width: 23%;} 
#main_menu {float: right;width: 62%;padding-top:0;}
.sf-menu a {padding: .75em .5em;}
#phone {width: 15%;padding-top: 2%;}
#phone a {font-size: .9em;}
*/
}

@media screen and (min-width:960px) and (max-width:1024px) {
	#wide_side{ width: 60%; }
	#top_left{ width: 15%; }
#holder,#header,#footer{ width: 92%; }
.view{ width: 32.3%; }
#slogan{ width: 80%; }
#slogan h1{ font-size: 2em; }
.view h2{ font-size: 130%; }
#logo{ width: 26%; }
#right_side{ width: 36.2% }
#middle_side{ width: 60%; }
.main_text{ width: 100%; }
.main_pic {
float: none;
width: 100%;
height: 250px;
overflow: hidden;
}
#holder{ padding-bottom:7%; }
#contact{ width: 70%; }
#slogan_pnim{ width: 80%; top:70%; }
#slogan_pnim h1{ font-size: 2.5em; }
#logo_pnim{ width: 35%; }
 #header{width: 100%;}
/*
 #logo {width: 23%;} 
#main_menu {float: right;width: 57%;padding-top:0;}
.sf-menu a {padding: .75em .5em;}
#phone {width: 15%;padding-top: 2%;}
#phone a {font-size: .9em;}
*/
}

@media screen and (min-width:1025px) and (max-width:1200px) {

}

@media screen and (min-width:1200px) and (max-width:1400px) {
.view{ width: 32%; }
#slogan h1{ font-size: 2.5em; }
#top_left{ width: 14%; }
#holder{ padding-bottom:6%; }
}
@media screen and (min-width:1400px) {

}

