/*--------------------------------------------------
BODY
--------------------------------------------------*/
*{
  -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
  -moz-box-sizing: border-box;    /* Firefox, other Gecko */
   box-sizing: border-box;         /* Opera/IE 8+ */
 }
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:#414141; }

body {margin:0; padding:0; background:#fff; font-size:18px; 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;}

/*--------------------------------------------------
Typography
--------------------------------------------------*/
h1{	margin: 0;	padding: 0; font-size: 1.5em; font-weight: bold; color: #6fa421; }
h2{font-size:1.2em; font-weight: bold;  margin: 0;}
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:100%;
   max-width: 1200px;
   text-align: center;
   margin:0 auto;
}
#holder{ width: 100%; margin: 0 auto; padding-bottom:1%;}



/*--------------------------------------------------
header
--------------------------------------------------*/
#header{
 width:100%;
  margin:0 auto;
}
#logo{
	width:20%;
	float:left;
	padding:0 2% 0 1%;
}
#logo img{width:100%;}

#top_right{ float:right; width: 80%; }

#top_phone,#top_mail,#top_social{ float:right; padding:2% 0; padding-left:20px;}

#top_phone a, #top_mail a{ text-decoration: none; color: #414141; font-weight: 500; font-size: 1em; padding-right:10px;}



.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; padding-bottom:3%;}
/*--------------------------------------------------
top_menu
--------------------------------------------------*/
#top_menu{
  width: 100%;
  padding:0;
  text-align: right;
  border-bottom: 2px solid #414141;
}

#top_menu_mob{ display: none;position: relative;z-index: 99; }

.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 }



#top_contact{background-color: #1896bf; width: 100%;}
#calcalist{ padding-top:10px; }


#top_contact h2{ font-size: 1.333rem; font-weight: 700; padding:10px 10% 5px 0; text-align: right;direction: rtl; color: #fff; }
#top_contact form{ padding:5% 10% 7% 10%; }

#top_contact input[type="text"],#top_contact textarea{
 width: 100%;
 padding:5px;
 text-align: right;
 direction: rtl;
  background-color:#fff;
   font-size: 1rem;
    border-radius:5px;
  border:none;
  margin:6px 0;
 }
 #top_contact input[type="submit"]{
 width: 100%;
 padding:10px;
 text-align: center;
 direction: rtl;
 border-radius:5px;
 background-color:#222222;
  font-size: 1.333rem;
  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;
	color: #fff;
	font-weight: 700;
  }

   #top_contact input[type="submit"]:hover{
   background-color:#84c427;
    }


/*--------------------------------------------------
home page
--------------------------------------------------*/
#main_gal{ float:left; width: 53.33%; padding-top:.7%; }

#cat_row { float:right; width: 46.67%; padding-top:.8%;}
.cat_item_holder { width: 33.333%; padding:0 0 13px 10px; float:right; text-align: center; direction: rtl;  }
.cat_item{ width:100%;}
.cat_item img{ width: 100%;}
.cat_item h1{color:#fff; font-size: 1rem; text-decoration: none; font-weight: 700; padding-top: 70%; display: block; width: 100%; }
.cat_item p{ color: #FFFFFF; }


/*--------------------------------------------------
CAT_HOVER RFFECTS
--------------------------------------------------*/


/* Common style */
.figure {
	position: relative;
	z-index: 1;
	display: inline-block;
	overflow: hidden;
	margin: -0.135em;
	width: 100%;

	background: #2fc2ec;
	text-align: center;
	cursor: pointer;

}
.figure a {
	position: relative;
	z-index: 1;
	display: inline-block;
	overflow: hidden;
	margin: -0.135em;
	width: 1000%;
	height: 270px;
	background: #2fc2ec;
	text-align: center;
	cursor: pointer;

}
.figure img {
	position: relative;
	display: block;
	min-width: 100%;
	opacity: 1;
}

.figure .figcaption {

	color: #fff;

	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.figure .figcaption::before,
.figure .figcaption::after {
	pointer-events: none;
}

.figure .figcaption,
.figure a {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/* Anchor will cover the whole item by default */
/* For some effects it will show as a button */
.figure a {
	z-index: 1000;
	text-indent: 200%;
	white-space: nowrap;
	font-size: 0;
	opacity: 0;
}

.figure.effect-chico img {
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
	-webkit-transform: scale(1.12);
	transform: scale(1.12);
}

.figure.effect-chico:hover img {
	opacity: 1;
	-webkit-transform: scale(1);
	transform: scale(1);
}

.figure.effect-chico figcaption {

}


.figure.effect-chico .figcaption::before,
.figure.effect-chico p {
	opacity: 0;
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
}

.figure.effect-chico h2 {
    position: absolute;
    right: 0;
    padding: 5px 10px;
    bottom: 10%;
    width: 45%;
    text-align: right;
}

.figure.effect-chico p {
	margin: 0 auto;
	max-width: 200px;
	-webkit-transform: scale(1.5);
	transform: scale(1.5);
}

.figure.effect-chico:hover .figcaption::before,
.figure.effect-chico:hover p {
	opacity: 1;
	-webkit-transform: scale(1);
	transform: scale(1);
}


#wide_side_cont { }

#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:75%; float: left; text-align: right;padding-right:3%;  }
#right_side{ width:25%; float: right; text-align: right; }
#middle_side{ width:75%; float:right;text-align: right;padding:3% 0 0 2%; direction: rtl;}
#middle_side img{ padding:2%; width: 100%;}
#left_side{	float:left;	width: 25%;	}
 .video-container {
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	overflow: hidden;
}
.freetext{ direction: rtl; text-align: right; }
.freetext img{float:left; width: 50%; padding-top:2%;  }
.video-container iframe,
.video-container object,
.video-container embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.order{ padding: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: 94%; padding:3%;text-align: right; font-size: 1em; }
.order textarea { border:1px solid #C5C5C5; width: 94%; padding:3%;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: #2D973D;

 }
 #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{ position: absolute; top: 0; width: 100%; text-align: center; padding: 2% 15%; color: #FFFFFF;}
.main_text h1{font-size: 2em;}
.main_text p{ line-height: 200%;}

.main_pic{ width: 100%; position: relative;}
.main_pic img{width: 100%; }


#menu_side ul{ margin: 0 0 5% 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: #2eaea4;
 padding:4% 2%;
 color: #fff;

 	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: #414141; color: #FFFFFF; }




#main_items_row{ overflow: auto; padding: 5% 10% 2% 10%; }
.main_item{ width: 25%; padding:1%; float: right;}
.main_item_holder{ width: 100%; border:1px solid #c9c9c9; padding:5%; text-align: center; direction: rtl;}
.main_item_pic{ height: 180px; }
.main_item img{ max-width: 100%; max-height: 180px; }
.main_item h2{ color: #2FC2EC; font-size: 1.333em; font-weight: normal;  }

.price_btn a{
  display: block;
  padding:10px;
  width: 100%;
  background-color: #2FC2EC;
  color: #FFFFFF;
  font-size: 1.333em;
  text-decoration: none;
  	transition:all 0.3s linear;
	-moz-transition:all 0.3s linear;
	-o-transition:all 0.3s linear;
	-webkit-transition:all 0.3s linear;
    border-bottom:3px solid #22a0c4;

  }
.price_btn a:hover{ background-color: #22a0c4; border-bottom:3px solid #fff; }

.page_link{ float:right; width: 20%; padding: 0 2%; text-align: center; }
.page_link a{ display: block; }
.page_link img{ width: 100%;}

#articles_menu{ width: 100%; }
#articles_menu ul { width: 100%; }
#articles_menu ul li{ direction: rtl; border-bottom: 1px solid #999999; padding:15px; }
#articles_menu ul li a{ color: #1896BF; font-weight: bold; text-decoration: none;}
#articles_menu ul li a:hover{ color: #6FA421;}

/*--------------------------------------------------
CONTACT PAGE
--------------------------------------------------*/
#maps{
	width: 100%;
	padding-top:2%;
	clear:both;

	}

#contact{ width:50%; text-align: right;padding: 0 ; float: left; direction: rtl; }
#cont_icons{width:50%; text-align: right;padding: 0 ; float: right; direction: rtl; }

#contact input[type="text"], #contact textarea{
  width: 100%;
  background-color: #CCCCCC;
  border: none;
  padding:5px;
  outline: 0;
  font-size: 1em;
  margin-bottom:10px;
}
#contact input[type="text"]:nth-child(2){ float:right;  width: 49%; }
#contact input[type="text"]:nth-child(3){ float:left;  width: 49%; }

#contact input[type="submit"]{
 padding:10px;
 width: 30%;
 background-color: #2EAEA4;
 color: #FFFFFF;
 border:none;
 font-size: 1rem;
 font-weight: 700;
 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: #414141;

}



#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: 1em; padding-top:3%; }
#cont_icons div{ padding: 1% 0; }
#cont_icons .fa{ padding-left:10px; }

#wide_side ul li:before ,#middle_side ul li:before{  font-family: 'FontAwesome';  content:"\f053"; color: #1896bf; padding-left:10px;}
#wide_side ul ,#middle_side ul{ list-style: none; line-height: 150%; padding:0; float:right;}



/*--------------------------------------------------
FOOTER
--------------------------------------------------*/
#footer{
   direction: rtl;
   text-align: right;
   clear: both;
   width: 100%; margin: 0 auto;
   border-top: 2px solid #414141;
   padding-top:2%;
}


#footer_address{ direction: rtl; text-align: right; width: 90%; float:right; }

#facebook_lb{ float: left; width: 25%; }


#credit{ text-align: left; clear: both; font-size: 80%;}
#credit a{ color:#999999; padding:10px 0;}
#credit a:hover{ color: #2FC2EC;}

#footer_social { width: 10%; text-align: left; padding:0; float:left; }
#footer_social img {margin:1%; opacity: 0.8; }
#footer_social img:hover { opacity: 1; }
#footer_icons a{ margin:1%; }
#footer_address p{ font-size:80%; color: #666666; }

/*--------------------------------------------------
media query
--------------------------------------------------*/
@media screen and (min-width:100px) and (max-width:559px) {
#header,#footer{ width: 100%; clear:both; padding:0; margin: 0 auto;}
#holder{ width: 96%; clear:both; padding:0; margin: 0 auto;}
#top_menu{ display: none;}
#top_menu_mob{ display: block; }
#logo_pnim{ display: none; }
#logo{ width: 100%; padding:1% 15%;}
#top_social{ width: 25%; }
#main_gal{ width: 100%; }
#cat_row { width: 100%; }
.cat_item_holder{ padding:3px; }
.cat_item h1 {font-size: .9rem; padding-top: 61%;width: 98%;}
#phone{ width: 100%; }
#wrapper{ width: 100% }
#left_side{ width: 100%; }
#top_contact{ position: static; width: 100%; }
#cont_icons{ width: 100%; }
#wide_side_cont{ width: 96%; margin: 0 auto; }
#footer_menu ul li a{ padding:10px; }
#top_left{ width: 100%; }

#calcalist{ display: none; }

.ff-items li{  width: 48.2%; }
#middle_side { width: 100%;  }
#right_side { width: 100%;clear: both; }
#wide_side  { width: 100%;}
#maps{ width: 100%; }
#contact { width: 100%; }

.view{ width: 32%; }
.view h2{ font-size: 100%; }
.view h2 a{ padding:6% 0; }
.main_text{ width: 100%; padding: 2%; }
.main_text h1{ font-size: 1.333em; }
.main_text p{ line-height: 120%; font-size: .9em; }
.main_pic{ width: 100%; }
#footer_social {
text-align: center; float: none;width: 100%; }
#footer_address {font-size: 1em;text-align: center;width: 100%; float: none;padding: 2% 0;}
#slogan_pnim{ width: 96%; top:25%; }
#slogan_pnim h1{ font-size: 1em; }
#contact{ width: 100%; margin-top:3%; right:0; }

}

@media screen and (min-width:560px) and (max-width:959px) {
#header,#footer, #wrapper{ width: 100%; }
#holder{ width: 96%; clear:both; padding:0; margin: 0 auto;}
.main_pic img{ width: auto; }
.cat_item_holder{ padding:0 0 8px 5px; }
.cat_item h1{ padding-top:58%; }
#top_menu{ width: 100% }
#top_left{ width: 20%; }
#top_right{ width: 76%; }
#logo{ width: 24%; }
#phone{ width: 50%; }
.view{ width: 32.3%; }
.main_text{ width: 100%; padding:2%; }
.main_text p{ line-height: 150%; }

#footer{ padding:1.5% }
.view h2{ font-size: 100%; }
#middle_side{ width: 61%; margin-bottom:3%; }
#left_side{ width: 39%; }
#right_side{width: 39%; }
#wide_side { width: 61%; }
}

@media screen and (min-width:960px) and (max-width:1024px) {
.cat_item_holder{ padding:0 0 8px 5px; }
.cat_item h1{ padding-top:61%; }
#top_menu{ width: 100% }
#top_left{ width: 20%; }
#logo{ width: 24%; }
#top_right{ width: 76%; }
#phone{ width: 50%; }
.view{ width: 32.3%; }
#holder,#header,#footer, #wrapper{ width: 100%; }
#holder{ width: 96%; clear:both; padding:0; margin: 0 auto;}

.main_text{ width: 100%; padding:2%; }
.main_text p{ line-height: 150%; }
#main_items_row{ padding:0; }

#middle_side{ width: 69%; margin-bottom:3%; }
#left_side{ width: 31%; }
#right_side{width: 31%; }
#wide_side { width: 69%; }
#wide_side_cont{ width: 96%; margin: 0 auto; }




}

@media screen and (min-width:1025px) and (max-width:1200px) {
#wide_side_cont{ width: 96%; margin: 0 auto; }
#middle_side{ width: 73%; margin-bottom:3%; }
#left_side{ width: 27%; }
#right_side{width: 27%; }
#wide_side { width: 73%; }
#holder{ width: 96%; clear:both; padding:0; margin: 0 auto;}  
}

@media screen and (min-width:1200px) and (max-width:1400px) {

}
@media screen and (min-width:1400px) {

}

