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

html{font-size: 62.5%;}
body{margin: 0 auto;padding: 0;overflow-x:hidden;position: relative;width:100%;background:#fff;font-family: 'Quattrocento', serif;font-weight:400;color:#58595b;}

.container, .contDemi, .smlCont{position:relative;display:block;margin:0 auto;padding:0 80px;width:100%}
.container{max-width:1200px;}
.contDemi{max-width:600px;}
.smlCont{max-width:900px;}

.pad{padding-top:40px;padding-bottom:40px}
.Bigpad{padding-top:80px;padding-bottom:80px}


a[href^=tel]{color:inherit;text-decoration:none;} a{text-decoration:none;color:inherit;cursor:pointer}a:focus{outline:0;}
img{max-width:100%;}
hr{border:0;border-bottom:1px dotted #ccc;margin:40px 0}

.ancre{padding-top:50px;margin-top:-50px;}/* hauteur du header*/

.center{text-align:center;} .left{text-align:left;} .right{text-align:right;} .justify{text-align:justify;} .uppercase{text-transform:uppercase;}
.none{display:none;} .block{display:block;}
.down{margin-bottom:30px;}.up{margin-top:30px;}
.flt-left{float:left}.flt-right{float:right}.clear{clear:both;}


/* COULEUR */

.blanc{color:#fff;}
.charcoal{color:#333333;}
.bckpale{background:#f1f1f1;}
.bckBlanc{background:#fff;}
.bckGris{background:#404041;}
.vert{color:#95c11e}


/* TEXTE */
h1, h2, h3, h4, h5, h6{margin:0;line-height:1.1;text-transform:uppercase;color:#222;}
h1{font-size:40px;font-weight:400;font-family: 'Oswald', serif;margin-bottom:30px}
h2{font-size:18px;font-weight:700;font-family: 'Montserrat', serif;margin-top:10px}
h3{font-size:40px;font-weight:400;font-family: 'Oswald', serif;}h3 span{color:#95c11e;}
h4{font-size:18px;font-weight:700;}
h5{font-size:17px;font-weight:700;}
h6{font-size:16px;font-weight:700;font-family: 'Montserrat', serif;color:#016a03;text-transform:none;margin-top:25px}

h1 + p, h2 + p, h3 + p, h4 + p, h5 + p, h6 + p, h1 + ul, h2 + ul, h3 + ul, h4 + ul, h5 + ul, h6 + ul{margin-top:20px}

p, li{font-size:15px;line-height:1.3;margin:0 0 20px}
ul{list-style-type:square} ul li{margin:0 0 10px 20px}

.bt{line-height:1;z-index:99;position:relative;margin:0-auto;display:block;text-align:center}
.bt a {padding:10px 15px 12px;color:#000;border:3px solid #000;display:inline-block;-moz-transition:all 0.2s ease-in-out;transition: all 0.2s ease-in-out; }
.bt a:hover{color:#a8a7a7;border-color:#a8a7a7;}


header{width:100%;z-index:100;background:rgba(255, 255, 255, 1); position: fixed;height:100px;top: 0;-moz-transition:all 0.4s ease-in-out;transition: all 0.4s ease-in-out;}
header.sticky{background:rgba(255, 255, 255, 1);-webkit-box-shadow: 0px 2px 5px 0px rgba(50, 50, 50, 0.25);-moz-box-shadow:0px 2px 5px 0px rgba(50, 50, 50, 0.25);box-shadow:0px 2px 5px 0px rgba(50, 50, 50, 0.25);} 
header.nav-up {top: -170px;}

header.sticky .container .row{border-bottom:3px solid #95c11e;}

header .logo{float:left;width:100%;margin-top:20px}
header .logo img{width:250px;padding:20px 30px;background:#fff;display:block;margin:0 auto}

#navMenu {position:relative;margin: 0 0;display:block;height:64px;background:#f1f2f2;width:100%;font-family: 'Montserrat', serif;text-transform:uppercase}
#navMenu ul{padding-top:25px}
#navMenu ul li{font-size:14px;line-height:1;margin:0;background:none;margin:0;display:block;width:calc(100% / 4);text-align:center;padding:0;border:0;float:left;}
#navMenu ul li:last-child{padding:0}
#navMenu ul li a{color:#222;} #navMenu ul li a:hover{color:#555;}
span#menuMob, .closebtn {display:none}

.btSoum{position:absolute;right:80px;top:17px}
.btSoum a{display:block;width:210px}.btSoum h6{margin:0;text-transform:uppercase}
.btSoum a span{width:40px;height:40px;margin-right:10px;background:url(../img/picto/demande-soumission.svg) no-repeat center center / 40px;display:block;float:left;vertical-align:middle}

.bloc{background:rgba(64,64,64, 0.9);padding:30px;width:30%;}

/* SLIDER */
.head{position:relative;width:100%;margin:100px auto 0 ;padding: 0 0 ;z-index:0;height:600px;border-top:10px solid #95c11e; border-bottom:10px solid #95c11e; }
.head {background:url(../img/fond/pelouse-head.jpg) no-repeat center top / cover;padding-top:180px;}
.head .bloc{float:right;width:auto;padding:40px 80px 40px 40px}
.head h2{color:#fff;font-size:50px;text-align:right;float:left;font-family: 'Oswald', serif;}.head h2 span{color:#95c11e}

.imgHome{width:100%;transform: translate(0,-150px);z-index:99;display:block;margin-bottom:-200px}
.imgHome img{display:block;margin:0 auto}

.bckPelouse{background:url(../img/fond/fertilisation-pelouse01.jpg) no-repeat center center / cover fixed ;min-height:400px}

#service img{display:block;margin:0 auto 20px}
#service h1{margin-bottom:40px}
#service h2 + p{margin:10px 0 0 0} 
.fond{background:#f1f2f2;padding:15px 15px;min-height:256px}
.fond p{margin-bottom:0}
.fondVert{background:#9ed20c;min-height:256px;padding:40px 20px 30px;margin-top:70px;-moz-transition:all 0.4s ease-in-out;transition: all 0.4s ease-in-out;cursor:pointer}
.fondVert:hover{background:#222;}
.fondVert h2{padding-top:40px;color:#fff;margin-bottom:20px;}



.bckEco{background:url(../img/fond/haie-de-cedre-fond.jpg) no-repeat center center / cover fixed ;padding:60px 0}
.bckEco .container{padding-left:0}
.bckEco .bloc{padding-left:80px;width:450px}
.bckEco h2, .bckEco h3{color:#fff;}
.bckEco h3{margin-bottom:15px}.bckEco h3 span{color:#9ed20c;}


#etapes .pad{padding-bottom:100px;padding-top:0}
#etapes h2 + p {margin-top:0}
#etapes  h1{margin:0}
.etape{margin-top:-2px}
.etape .bckpale{padding:20px}
.etape img{margin:-50px 0 20px}
.etape .bckpale:nth-child(2){background:#ebebec;}
.etape .bckpale:nth-child(3){background:#e4e5e6;}
.etape .bckpale:nth-child(4){background:#dedfe0;}

.bckPelouse02{background:url(../img/fond/fertilisation-pelouse02.jpg) no-repeat center top / cover ;min-height:350px;}
.fondPelouse{background:url(../img/fond/pelouse-pied-page.jpg) no-repeat center center / cover ;min-height:200px;}

#soumission h1{margin:30px 0 0 0}
#soumission h2 + p{margin-top:0}
/* FOOTER */

footer{width:100%;background:#404041}
footer h1{margin-bottom:0}
footer .Bigpad{padding-bottom:40px}
footer p{margin:5px 0}
footer .fb img{vertical-align:middle;margin-right:5px;}


.credit p, .credit img{display:inline-block;vertical-align:text-top;text-align:right}
.credit p{line-height:1.1;color:#ccc;}
.credit img{margin-left:20px}

#credits{background:#9ed20c;padding:10px 30px;}
#credits p, #credits a{margin:0;font-size:11px;color:#222;text-align:center}
#credits a{font-size:10px;text-transform:uppercase;letter-spacing:1px;padding-top:2px;display:block}


@media only screen and (max-width: 1024px) {	

.container, .contDemi{padding-left:50px;padding-right:50px}

 header .container{padding-left:0px;padding-right:0;max-width:100%}
.btSoum{right:20px}
.btSoum a{font-size:14px}
.btSoum a span{width:30px;height:30px;margin-right:10px;background:url(../img/picto/demande-soumission.svg) no-repeat center center / 30px;}


}


@media only screen and (max-width: 768px) {	

.container, .contDemi{padding:0 40px;}
.pad{padding-top:30px;padding-bottom:30px}
.Bigpad{padding-top:60px;padding-bottom:60px}


h1{font-size:32px;}
h2{font-size:16px;}
h3{font-size:32px;}
h4{font-size:16px;}
h5{font-size:15px;}
h6{font-size:14px;}

p, li{font-size:14px;margin:15px 0;}
li{margin:5px 0}

header{height:70px}
header .logo{margin:10px 20px}
header .logo img{width:140px;padding:0 0;background:none;margin:0}

span#menuMob {position:absolute;right:20px;top:25px;width:40px;height:40px;display:block;background: url("../img/menu-mobile.svg") no-repeat center center / 35px;cursor:pointer}
.open .overlay{width:100%} .overlay{height:100%;width:0;position:fixed;z-index:1;top:0;left:0;background: rgba(0,0,0, 0.9);overflow-x: hidden;transition: 0.3s;}
.overlay .closebtn {display:block;position: absolute;top:20px;right: 45px;font-size: 60px;color:#ccc} .overlay-content {position: relative;top: 25%;width: 100%;text-align: center;}

#navMenu nav{position:relative;width:100%;height:100%;}
#navMenu{background:none;height:100%;}
#navMenu ul li{display:block;text-align:center;padding:0;transition: 0.3s;width:100%;margin:10px 0;font-size:24px}
#navMenu ul li a{color:#fff;}

.head{margin-top:90px;height:400px;padding-top:60px}
.head .bloc{padding:25px 40px 25px 25px}
.head h2{font-size:40px}
.btSoum{right:40px;top:30px}

.bckPelouse{background:url(../img/fond/fertilisation-pelouse01.jpg) no-repeat center center / cover scroll ;}
.bckEco{background:url(../img/fond/haie-de-cedre-fond.jpg) no-repeat center center / cover scroll ;}

.imgHome{transform: translate(0,-100px);margin-bottom:-150px}
.imgHome img{max-width:220px}

.fond, .fondVert{min-height:0}

#etapes .pad{padding-top:100px;}
.etape .bckpale {padding: 20px 20px 60px 20px;}



}


@media only screen and (max-width: 480px) {

.container, .contDemi{padding:0 25px;}
.pad{padding-top:25px;padding-bottom:25px}
.Bigpad{padding-top:50px;padding-bottom:50px}


h1{font-size:22px;}
h2{font-size:14px;}
h3{font-size:22px;}
h4{font-size:14px;}
h5{font-size:13px;}
h6{font-size:12px;}

p, li{font-size:12px;margin:15px 0;}

header{height:50px;}
header .logo{margin:10px 12px}
header .logo img{width:100px;}
span#menuMob {top:14px;right:12px}

.head{margin-top:60px;height:320px;padding-top:40px}
.head .bloc{padding:15px 30px 15px 15px}
.head h2{font-size:26px}


.btSoum{top:23px;right:-10px}
.btSoum a{font-size:11px}
.btSoum a span{width:25px;height:25px;margin-right:5px;background:url(../img/picto/demande-soumission.svg) no-repeat center center / 25px;}

.imgHome{transform: translate(0,-100px);margin-bottom:-150px}
.imgHome img{max-width:180px}

.bckEco .bloc{padding-left:30px;width:250px}


.credit {margin-top:20px}
.credit img{max-width:70px}
	
}