@import 'reset.css';

b{
	font-family: Alef-bold;
}

.clear{
	clear: both;
	width:0;
	height:0;
}

.hidden{
	display: none;
}

@font-face {
    font-family: Alef-regular;
    src: url(../fonts/Alef-regular.ttf);
	font-size: 1em;
	
}

@font-face {
    font-family: Alef-bold;
    src: url(../fonts/Alef-bold.ttf);
	font-size: 1em;
}

/*@font-face {
    font-family: Alef-regular-eng;
    src: url(../fonts/Alef-regular.ttf);
	font-size: 0.8em;
}

@font-face {
    font-family: Alef-bold-eng;
    src: url(../fonts/Alef-bold.ttf);
	font-size: 0.8em;
}*/

body{
direction:rtl;
text-align:right;
color:rgb(77,77,71);
width:100%;
font-family: Alef-regular;
height:auto;
background: #F5F1E6;
background-image: url('../images/background4.png');
background-blend-mode: multiply;
font-size:16px;
}

.wrapper{
width:100%;
margin:0 auto;
position:relative;}

.main{
margin:0 auto;
background-size:100%;
}

/********************* HEADER ********************/
/*************************************************/
.menu{
width: 87%;
}

.indexAside{
width:20%;
float: right;
margin-right: 7.5%;
margin-top: 2.5%;
}

.menuHeader{
background-color:#d76d41;
background-image: url('../images/background4.png');
background-blend-mode: multiply;
color:#F5F1E6;
font-family:Alef-bold;
font-size:22px;
padding: 5% 0;
text-align:center;
border-radius: 6px 6px 0 0 ;
}

.menu ul{
width: 80%;
padding: 1% 10% 2%;
background-color: #FECB6F;
background-image: url('../images/background4.png');
background-blend-mode: multiply;
}

.menu ul li{
width:90%;
font-size:17px;
color:rgb(77,77,71);
padding: 3% 21% 3% 0;
background: url('../images/bullet.png'), url('../images/background4.png');
background-size: 97%;
background-repeat: no-repeat;
background-position: right center;
background-blend-mode: multiply;
background-size:5%;
}

.menu ul li a{
color:rgb(77,77,71);
}

.main header{
width:72%;
float:right;
position:relative;

}

.logo{
cursor:pointer;
width:21%;
padding-bottom: 21%;
background:url('../images/logo.png'), url('../images/background4.png') center center no-repeat;

background-blend-mode: multiply;
background-size:100%, 476%;
position:absolute;
right: 26%;
bottom: 0;
z-index: 99;
}

.contactUs{
width:13%;
text-align:center;
float: left;
margin-top: 5%;
margin-left: 10%;
}

.contactUsImg{
width:100%;
padding-bottom:100%;
background:url('../images/air_baloon.png'), url('../images/background4.png');
background-position: top center;
background-repeat: no-repeat;
background-blend-mode: multiply;
background-size:contain, 769%;
margin:0 auto;
}

.contactUs h3{
font-family:Alef-bold;
font-size:15px;
padding:2% 0;
}

.number{
font-size:17px;
padding:2% 0 6%;
}

.number a{
color:rgb(77,77,71);
display: block;
}

.greyLegRight{
width:10%;
padding-bottom:9%;
background-color:#CCC7B5;
background-image: url('../images/background4.png');
background-blend-mode: multiply;
float:right;
}

.greyLegLeft{
width:10%;
padding-bottom:9%;
background-color:#CCC7B5;
background-image: url('../images/background4.png');
background-blend-mode: multiply;
float:left;
}

.threeTrees{
width: 18%;
padding-bottom: 9.5%;
background: url('../images/three_trees.png'), url('../images/background4.png');

background-blend-mode: multiply;
background-position: top center;
background-repeat: no-repeat;
background-size: contain;
position: absolute;
margin-top: -9.5%;
left: 26%;

}
/********************* SECTION ********************/
/*************************************************/
.getToKnowUs{
width:46%;
float:right;
background: url('../images/water.png'), url('../images/background4.png');
background-position: 1% 2%,top left;
background-size: 90%, 217%;
background-repeat: no-repeat;
background-blend-mode: multiply;
padding-bottom: 23%;
position: relative;
}

.plug{
position: absolute;
width: 7%;
background-image: url('../images/plug.png'), url('../images/background4.png');
background-position:center  ;
background-repeat: no-repeat;
background-size: contain, 3105%;
background-blend-mode: multiply;
padding-bottom: 8%;
bottom: -7%;
left: 18.3%;
}

.whoAreWe{
width:42%;
margin: 13% 36% 0 0;
background: url('../images/cabel.png'), url('../images/background4.png');
background-blend-mode: multiply;
background-position: left 31% ;
background-repeat: no-repeat;
background-size: 94%, 518%;
}

.person{
   width:42%;
   text-align:center;
   display:inline-block;
   margin-right: 20%; /* NS */
}

.personIndexYoav{
width:100%;
padding-bottom: 100%;
background:url('../images/fox.png'), url('../images/background4.png');
background-position: center center ;
background-repeat: no-repeat;
background-size:contain, 1233%;
background-blend-mode: multiply;
}

.personIndexShahar{
width:100%;
padding-bottom: 100%;
background:url('../images/fox_woman.png'), url('../images/background4.png');
background-position: center center ;
background-repeat: no-repeat;
background-size:contain, 1233%;
background-blend-mode: multiply;
}

.person h4{
font-size:16px;
}
.greenPath{
width:80%;
padding-bottom: 20%;
background:url('../images/green_path.png'), url('../images/background4.png');
background-position: center center ;
background-repeat: no-repeat;
background-size:contain, 649%;
background-blend-mode: multiply;
}

.whoAreWeLink{
font-size: 1.1vw;
background: url('../images/who_are_we.png') center center no-repeat;
background-position: center center ;
background-repeat: no-repeat;
background-blend-mode: multiply;
background-size: contain;
text-align: center;
padding: 10%;
display: inline;
margin-right: 16%;
position: relative;
top: 4px;
z-index: 9;
}

.whoAreWeLink a{
color:rgb(77,77,71);
font-family:Alef-bold;
}

.welcomeSection{
}

.welcome{
text-align:center;
width:22%;
float: left;
margin-left: 10%;
position:relative;
}

.orangeTree{
background: url('../images/orange_tree.png'), url('../images/background4.png');
background-position: top center ;
background-repeat: no-repeat;
background-size: contain, 4545%;
background-blend-mode: multiply;
width: 10%;
padding-bottom: 19%;
position: absolute;
margin-top: -19%;
left: 75%;
top:0;
}

.welcomeTitle{
width:100%;
padding: 2% 0;
background:url('../images/welcome.png'), url('../images/background4.png');
background-blend-mode: multiply;
background-position: center center ;
background-repeat: no-repeat;
text-align:center;
font-size:22px;
background-size: contain, 454%;
position: relative;
z-index: 99;
}

.welcomeText{
font-size: 16px;
font-size:1.1vw;
width:88%;
line-height:20px;
line-height: 18px;
margin: 1% auto 2%;
height: 90px;
}


.welcomeTrey{
width:19%;
padding-bottom:1%;
margin:0 auto;
background-color:#CCC7B5;
background-image: url('../images/background4.png');
background-blend-mode: multiply;
}

.welcomeLeg{
width:7%;
padding-bottom:13%;
margin:0 auto;
background-color:#CCC7B5;
background-image: url('../images/background4.png');
background-blend-mode: multiply;
}

.centerImage{
width: 147%;
position: absolute;
background: url('../images/red_path.png'),url('../images/background4.png');
background-blend-mode: multiply;
background-position: right top ;
background-repeat: no-repeat;
background-size: cover, 310%;
padding-bottom: 120%;
margin-bottom: -40%;
left: 24.5%;
bottom:0;
z-index: 9;
}
.portfolio{
width:23%;
position: absolute;
margin-top: -19%;
left: 4.6%;
z-index: 2;
}
.portfolioBrief{
width:100%;
height:250px;
background-color:rgb(77,77,71);
background-image: url('../images/background4.png');
background-blend-mode: multiply;
overflow:auto;
padding: 4%;
box-sizing: border-box;
}

.greyPipe{
position: absolute;
width: 73%;
padding-bottom: 45%;
bottom:0;
left: 16%;
background: url('../images/lets_go_pipe2.png'), url('../images/background4.png');
background-blend-mode: multiply;
background-position: center center ;
background-repeat: no-repeat;
background-size: contain, 137%;
pointer-events: none;
}

.hitTheRoad{
position:relative;
}

.hitTheRoadMain{
width: 65%;
}

.hitTheRoadTitleWrap{
width: 25%;
float: left;
margin-left: 10%;
text-align: center;

}

.hitTheRoadTitle{
padding:4.5%;
text-align:center;
font-size:22px;
color:#FFCC6E;
background:url('../images/lets_go.png'), url('../images/background4.png');
background-blend-mode: multiply;
background-position: center center ;
background-repeat: no-repeat;
background-size: 100%, 615%;
margin-top: 2%;
position: relative;
}

.hitTheRoadTitleRight{
width: 10%;
display: inline-block;
padding-bottom: 25%;
background-color: #CCC7B5;
background-image: url('../images/background4.png');
background-blend-mode: multiply;
margin-left: 17%;
}

.hitTheRoadTitleLeft{
width: 10%;
display: inline-block;
padding-bottom: 25%;
background-color: #CCC7B5;
background-image: url('../images/background4.png');
background-blend-mode: multiply;
}

.hitTheRoadBottom{
direction:ltr;
width:59%;
float: left;
margin-bottom:3%;
margin-top: 1.5%;
}

.DropExplenation{
position:absolute;
width: 100%;
margin: 10% 0;
display:none;
min-width:80px;
}

.DropExplenationTitle{
padding-bottom: 8%;
}

.DropExplenationBoxWrap{
border:2px solid #D46B40;
border-radius: 3px;
}

.DropExplenationBox{
background-color:#D46B40;
background-image: url('../images/background4.png');
background-blend-mode: multiply;
border:2px solid #F5F1E6;
border-radius: 3px;
color:#F5F1E6;
text-align:center;
padding:7% 2%;
}

.hitTheRoadDrop{
text-align:center;
display: inline-block;
width:19%;
position:relative;
}

.hitTheRoadDropLine{
width:0;
padding-bottom:50%;
border-right:1px solid black;
margin: 0 auto;
}

.hitTheRoadDropRound{
padding-bottom: 30%;
width: 30%;
margin: 0 auto;
cursor:pointer;
transition:1s ease;
}

.hitTheRoadDrop:nth-child(1) .hitTheRoadDropRound{
background:url('../images/round1.png'), url('../images/background4.png');
background-blend-mode: multiply;
background-position: center center ;
background-repeat: no-repeat;
background-size: contain, 4545%;
}

.hitTheRoadDrop:nth-child(2) .hitTheRoadDropRound{
background:url('../images/round2.png'), url('../images/background4.png');
background-blend-mode: multiply;
background-position: center center ;
background-repeat: no-repeat;
background-size: contain, 4545%;
}

.hitTheRoadDrop:nth-child(3) .hitTheRoadDropRound{
background:url('../images/round3.png'), url('../images/background4.png');
background-blend-mode: multiply;
background-position: center center ;
background-repeat: no-repeat;
background-size: contain, 4545%;
}

.hitTheRoadDrop:nth-child(4) .hitTheRoadDropRound{
background:url('../images/round4.png'), url('../images/background4.png');
background-blend-mode: multiply;
background-position: center center ;
background-repeat: no-repeat;
background-size: contain, 4545%;
}

.hitTheRoadDrop:nth-child(5) .hitTheRoadDropRound{
background:url('../images/round5.png'), url('../images/background4.png');
background-blend-mode: multiply;
background-position: center center ;
background-repeat: no-repeat;
background-size: contain, 4545%;
}

.onTopFooter{
width: 86%;
padding-bottom: 16%;
background: url('../images/bottom_footer_index.png'), url('../images/background4.png');
background-blend-mode: multiply;
background-position: 54% bottom;
background-repeat: no-repeat;
background-size: 87%, 116%;
position: relative;
}

.bluePath{
width: 20%;
padding-bottom: 39%;
background: url('../images/blue_path.png'), url('../images/background4.png');
background-blend-mode: multiply;
background-position: left bottom;
background-repeat: no-repeat;
background-size: contain, 581%;
position: absolute;
left: 0;
bottom: 0;
}

.portfolioBriefWrap{

}

.portfolioBriefHead{
background-color:#C8D9D3;
background-image: url('../images/background4.png');
background-blend-mode: multiply;
background-size: 625%;
font-size:1.2em;
color:rgb(77,77,71);
padding:1% 0;
text-align:center;
font-family:alef-bold;
}

.triangle{
width: 10%;
padding-bottom: 12%;
background: url('../images/triangle.png'), url('../images/background4.png');
background-blend-mode: multiply;
background-position: left bottom;
background-repeat: no-repeat;
background-size: contain, 4807%;
position: absolute;
left: 45%;
top: 0;
margin-top: -12%;
}
/********************* FOOTER ********************/
/*************************************************/
.main footer{
background:url('../images/sea2.png'), url('../images/background4.png');
background-blend-mode: multiply;
background-position: top right;
background-repeat: no-repeat;
width:100%;
background-size: 100%;
padding-bottom: 17%;
padding: 6% 0 11%;
}

.footerRight{
float:right;
width:16%;
margin: -2% 6% 0 9%;
}

.footerRightLogo{
background:url('../images/logo_footer.png'), url('../images/background4.png');
background-blend-mode: multiply;
background-position: top center;
background-repeat: no-repeat;
width:72%;
background-size: contain, 139%;
padding-bottom: 58%;
}

.footerRightBottom{
width:100%;
float: left;
padding-top: 27%;
text-align: center;
}

.social{
width:100%;
}

.social img{
display:inline;
margin-left:3%;
}

.email a{
color:rgb(77,77,71);
font-family:Alef-bold;
font-size:15px;
}


.footerMiddle{
width:23%;
float:right;
margin-left: 5%;
}

.footerMiddle form{
position:relative;
}

legend{
text-align:center;
margin-bottom:5px;
}

.footerMiddle input, .footerMiddle textarea{
width:92%;
height:30px;
line-height:30px;
font-size:16px;
font-family: Alef-regular;
color:#fff;
background-color:#D76D41;
background-image: url('../images/background4.png');
background-blend-mode: multiply;
padding:0 4%;
margin-bottom:2.5%;
}

.footerMiddle textarea{
height:90px;
resize:none;
}

.footerMiddle input[type="submit"]{
width:21%;
height:27.5%;
font-size:16px;
font-family: Alef-regular;
color:#D76D41;
background-color:#fff;
background-image: url('../images/background4.png');
background-blend-mode: multiply;
text-align:center;
border-radius:100%;
position:absolute;
bottom:-14%;
right: 39%;
}

.footerMiddle input::-webkit-input-placeholder {
   color: #fff;
}

.footerMiddle input:-moz-placeholder { /* Firefox 18- */
   color: #fff;  
}

.footerMiddle input::-moz-placeholder {  /* Firefox 19+ */
   color: #fff;  
}

.footerMiddle input:-ms-input-placeholder {  
   color: #fff;  
}


.footerMiddle textarea::-webkit-input-placeholder {
   color: #fff;
}

.footerMiddle textarea:-moz-placeholder { /* Firefox 18- */
   color: #fff;  
}

.footerMiddle textarea::-moz-placeholder {  /* Firefox 19+ */
   color: #fff;  
}

.footerMiddle textarea:-ms-input-placeholder {  
   color: #fff;  
}

.footerLeft{
width:15%;
float:right;
margin-top:5.5%;
}

.footerLeft ul li{
width:100%;
font-size:16px;
color:rgb(77,77,71);
height:21px;
line-height:21px;
}

.footerLeft ul li a{
color:rgb(77,77,71);
}

/********************* ABOUT ********************/
/*************************************************/
section.aboutSection{
background: url('../images/who_are_we_pipe.png'), url('../images/background4.png');
background-blend-mode: multiply;
background-position: top left;
background-repeat: no-repeat;
background-size: contain;
width: 100%;
padding-top: 5%;
padding-bottom: 10%;
}

.main_about{
width:1024px;
margin:0 auto;
position:relative;
background: #F5F1E6 url('../images/background2.png') top center repeat;
}

.aboutPicsWrap{
width: 60%;
margin: 0 auto;
}

.aboutPics{
text-align:center;
background: url('../images/cabel.png') 44% center no-repeat;
background-size: 60%;
}

.aboutPics h4{
font-size:2em;
}

.articleYoavWrapper, .articleshaharWrapper{
border:2px solid rgba(182, 186, 104, 0.7); 
position:absolute;
width:26%;
}

.articleshaharWrapper{
left: -19%;
margin-top: 4%;
}

.articleYoavWrapper{
margin-top: 11.5%;
right: 9%;
}

.articleYoav, .articleShahar{
background-color:rgba(182, 186, 104, 0.7); 
border: 2px solid rgba(255, 255, 255, 0.8);
color:#fff;
font-size:1em;
padding:5% 4%;
line-height:1.2em;
}

.yoav{
width:26%;
float:right;
}

.shahar{
width:42%;
float:right;
}

.yoavPic{
background:url('../images/fox.png') center center no-repeat;
background-size:100%;
width:100%;
padding-bottom:132%;
}

.shaharPic{
background:url('../images/fox_woman.png') center center no-repeat;
background-size:100%;
width: 79%;
padding-bottom: 83%;
float: left;
}

span.black{color:rgb(77,77,71);}

.us{
text-align:center;
width:30%;
margin:0 auto;
}

.usTitle{
font-size:2em;
background:url('../images/who_are_we.png') center center no-repeat;
padding:5% 0;
text-align:center;
background-size:cover;
margin:0 auto 10%;
width:100%;
}

.usText{
color:rgb(77,77,71);

}

.usText p{
background: url('../images/drop.png') top right no-repeat;
background-size:4%;
text-indent:5%;
margin-bottom:10%;
font-size:1.3em;
color:#4A4A43;
line-height:1.3em;
text-align:justify;

}

.black{
color:rgb(77,77,71);
}

.arrows{
background: url('../images/about_arrow_ns.png') top center no-repeat;
background-size: contain;
padding-bottom: 10%;
width: 77%;
margin-top: 2%;
position: relative;
margin-right: 2%;
}
/********************* PORTFOLIO ******************/
/*************************************************/
.portfolio{
border: 1px solid #4B4A44;
}


.portfolioWrap{
width:100%;
margin:0 auto;
}

.portfolioWrapTitle{
border:2px solid #A19F96;
border-bottom:none;
}

.portfolioPageTitle{
width:25%;
float:right;
background-color:#FFCC6E;
text-align:center;
padding:1% 0;
font-size:21px;
font-weight: bold;
}

.portfolioSiteTitle{
width:75%;
float:right;
text-align:center;
padding:1% 0;
font-size:21px;
}

.portfolioWrapContent{
background-color:#4D4D47;
}

.portfolioContentRight{
width:25%;
float:right;
/* height:430px; */
overflow:hidden;
}

.slimScrollDiv{
	float: right;
}

.portfolioContentleft{
width:75%;
float:left;
padding:5% 0;
position:relative;
}

.oneProjectTitle{
color:#fff;
font-size:15px;
text-align:right;
margin-bottom: 5px;
}

.active .oneProjectTitle{
	color: #FFCB6D;
}

.active .oneProjectImage{
	border-color: #FFCB6D;
}

.oneProjectImage img{
width:100%;
height:auto;
}

.oneProjectImage{
border:4px solid #fff;
}

.oneProject{
width:70%;
margin:0 auto;
padding-top:5%;
}

.oneProjectCurrent {
color:#FFCC6E;
}

.oneProjectCurrent .oneProjectImage{
border:4px solid #FFCC6E;
}

.imgWrapper{
width:75%;
text-align: center;
position:relative;
margin: auto;
}

.imgWrapper img{
width:100%;
height:auto;
margin:0 auto;
}

.rightArrow{
position: absolute;
width: 31px;
height: 37px;
background: url(../images/arrow_right.png) top center no-repeat;
background-size: contain;
top: 0;
right: -40px;
bottom: 0;
margin: auto;
cursor: pointer;
}

.leftArrow{
position:absolute;
width: 31px;
height:37px;
background: url(../images/arrow_left.png) top center no-repeat;
background-size: contain;
top: 0;
left: -40px;
bottom: 0;
margin: auto;
cursor: pointer;
}


.portfolioPresent{
float: right;
width: 710px;
background-color: #dcdcdc;
padding: 10px 20px 20px;
height: 605px;
}

.portfolioPresentImg{
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}

.portfolioPresent h2{
font-size:1.5em;
font-family: Alef-bold;
margin-bottom: 10px;
}

.bottomLink a{
color:rgb(77,77,71);
float:left;
font-size: 1.5em;
}

.portfolioImages{
background-color:rgb(77,77,71);
padding:10px;
margin-bottom: 25px;
}

.portfolioImages img{
width: 320px;
/*height:auto;*/
height:230px;
}

.portfolioMenu{
float: left;
width: 195px;
padding: 0 15px;
background-color: rgb(77,77,71);
overflow: auto;
position: relative;
height: 486px;
}

.onePortfolio{
width:100%;
padding: 10px 0;
color:#fff;
text-align: center;
}

.onePortfolioTitle{
margin-bottom: 1%;
text-align: right;
width: 95%;
margin: 1% auto;
}

.onePortfolioTitle h3{
display:inline-block;
margin-left:-2px;
font-size:18px;
color:#fff;
}

.portfolioLink {
	float: left;
	color: #fff;
}

.onePortfolioLink{
float:left;
font-size:0.8em;
color:#fff;
}

.onePortfolioLink a{color:#fff;font-size:0.8em;}

.onePortfolioImg{
width:100%;
}

.onePortfolioImg img{
width: 195px;
height: 112px;
}

.portfolioBrief .onePortfolioImg img{
width: 95%;
height:auto;
}

/********************* PAGE **********************/
/*************************************************/
.main_page{
width:85%;
margin:0 auto;
position: relative;
}

.pageContentWrap{
border:10px solid #FFCC6E;
width:85%;
float:right;
border-radius:3px;
}

.pageContent{
background-color:#FFCC6E;
border:2px solid #fff;
padding: 2% 2%;
min-height: 270px;
position: relative;
}

.pageAside{
float:right;
width:13%;
padding-top:2%;
}

ul.pageMenu{
width:100%
}

ul.pageMenu li{
margin-bottom:1%;
color:rgb(77,77,71);
border-radius:5px;
}

ul.pageMenu li a{
border-radius:3px;
display:block;
color:inherit;
background: #B3B96B url('../images/bullet_orange.png') 95% center no-repeat;
background-size:6%;
padding:4% 16% 4% 0;
}

ul.pageMenu li a:hover{
border-radius:5px 0 0 5px;
color:rgb(77,77,71);
background:#FFCC6E url('../images/bullet.png') 95% center no-repeat;
background-size:6%;
}

ul.pageMenu li a.current{
border-radius:5px 0 0 5px;
color:rgb(77,77,71);
background:#FFCC6E url('../images/bullet.png') 95% center no-repeat;
background-size:6%;
}

.pageContent h1{
color:#fff;
font-size:1.5em;
font-family: Alef-bold;
padding: 0 1%;
text-align: center;
background-color:#D66C41;
float:right;
height: 36px;
line-height: 36px;
position: relative;
margin:0 16px;
}

.pageContent h1::before{
content: '';
width: 16px;
background: url('../images/right_red.png') top left no-repeat;
background-size: 100%;
position: absolute;
right: -16px;
height: 36px;
}

.pageContent h1::after{
content: '';
width: 16px;
background: url('../images/left_red.png') top left no-repeat;
background-size: 100%;
position: absolute;
left: -16px;
height: 36px;
}

.bread{
color: #d76d41;
line-height:36px;
height:36px;
/*background: url('../images/red_line.png') right center no-repeat;
background-size: 100%;*/
}

.bread a{
color: #d76d41;
}

.pageContentTextWrap h2{
color: #d76d41;
width: 46%;
text-align: center;
padding: 2% 0 1%;
font-size: 1.1em;
font-family: Alef-bold;
}

.pageContentText{
background-color:inherit;
-moz-column-count: 2;
-moz-column-gap: 2%;
-webkit-column-count: 2;
-webkit-column-gap: 2%;
column-count: 2;
column-gap: 2%;

}

.pageContentText p{
	-webkit-column-break-inside: avoid;
	page-break-inside: avoid;
	break-inside: avoid;
	margin-bottom: 15px;
}

.pageContentTextWrap{
float:right;
width:70%;
}

.WorkingTools{
width: 27%;
text-align:center;
float:left;
position:relative;
/*display:flex;
justify-content:space-around;
flex-wrap: wrap;*/
}

/* .WorkingTools:before {
content: '';
width: 15%;
height: 3px;
background-color: #D76D41;
position: absolute;
margin: auto;
left: 0;
right: 0;
top:-5px;
} */

.WorkingTools h4{
color:#D76D41;
font-size:1.5em;
font-family: Alef-bold;
text-align:center;
margin-bottom: 5%;
}
.WorkingToolsImg{
display:inline-block;
width:26%;
vertical-align: top;
margin-bottom:5%;
}
.ToolsImg{
width: 53%;
padding-bottom: 54%;
background: url('../images/tools1.png') center center no-repeat;
background-size: 100%;
margin: 0 auto;
}

.ToolsImgTitle{
color:#D76D41;
font-size:0.8em;
margin-top:8%;
}

.ToolsImgTitle a{
color:#D76D41;
}

/******************PAGE HEADER******************/
/*************************************************/
.cover{
background: url('../images/background2.png') center center repeat;
width:100%;
height:100%;
position:absolute;
top:0;
bottom:0;
left:0;
right:0;
opacity:0;
z-index:20;
pointer-events: none;
}

.main_page header{
position:relative;
width:100%;
background: url('../images/header_page_bottom.png') 72% bottom no-repeat;
background-size: 59%;
padding-bottom: 2%;
}

.headerNavigator{
float: right;
width: 9%;
position: relative;
background: url('../images/background_nav.png') top center no-repeat;
background-size: 91%;
padding-bottom: 2%;
position: fixed;
z-index: 99999999;
}

.headerNavigatorMenu{
display:inline-block;
width:47%;
padding-bottom: 41%;
background: url('../images/hamburger.png') center center no-repeat;
background-size: 60%;
cursor:pointer;
padding-top: 24%;
border-right: 1px solid #dcdcdc;
}

.headerNavigatorHome{
width:50%;
padding-bottom: 44%;
background: url('../images/home.png') center center no-repeat;
background-size: 64%;
float: right;
padding-top: 22%;
}

.hamburgerMenu{
position:absolute;
width:100%;
margin-top: 60%;
z-index: 3;
}

.navWrap{
width:92%;
margin: auto;	
}
.topNavMenu{
width: 100%;
padding-bottom: 100%;
background: url('../images/top_nav.png') 66% top no-repeat;
background-size: 33%;
}

.hamburgerMenu{
display:none;
}

.hamburgerMenu ul {

}

.hamburgerMenu ul li{
width: 100%;
font-size: 1.1em;
color: rgb(77,77,71);
padding: 5%;
background: #B3BA6B;
box-sizing: border-box;
margin-bottom: 2px;
border-radius: 2px;
}

.hamburgerMenu ul li a{
color: #fff;
}


.headerLogo{
position:absolute;
right:41%;
top:2.8%;
width:12%;
}

.headerLogoImg{
padding-bottom: 100%;
background:url('../images/logo.png') center center no-repeat;
background-size: contain;
}

.headerLogoPath{
width: 100%;
padding-bottom: 62%;
background: url('../images/path.png') 43% top no-repeat;
background-size: contain;
display: none;
}

.headerContactUs{
float:left;
padding-top:2%;
width:12%;
}

.headerContactUs{
width:12%;
text-align:center;
float: left;
}

.headerContactUsImg{
width:38%;
padding-bottom:59%;
background:url('../images/air_baloon.png') top center no-repeat;
background-size:contain;
margin:0 auto;
}

.headerContactUs h3{
font-family:Alef-bold;
font-size:15px;
}

.headerNumber{
font-size:17px;
padding:3% 0;
}

.headerNumber a{
color:rgb(77,77,71);
}

/*page footer*/
footer.footer_page{
background:url('../images/sea2.png') top right no-repeat;
width:100%;
background-size: 100%;
padding-bottom: 17%;
padding: 6% 0 11%;
}

.footer_page_top{
background:url('../images/footer_top.png') top right no-repeat;
width:100%;
background-size: 80%;
padding-bottom: 12%;
}

.footer_page_top.no_tap{
background-image: url('../images/footer_top_no.png');
}

.footerRightPage{
float:right;
width:25%;
background:url('../images/footer_right_lane.png') center 56% no-repeat;
background-size: contain;
}

.footerRightLogoPage{
background:url('../images/logo_footer.png') top center no-repeat;
width:40%;
background-size: contain;
padding-bottom: 32%;
margin: 0% 10%;
}

.footerRightBottomPage{
width:60%;
padding: 6% 0;
text-align: center;
}

.socialPage{
width:100%;
}

.socialPage img{
display:inline;
margin-left:3%;
}

.emailPage a{
color:rgb(77,77,71);
font-family:Alef-bold;
font-size:15px;
}


.footerMiddlePage{
width:100%;
}

.footerMiddlePage form{
position:relative;
}

legend{
text-align:center;
margin-bottom:1%;
}

.footerMiddlePage input, .footerMiddlePage textarea{
width:92%;
font-size:1em;
font-family: Alef-regular;
color:#fff;
background-color:#D76D41;
padding:1% 4%;
margin-bottom:2.5%;
}

.footerMiddlePage textarea{
padding-bottom: 14%;
resize:none;
}

.footerMiddlePage input[type="submit"]{
width:60px;
height:60px;
font-size:16px;
font-family: Alef-regular;
color:#D76D41;
background-color:#fff;
text-align:center;
border-radius:100%;
position:absolute;
margin-top: -11%;
right: 40%;
cursor: pointer;
}

.footerMiddlePage input::-webkit-input-placeholder {
   color: #fff;
}

.footerMiddlePage input:-moz-placeholder { /* Firefox 18- */
   color: #fff;  
}

.footerMiddlePage input::-moz-placeholder {  /* Firefox 19+ */
   color: #fff;  
}

.footerMiddlePage input:-ms-input-placeholder {  
   color: #fff;  
}


.footerMiddlePage textarea::-webkit-input-placeholder {
   color: #fff;
}

.footerMiddlePage textarea:-moz-placeholder { /* Firefox 18- */
   color: #fff;  
}

.footerMiddlePage textarea::-moz-placeholder {  /* Firefox 19+ */
   color: #fff;  
}

.footerMiddlePage textarea:-ms-input-placeholder {  
   color: #fff;  
}

.footerLeftPage{
width:15%;
float:right;
margin-top:1.8%;
background:url('../images/footer_lamp.png') bottom right no-repeat;
background-size: contain;
padding-bottom:1.9%;
margin-right: 4%;
}

.footerLeftPage ul {
padding-right: 16%;
padding-top: 21%;
}

.footerLeftPage ul li{
width:100%;
font-size:16px;
color:rgb(77,77,71);
height:21px;
line-height:21px;
}

.footerLeftPage ul li a{
color:rgb(77,77,71);
}

.numberPage a{color:rgb(77,77,71);}


.boat{
position:absolute;
background:url('../images/ship.png') top center no-repeat;
width:5%;
padding-bottom:3%;
background-size:contain;
left:2%;
bottom:-29%;
-webkit-animation: moveRightLeft 200s linear 0s infinite alternate; /* Chrome, Safari, Opera */
animation: moveRightLeft 200s 0s linear infinite alternate;
-moz-animation:moveRightLeft 200s 0s linear infinite alternate;
}

@-webkit-keyframes moveRightLeft {
0% {left:2%}
25% {left:50%}
50% {left:100%}
75% {left:50%}
100% {left:2%}
}

@keyframes moveRightLeft {
0% {left:2%}
25% {left:50%}
50% {left:100%}
75% {left:50%}
100% {left:2%}
}

@-moz-keyframes moveRightLeft {
0% {left:2%}
25% {left:50%}
50% {left:100%}
75% {left:50%}
100% {left:2%}
}

.fan{
width: 2%;
position: absolute;
top: -16%;
left: 18.5%;
}

.fanLeg{
background: url('../images/poll.png') top center no-repeat;
width: 100%;
padding-bottom: 200%;
background-size: contain;
position:relative;
}

.fanWings{
background: url('../images/all_wings.png') top center no-repeat;
width: 150%;
padding-bottom: 150%;
position: absolute;
background-size: contain;
margin-top: -70%;
left: -24%;
-webkit-animation: round 20s  0s infinite linear;
animation: round 20s 0s  infinite linear;
-moz-animation: round 20s 0s infinite linear;
z-index: 3;
}


@-moz-keyframes round { from { -moz-transform: rotate(360deg); } }
@-webkit-keyframes round { 100% { -webkit-transform: rotate(360deg); } }
@keyframes round { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } } 



.fanWing1{
background: url('../images/wing1.png') top center no-repeat;
width: 100%;
padding-bottom: 110%;
position: absolute;
background-size: contain;
left: -38%;
-webkit-animation: round 60s  0s infinite cubic-bezier(0.455, 0.030, 0.515, 0.955);
animation: round 60s 0s  infinite cubic-bezier(0.455, 0.030, 0.515, 0.955);
-moz-animation: round 60s 0s infinite cubic-bezier(0.455, 0.030, 0.515, 0.955);
}

.fanWing2{
background: url('../images/wing2.png') top center no-repeat;
width: 100%;
padding-bottom: 110%;
position: absolute;
background-size: contain;
top: -51%;
left: -31%;
-webkit-animation: round 60s  0s infinite cubic-bezier(0.455, 0.030, 0.515, 0.955);
animation: round 60s 0s  infinite cubic-bezier(0.455, 0.030, 0.515, 0.955);
-moz-animation: round 60s 0s infinite cubic-bezier(0.455, 0.030, 0.515, 0.955);
}

.fanWing3{
background: url('../images/wing3.png') top center no-repeat;
width: 111%;
padding-bottom: 39%;
position: absolute;
background-size: contain;
right: -60%;
top: -2%;
-webkit-animation: round 60s  0s infinite cubic-bezier(0.455, 0.030, 0.515, 0.955);
animation: round 60s 0s  infinite cubic-bezier(0.455, 0.030, 0.515, 0.955);
-moz-animation: round 60s 0s infinite cubic-bezier(0.455, 0.030, 0.515, 0.955);
}

.children{
font-family: Alef-bold;
color:rgb(77,77,71);
margin-top: 3%;
}

.children ul li a{
color:rgb(77,77,71);
}

.ToolsImgWrap{
width: 75%;
padding-bottom: 75%;
border-radius: 100%;
background-color: #d76d41;
margin: 0 auto;
background: url('../images/tools1.png') center center no-repeat;
}


.imgHeader{
width: 17%;
padding-bottom: 14%;
background: url('../images/facebook_header.png') top center no-repeat;
background-size: contain;
margin: 0 auto;
}

.goggles{
color: #fff;
position: absolute;
top: 5%;
left: 15%;
height: 32px;
padding-left: 50px;
background-image: url('../images/goggles.png');
background-repeat: no-repeat;
background-position: left;
}

.goggles a{
color: #fff;
}



.linkToProtfolio {
position: absolute;
left: 2%;
bottom: 2%;
}

.linkToProtfolio a{
	color: #D76D41;
	font-weight: bold;
	font-size: 20px;
}

.frame{
	background: transparent;
}