/*
Theme Name: Jardin d'Orante
Theme URI: https://wordpress.org/themes/twentyfourteen/
Author: Jardin d'Orannte
Description: 
Version: 1
*/

/* @import must be at top of file, otherwise CSS will not work */
@import url("https://hello.myfonts.net/count/34316e");

@font-face {font-family: 'DaftBrush';src: url('webfonts/34316E_0_0.eot');src: url('webfonts/34316E_0_0.eot#iefix') format('embedded-opentype'),url('webfonts/34316E_0_0.woff') format('woff2'),url('webfonts/34316E_0_0.woff') format('woff'),url('webfonts/34316E_0_0.ttf') format('truetype'),url('webfonts/34316E_0_0.svg') format('svg');}
@font-face {font-family: 'Decour-Black';src: url('webfonts/34316E_1_0.eot');src: url('webfonts/34316E_1_0.eot#iefix') format('embedded-opentype'),url('webfonts/34316E_1_0.woff') format('woff2'),url('webfonts/34316E_1_0.woff') format('woff'),url('webfonts/34316E_1_0.ttf') format('truetype'),url('webfonts/34316E_1_0.svg') format('svg');}
@font-face {font-family: 'Decour-Semibold';src: url('webfonts/34316E_2_0.eot');src: url('webfonts/34316E_2_0.eot#iefix') format('embedded-opentype'),url('webfonts/34316E_2_0.woff') format('woff2'),url('webfonts/34316E_2_0.woff') format('woff'),url('webfonts/34316E_2_0.ttf') format('truetype'),url('webfonts/34316E_2_0.svg') format('svg');}
@font-face {font-family: 'Decour-SemiboldItalic';src: url('webfonts/34316E_3_0.eot');src: url('webfonts/34316E_3_0.eot#iefix') format('embedded-opentype'),url('webfonts/34316E_3_0.woff') format('woff2'),url('webfonts/34316E_3_0.woff') format('woff'),url('webfonts/34316E_3_0.ttf') format('truetype'),url('webfonts/34316E_3_0.svg') format('svg');}
@font-face {font-family: 'BrandonGrotesqueWeb-Bold';src: url('webfonts/34316E_4_0.eot');src: url('webfonts/34316E_4_0.eot#iefix') format('embedded-opentype'),url('webfonts/34316E_4_0.woff') format('woff2'),url('webfonts/34316E_4_0.woff') format('woff'),url('webfonts/34316E_4_0.ttf') format('truetype'),url('webfonts/34316E_4_0.svg') format('svg');}
@font-face {font-family: 'BrandonGrotesqueWeb-Black';src: url('webfonts/34316E_5_0.eot');src: url('webfonts/34316E_5_0.eot#iefix') format('embedded-opentype'),url('webfonts/34316E_5_0.woff') format('woff2'),url('webfonts/34316E_5_0.woff') format('woff'),url('webfonts/34316E_5_0.ttf') format('truetype'),url('webfonts/34316E_5_0.svg') format('svg');}
 
/*
@font-face {font-family: 'Decour-Black';src: url('webfonts/316E27_0_0.eot');src: url('webfonts/316E27_0_0.eot#iefix') format('embedded-opentype'),url('webfonts/316E27_0_0.woff') format('woff2'),url('webfonts/316E27_0_0.woff') format('woff'),url('webfonts/316E27_0_0.ttf') format('truetype');}
@font-face {font-family: 'Decour-Semibold';src: url('webfonts/316E27_1_0.eot');src: url('webfonts/316E27_1_0.eot#iefix') format('embedded-opentype'),url('webfonts/316E27_1_0.woff') format('woff2'),url('webfonts/316E27_1_0.woff') format('woff'),url('webfonts/316E27_1_0.ttf') format('truetype');}
@font-face {font-family: 'BrandonGrotesqueWeb-Bold';src: url('webfonts/316E27_2_0.eot');src: url('webfonts/316E27_2_0.eot#iefix') format('embedded-opentype'),url('webfonts/316E27_2_0.woff') format('woff2'),url('webfonts/316E27_2_0.woff') format('woff'),url('webfonts/316E27_2_0.ttf') format('truetype');}
@font-face {font-family: 'DaftBrush';src: url('webfonts/316E28_0_0.eot');src: url('webfonts/316E28_0_0.eot#iefix') format('embedded-opentype'),url('webfonts/316E28_0_0.woff') format('woff2'),url('webfonts/316E28_0_0.woff') format('woff'),url('webfonts/316E28_0_0.ttf') format('truetype');}
 */

html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background-color:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:700}dfn{font-style:italic}h1{font-size:2em;margin:.67em 0}mark{background:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0}textarea{overflow:auto}optgroup{font-weight:700}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}

*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}

img { max-width:100%; height: auto; } /* Enough everywhere except IE8. */
@media \0screen {img { width: auto !important }} /* Prevent height distortion in IE8. */

a,a:visited{color: #18563e}
a:hover{text-decoration: none;}

html {color: #1d1e1c;font-size: 1em;line-height: 1.2;}
::-moz-selection {background: #b3d4fc;text-shadow: none;}
::selection {background: #b3d4fc;text-shadow: none;}


::-webkit-input-placeholder {
  font-size: 18px;
  color: #000 !important;
  opacity: 1 !important;
  text-align: left; }

:-moz-placeholder {
  font-size: 18px;
  color: #000 !important;
  opacity: 1 !important;
  text-align: left; }

::-moz-placeholder {
  font-size: 18px;
  color: #000 !important;
  opacity: 1 !important;
  text-align: left; }

:-ms-input-placeholder {
  font-size: 18px;
  color: #000 !important;
  opacity: 1 !important;
  text-align: left; }


hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}
audio,canvas,iframe,img,svg,video {vertical-align: middle;}
fieldset {border: 0;margin: 0;padding: 0;}
textarea {resize: vertical;}
.browserupgrade {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}
body{background: #fff;font-family: 'Decour-Semibold';overflow-x: hidden;width: 100%}

h1,h2,h3,h4,h5,h6{font-weight: normal;}
h2{
    color: #18563e;
    font-family: 'DaftBrush';
    font-size: 40px;
    margin: 0;
}
h3{margin: 0;}
.gammes h3{
    color: #1d1e1c;
    font-family: 'DaftBrush';
    font-size: 30px;
}
/*
.gammes h3 span{display: block;}*/

body.wait{
    cursor: wait;
}

.maxwith840{
    max-width: 840px;
    margin: 0 auto;
    padding: 0 28px;
}

.button,.button:visited{
    display: inline-block;
    position: relative;
    background: #f1910b;
    font-family: 'Decour-Semibold';
    font-size: 24px;
    color: #fff;
    text-decoration: none;
    max-width: 225px;
    width: 100%;
    padding: 12px 0 11px;
    text-align: center;
    overflow: hidden;
}
.safari .button{
    -webkit-box-shadow: inset 0px 0px 0px 1px rgba(241,236,230,1);
    -moz-box-shadow: inset 0px 0px 0px 1px rgba(241,236,230,1);
    box-shadow: inset 0px 0px 0px 1px rgba(241,236,230,1);
}

.button:hover{
    background: #1d1e1c;
}
.button .soon{
    display: block;
    position: absolute;
    top: 14px;
    left: -3px;
    background: #fff;
    color: #5b5853;
    z-index: 80;
    -ms-transform: translateY(-1px) translateZ(0) rotate(-17deg);
    -webkit-transform: translateY(-1px) translateZ(0)  rotate(-17deg);
    transform: translateY(-1px) translateZ(0) rotate(-17deg);
    text-align: center;
    width: 270px;
    font-size: 15px;
    padding:6px 0;
}

.green{color: #18563e}
.yellow{color: #f1910b}

.subtitle{
    font-family: 'BrandonGrotesqueWeb-Black';
    font-size: 16px; /*24px*/
    text-transform: uppercase;
    color: #18563e;
    max-width: 455px;
    text-align: center;
    margin: 0 auto 40px;
}
.metiers .subtitle{
    max-width: 800px;
}

/*.bgtop,.bgmiddle{background: url(img/bgtop.jpg);}*/
.bgtop{background: #f7f3ed;}
.bggreen{background: #17573f;}
.bgbottom{/*background: url(img/bgtop.jpg);*/padding-bottom:0px; position: relative;}

.bggreen2{
    background:#d5e0c2;
}

.button-orange{
    display: inline-block;
    background: #f1900b;
    color: #fff !important; 
    font-family: 'Decour-Semibold';
    font-size: 19px;
    padding:17px 20px;
    text-decoration: none;
}

article.top .frame{
    position: relative;
    font-size: 24px;
    color: #18563e;
    width: 100%;max-width: 622px;
    margin: 30px auto 30px;
    padding: 30px 0 0;
    text-align: center;
}
article.top .bgtop-i{
    position: absolute;
    top: 50%;left: 50%;
    width: 100%;
    padding: 40px 0;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
}
article.top .frame .cornichon-maison{
    font-size: 30px;
    font-family: 'DaftBrush';
}

article.top .frame .date{
    color: #f1900b;
    font-size: 36px;
    padding: 0 0 24px 0;
    font-family: 'DaftBrush';
}

article.top .frame .recevez{
    padding: 0 0 24px 0;
}

article.top .pictos-c{
    display: none;
}
article.top .pictos-c .p{
    position: absolute;
}
article.top .pictos-c .l1{
    top:80px;
    left: 50%;margin-left:-440px;
}
article.top .pictos-c .l2{
    display: none;
    top:250px;
    left: 50%;margin-left:-430px;
}
article.top .pictos-c .l3{
    top:400px;
    left: 50%;margin-left:-440px;
}
article.top .pictos-c .r1{
    top:67px;
    left: 50%;margin-left:357px;
}
article.top .pictos-c .r2{
    top:401px;
    left: 50%;margin-left:280px;
}

.order-kit{
    padding: 60px 0 0;
}
.cornichon-title{
    font-size: 23px;
    color: #18563e;
    margin: 0 auto 40px;
    display: inline-block;
}
.cornichon-title span.big{
    font-size: 33px;
    font-family: 'DaftBrush';
}

.form-contact input[type=text],
.form-contact textarea{
    width: 100%;
    border: none;
    border-bottom: 1px solid #d2d2d2;
    padding: 8px 0;
    font-size: 18px;
    margin: 0 0 20px;
}

.form-contact{
    max-width: 820px;
    padding: 0 20px;
    margin: 0 auto;
    text-align: left;
}

.form-contact .submit{
    display: inline-block;
    margin: 30px 0 0;
}

.form-contact .col.error > *{
    background: #dedede;
}

.form-contact .small{
    font-size: 11px;
}


.how-to-terre{
    position: absolute;
    right: -30px; top: -36px;
    -webkit-transform: scale(0.6);  
    -moz-transform:    scale(0.6);  
    -ms-transform:     scale(0.6); 
    -o-transform:      scale(0.6);  
    transform:         scale(0.6);
}

.how-to-arrosoir img{
    display: none;
}

.how-to-grow{
    padding: 20px 0 0;
    color: #fff;
}

.how-to-bol{
    position: absolute;
    left: 0px; bottom: -120px;
    -webkit-transform: scale(0.6);  
    -moz-transform:    scale(0.6);  
    -ms-transform:     scale(0.6); 
    -o-transform:      scale(0.6);  
    transform:         scale(0.6);
}


.how-to-bloc{
    position: relative;
    padding: 20px 20px;
    text-align: justify;
}
.how-to-bloc h3{
    font-size: 20px;
    padding: 0 0 8px 0;
    text-align: center;
}
.how-to-bloc h3 span{
    font-size: 24px;
    font-family: 'DaftBrush';
}


.how-to-blocs .green1{
    background:#07523d;
}

.how-to-blocs .green2{
    background:#188c6c;
}

.how-to-blocs .orange{
    background:#f1900b;
}
.how-to-blocs .border{
    display: none;
}

.btn-commander{
    display: inline-block;
    background: url(img/new/commander.png) no-repeat;
    text-align: center;
    color: #fff !important;
    width: 756px;height: 104px;
    font-size: 30px;line-height: 94px;
    font-family: 'DaftBrush';
    margin:30px auto 40px;
    text-decoration: none !important;
}

.btn-commander-mobile{
    display: inline-block;
    background: url(img/new/commander-mobile.png) no-repeat;
    text-align: center;
    color: #fff !important;
    width: 290px;height: 64px;
    font-size: 20px;line-height: 1.1em;
    padding: 8px 0 0;
    font-family: 'DaftBrush';
    margin:30px auto 40px;
    text-decoration: none !important;
}

.recette-c{
    margin: 86px auto 0;
}
.recette{
    position: relative;
    max-width: 680px; width: 100%;
    text-align:left;
    margin: 0 auto;
}
.recette .recettei{
    padding: 40px 30px 0;
    margin:40px 0 0;
}
.recette .col-left,
.recette .col-right,
.recette .preparation{
    line-height: 1.4em;
}


/*
.recette .recettei .subtitle{
    color:#000;
}*/
.recette .imgcorner{
    position: absolute;
    right: 0px;top:3px;
}
.recette .recette-top{
    position: absolute;
    left: 50%;
    top:-52px;
    -webkit-transform: translate(-50%,0px);
    transform: translate(-50%,0px);
    background:#fff;
}
.recette .recette-top img,
.recette-off .recette-top img{
    width: 72px;
}
.recette-off .recette-top{
    position: absolute;
    left: 50%;
    top:-52px;
    -webkit-transform: translate(-50%,0px);
    transform: translate(-50%,0px);
    background:#fff;
}
.recette .recette-frame-top{
    position: absolute;
    width: 100%;height: 100%;
    background: url(img/new/recette-frame-top.png) no-repeat center top;
}
.recette .recette-frame-bottom{
    position: absolute;
    width: 100%;height: 100%;
    background: url(img/new/recette-frame-bottom.png) no-repeat center bottom;
}

.recette .recette-frame-bottom img{
    position: absolute;
    left: -104px;bottom:25px;
}

.recette-off{
    display: inline-block;
    position: relative;
    max-width: 620px; width: 100%;
    text-decoration: none !important;
    margin: 0;
}

.recette-off .frame-top{
    position: absolute;
    left: 0;top:0;
    width:100%;max-width: 620px;height: 146px;
}
.recette-off .frame-top img{
    margin:0 auto;
}

.recette-off .svg-c{
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    transition: all 0.5s ease;
}
.recette-c.on .recette-off .svg-c{
    -ms-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
}

.recette .free-creativity{
    position: relative;
    max-width: 520px;
    padding: 0 20px 20px;
    margin:34px auto 0;
    text-align: center;
    font-size: 14px;
}
.recette .free-creativity .free-title{
    font-family: 'DaftBrush';
    font-size: 24px;
}

.recette h3,
.recette-off h3{
    position: relative;
    z-index: 2;
    color: #07523d;
    font-family: 'DaftBrush';
    font-size: 30px;
    text-align: center;
    padding: 20px 0 20px;
}
.recette-off h3{
    padding: 50px 0 12px;
}
.recette-off h3.formobile{
    padding: 14px 0 4px;
}
.recette-off svg{
    width: 24px;
}
.recette .graines,
.recette-off .graines{
    position: absolute;
    left: 46px;
    top: -35px;
}

.recette .subtitle{
    font-family: 'DaftBrush';
    font-size: 25px;
    margin: 20px auto 0px;
}

.and-after{
    font-family: 'DaftBrush';
    color: #f1900b;
    font-size: 43px;
    padding: 100px 0 0px;
}

.retrouvez-ici-recette{
    max-width: 600px;
    padding: 50px 20px 0px;
    margin:0 auto;
    text-align: center;
    font-size: 18px;
}

.retrouvez-ici-recette strong{
    font-size: 24px;
}

.recette-c .recette-off{
    display: inline-block;
}
.recette-c .recette-on{
    display: none;
}
.recette-c.on .recette-on{
    display: block;
}

.share-hashtag{
    max-width: 640px;
    padding: 0 20px 60px;
    text-align: center;
    margin:0 auto;
}

.galerie .title{
    font-family: 'Decour-Semibold';
    font-size: 24px;
    padding: 0px 0 40px;
}

html,body{
    width:100%;overflow-x:hidden;
}

.cornichons{
    position: absolute;
    top: 0px;left:0;
    width: 100%;
    height: 100%;
}

.pot-cornichon{
    position: absolute;
    bottom: -200px;
    left: 50%; margin-left: -138px;
    max-width: 276px;
    z-index: 3;
}

.bgtop{
    position: relative;
    height: 462px;
}

.logo{
    position: absolute;
    left: 50%;
    margin-left: -69px;
    width: 137px;
    top:20px;
}

.top .down{
    position: absolute;
    left: 50%;
    margin-left:-60px;
    background: #fff;
    bottom: -60px;
    width: 120px;height: 120px;
    text-align: center;
    padding:20px 0 0; 
    z-index: 5;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}

.social a{
    display: inline-block;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    transition: all 0.5s ease;
    -ms-transform: translateZ(0) rotate(0deg);
    -webkit-transform: translateZ(0)  rotate(0deg);
    transform: translateZ(0) rotate(0deg);
}
.social a svg{
    width: 33px;
}
.social a svg path{
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    transition: all 0.5s ease;
}
.social a:hover svg path{
 fill:#f1900b !important;
}

.social a.facebook:hover,
.social a.twitter:hover{
    -ms-transform: translateZ(0) rotate(-9deg);
    -webkit-transform: translateZ(0)  rotate(-9deg);
    transform: translateZ(0) rotate(-9deg);
}
.social a.pinterest:hover{
    -ms-transform: translateZ(0) rotate(9deg);
    -webkit-transform: translateZ(0)  rotate(9deg);
    transform: translateZ(0) rotate(9deg);
}

.pot .shadow{
    background: url(img/shadow.png) no-repeat;
    width: 323px;height: 101px;
}

.intro{
    font-size: 24px;
    font-family: 'Decour-Semibold';
    text-align: center;
}

.text{
    margin: 0 auto;
    max-width: 455px;
    text-align: justify;
    /*
    -moz-text-align-last: center;
    text-align-last: center;*/
    padding:0 20px; 
}
.subtitle {
    /*
    text-align: justify;
    -moz-text-align-last: center;
    text-align-last: center;*/
}

article{position: relative;text-align: center;}
article.top{overflow: hidden;}
article.relancer{padding: 40px 0 0px;overflow: hidden; position: relative;}
article.fiers{padding: 80px 0 80px;}
article.fiers.top{background:#d5e0c2;}
article.douze-etapes{padding: 40px 0 60px;}
.page-template-page-cornichons-maison article.top{
    padding:80px 0 60px;
}
article.gammes{padding: 80px 0 0;overflow: hidden;}
.page-template-home article.gammes{padding: 40px 0 0;}

.path1{width:551px;height:587px;position: absolute;top: 50px;z-index: -1;left: 50%;margin-left: 323px;z-index: -1}
.marker{
    position: absolute;
    top:250px;
    left: 50%;margin-left: 390px;
}

.fourchette{display:none;position: absolute;bottom:-60px;left:50%;margin-left:-300px;z-index: -1;max-width:317px !important;}


.map{
    display: block;
    margin:0 auto;
    padding:10px 0 0; 
    width: 100%;
    max-width: 100%;
    background: #fff;
    height: 294px;
    overflow: hidden;
    position: relative;
}
/*
.map .marker{
    position:absolute;
    width: 100px;
    font-size: 20px;line-height: 20px;
    font-family: 'Decour-Semibold';
    text-align: center;
}
.map .marker span{
    display: block;
    white-space: nowrap;
    padding: 10px 0 0;
}
.map .marker img{
    width:30px;
}*/
/*
.col1 .marker{top:88px;left:50%;margin-left: -80px}
.col2 .marker{top:100px;left:50%;margin-left: -80px}
.col3 .marker{top:100px;left:50%;margin-left: -26px}
.col1 .marker img,
.col3 .marker img{-webkit-transform: rotate(-6deg); -ms-transform: rotate(-6deg); transform: rotate(-6deg);}
.col2 .marker img{-webkit-transform: rotate(12deg); -ms-transform: rotate(12deg); transform: rotate(12deg);}
*/

.maps .col{
    padding:15px 20px 0px; 
}
.maps .name{
    color: #18563e;
    font-family: 'DaftBrush';
    font-size: 40px;
    line-height: 1em;
    padding-top: 10px;
}
.map .mapimg{
    width: 432px !important;
    max-width: 432px !important;
    position: absolute;
    top:34px;left: 50%;margin-left: -216px;
}

.person{
    position: absolute;
    left: 60%; top:  56px;
}
.col1 .person{width: 220px;}
.col2 .person{width: 220px;}
.col3 .person{width: 220px;left: 64%;}


.table.pots .pot{height: 100%;width:100%;position: relative;}
.pot .img{display: inline-block;position: relative}
.pot .img img.photo{z-index: 2;position: relative;width: 219px}
.shadow{
    position: absolute;
    bottom: -30px;left:50%;margin-left:-159px;;
    z-index: 1;
}

.pots .potleft,
.pots .potright{
    padding: 0 0px 60px;
}
.pots .potcenter{
    padding: 60px 0 60px;
}
.pots h3{margin: 40px 0 10px;line-height: 1em;}
.pots p{margin: .6em 0 1em;}
.pots .buttonc{
    margin-top: 10px;
    text-align: center;
}

.pots .potleft img.photo{
    -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg);
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    transition: all 0.5s ease;
}
.pots .potcenter img.photo{
    -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg);
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    transition: all 0.5s ease;
}
.pots .potright img.photo{
    -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg);
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    transition: all 0.5s ease;
}
.pots .potleft:hover img.photo{
    -webkit-transform: rotate(-4deg); -ms-transform: rotate(-4deg); transform: rotate(-4deg);
}
.pots .potcenter:hover img.photo{
    -webkit-transform: rotate(-4deg); -ms-transform: rotate(-4deg); transform: rotate(-4deg);
}
.pots .potright:hover img.photo{
    -webkit-transform: rotate(4deg); -ms-transform: rotate(4deg); transform: rotate(4deg);
}

#cookie-bar{
    position: fixed;
    bottom: 0;
    width: 100%;
    background: #f1910b;
    color: #fff;
    z-index: 200;
    font-family: 'Decour-Semibold';
    font-size: 14px;line-height: 1.1em;
    text-align: center;
    padding: 6px 0;
}
#cookie-bar .close{position: absolute; right: 20px; top:50%; margin-top: -7px;}
.biggreen{font-size: 24px;color: #18563e;font-family: 'Decour-Black';}

.bgtop{height: 460px;}

h2{display: inline-block;margin:0 auto;position: relative;text-align: center;line-height: 1em}
h2 .title{z-index: 4;position: relative;text-align: center;line-height: 1em}
h2 .title{font-size: 32px}
h2 .flag{position: absolute;z-index: 1}
h2 .flagleft{left:-42px;width: 34px;height:100%;background: url(img/flags/left.svg) no-repeat center center;top:50%;margin-top:-20px;}
h2 .flagright{right:-42px;width: 34px;height:100%;background: url(img/flags/right.svg) no-repeat center center;top:50%;margin-top:-20px;}

.formobile h2{margin: 0 auto 0; display: inline;font-size: 50px;line-height:0.8em}
.formobile h2 .little{position: relative;font-size: 30px;}
.formobile h2 .little:after{content: "\A";white-space: pre; /* or pre-wrap */}
.formobile h2 .flagleft{left:-38px;width: 28px;height:27px;top:14px;margin-top:-2px;}
.formobile h2 .flagright{right:-38px;width: 28px;height:27px;top:14px;margin-top:-2px;}
.formobile h2 .little .flagleft{left:-38px;width: 28px;top:4px;margin-top:0px;}
.formobile h2 .little .flagright{right:-38px;width: 28px;top:4px;margin-top:0px;}
.formobile .subtitle{margin: 14px auto 0;}

.gammes .subtitle{ padding-bottom: 60px;}

footer .footer-green{
    position: relative;
    background: #18563e;
}
.footer-content{position: relative;max-width: 840px;margin: 0 auto;padding:20px 0;}
.footer-content .colleft{padding-left:0px 20px;text-align: center;}
.footer-content .colright{text-align: center;border-left:1px solid #dbdbdb;padding: 20px 0 0}

footer .legal{
    display: block;
    text-align: center;
    margin:6px 0;
}

footer .footer-green .footer-content{
    text-align: center;
}

footer .contact-press{
    text-align: center;
    padding:40px 0 20px 0;
}
footer .contact-press .title{
    color:#18563e;
    text-transform:uppercase;
    font-size: 14px;
    padding: 10px 0;
    font-family: "BrandonGrotesqueWeb-Black"; 
}
footer .contact-press p{
    margin:0 0 10px;
}


footer .pousse{
    display: none;
    width: 134px;
    position: absolute;
    left: -105px;top:-120px;
    -webkit-transform: scale(0.2);  
    -moz-transform:    scale(0.2);  
    -ms-transform:     scale(0.2); 
    -o-transform:      scale(0.2);  
    transform:         scale(0.2);
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    transition: all 0.5s ease;
    -webkit-transform-origin : 50% 100%;
    -moz-transform-origin : 50% 100%;
    -o-transform-origin : 50% 100%;
    -ms-transform-origin : 50% 100%;
    transform-origin : 50% 100%;
}
.pousse.grow{
    -webkit-transform: scale(1);  
    -moz-transform:    scale(1);  
    -ms-transform:     scale(1); 
    -o-transform:      scale(1);  
    transform:         scale(1);
}

footer .footer-green a{
    text-decoration: none;
    color: #fff;
    font-size: 14px;
}
footer {position: relative;font-size: 18px;}
footer .social{text-align: center;padding: 0px 0 10px;}
footer img{display: inline-block;margin: 0px auto 0}
footer .social a{position: relative;width: 50px;height: 31px;margin: 0 14px 0 14px}
footer .social a svg{width: 50px;}

footer a.underline{
    display: inline-block;
    padding: 0 0 4px 0;
    background: url(img/elements/link-footer.svg) no-repeat center bottom;
    text-decoration: none !important;
    background-size: 238px;
}
footer strong{
    font-family: 'Decour-Black';
    font-weight: normal;
}

.etapes.desktop{display: none;}
.etapes.mobile{display: block;
    position: relative;
    display: block;
    /*background: url(img/etapes-mobiles.svg) no-repeat top center;*/
    background: url(img/new/etapes-path-mobile.svg) no-repeat top center;
    width: 100%;height: 2000px;
    margin: 0px auto 0;
    -webkit-transform: scale(0.94);  
    -moz-transform:    scale(0.94); 
    -ms-transform:     scale(0.94);  
    -o-transform:      scale(0.94); 
    transform:         scale(0.94); 
}
.etapes .t{
    white-space: nowrap;
    font-family: 'Decour-Semibold';
    font-size:20px;line-height: 0.9em;
}
.etapes .t i{
    display: block;
    font-family: 'DaftBrush';
    font-size:44px;line-height: 1.1em;
    font-style: normal;
}

.b i{color: #1d1e1c;}
.y i{color: #f09004;}
.g i{color: #18563e;}

.bgtop .link{
    position: absolute;
    top: 0;
    
    left:-18px;
    width: 201px;height: 63px;
    z-index: 150;
}

.link img{display: none;}
.link .mobile{display: block; position: relative; left: 8px; top: -6px;}

/*
.credits .off{display: none;}
.credits .on{display: block;}
*/

.bgwhite{position: absolute;top: 0;left:0;width: 100%;height: 400px;background: #fff;}
    

.cornich{position: absolute;z-index: 10}
.rouge1{left:50%;margin-left:-680px; top:116px;}
.rouge2{left:50%;margin-left:210px; top:124px;}
.rouge3{left:50%;margin-left:136px; top:280px;}/* - */
.vert1{left:50%;margin-left:-230px; top:76px;}/* - */
.vert2{left:50%;margin-left:-40px; top:320px;z-index: 1}/* - */
.vert3{left:50%;margin-left:-438px; top:634px;}
.vert4{left:50%;margin-left:80px; top:-20px;}/* - */
.vert5{left:50%;margin-left:326px; top:290px;}
.vert6{left:50%;margin-left:-680px; top:116px;}
.vert6{left:50%;margin-left:473px; top:582px;}
.vert7{left:50%;margin-left:262px; top:706px;}
.bleu1{left:50%;margin-left:-440px; top:230px;}
.bleu2{left:50%;margin-left:-200px; top:340px;}/* - */
.bleu3{left:50%;margin-left:484px; top:220px;}

.logocornichons{width: 250px;position: absolute; left: 50%;margin-left: -125px;top:140px;}

.etapesmobilec{padding: 0px 0px 0;max-width: 400px;margin:0 auto;}
.etapes.mobile{position: relative;}
.etapes.mobile > div {position: absolute;}
.etapes.mobile div.etape1{top:87px;left:0px;text-align: left;}  
.etapes.mobile div.etape2{top:103px;right:43px;text-align: left;} 
.etapes.mobile div.etape3{top:280px;right:62px;text-align: left;} 
.etapes.mobile div.etape4{top:625px;right:64px;text-align: left;} 
.etapes.mobile div.etape5{top:730px;left:139px;text-align: left;}
.etapes.mobile div.etape6{top:879px;left:19px;text-align: center;}
.etapes.mobile div.etape7{top:1010px;left:142px;text-align: left;}
.etapes.mobile div.etape8{top:1169px;left:69px;text-align: right;}
.etapes.mobile div.etape9{top:1364px;left:164px;text-align: left;}  
.etapes.mobile div.etape10{top:1533px;left:109px;text-align: center;} 
.etapes.mobile div.etape11{top:1709px;left:139px;text-align: center;} 
.etapes.mobile div.etape12{top:1974px;right:50px;text-align: left;}


.pot .deco{position: absolute;}
.pot .deco.left1{left: -40px; top:-52px;}
.pot .deco.left2{right: -80px;top:20px;}
.pot .deco.left2{
        -webkit-transform: rotate(-246deg);  
        -moz-transform: rotate(-246deg);   
        -ms-transform: rotate(-246deg);   
        -o-transform: rotate(-246deg);  
        transform: rotate(-246deg);  
} 
.pot .deco.left3{left: -28px;top:230px;}
.pot .deco.leftp1{left: -40px;top:175px;}
.pot .deco.leftp2{left: 242px;top:150px;}
.pot .deco.leftp3{left: -200px;top:150px;}
.pot .deco.leftc1{left: -40px;top:80px;}

.pot .deco.right1{left: 200px; top:-30px;}
.pot .deco.right2{left: -45px;top:25px;}
.pot .deco.right3{left: 220px;top:230px;}
.pot .deco.right4{left: -200px;top:150px;}
.pot .deco.rightb1{left: 220px;top:30px;}
.pot .deco.rightb2{left:  -80px;top:120px;}
.pot .deco.rightc1{right: -65px;top:100px;}

.fordesktop{display: none;}
.formobile{display: block;}

.center{text-align: center;}

.maps.single .table{background: #fff;}
.maps.single .col{
    vertical-align: top;
}
.maps.single > col{
    padding: 0 20px;
}
.maps{text-align: justify;}
.maps.single{width: 100%;}
.maps.single .name{
font-size: 50px;
position: relative !important;
text-align: left;
}
.name-subtitle{
    padding: 8px 0 0;
    font-size: 16px;
    font-family: 'Decour-Black';
}
.maps .text{
    padding: 0px 0 0;
    max-width: 100%;
    font-family: 'Decour-SemiboldItalic';
}
.maps .text strong{
    font-weight: 900;
}
.maps.single .colleft .text{
    -moz-text-align-last: left;
    text-align-last: left;
}
.maps.single .map{
    height: auto;
}
.maps.single .colleft{
    padding: 0 22px 0 22px;
}
.maps.single .mapimg{
    position: relative;
    left: 0;top:20px;
    margin: 0 auto;
    max-width: 380px !important;
    width: 380px !important;
    margin: 0 auto !important;;
    left: 50% !important;;margin-left: -200px !important;;
}
.maps.single .colright{
    padding: 0;
}
.maps.single .person{
    top:40px;
    width: 218px;
}
/*
.maps.single .marker {
    top:82px;
    left: 50%;
    margin-left:-100px; 
}
*/
h2,.subtitle,.text,.map,.pot{
    opacity: 0;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    transition: all 0.5s ease;
}
h2.visible,.subtitle.visible,.text.visible,.map.visible,.pot.visible{
    opacity: 1;
}

.ou-trouver-magasin{
    padding: 10px 20px 40px;
}
.ou-trouver-magasin h3{
    color: #18563e;
    font-size: 24px;
    margin: 0;
    font-family: 'BrandonGrotesqueWeb-Bold';
    text-transform: uppercase;
}
.ou-trouver-magasin p{
    color: #1d1e1c;
    font-size: 24px;
    margin: 0;
    font-family: 'Decour-Semibold';
}

.kit-intro{
    padding: 0 20px;
}
.kit-intro .subtitle{
    font-family: 'Decour-Semibold';
    font-size: 23px;
    color: #18563e;
    margin: 70px auto 0;
    text-transform: none;
}
.kit-intro h3{
    font-size: 33px;
    font-family: 'DaftBrush';
    color: #18563e;
}
.participate{
    font-size: 24px;
    font-family: 'Decour-Semibold';
    padding:25px 0 10px;
}

.participate .b{
    font-size: 26px;
    font-family: 'DaftBrush';
}

.comme-nos-agriculteurs{
    font-size: 16px;
    padding: 0 0;
}


.kit-steps {
    font-family: 'Decour-Black';
    font-size: 23px;
    margin-bottom: 34px;
}

.kit-steps .item{
    position: relative;
    display: inline-block;
    width: 49%;
    text-align: center;
    vertical-align: top;
}
.kit-steps .item .img{
    height:190px;
    vertical-align: bottom;
}
.kit-steps .item .img img{
    vertical-align: bottom;
}
.kit-steps .item .number{
    position: absolute;
    left: 00px;
    top: 40%;
    -webkit-transform: scale(0.6);  
    -moz-transform:    scale(0.6);  
    -ms-transform:     scale(0.6); 
    -o-transform:      scale(0.6);  
    transform:         scale(0.6);
}
.kit-steps .item .tab{
    display: table;
    width: 100%;
    height: 100%;
}
.kit-steps .item .tab .cell{
    display: table-cell;
    vertical-align: middle;
    width: 100%;
}

.each-kit{
    font-family: 'Decour-Semibold';
    font-size: 24px;
    margin:0 0 20px 0;
    padding: 0 0 10px;
    background-size: 139px;
}
.each-kit span{
    font-family: 'Decour-Black';
    font-size: 36px;
}

.inside-kit{
    color: #18563e;
    padding:33px 0 60px;
    margin: 69px auto 0;
    max-width: 1100px;
}
.inside-kit .i{
    position: relative;
    display: inline-block;
    padding:15px 15px;
}
.inside-kit .bg-bottom{
    background: #D5E0C2;
    position: absolute;
    left: 0;
    bottom: -360px;
    width: 100%;
    height: 360px;
}
.inside-kit .img{
    position: relative;
    height: 100px;
    vertical-align: bottom;
    margin:0 0 25px;
}
.inside-kit .i2 .img img{
    bottom: 20px;
}
.inside-kit .img img{
    position: absolute;
    bottom:0;left: 50%;
    -webkit-transform: translate(-50%,0px);
    transform: translate(-50%,0px);
}
.inside-kit .plus{
    position: absolute;
    left: -29px;top: 23%;
}

.inside-kit .i3 .plus{
    left: -6px;
}
.inside-kit .i5 .plus{
    left: 12px;
}

.legalc{
  position: fixed;
  bottom:-250%;left:0;
  width: 100%;
  z-index: 8000;
  background:#fff;
  padding: 20px 0px 20px;
  text-align: center;
  -webkit-transition: all .4s ease;
  -moz-transition: all .4s ease;
  transition: all .4s ease;
}
.legalc .legali{
  position: relative;
  background:#fff;
  padding: 0 40px 0;
  overflow-y: scroll;
  max-width: 1200px;
  margin:0 auto;
}
.show-legal .legalc{
  bottom:0px;
  padding: 0 0 20px;
}
.legalc .title{
  color: #00523d;
  margin:40px 0 20px;
  font-size: 18px;font-family: 'Decour-Semibold';
  text-transform: uppercase;
}
.legalc h3{
  margin:30px 0 12px;
  color: #00523d;
  font-size: 18px;font-family: 'Decour-Semibold';
}
.legalc .close{
    margin: 20px 0;
  font-size: 50px;
  color: #fff;
  text-decoration: none !important;
}

article.cornichonmaison .bgtop .intro{
    padding: 40px 20px 30px;
    width: 100%;
    max-width: 500px;
    margin: 0 auto;
    font-size: 16px;
    text-align: justify;
}
article.cornichonmaison .bgtop {
    background: #C9D485;
}

article.cornichonmaison .bgtop .share-hashtag{
    font-size: 24px;
    color: #18563e;
    font-family: 'Decour-Black';
}



.objectifs{
    color:#185640;
    font-size: 18px;
    text-align: center;
    padding: 40px 0px;
}
.objectifs .t{
    padding: 0 20px;
}
.objectifs .title{
    font-size: 48px;
    font-family: 'DaftBrush';
}
.objectifs .bloc-annee-highlight{
    background: #d5e0c2;
    max-width: none;
}

.highlight{
    font-size: 24px;
    font-family: 'DaftBrush';
}

.bloc-annee{
    position: relative;
    margin: 34px 0;
}
.bloc-annee .item{
    display: inline-block;
    text-align: center;
    vertical-align: top;
    margin:0 0 24px;
    padding: 50px 20px 0;
}
.bloc-annee .item .t{
    text-align: center;
    font-size: 24px;
    font-family: 'DaftBrush';
    margin:0 0 18px;
}
.bloc-annee .item .t div{
    position: relative;
    display: inline-block;
    padding: 0 0 6px;
}
.bloc-annee .item .t i{
    position: absolute;
    bottom: 0;left: 0;
    width: 100%; height: 2px;
}
.bloc-annee .item .t i img{
    vertical-align: top;
}
.bloc-annee .item-c .img-c{
    height: 100px;
    display: table;
    width: 100%;
}
.bloc-annee .item-c .img-c img{
    vertical-align: bottom !important;
}
.bloc-annee .item img{
    margin:4px 0;
}
.bloc-annee .img-c .cell{
    display: table-cell;
    vertical-align: bottom;
}

.bloc-annee .trait{
    position: absolute;
    top: -10px;
    width: 100%;
}

.bloc-annee-highlight .img-c{
    height: 160px;
    display: table;
    width: 100%;
}


.bloc-annee .item.full{
    width: 100%;
}

.bloc-annee .p2016{
    position: absolute;
    right: 2px;
    top:0px;
}
.bloc-annee .p2017{
    position: absolute;
    left: 2px;
    top:0px;
}

.legends{
    max-width: 182px;
    margin: 0 auto;
    padding: 20px 0 0;
    text-align: left;
}
.legends .legend{
    display: block;
    padding: 8px 0;
}
.legends .legend img{
    position: relative;
    top: -21px; 
    margin-right: 4px;
}
.legends .legend.orange{
    color: #f09004;
}
.legends .legend.green{
    color: #17553d;
}
.legends .legend.green2{
    color: #235352;
}
.legends .legend.yellow{
    color: #fbc51a;
}

.video-kit-title{
    font-size: 36px;
    font-family: 'DaftBrush';
    padding: 40px 20px 20px 0;
    color: #fff;
}
.kit-vid {
    display: block;
    background: #07523d;
    text-align: center;
    padding: 0 0 20px;
}
.kit-vid a{
    display: inline-block;
    margin: 0 20px 30px;
    cursor: pointer;
    font-family: 'BrandonGrotesqueWeb-Black';
    font-size: 20px;
    text-decoration: none;
}
.kit-vid .item .image{
    display: inline-block;
    position: relative;
    -moz-box-shadow:  0px 0px 0px 8px #17573f;
    -webkit-box-shadow:  0px 0px 0px 8px #17573f;
    -o-box-shadow:  0px 0px 0px 8px #17573f;
    box-shadow:  0px 0px 0px 8px #17573f;
    margin: 0 0 27px 0;
}
.kit-vid .item .text{
    text-align: center;
}
.kit-vid .item .image img{
    width: 618px;
}
.kit-vid .item .image .play{
    position: absolute;
    width: 52px;height: 52px;
    left: 50%;margin-left: -26px;
    top:50%;margin-top: -26px;
    background: url(img/elements/play.svg);
    background-size: 52px;
}


.cornichon-trait{
    padding: 8px 0;
}

@media screen and (max-height: 400px) {

    .show-legal .legalc{
      bottom:0px;
    }
}

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

    .bloc-annee{
        -webkit-transform: scale(0.95);  
        -moz-transform:    scale(0.95);  
        -ms-transform:     scale(0.95); 
        -o-transform:      scale(0.95);  
        transform:         scale(0.95);
    }
    .bloc-annee-highlight{
        -webkit-transform: scale(1);  
        -moz-transform:    scale(1);  
        -ms-transform:     scale(1); 
        -o-transform:      scale(1);  
        transform:         scale(1);
    }
}

@media screen and (min-width: 768px) {
    .recette .recettei{
        padding: 20px 30px;
        margin:0px 0 0;
    }
    .and-after{
        text-align: right;
        max-width: 620px;
        padding: 0;
        margin:0 auto;
    }

    .recette-c.on .recette-off{
        display: none;
    }
    .recette-c.on .recette-on{
        display: block;
    }

    .recette .imgcorner{
        right: 10px;top:3px;
    }

    .comme-nos-agriculteurs{
        padding: 0 28px;
    }

    article.cornichonmaison .bgtop .intro{
        font-size: 16px;
        max-width: 446px;
    }
    article.cornichonmaison .bgtop{
        background: url(img/new/bg-cornichons-maison.jpg) no-repeat 32% center;
        background-size: cover;
    }

    article.cornichonmaison .bgtop  h2 .title{
        font-size: 60px;
    }

    article.cornichonmaison .bgtop-i{
        position: absolute;
        width: 455px;
        margin-left: -225px;
    }

    .kit-intro .subtitle{
        font-size: 30px;
    }
    .kit-intro h3{
        font-size: 43px;
    }
    .cornichon-title{
        font-size: 30px;
    }
    .cornichon-title span.big{
        font-size: 43px;
    }

    .agriculteurs .imageleft .image .photo{
        display: block;
    }

    .bloc-annee{
        width: 100%;
        max-width: 840px;height: 237px;
        margin: 30px auto;
        padding: 40px 0 0;
    }
    .bloc-annee.bloc-annee-highlight{
        height: auto;
        padding: 110px 0 0;
    }
    .objectifs{
        padding: 0 0px;
    }
    .objectifs .bloc-annee-highlight .p2018{
        position: absolute;
        left: 50%;top:-1px;
        -webkit-transform: translate(-50%,0);  
        -moz-transform:    translate(-50%,0);  
        -ms-transform:     translate(-50%,0);  
        -o-transform:      translate(-50%,0);  
        transform:         translate(-50%,0); 
    }

    .bloc-annee .frame{
        position: absolute;
        top:0;left:0;
        width: 840px;height: 237px;
        background: url(img/new/frame-agriculteur-date.png) no-repeat center center;
    }

    .bloc-annee .item{
        padding: 0 0;
    }
    .bloc-annee .item-c{
        display: table;
        width: 100%;
    }
    .bloc-annee .item-c .item{
        display: table-cell;
        padding: 0 12px;
        white-space: nowrap;
    }
    .bloc-annee .item-c .item.large{
        width: 366px;
    }

    .legends{
        max-width: none;
        margin: 0 auto;
        text-align: center;
    }
    .legends .legend{
        display: inline-block;
        margin: 0 20px;
        padding: 0;
    }

    .video-kit-title{
        padding: 40px 20px 30px 0;
    }
    .kit-vid {
        padding: 0 0 40px;
    }
    .each-kit{
        margin:0 0 50px 0;
    }

    .kit-steps .item{
        width: 290px;
    }
    .kit-steps .item .tab{
        display: table;
        width: 100%;
        height: 100%;
    }
    .kit-steps .item .tab .cell{
        display: table-cell;
        vertical-align: middle;
        width: 100%;
    }

    .kit-steps .item .number{
        left: 40px;
        top: 80px;
        -webkit-transform: scale(1);  
        -moz-transform:    scale(1);  
        -ms-transform:     scale(1); 
        -o-transform:      scale(1);  
        transform:         scale(1);
    }
    .kit-steps .item .number.number2{
        left: 25px;
    }

    .how-to-blocs{
        position: relative;
        height: 830px;
        margin-bottom: 50px;
    }
    .how-to-blocs .how-to-bloc .border{
        display: block;
        position: absolute;
        top: -36px;
        left: -36px;
        width: 124%;
        height: 129%;
    }
    .how-to-blocs .how-to-bloc .border svg{
        width: 100%;height: 100%;
    }
    .how-to-blocs .how-to-bloc1{
        position: absolute;
        right: 50%; top: 0; margin-right: 15px;
        width: 245px;min-height: 245px;
        background:#07523d;
        padding: 20px 28px 28px 20px;
    }
    .how-to-blocs .how-to-bloc1 .border{
        width: 124%;
        height: 124%;
    }
    .how-to-blocs .how-to-bloc4 .border{
        top:-7px; left:-27px;
        width: 124%;
        height: 125%;
    }

    .how-to-blocs .how-to-bloc2{
        position: absolute;
        left: 50%; top: 80px; margin-left: 15px;
        width: 294px;min-height: 325px;
        background:#188c6c;
    }
    .how-to-blocs .how-to-bloc3{
        position: absolute;
        right: 50%; top: 294px; margin-right: 15px;
        width: 6000px;min-height: 245px;
        background:#188c6c;
    }
    .how-to-blocs .how-to-bloc4{
        position: absolute;
        left: 50%; top: 440px; margin-left: 15px;
        width: 6000px;min-height: 200px;
        background:#07523d;
        padding: 20px 20px 20px 40px;
    }
    .how-to-blocs .how-to-bloc5{
        position: absolute;
        right: 50%; top: 574px; margin-right: 15px;
        width: 245px;min-height: 245px;
        background:#f1900b;
    }


    .how-to-bloc .i{
        display: inline-block;
        max-width: 242px;
        position: relative;
    }

    .how-to-bloc3 {
        text-align: right;
    }
    .how-to-bloc3 .i{
        text-align: left;
    }

    .how-to-terre{
        position: absolute;
        right: -209px; top: -30px;
        -webkit-transform: scale(1);  
        -moz-transform:    scale(1);  
        -ms-transform:     scale(1); 
        -o-transform:      scale(1);  
        transform:         scale(1);
    }
    .how-to-arrosoir{
        position: absolute;
        right: 250px; top: -60px;
    }
    .how-to-arrosoir img{
        display: inline-block;
    }
    .how-to-bol{
        position: absolute;
        left: -110px;
        bottom: -70px;
        -webkit-transform: scale(1);  
        -moz-transform:    scale(1);  
        -ms-transform:     scale(1); 
        -o-transform:      scale(1);  
        transform:         scale(1);
    }

    .row{
        display: table;
        width: 100%;
    }
    .row .col{
        display: table-cell;
        width: 50%;
    }

    .form-contact .col-left{
        padding-right: 60px;
    }
    .form-contact .col-right{
        padding-left: 60px;
    }

    article.top .pictos-c{
        display: block;
    }

    .recette-c{
        margin: 100px auto 0;
    }
    .recette .col-left{
        float: left;
        width: 50%;
    }
    .recette .col-right{
        float: left;
        width: 50%;
        padding: 0 0 0 70px;
    }


    .recette-off svg{
        width: 39px;
    }
    .recette .recette-top img,
    .recette-off .recette-top img{
        width: 92px;
    }

    h2,.subtitle,.text,.map,.pot{
        opacity: 1 !important;
    }

    .fordesktop{display: block;}
    .formobile{display: none;}

    .subtitle{margin: 10px auto 0}
    .gammes .subtitle{ padding-bottom: 0px;}

    .link img{display: block;}
    .link .mobile{display: none;}
    
    .bgtop .link .on{display: none;}
    .bgtop .link .off{display: block;}
    .bgtop .link:hover .on{display: block;}
    .bgtop .link:hover .off{display: none;}


    .bgtop{height: 860px;}
    .bgtop .link{left: 50%;margin-left: -360px;}


    .logocornichons{width: 440px;position: absolute; left: 50%;margin-left: -220px;top:272px;}

    .logo{
        top:40px;
    }

    .text{
        padding: 0;
    }

    .pots .potleft{padding-left:0px;padding-right: 30px; }
    .pots .potcenter{padding-top:0;padding-left:30px;padding-right: 30px; }
    .pots .potright{padding-left:30px;padding-right: 0px; }

    .cornich{position: absolute;z-index: 10}
    .rouge1{left:50%;margin-left:-680px; top:116px;}
    .rouge2{left:50%;margin-left:210px; top:124px;}
    .rouge3{left:50%;margin-left:286px; top:436px;}
    .vert1{left:50%;margin-left:-298px; top:154px;}
    .vert2{left:50%;margin-left:-462px; top:366px;}
    .vert3{left:50%;margin-left:-438px; top:634px;}
    .vert4{left:50%;margin-left:436px; top:50px;}
    .vert5{left:50%;margin-left:326px; top:290px;}
    .vert6{left:50%;margin-left:-680px; top:116px;}
    .vert6{left:50%;margin-left:473px; top:582px;}
    .vert7{left:50%;margin-left:262px; top:706px;}
    .bleu1{left:50%;margin-left:-440px; top:230px;}
    .bleu2{left:50%;margin-left:-340px; top:508px;}
    .bleu3{left:50%;margin-left:484px; top:220px;}

    .etapes.mobile,.etapesmobilec{display: none;}
    .etapes.desktop{
        position: relative;
        display: block;
        /*background: url(img/etapes-path.png) no-repeat;*/
        background: url(img/new/etapes-path.png) no-repeat center center;
   
        width: 789px;height: 858px;

        -webkit-transform: scale(0.73) translateX(-8%) !important;  
        -moz-transform:    scale(0.73) translateX(-8%) !important;  
        -ms-transform:     scale(0.73) translateX(-8%) !important;  
        -o-transform:      scale(0.73) translateX(-8%) !important;  
        transform:         scale(0.73) translateX(-8%) !important;
        margin: 0px auto 0;
       
    }    

    .pot-cornichon{
        bottom: -377px;
    }

    .bgwhite{height: 488px;}
    
    .etapes .t{
        position: absolute;
        text-align: center;
    }
    .etapes > div {position: absolute;}
    .etapes > div .hover{/*visibility: hidden;*/opacity: 0;position: absolute;top:0;left:0;max-width: none;}
    .etapes > div img{-webkit-transition: all 0s ease;-moz-transition: all 0s ease;transition: all 0s ease;}
    .etapes > div:hover img{-webkit-transform: scale(1.5) !important;  -moz-transform:    scale(1.5) !important;  -ms-transform:     scale(1.5) !important;  -o-transform:      scale(1.5) !important;  transform:         scale(1.5) !important;/*visibility: hidden;*/opacity: 0;-webkit-transition: all 0.5s ease;-moz-transition: all 0.5s ease;transition: all 0.5s ease;}
    .etapes > div:hover .hover{display: block;/*visibility:visible;*/opacity: 1;-webkit-transform: scale(0.8) !important;  -moz-transform:    scale(0.8) !important;  -ms-transform:     scale(0.8) !important;  -o-transform:      scale(0.8) !important;  transform:         scale(0.8) !important;}
    .etapes div.etape1{top:-46px;left:10px;}   .etapes div.etape1 .hover{top:8px;left:10px;}
    .etapes div.etape2{top:180px;left:5px;}   .etapes div.etape2 .hover{top:-1px;}
    .etapes div.etape3{top:127px;left:273px;}    .etapes div.etape3 .hover{top:8px;left:-3px;}
    .etapes div.etape4{top:202px;left:447px;}   .etapes div.etape4 .hover{top:1px;left:-6px;}
    .etapes div.etape5{top:136px;left:626px;}
    .etapes div.etape6{top:387px;left:483px;}
    .etapes div.etape7{top:308px;left:242px;}  .etapes div.etape7 .hover{top:-5px;left:-6px;}
    .etapes div.etape8{top:397px;left:28px;}
    .etapes div.etape9{top:559px;left:60px;}   .etapes div.etape9 .hover{top:-4px;}
    .etapes div.etape10{top:624px;left:303px;} .etapes div.etape10 .hover{top:22px;}
    .etapes div.etape11{top:655px;left:517px;} .etapes div.etape11 .hover{top:-2px;left: -3px} 
    .etapes div.etape12{top:704px;left:625px;} .etapes div.etape12 .hover{top:-34px;left: -41px} 

    .etapes div.etape1 .t{bottom: -59px;left:-12px;text-align: left;}
    .etapes div.etape2 .t{bottom: -80px;left:17px;text-align: left;}
    .etapes div.etape3 .t{bottom: -62px;left:-55px;text-align: center;}
    .etapes div.etape4 .t{bottom: 112px;right:-6px;text-align: right;}
    .etapes div.etape5 .t{bottom: -3px;left:96px;text-align: left;}
    .etapes div.etape6 .t{bottom: 83px;right:63px;text-align: center;}
    .etapes div.etape7 .t{bottom: -78px;right:32px;text-align: right;}
    .etapes div.etape8 .t{bottom: -54px;left:-83px;text-align: left;}
    .etapes div.etape9 .t{bottom: -86px;left:0;text-align: left;}
    .etapes div.etape10 .t{bottom: -75px;left:-35px;text-align: center;}
    .etapes div.etape11 .t{top: -85px;left:-20px;text-align: center;}
    .etapes div.etape12 .t{bottom: 0;right:-118px;text-align: left;}


    .pot-cornichon{margin-left: -230px;max-width: none}

    .table{display: table;width: 100%}
    .table .col{display: table-cell;}
    .valignm{vertical-align: middle;}


    .table.pots .pot{height: 400px;}
    .table .potleft{display: table-cell;width: 280px;}
    .table .potcenter{display: table-cell;width: 280px;}
    .table .potright{display: table-cell;width: 280px;}
    .table .pot{height: 100%;width:100%;position: relative;}
    /*.table.pots{max-width: 810px;margin:0 auto;}*/
    .table.pots{max-width: 840px;margin:0 auto;}
    .pot .img{position: absolute; width: 318px; bottom:0px; /*left:50%;margin-left:-159px;*/}
    .pot .img img.photo{z-index: 2;position: relative;width: 219px}
    .potleft .pot .img{left: -30px}
    .potcenter .pot .img{left: -30px}
    .potright .pot .img{left: -30px}
    .shadow{
        position: absolute;
        bottom: -30px;
        z-index: 1;
        margin-left: 0;
        left: 0;
    }
    .potleft .shadow{right: -30px;left: auto}
    .potcenter .shadow{left: -30px;}
    .potright .shadow{left: -30px;}

    .maps{
        display: table;
        width: auto;
        margin: 0 auto;
    }
    .maps .col{
        display: table-cell;
        padding:0 8px; 
    }
    .map{padding:0 0;width: 210px;height: 328px;max-width: none;}

    .map .mapimg{
        width: 300px !important;
        max-width: 300px !important;
        position: absolute;
        top:44px;left: 50%;margin-left: -150px;
    }
    .maps.single .mapimg{
        top:60px;
    }
    /*
    .maps.single .marker{
        top:60px;
    }*/
/*
    .col1 .marker{top:70px;left:50%;margin-left: -70px}
    .col2 .marker{top:100px;left:50%;margin-left: -70px}
    .col3 .marker{top:90px;left:50%;margin-left: -44px}
    .map .marker span{padding: 5px 0 0;font-size: 16px;line-height: 16px}
    .map .marker img{width: 24px}*/

    .person{top:  72px;left:50%;}
    .col1 .person{width: 177px;}
    .col2 .person{width: 195px;top:75px;left:34%}
    .col3 .person{width: 212px;left: 45%;}
    .maps .name{font-size: 30px;}

    article.top{overflow: initial;}
    article.relancer{padding: 50px 0 60px;}
    article.fiers{padding: 100px 0 84px;}
    article.douze-etapes{padding: 60px 0 40px;}
    article.gammes{padding: 100px 0 0;}
    .page-template-page-cornichons-maison .top{
        padding:125px 0 100px;
    }


    .littlep{max-width: 80%;margin:0 auto;}
    .relancer .text p{max-width: 80%;margin-left:auto;margin-right:auto;text-align: justify;}
    .relancer .text .center{
        text-align: center;
    }
    .relancer .text p br{display: none;}
    .fourchette{position: absolute;bottom:-16px;left:50%;margin-left:-700px;z-index: -1;max-width:407px !important;}

    footer {position: relative;}
    /*footer .social{position: absolute;right: 0;top:-10px;padding: 0}*/
    footer img{display: inline-block;margin: 0}

    footer .legal{
        display: inline-block;
        float: right;
        margin: 0;
    }


    .bgbottom{padding-bottom:0px;}

    .pot .deco{position: absolute;}
    .pot .deco.left1{left: -40px; top:-52px;}
    .pot .deco.left2{right: -80px;top:20px;}
    .pot .deco.left2{
        -webkit-transform: rotate(0deg);  
        -moz-transform: rotate(0deg);   
        -ms-transform: rotate(0deg);   
        -o-transform: rotate(0deg);  
        transform: rotate(0deg);  
    } 
    .pot .deco.left3{left: -28px;top:230px;}
    .pot .deco.leftp1{left: -40px;top:175px;}
    .pot .deco.leftp2{left: 242px;top:150px;}
    .pot .deco.leftp3{left: -27px;top:22px;}
    .pot .deco.leftc1{left: -40px;top:100px;}

    .pot .deco.right1{left:auto;right: 200px;top:-40px;}
    .pot .deco.right2{left:auto;right: -45px;top:80px;}
    .pot .deco.right3{left:auto;right: -40px;top:140px;}
    .pot .deco.right4{left:auto;right:-30px;top:300px;}
    .pot .deco.rightb1{left: 220px;top:-40px;}
    .pot .deco.rightb2{left:auto;right:-46px;top:202px;}
    .pot .deco.rightc1{right:-66px;top:-15px;}

    
    .maps.single{width: 780px;margin: 0 auto}

    .maps.single .map{
        height: 100%;
        width: 100%;
    }
    .maps.single .colright{
        height: 100%;
    }
    .maps.single .table{
        height: 100%;
        width: 100%;
    }
    .maps.single .colleft{
        width: 300px;
    }
    .maps.single .text{
        max-width: 100%;
    }
    .maps.single .colleft{
        padding: 0 0px 40px 40px;
    }
    .maps.single .name{
        padding-top:0px; 
    }
    .maps.single .mapimg{
        position: relative;
        left: 0;top:30px;
        margin: 0 auto;
        max-width: 300px !important;
        width: 300px !important;
        margin: 0 auto !important;;
        left: 50% !important;;margin-left: -150px !important;;
    }
    /*
    .maps.single .marker{
        top:73px;
        left: 55%;
    }*/

    .ou-trouver-magasin h3{
        font-size: 24px;
    }
    .ou-trouver-magasin p{
        font-size: 20px;
    }

    h2 .title{font-size: 40px}
}

@media screen and (min-width: 992px) {

    .bloc-annee{
        -webkit-transform: scale(1);  
        -moz-transform:    scale(1);  
        -ms-transform:     scale(1); 
        -o-transform:      scale(1);  
        transform:         scale(1);
    }


    h2 .title{white-space:nowrap;}
    .subtitle{margin: 20px auto 0}

    .bgtop .link{margin-left: -433px;}
    .logocornichons{width: 408px;position: absolute; left: 50%;margin-left: -204px;top:200px;}
    .pot-cornichon{margin-left: -200px;max-width: 400px;}

    .cornich{position: absolute;z-index: 10}
    .rouge1{left:50%;margin-left:-680px; top:116px;}
    .rouge2{left:50%;margin-left:210px; top:124px;}
    .rouge3{left:50%;margin-left:286px; top:436px;}
    .vert1{left:50%;margin-left:-298px; top:154px;}
    .vert2{left:50%;margin-left:-462px; top:366px;}
    .vert3{left:50%;margin-left:-438px; top:634px;}
    .vert4{left:50%;margin-left:436px; top:50px;}
    .vert5{left:50%;margin-left:326px; top:290px;}
    .vert6{left:50%;margin-left:-680px; top:116px;}
    .vert6{left:50%;margin-left:473px; top:582px;}
    .vert7{left:50%;margin-left:262px; top:706px;}
    .bleu1{left:50%;margin-left:-440px; top:230px;}
    .bleu2{left:50%;margin-left:-340px; top:508px;}
    .bleu3{left:50%;margin-left:484px; top:220px;}

    .etapes.desktop{
        width: 789px;height: 858px;
    }
    .etapes.desktop{
        -webkit-transform: scale(1) !important;  
        -moz-transform:    scale(1) !important;  
        -ms-transform:     scale(1) !important;  
        -o-transform:      scale(1) !important;  
        transform:         scale(1) !important;
        margin: 44px auto 0;
    }

    .table.pots{display: table;}
    .table.pots .pot{height: 480px;}

    .bgtop{height: 650px;}

    .credits{
        min-width: 400px;
        text-align: center;
    }
    /*
    .credits .off{display: block;}
    .credits .on{display: none;}
    .credits:hover .off{display: none;}
    .credits:hover .on{display: block;}*/

    .map{width: 304px;height: 470px;}

    .maps.single .colleft{
        width: 350px;
    }
    /*
    .maps.single .marker{
        top: 45px;left: 54%;
    }
    .map .mapimg{
        width: 432px !important;
        max-width: 432px !important;
        position: absolute;
        top:62px;left: 50%;margin-left: -216px;
    }
    .col1 .marker{top:100px;left:50%;margin-left: -80px}
    .col2 .marker{top:140px;left:50%;margin-left: -84px}
    .col3 .marker{top:120px;left:50%;margin-left: -44px}
    .map .marker img{width: 39px}
    .map .marker span{padding: 10px 0 0;font-size: 20px}*/

    .maps.single .person{
        left: 56%;
    }
    .person{top:  108px;}
    .col1 .person{width: 255px;}
    .col2 .person{width: 276px;top:110px;left:50%}
    .col3 .person{width: 305px;}

    .maps .name{padding-top: 40px;font-size: 50px;}

    article.relancer{padding: 70px 0;}
    article.fiers{padding: 70px 0;}
    article.douze-etapes{padding: 70px 0;}
    article.gammes{padding: 70px 0 0;}


    /* Deco pots cornichons */
    .pot .deco.left1{left: 44px; top:-52px;}
    .pot .deco.left2{left: auto;right:auto;left:-80px;top:-17px;}
    .pot .deco.left3{left: -80px;top:230px;}
    .pot .deco.leftp1{left: -40px;top:160px;}
    .pot .deco.leftp2{left: 10px;top:-34px;}
    .pot .deco.leftp3{left: -42px;top:47px;}
    .pot .deco.leftc1{left: -100px;top:76px;}

    .pot .deco.right1{left: auto;right: 60px; top:-52px;}
    .pot .deco.right2{left: auto;right: auto;right: -110px;top:102px;}
    .pot .deco.right3{left: auto;right: -60px;top:150px;}
    .pot .deco.right4{left: auto;right: -60px;top:280px;}
    .pot .deco.rightb1{left: auto;right: -60px;top:-50px;}
    .pot .deco.rightb2{left: auto;right: -98px;top:194px;}
    .pot .deco.rightc1{left:auto;right: -157px;top:17px;}


    .maps.single{width: 940px;margin: 0 auto}
    /*
    .maps.single .marker{
        left: 56%;
    }*/

    .ou-trouver-magasin h3{
        font-size: 24px;
    }
    .ou-trouver-magasin p{
        font-size: 24px;
    }


}

@media screen and (min-width: 1200px) {

    .bgtop .link{margin-left: -562px;}
    .etapes.desktop{width: 789px;height: 858px;}

    h2 .flagleft{left:-42px;width: 34px;height:100%;background: url(img/flags/left.svg) no-repeat center center;top:0%;margin-top:14px;}
    h2 .flagright{right:-42px;width: 34px;height:100%;background: url(img/flags/right.svg) no-repeat center center;top:0%;margin-top:10px;}

    .pot-cornichon{margin-left: -230px;max-width: none;}


    .maps{
        margin: auto;
        width: 1000px;
    }

    .map{width: 324px;height: 504px;}

    .map .mapimg{
        width: 463px !important;
        max-width: 463px !important;
        position: absolute;
        top:68px;left: 50%;margin-left: -231px;
    }

/*
    .maps.single .marker{
        top: 58px;
    }*/
    .maps.single{width:940px;margin: 0 auto}
    .maps.single .colleft{
        width: 380px;
    }
    .maps.single .person{
        left: 50%;
    }
    .maps.single .mapimg{
        position: relative;
        left: 0;top:20px;
        margin: 0 auto;
        max-width: 400px !important;
        width: 400px !important;
        margin: 0 auto !important;;
        left: 50% !important;;margin-left: -200px !important;;
    }

    .person{top:  117px;}
    .col1 .person{width: 274px;}
    .col2 .person{width: 305px;top:120px;}
    .col3 .person{width: 327px;}

    .maps .name{
        padding-top: 44px;font-size: 50px;
        position: absolute;
        top: 0;left: 0;
        width: 100%;
    }
    /*
    .maps .col1 .marker{top:110px;left:50%;margin-left: -80px}
    .maps .col2 .marker{top:156px;left:50%;margin-left: -80px}
    .maps .col3 .marker{top:142px;left:50%;margin-left: -40px}*/

    .bgtop{
        height: 753px;
    }

    .cornich{position: absolute;z-index: 10}
    .rouge1{left:50%;margin-left:-680px; top:116px;}
    .rouge2{left:50%;margin-left:210px; top:124px;}
    .rouge3{left:50%;margin-left:286px; top:436px;}

    .vert1{left:50%;margin-left:-298px; top:154px;}
    .vert2{left:50%;margin-left:-462px; top:366px;}
    .vert3{left:50%;margin-left:-438px; top:634px;}
    .vert4{left:50%;margin-left:436px; top:50px;}
    .vert5{left:50%;margin-left:326px; top:290px;}
    .vert6{left:50%;margin-left:-680px; top:116px;}
    .vert6{left:50%;margin-left:473px; top:582px;}
    .vert7{left:50%;margin-left:262px; top:706px;}

    .bleu1{left:50%;margin-left:-440px; top:230px;}
    .bleu2{left:50%;margin-left:-340px; top:508px;}
    .bleu3{left:50%;margin-left:484px; top:220px;}

    .logocornichons{width: 453px;position: absolute; left: 50%;margin-left: -227px;top:225px;}

    .bgwhite{position: absolute;top: 0;left:0;width: 100%;height: 488px;background: #fff;}

    h2{
        font-size: 60px;
    }

    article.relancer{padding: 20px 0 100px;
        z-index: 20;
    }
    article.fiers{padding: 100px 0;}
    article.douze-etapes{padding: 100px 0 200px;}
    article.gammes{padding: 100px 0 0;}

    .page-template-home article.gammes{padding: 50px 0 0;}

    .text{max-width: 570px;}
    .subtitle {max-width: 555px;}

    .fiers .text{
        padding-bottom: 20px;
    }

    footer{/*max-width: 1140px;*/}

}




.skrollr-desktop .cornichons .cornich{
    -webkit-animation-name:infinitebouncedesktop;
       -moz-animation-name:infinitebouncedesktop;
        -ms-animation-name:infinitebouncedesktop;
         -o-animation-name:infinitebouncedesktop;
            animation-name:infinitebouncedesktop;
    /*animation-duration*/
    -webkit-animation-duration:20s;
       -moz-animation-duration:20s;
        -ms-animation-duration:20s;
         -o-animation-duration:20s;
            animation-duration:20s;
    /*animation-iteration-count*/
    -webkit-animation-iteration-count:infinite;
       -moz-animation-iteration-count:infinite;
        -ms-animation-iteration-count:infinite;
         -o-animation-iteration-count:infinite;
            animation-iteration-count:infinite;
}
@-webkit-keyframes infinitebouncedesktop {
  0%   { -webkit-transform: translate(0%,0) rotate(-20deg);}
  50%  { -webkit-transform: translate(40%,0) rotate(0deg);}
  100% { -webkit-transform: translate(0%,0) rotate(20deg);}
}
@-moz-keyframes infinitebouncedesktop {
  0%   { -moz-transform: translate(0%,0) rotate(-20deg);}
  50%  { -moz-transform: translate(40%,0) rotate(0deg);}
  100% { -moz-transform: translate(0%,0) rotate(20deg);}
}
@-o-keyframes infinitebouncedesktop {
  0%   { -o-transform: translate(0%,0) rotate(-20deg);}
  50%  { -o-transform: translate(40%,0) rotate(0deg);}
  100% { -o-transform: translate(0%,0) rotate(-20deg);}
}
@keyframes infinitebouncedesktop {
  0%   { transform: translate(0%,0) rotate(-20deg);}
  50%  { transform: translate(40%,0) rotate(0deg);}
  100% { transform: translate(0%,0) rotate(-20deg);}
}
@-webkit-keyframes infinitebouncedesktopinverse {
  0%   { -webkit-transform: translate(0%,0) rotate(-20deg);}
  50%  { -webkit-transform: translate(-40%,0) rotate(0deg);}
  100% { -webkit-transform: translate(0%,0) rotate(20deg);}
}
@-moz-keyframes infinitebouncedesktopinverse {
  0%   { -moz-transform: translate(0%,0) rotate(-20deg);}
  50%  { -moz-transform: translate(-40%,0) rotate(0deg);}
  100% { -moz-transform: translate(0%,0) rotate(20deg);}
}
@-o-keyframes infinitebouncedesktopinverse {
  0%   { -o-transform: translate(0%,0) rotate(-20deg);}
  50%  { -o-transform: translate(-40%,0) rotate(0deg);}
  100% { -o-transform: translate(0%,0) rotate(-20deg);}
}
@keyframes infinitebouncedesktopinverse {
  0%   { transform: translate(0%,0) rotate(-20deg);}
  50%  { transform: translate(-40%,0) rotate(0deg);}
  100% { transform: translate(0%,0) rotate(-20deg);}
}

.skrollr-desktop .cornichons .cornich.rouge2,
.skrollr-desktop .cornichons .cornich.vert2{
    -webkit-animation-duration:12s;
       -moz-animation-duration:12s;
        -ms-animation-duration:12s;
         -o-animation-duration:12s;
            animation-duration:12s;
    -webkit-animation-name:infinitebouncedesktopinverse;
       -moz-animation-name:infinitebouncedesktopinverse;
        -ms-animation-name:infinitebouncedesktopinverse;
         -o-animation-name:infinitebouncedesktopinverse;
            animation-name:infinitebouncedesktopinverse;
}
.skrollr-desktop .cornichons .cornich.vert4,
.skrollr-desktop .cornichons .cornich.vert6,
.skrollr-desktop .cornichons .cornich.bleu2{
    -webkit-animation-duration:16s;
       -moz-animation-duration:16s;
        -ms-animation-duration:16s;
         -o-animation-duration:16s;
            animation-duration:16s;
    -webkit-animation-name:infinitebouncedesktopinverse;
       -moz-animation-name:infinitebouncedesktopinverse;
        -ms-animation-name:infinitebouncedesktopinverse;
         -o-animation-name:infinitebouncedesktopinverse;
            animation-name:infinitebouncedesktopinverse;
}


.skrollr-desktop .cornichons .cornich.vert4,
.skrollr-desktop .cornichons .cornich.vert6,
.skrollr-desktop .cornichons .cornich.bleu2{
    -webkit-animation-duration:16s;
       -moz-animation-duration:16s;
        -ms-animation-duration:16s;
         -o-animation-duration:16s;
            animation-duration:16s;
    -webkit-animation-name:infinitebouncedesktopinverse;
       -moz-animation-name:infinitebouncedesktopinverse;
        -ms-animation-name:infinitebouncedesktopinverse;
         -o-animation-name:infinitebouncedesktopinverse;
            animation-name:infinitebouncedesktopinverse;
}

.mobile .cornichons .cornich{
    /*
    -webkit-animation-name:infinitebounce;
       -moz-animation-name:infinitebounce;
        -ms-animation-name:infinitebounce;
         -o-animation-name:infinitebounce;
            animation-name:infinitebounce;
            */
    -webkit-animation-name:infinitebouncedesktop;
       -moz-animation-name:infinitebouncedesktop;
        -ms-animation-name:infinitebouncedesktop;
         -o-animation-name:infinitebouncedesktop;
            animation-name:infinitebouncedesktop;

    /*animation-duration*/
    /*
    -webkit-animation-duration:1s;
       -moz-animation-duration:1s;
        -ms-animation-duration:1s;
         -o-animation-duration:1s;
            animation-duration:1s;*/
    -webkit-animation-duration:12s;
       -moz-animation-duration:12s;
        -ms-animation-duration:12s;
         -o-animation-duration:12s;
            animation-duration:12s;
    /*animation-iteration-count*/
    -webkit-animation-iteration-count:infinite;
       -moz-animation-iteration-count:infinite;
        -ms-animation-iteration-count:infinite;
         -o-animation-iteration-count:infinite;
            animation-iteration-count:infinite;
}
@-webkit-keyframes infinitebounce {
  0%   { -webkit-transform: scale(0.9);}
  50%  { -webkit-transform: scale(1);}
  100% { -webkit-transform: scale(0.9);}
}
@-moz-keyframes infinitebounce {
  0%   { -moz-transform: scale(0.9);}
  50%  { -moz-transform: scale(1);}
  100% { -moz-transform: scale(0.9);}
}
@-o-keyframes infinitebounce {
  0%   { -o-transform:scale(0.9);}
  50%  { -o-transform: scale(1);}
  100% { -o-transform: scale(0.9);}
}
@keyframes infinitebounce {
  0%   { transform: scale(0.9);}
  50%  { transform: scale(1);}
  100% { transform: scale(0.9);}
}



.mobile .cornichons .cornich.vert4,
.mobile .cornichons .cornich.vert6,
.mobile .cornichons .cornich.bleu2{
    -webkit-animation-duration:16s;
       -moz-animation-duration:16s;
        -ms-animation-duration:16s;
         -o-animation-duration:16s;
            animation-duration:16s;
    -webkit-animation-name:infinitebouncedesktopinverse;
       -moz-animation-name:infinitebouncedesktopinverse;
        -ms-animation-name:infinitebouncedesktopinverse;
         -o-animation-name:infinitebouncedesktopinverse;
            animation-name:infinitebouncedesktopinverse;
}





.clearfix:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0;
}

/* 2017 */
.agriculteurs .imageleft .infos{
}
.agriculteurs .imageleft .image{
    text-align: left;
}
.agriculteurs .imageleft .image img{
    position: relative;
    left: 0px;
}
.agriculteurs .imageright .infos{
}
.agriculteurs .imageright .image{
    text-align: right;
}
.agriculteurs .imageright .image img{
    position: relative;
}
.agriculteurs .personne{
    position: relative;
    background: #fff;
    max-width: 940px;
    padding: 20px 20px 0;
    margin: 40px 0;
    z-index: 20;
}
.agriculteurs .personne:last-child{
    margin-bottom: 0;
}
.agriculteurs .imageleft{
    background: #fff url(img/elements/pathleftm.png) right bottom no-repeat;
}
.agriculteurs .imageright{
    background: #fff url(img/elements/pathrightm.png) left bottom no-repeat;
}
.agriculteurs .imageleft .pousse3{
    position: absolute;
    right: 0;
    top:10px;
    width: 138px;
}
.agriculteurs .imageright .pousse2{
    position: absolute;
    left: 54%;
    bottom:-42px;
    width: 160px;
    z-index: 10;
}
.agriculteurs .poussesc{
    position: absolute;
    width: 100%;height: 100%;
    top: 0;left:0;
    overflow: hidden;
    display: none;
}
.agriculteurs .personne.imageleft .contourt {
    position: absolute;
    top: -17px;right:6px;
    width: 100%;max-width: 849px;height: 485px;
    background: url(img/elements/personne-contour-leftt.png) center top no-repeat;
}
.agriculteurs .personne.imageleft .contourb {
    position: absolute;
    bottom:-6px;left:6px;
    width: 100%;max-width: 937px;height: 496px;
    background: url(img/elements/personne-contour-leftb.png) center top no-repeat;
}
.agriculteurs .personne.imageright .contourt {
    position: absolute;
    top: -10px;right:0;
    width: 100%;max-width:913px;height: 482px;
    background: url(img/elements/personne-contour-rightt.png) center top no-repeat;
}
.agriculteurs .personne.imageright .contourb {
    position: absolute;
    bottom:-10px;left:0;
    width: 100%;max-width: 937px;height: 497px;
    background: url(img/elements/personne-contour-rightb.png) center top no-repeat;
}
.agriculteurs .personne.imageleft .marker {
    position: absolute;
    width: 45px;
    bottom: 181px;right: 39px;left:auto;top:auto;margin-right: 0;
}
.agriculteurs .personne.imageright .marker {
    position: absolute;
    width: 45px;
    bottom: 179px;left: 20px;right:auto;top:auto;margin-left: 0;
}
.marker .m{
    display: block;
    width: 45px;
    position: relative;left: 4px;
    -ms-transform: rotate(10deg);
    -webkit-transform: rotate(10deg);
    transform: rotate(10deg);
}
.marker .c{
    display: block;
    width: 44px;
}


.where-find-products{
    background: #f1910b;
    padding: 50px 0;
    color: #fff;
    text-align: center;
}
.where-find-products .block{
    max-width: 780px;
    margin: 0 auto;
}
.where-find-products .image{
    width: 50%;
    float: left;
    display: inline-block;
    text-align: center;
    height: 80px;line-height: 80px;
}
.where-find-products .titre{
    font-size: 24px;
    margin-bottom: 20px;
}
.where-find-products .sous-titre{
    font-size: 16px;
    margin-bottom: 15px;
    padding: 0 20px;
}
.where-find-products .sous-titre-boutique{
    font-size: 16px;
    margin-top: 30px;
}
.where-find-products .btn-store{
    display: inline-block;
    background-color: #fff;
    color: #f1910b;
    padding: 6px 10px;
    margin: 10px 0 0;
    text-decoration: none;
    min-width: 220px;
    text-align: center;
}
.where-find-products .btn-store:hover{
    background-color: #1d1e1c;
}



header{
    position: relative;
    max-width: 840px;
    margin: 0 auto;
    padding: 20px 0 20px;
    height: 64px;
}

.site-header{
    position: absolute;
    z-index: 20;
    display: inline-block;
}
.site-header a{
    position: relative;
    display: inline-block;
    -ms-transform: rotate(-10deg);
    -webkit-transform: rotate(-10deg);
    transform: rotate(-10deg);
}
.site-header a img{
    position: relative;
    left: 6px;
}
.site-header a:before{
    display: block;
    position: absolute;
    top: 20px;left: -20px;
    content: "";
    width: 11px;height: 22px;
    background: url(img/elements/arrow-left-logo.svg) no-repeat;
    background-size: 11px;
    -ms-transform: rotate(10deg);
    -webkit-transform: rotate(10deg);
    transform: rotate(10deg);
}
.site-header a:after{
    display: block;
    position: absolute;
    bottom: -12px;left: -27px;
    content: "";
    width: 223px;height: 136px;
    background: url(img/elements/bg-logo.png) no-repeat;
    z-index: -1;
}
.menu-top-container{
    display: inline-block;
    padding-left: 192px;
    display: none;
}
.menu-top-container ul{
    margin: 0;
    padding: 0;
    list-style: none;
}
.menu-top-container ul li{
    display: block;
}
.menu-top-container ul li a {
    display: block;
    font-family: 'BrandonGrotesqueWeb-Bold';
    font-weight: bold;
    font-size:16px;
    text-transform: uppercase;
    text-decoration: none !important;
    padding: 20px 46px 20px 0px;
    vertical-align: middle;
    border-top: 1px solid #dbdbdb;
}
.menu-top-container ul li:first-child a {
    border-top: none;
}
.menu-top-container ul li a span{
    display: inline-block;
    vertical-align: middle;
    line-height: 17px;
}
.menu-top-container ul li a span.formobile{
    display: none;
}
.menu-top-container ul li a:hover,
.menu-top-container ul li.current-menu-item a{
    color: #1d1e1c;
}
.relative{
    position: relative;
}

.bg-white{
    background: #fff;
}
.bggrey{
    background:#d5e0c2;
}

.kitc{
    position: relative;
    overflow: hidden;
    padding: 0px 0 40px;
}
.kitc .corner{
    position: absolute;
    right: 0;top:-40px;
    width: 189px;height: 91px;
    background: url(img/cornichons-maisons/kit.svg) no-repeat center center;
    background-size: 189px;
}
.kitc .pictos{
    height: 600px;
}
.kit{
    position: relative;
    max-width: 780px;
    margin: 0 auto;
    z-index: 20;
    text-align: center;
    min-height: 740px;
    padding-top: 40px;
}
.kit.ouvert .intro.ouvert,
.kit.ferme .intro.ouvert{
    display: block;
}
.kit.ouvert .intro.clos,
.kit.ferme .intro.clos{
    display: none;
}
.kit.clos .intro.ouvert{
    display: none;
}
.kit.clos .intro.clos{
    display: block;
}

.kit .intro{
    font-family: 'Decour-Black';
    font-size: 16px;
    margin: 0 0 30px 0;
}
.kit .plante{ 
    display: none;
    width: 350px;
    -webkit-transform-origin : 50% 100%;
    -moz-transform-origin : 50% 100%;
    -o-transform-origin : 50% 100%;
    -ms-transform-origin : 50% 100%;
    transform-origin : 50% 100%;
}
.kit .sachet{width: 104px;position: absolute; top: 150px;left: 45px}
.kit .bocal{ width: 60px;position: absolute; top: 372px;left: 35px}
.kit .etiquette{width: 83px;position: absolute; top: 590px;left: 35px}
.kit .notice{ width: 93px;position: absolute; top: 252px;right: 77px;}
.kit .ardoise{width: 57px;position: absolute; top: 510px;right: 100px}
.kit .title{font-size: 24px;color:#00523d;}
.kit .pictos .texte{font-size: 16px;font-weight:bold;margin:0 0 20px 0; white-space: nowrap;}

.kit img{
    margin: 0 0 5px;
}
.kit .offer{
    position: relative;
    background: #f1910b;
    color: #fff;
    font-size: 16px;
    text-align: center;
    text-decoration: none;
    padding: 12px 34px;
    z-index: 20;
    top: 12px;
    border-left: 4px solid #fff;
    border-right: 4px solid #fff;
}
.kit .offer .ouvert{
    display: inline-block;
}
.kit .offer .ferme{
    display: none;
}
.kit.ferme .offer{
    cursor: default;
}
.kit.ferme .offer .ferme{
    display: inline-block;
}
.kit.ferme .offer .ouvert{
    display: none;
}
.kit.ouvert .offer:hover{
    background: #1d1e1c;
}

.kit .clos-bottom{
    position: relative;
    color: #f1910b;
    background:#fff;
    font-size: 24px;
    text-align: center;
    font-family: 'Decour-Semibold';
    text-decoration: none;
    padding: 12px 34px;
    z-index: 20;
    top: 28px;
}
.kit .clos-bottom{display: none;}
.kit.clos .clos-bottom{display: inline-block;}
.kit.clos .offer{display: none;}


.filiere{
    padding: 60px 0;
}
.filiere .cornich.vert6{
    display: none;
}
.skrollr-desktop .filiere .cornich.vert6{
    display: block;
    top: -20px;
    left: 50%;
    margin-left: 440px;
    -webkit-animation-duration:16s;
       -moz-animation-duration:16s;
        -ms-animation-duration:16s;
         -o-animation-duration:16s;
            animation-duration:16s;
    -webkit-animation-name:infinitebouncedesktopinverse;
       -moz-animation-name:infinitebouncedesktopinverse;
        -ms-animation-name:infinitebouncedesktopinverse;
         -o-animation-name:infinitebouncedesktopinverse;
            animation-name:infinitebouncedesktopinverse;
    -webkit-animation-iteration-count:infinite;
       -moz-animation-iteration-count:infinite;
        -ms-animation-iteration-count:infinite;
         -o-animation-iteration-count:infinite;
            animation-iteration-count:infinite;
}
.filiere .cornich.vert2{
    display: none;
}
.skrollr-desktop .filiere .cornich.vert2{
    display: block;
    top: auto;bottom: 40px;
    left: 50%;
    margin-left: -600px;
    -webkit-animation-duration:12s;
       -moz-animation-duration:12s;
        -ms-animation-duration:12s;
         -o-animation-duration:12s;
            animation-duration:12s;
    -webkit-animation-name:infinitebouncedesktop;
       -moz-animation-name:infinitebouncedesktop;
        -ms-animation-name:infinitebouncedesktop;
         -o-animation-name:infinitebouncedesktop;
            animation-name:infinitebouncedesktop;
    -webkit-animation-iteration-count:infinite;
       -moz-animation-iteration-count:infinite;
        -ms-animation-iteration-count:infinite;
         -o-animation-iteration-count:infinite;
            animation-iteration-count:infinite;
}


.metiers .cornich.vert2,
.metiers .cornich.vert12,
.metiers .cornich.vert6{
    display: none;
}
.skrollr-desktop .metiers .cornich.vert2{
    display: block;
    top: -20px;
    left: 50%;
    margin-left: 480px;
    -ms-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    -webkit-animation-duration:20s;
       -moz-animation-duration:20s;
        -ms-animation-duration:20s;
         -o-animation-duration:20s;
            animation-duration:20s;
    -webkit-animation-name:infinitebouncedesktop;
       -moz-animation-name:infinitebouncedesktop;
        -ms-animation-name:infinitebouncedesktop;
         -o-animation-name:infinitebouncedesktop;
            animation-name:infinitebouncedesktop;
    -webkit-animation-iteration-count:infinite;
       -moz-animation-iteration-count:infinite;
        -ms-animation-iteration-count:infinite;
         -o-animation-iteration-count:infinite;
            animation-iteration-count:infinite;
}
.skrollr-desktop .metiers .cornich.vert12{
    display: block;
    bottom: 30%;
    left: 50%;
    margin-left: 500px;
    -webkit-animation-duration:12s;
       -moz-animation-duration:12s;
        -ms-animation-duration:12s;
         -o-animation-duration:12s;
            animation-duration:12s;
    -webkit-animation-name:infinitebouncedesktopinverse;
       -moz-animation-name:infinitebouncedesktopinverse;
        -ms-animation-name:infinitebouncedesktopinverse;
         -o-animation-name:infinitebouncedesktopinverse;
            animation-name:infinitebouncedesktopinverse;
    -webkit-animation-iteration-count:infinite;
       -moz-animation-iteration-count:infinite;
        -ms-animation-iteration-count:infinite;
         -o-animation-iteration-count:infinite;
            animation-iteration-count:infinite;
}
.skrollr-desktop .metiers .cornich.vert6{
    display: block;
    bottom: 40%;top: auto;
    left: 50%;
    margin-left: -560px;
    -webkit-animation-duration:18s;
       -moz-animation-duration:18s;
        -ms-animation-duration:18s;
         -o-animation-duration:18s;
            animation-duration:18s;
    -webkit-animation-name:infinitebouncedesktop;
       -moz-animation-name:infinitebouncedesktop;
        -ms-animation-name:infinitebouncedesktop;
         -o-animation-name:infinitebouncedesktop;
            animation-name:infinitebouncedesktop;
    -webkit-animation-iteration-count:infinite;
       -moz-animation-iteration-count:infinite;
        -ms-animation-iteration-count:infinite;
         -o-animation-iteration-count:infinite;
            animation-iteration-count:infinite;
}

.top-cornicons-maison{
    position: relative;
}
.top-cornicons-maison .cornich.vert2,
.top-cornicons-maison .cornich.vert12,
.top-cornicons-maison .cornich.vert6{
    display: none;
}

.skrollr-desktop .top-cornicons-maison .cornich.vert12{
    display: block;
    top: 10%;
    left: 50%;
    margin-left: 480px;
    -ms-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    -webkit-animation-duration:20s;
       -moz-animation-duration:20s;
        -ms-animation-duration:20s;
         -o-animation-duration:20s;
            animation-duration:20s;
    -webkit-animation-name:infinitebouncedesktop;
       -moz-animation-name:infinitebouncedesktop;
        -ms-animation-name:infinitebouncedesktop;
         -o-animation-name:infinitebouncedesktop;
            animation-name:infinitebouncedesktop;
    -webkit-animation-iteration-count:infinite;
       -moz-animation-iteration-count:infinite;
        -ms-animation-iteration-count:infinite;
         -o-animation-iteration-count:infinite;
            animation-iteration-count:infinite;
}
.skrollr-desktop .top-cornicons-maison .cornich.vert2{
    display: block;
    bottom: -5%;top: auto;
    left: 50%;
    margin-left: 300px;
    -webkit-animation-duration:12s;
       -moz-animation-duration:12s;
        -ms-animation-duration:12s;
         -o-animation-duration:12s;
            animation-duration:12s;
    -webkit-animation-name:infinitebouncedesktopinverse;
       -moz-animation-name:infinitebouncedesktopinverse;
        -ms-animation-name:infinitebouncedesktopinverse;
         -o-animation-name:infinitebouncedesktopinverse;
            animation-name:infinitebouncedesktopinverse;
    -webkit-animation-iteration-count:infinite;
       -moz-animation-iteration-count:infinite;
        -ms-animation-iteration-count:infinite;
         -o-animation-iteration-count:infinite;
            animation-iteration-count:infinite;
}
.skrollr-desktop .top-cornicons-maison .cornich.vert6{
    display: block;
    top: 62%;
    left: 50%;
    margin-left: -560px;
    -webkit-animation-duration:18s;
       -moz-animation-duration:18s;
        -ms-animation-duration:18s;
         -o-animation-duration:18s;
            animation-duration:18s;
    -webkit-animation-name:infinitebouncedesktop;
       -moz-animation-name:infinitebouncedesktop;
        -ms-animation-name:infinitebouncedesktop;
         -o-animation-name:infinitebouncedesktop;
            animation-name:infinitebouncedesktop;
    -webkit-animation-iteration-count:infinite;
       -moz-animation-iteration-count:infinite;
        -ms-animation-iteration-count:infinite;
         -o-animation-iteration-count:infinite;
            animation-iteration-count:infinite;
}


.galerie{
    position: relative;
}
.galerie .cornich.vert2,
.galerie .cornich.vert12,
.galerie .cornich.vert6{
    display: none;
}

.skrollr-desktop .galerie .cornich.vert12{
    display: block;
    top: -20px;
    left: 50%;
    margin-left: 300px;
    -ms-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    -webkit-animation-duration:20s;
       -moz-animation-duration:20s;
        -ms-animation-duration:20s;
         -o-animation-duration:20s;
            animation-duration:20s;
    -webkit-animation-name:infinitebouncedesktop;
       -moz-animation-name:infinitebouncedesktop;
        -ms-animation-name:infinitebouncedesktop;
         -o-animation-name:infinitebouncedesktop;
            animation-name:infinitebouncedesktop;
    -webkit-animation-iteration-count:infinite;
       -moz-animation-iteration-count:infinite;
        -ms-animation-iteration-count:infinite;
         -o-animation-iteration-count:infinite;
            animation-iteration-count:infinite;
}
.skrollr-desktop .galerie .cornich.vert2{
    display: block;
    bottom: 40px;top: auto;
    left: 50%;
    margin-left: 420px;
    -webkit-animation-duration:12s;
       -moz-animation-duration:12s;
        -ms-animation-duration:12s;
         -o-animation-duration:12s;
            animation-duration:12s;
    -webkit-animation-name:infinitebouncedesktopinverse;
       -moz-animation-name:infinitebouncedesktopinverse;
        -ms-animation-name:infinitebouncedesktopinverse;
         -o-animation-name:infinitebouncedesktopinverse;
            animation-name:infinitebouncedesktopinverse;
    -webkit-ani/mation-iteration-count:infinite;
       -moz-animation-iteration-count:infinite;
        -ms-animation-iteration-count:infinite;
         -o-animation-iteration-count:infinite;
            animation-iteration-count:infinite;
}
.skrollr-desktop .galerie .cornich.vert6{
    display: block;
    top: 130px;
    left: 50%;
    margin-left: -560px;
    -webkit-animation-duration:18s;
       -moz-animation-duration:18s;
        -ms-animation-duration:18s;
         -o-animation-duration:18s;
            animation-duration:18s;
    -webkit-animation-name:infinitebouncedesktop;
       -moz-animation-name:infinitebouncedesktop;
        -ms-animation-name:infinitebouncedesktop;
         -o-animation-name:infinitebouncedesktop;
            animation-name:infinitebouncedesktop;
    -webkit-animation-iteration-count:infinite;
       -moz-animation-iteration-count:infinite;
        -ms-animation-iteration-count:infinite;
         -o-animation-iteration-count:infinite;
            animation-iteration-count:infinite;
}



article.metiers{
    padding: 30px 0 0;
}
.metiers .text.intro{
    color:#18563e;
    text-transform:uppercase;
    font-size: 20px;
    font-family: "BrandonGrotesqueWeb-Black"; 
    max-width: 840px;
    text-align: center;
}
.persons{
    max-width: 900px;
    margin: 0 auto;
}
.persons .item{
    float: none;
    padding: 0 20px 40px;   
    width: 100%;
    max-width: 300px;
    margin: 0 auto;
}
.persons .item .photo{
    position: relative;
    background: #fff;
    height: 316px;
    overflow: hidden;
}
.persons .item .photo span{
    position: absolute;
    top: 0;left:0;
    color:#f39307;
    text-transform: uppercase;
    font-size: 20px;
    padding-top: 34px;
    padding-left: 18px;
    font-family: 'BrandonGrotesqueWeb-Bold';
}
.persons .item .photo img.p{
    position: absolute;
    bottom: -20px;
    right: 0;
    height: 238px;
    width: auto;
}
.persons .item .photo .plante{
    position: absolute;
    top: 78px;left: -30px;
}
.persons .item1 .photo .plante{
    top: 140px;
}
.persons .item2 .photo .plante{
    top: 68px;
}
.persons .item1 .frame{
    -ms-transform: rotate(-1deg);
    -webkit-transform: rotate(-1deg);
    transform: rotate(-1deg);
}
.persons .item2 .frame{
    background-position: 20px 5px;
}
.persons .item3 .frame{
    -ms-transform: rotate(1deg);
    -webkit-transform: rotate(1deg);
    transform: rotate(1deg);
}
.persons .item .details{
    text-align: right;
}
.persons .item .details a{
    position: relative;
    display: inline-block;
    padding: 0px 10px 0px 4px;
    /*background:url(img/elements/btn-savoirplus.svg) no-repeat left center;*/
    text-decoration: none !important;
    background-size: 109px;
}
.persons .item .details a div.frame{
    position: absolute;
    top: -4px;left:0;
    width:109px;height:34px;
    background:url(img/elements/btn-savoirplus.svg) no-repeat left center;
}
.persons .item .details a span{
    display: inline-block;
    padding: 3px 19px 3px 8px;
    font-family: 'Decour-Black';
}

.persons .item .details a:hover span{
    background: #fff;
}
.persons .item .details a .plus{
    position: absolute;
    right: 2px;top:5px;
    width: 18px;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    transition: all 0.4s ease;
}
.persons .item .details a:hover .plus{
    position: absolute;
    right: 2px;top:5px;
    width: 18px;
    -ms-transform: rotate(4deg) scale(1.1);
    -webkit-transform: rotate(4deg) scale(1.1);
    transform: rotate(4deg) scale(1.1);
}
.persons .text{
    font-size: 16px;
    padding: 0;
    font-family: 'Decour-Semibold';
}
.persons .text strong{
    font-weight: normal;
    font-family: 'Decour-Black';
}

.metier-person{
    max-width:900px;
    margin:0 auto;
    padding: 128px 20px 100px;
}
.metier-person .photo{
    position: relative;
    text-align: center;
    background: #fff;
    width: 326px;height: 400px;
    margin: 0 auto;
    /*overflow: hidden;*/
}
.metier-person .photo .plantec{
    position: absolute;
    width: 100%;height: 100%;
    overflow: hidden;
}
.metier-person  .photo .plante{
    position: absolute;
    top: 78px;left: -40px;
}
.metier-person .photo img.p{
    position: absolute;
    bottom: 0;right: 0;
}
.metier-person .photo .tag{
    position: absolute;
    bottom: -76px;left: -13px;
    display: inline-block;
    width: 360px;
    height: 164px;
    background: url(img/elements/metier-tag.png) no-repeat center center;
    font-size: 20px;
    color: #fff;
    font-family: 'Decour-Semibold';
}
.metier-person .photo .tag span{
    position: absolute;
    right: 34px;
    top: 82px;
    -ms-transform: rotate(19deg);
    -webkit-transform: rotate(19deg);
    transform: rotate(19deg);
}

.metier-person .photo .frame{
    position: absolute;
    width: 324px;height: 402px;
    top: -2px;left:0;
    background: url(img/elements/metier-photo-cadre.png) no-repeat center center;
}
.persons .item{position: relative;}
.persons .photo{
    position: relative;
}
.persons .frame{
    position: absolute;
    width: 324px;height: 402px;
    top: -2px;left:0;
    background: url(img/elements/metier-photo-cadre.png) no-repeat 20px 0px;
    background-size: 260px;
}



.single-metiers h1{
    display: block;
    font-size: 28px;
    color: #18563e;
    font-family: 'Decour-Semibold';
    text-align: left;
    text-align-last:left;
    margin: 0 0 10px;
}
.single-metiers h2{
    display: block;
    font-size: 16px;line-height:1.2;
    color: #18563e;
    font-family: 'BrandonGrotesqueWeb-Bold';
    text-transform: uppercase;
    text-align: left;
    text-align-last:left;
    margin: 0 0 20px 0;
}

.yellow{
    color: #f1910b;
}
.green{
    color: #00523d;
}
.green2{
    color: #e4eac1;
}
.red{
    color: #d71713;
}

.galerie{
    padding: 70px 0 70px;
}
.galerie p{
    margin: 0;
}
.galerie .title{
    text-align: center;
    color: #1d1e1c;
    font-size: 24px;
    padding-bottom: 40px;
}
.galerie .items{
    max-width: 100%;
    margin: 0 20px;
}
.galerie .item{
    float: left;
    width: 50%;height: 210px;
    border-right: 1px solid #F8F3EF;
    border-bottom: 1px solid #F8F3EF;
}

blockquote{
    display: inline-block;
    position: relative;
    font-family: 'Decour-SemiboldItalic';
    font-size: 20px;
    padding: 0;
    margin-left: 0;
    margin-right: 0;
    text-align: left;
}
blockquote:before{
    content: "\00ab";
    position: absolute;
    left: -28px;top: -4px;
    color: #18563e;
    font-size: 47px;
}
blockquote p:after{
    content: "\00bb";
    position: absolute;
    right: -25px;bottom:10px;
    color: #18563e;
    font-size: 47px;
}
.actualites{
    padding:40px 0 0;
}
.actualites h2{
    text-align: center;
    color: #fff;
    font-size: 24px;
    font-family: 'Decour-Semibold';
    margin:0;
    padding: 0 0 10px 0;
    background:url(img/elements/traitnew.png) no-repeat center bottom;
    background-size: 190px;
}
.news-all{
    position: relative;
    width: 100%;
   /* left:50%;margin-left: -632px;*/
    margin-top: 40px;
    padding:0 0 40px; 
}
.news-all .bg-wait{
    position: absolute;
    top: 0;left: 0;
    width: 100%;height: 100%;
    background:rgba(0,0,0,0.62);
    line-height: 195px;
    color: #fff;
    text-align: center;
    font-family: 'Decour-Semibold'; /* @CW black */
    font-size: 20px;
}
.news-all .videos{
    max-width: 780px;
    margin:0 auto;
}
.news-all .videos .item{
    display: inline-block;
    margin: 0 20px 30px;
    cursor: default;
}
.news-all .videos .item .play{
    display:none;
}
.news-all .videos .item .bg-wait{
    display:block;
}
.news-all .videos .item.publish{
    cursor: pointer;
}
.news-all .videos .item.publish .play{
    display: block;
}
.news-all .videos .item.publish .bg-wait{
    display:none;
}
.news-all .videos .item .text{
    text-align: center;
    color: #fff;
    padding-bottom: 20px;
    font-size: 16px;
    text-transform: uppercase;
    font-family: 'BrandonGrotesqueWeb-Bold'; /* @CW black */
}
.news-all .videos .item .text span{
    display: inline-block;
    vertical-align: middle;
    line-height: 1.2;
}
.news-all .videos .item .image{
    display: inline-block;
    position: relative;
    -moz-box-shadow:  0px 0px 0px 8px #fff;
    -webkit-box-shadow:  0px 0px 0px 8px #fff;
    -o-box-shadow:  0px 0px 0px 8px #fff;
    box-shadow:  0px 0px 0px 8px #fff;
}
.news-all .videos .item .image img{
    width: 332px;
}
.news-all .videos .item .image .play{
    position: absolute;
    width: 52px;height: 52px;
    left: 50%;margin-left: -26px;
    top:50%;margin-top: -26px;
    background: url(img/elements/play.svg);
    background-size: 52px;
}
.news-path{
    position: absolute;
    width: 538px;height: 1230px;
    top: 0px;left: 50%;margin-left: -200px;
    background: url(img/elements/news-path-mobile.png) no-repeat center 0px;
}
.episode1{position: absolute;top:24px;left: 50%;margin-left:-567px;color: #fff;font-family: 'DaftBrush';font-size: 30px}
.episode2{position: absolute;top:157px;left: 50%;margin-left:424px;color: #fff;font-family: 'DaftBrush';font-size: 30px}
.episode3{position: absolute;top:445px;left: 50%;margin-left:-536px;color: #fff;font-family: 'DaftBrush';font-size: 30px}
.episode4{position: absolute;top:494px;left: 50%;margin-left:430px;color: #fff;font-family: 'DaftBrush';font-size: 30px}

.produits{
    background:#f4f4f4;
    padding: 80px 0 30px;
}
.videos-produits{
    text-align: center;
    padding: 70px 0 0;
}
.videos-produits .vid{
    display: inline-block;
}
.videos-produits .vid a{
    display: inline-block;
    margin: 0 20px 30px;
    cursor: pointer;
    font-family: 'BrandonGrotesqueWeb-Black';
    font-size: 20px;
    text-decoration: none;
}
.videos-produits .vid .item .image{
    display: inline-block;
    position: relative;
    -moz-box-shadow:  0px 0px 0px 8px #17573f;
    -webkit-box-shadow:  0px 0px 0px 8px #17573f;
    -o-box-shadow:  0px 0px 0px 8px #17573f;
    box-shadow:  0px 0px 0px 8px #17573f;
    margin: 0 0 27px 0;
}
.videos-produits .vid .item .text{
    text-align: center;
}
.videos-produits .vid .item .image img{
    width: 293px;
}
.videos-produits .vid .item .image .play{
    position: absolute;
    width: 52px;height: 52px;
    left: 50%;margin-left: -26px;
    top:50%;margin-top: -26px;
    background: url(img/elements/play.svg);
    background-size: 52px;
}


.popin-bg{
    background: rgba(255,255,255,0.85);
    position: fixed;
    top: 0;left: 0;
    width: 100%;height: 100%;
    z-index: 780;
}
.popinc{
    position:fixed;
    z-index:800;
    top:0;left:0;
    width:90%;height:auto;
    margin-left: 5%;
    top:50%;
    border:10px solid #fff; 
    -webkit-transform: translate(0,-50%);  
    -moz-transform:    translate(0,-50%);  
    -ms-transform:     translate(0,-50%);  
    -o-transform:      translate(0,-50%);  
    transform:         translate(0,-50%); 
}

.popin-i{
    position: relative;
    background: #188c6c;
    text-align: center;
    color: #fff;
    font-size: 24px;
    width: 100%;max-width: 457px;
    min-height: 263px;
    margin: 0 auto;
    padding: 10px 10px;
}
.popin-i.orange{
    background: #f1900b;
    text-align: center;
}

.popin-i .title-popin{
    font-size: 36px;
    font-family: 'DaftBrush';
    margin: 10px 0 32px;
    padding: 0 0 12px 0;
    background: url(img/new/trait-white.svg) no-repeat center bottom;
    background-size: 139px;
}

.popin-i .border-frame{
    display: none;
    position: absolute;
    top: -13px;left: -17px;
    width: 465px;height: 264px;
    background: url(img/new/popin-border.png) no-repeat 0 0;
}

.popin-i .close{
    position: absolute;
    top: 17px; right: 34px;
    font-size: 32px;
    font-family: 'DaftBrush';
    color: #fff;
    z-index: 4;
    text-decoration: none;
}

.popin-i .small{
    font-size: 16px;line-height: 16px;
    padding: 20px 0 0;
}

.popin-bg,
.popinc{
    display: none;
}

.video-bg{
    background: rgba(0,0,0,0.5);
    position: fixed;
    top: 0;left: 0;
    width: 100%;height: 100%;
    z-index: 780;
}
.videoc{
    position:fixed;
    z-index:800;
    top:0;left:0;
    width:90%;height:auto;
    margin-left: 5%;
    top:50%;
    border:10px solid #fff; 
    -webkit-transform: translate(0,-50%);  
    -moz-transform:    translate(0,-50%);  
    -ms-transform:     translate(0,-50%);  
    -o-transform:      translate(0,-50%);  
    transform:         translate(0,-50%); 
}
.videoc iframe{
    width: 100%;
}
.videoc .video-controls{
    position: absolute;
    top: 50%;left: 50%;margin-top: -25px;margin-left: -25px;
    z-index: 50;
    opacity: 0;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    transition: all 0.5s ease;
}
.videoc:hover .video-controls{
    opacity: 1;
}
.videoc .video-controls a img{
    width:50px;
}
.videoc .video-controls a{
    display: none;
}

.video-bg,
.videoc{
    display: none;
}


.relancer .contourtext{
    position: relative;
    padding: 50px 0 50px;
}
.relancer .contourt{
    position: absolute;
    width: 671px;height: 504px;
    top: 10px;left: 50%;margin-left: -336px;
    background: url(img/elements/contour-homet.png) no-repeat 0 0;
    z-index: -1;
}
.relancer .contourb{
    position: absolute;
    width: 644px;height: 496px;
    bottom: 0px;left: 50%;margin-left: -336px;
    background: url(img/elements/contour-homeb.png) no-repeat 0 bottom;
    z-index: -1;
}
.relancer .plantec{
    position: relative;
    width: 100%;
    max-width:671px;
    margin: 0 auto;
}
.relancer .planteright{
    position: absolute;
    right: 0;top:-55px;
    width: 90px;
}


.menumobilecontainer .open{display: block;}
.menumobilecontainer{display: block;}
a.mobile-hamb{position: absolute;right:0px;top:0px;width: 80px;height: 60px;background: #fff;z-index: 50}
a.mobile-hamb > span{left:50%;margin-left:-13px;width: 26px;height:4px;background: #1d1e1c;display: block;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    transition: all 0.4s ease;
    -webkit-transform-origin: center center;
        -ms-transform-origin: center center;
            transform-origin: center center;
}
a.mobile-hamb .trait1{position:absolute;top:19px;}
a.mobile-hamb .trait2{position:absolute;top:28px;}
a.mobile-hamb .trait3{position:absolute;top:37px;}


.showmenumobile .menumobilecontainer .trait1{
    -webkit-transform: rotate(45deg) translate(2px,1px);
    transform: rotate(45deg) translate(2px,1px);
}
.showmenumobile .menumobilecontainer .trait2{
    -webkit-transform: rotate(-45deg) translate(5px, -5px);
    transform: rotate(-45deg) translate(5px, -5px);
}


.showmenumobile .menu-top-container{
    display: block;
    position: absolute;
    right: 0;
    z-index: 20;
    top: 61px;
}
.showmenumobile .menu-top-container ul{
    background: #fff;
    padding-bottom: 50px;
}
.showmenumobile .menu-top-container ul li{
    padding: 0 20px 0 40px;
}

.menu-top-container ul li a svg{
    display: none;
}

.metier-person blockquote br{display: none;}

.picto-number{
    position: absolute;
    left: 0;top:0;
}

.picto-number.number-1{
    position: absolute;
    left: -58px;
    top: -20px;
    -webkit-transform: scale(0.6);  
    -moz-transform:    scale(0.6);  
    -ms-transform:     scale(0.6); 
    -o-transform:      scale(0.6);  
    transform:         scale(0.6);
}
.picto-number.number-2{
    position: absolute;
    left: -57px;
    top: -20px;
    z-index: 0;
    -webkit-transform: scale(0.6);  
    -moz-transform:    scale(0.6);  
    -ms-transform:     scale(0.6); 
    -o-transform:      scale(0.6);  
    transform:         scale(0.6);
}
.picto-number.number-3{
    position: absolute;
    left: -57px;
    top: -20px;
    -webkit-transform: scale(0.6);  
    -moz-transform:    scale(0.6);  
    -ms-transform:     scale(0.6); 
    -o-transform:      scale(0.6);  
    transform:         scale(0.6);
}


@media screen and (min-width: 768px) {
    .picto-number.number-1{
        position: absolute;
        left: -58px;
        top: -20px;
        -webkit-transform: scale(1);  
        -moz-transform:    scale(1);  
        -ms-transform:     scale(1); 
        -o-transform:      scale(1);  
        transform:         scale(1);
    }
    .picto-number.number-2{
        position: absolute;
        left: -57px;
        top: -20px;
        z-index: 0;
        -webkit-transform: scale(1);  
        -moz-transform:    scale(1);  
        -ms-transform:     scale(1); 
        -o-transform:      scale(1);  
        transform:         scale(1);
    }
    .picto-number.number-3{
        position: absolute;
        left: -57px;
        top: -20px;
        -webkit-transform: scale(1);  
        -moz-transform:    scale(1);  
        -ms-transform:     scale(1); 
        -o-transform:      scale(1);  
        transform:         scale(1);
    }


    .agriculteurs .image .photo{
        display: block;
        max-width:280px;
    }

    .popin-i{
        padding: 10px 50px;
    }

    .popin-i .border-frame{
        display: block;
    }

    article.top .frame{
        height: 220px;
        background:url(img/new/home-frame-top.png) no-repeat center center;
    }

    .videoc{
        width:auto;height:auto;
        left:50%;top:50%;margin-left: 0%;
        -webkit-transform: translate(-50%,-50%);  
        -moz-transform:    translate(-50%,-50%);  
        -ms-transform:     translate(-50%,-50%);  
        -o-transform:      translate(-50%,-50%);  
        transform:         translate(-50%,-50%);  
    }
    .videoc iframe{
        width: 640px;
    }


    .relancer .planteright{
        right: 0;top:-40px;
        width: 138px;
    }

    .agriculteurs .imageleft .image img{
        position: relative;
        left: -60px;
    }
    .agriculteurs .imageright .image img{
        position: relative;
        float: right;
    }

    .persons{
        width: 740px;
        margin: 0 auto;
    }
    .persons .item .details{
        text-align: right;
    }
    .persons .text{
        min-height: 210px;
    }
    .persons .item{
        float: left;
        padding: 0 20px 20px;
        width: 33.33%;
    }
    .persons .frame{
        position: absolute;
        width: 240px;height: 402px;
        background: url(img/elements/metier-photo-cadre.png) no-repeat 20px 0px;
        background-size: 206px;
    }
    .persons .item .photo{
        height: 256px;
    }

    .persons .item .photo img.p{
        height: 200px;
    }
    .news-path{
        position: absolute;
        width: 1356px;
        top: 0;left: 50%;margin-left: -678px;
        height: 675px;
        background: url(img/elements/news-path-big.png) no-repeat center 20px;
    }

    .where-find-products .titre{
        margin-bottom: 5px;
    }

    .fourchette{display:block;}


    .footer-content .colleft{
        text-align: left;
        padding: 0 0 0 40px;
    }
    footer .pousse{
        display: inline-block;
    }
    .footer-content .colright{
        text-align: right;
        padding: 7px 30px 0 0;
    }

    footer .footer-green .footer-content{
        padding-left: 40px;text-align: left;
    }

    footer .social{text-align: right;}
    footer .social a{position: relative;width: 33px;height: auto;margin: 0 0px 0 14px;padding: 0;}
    footer .social a svg{width: 33px;height:29px;}

    .top-cornicons-maison .text{
        max-width: 480px;
    }

    .subtitle{
        font-size: 19px;
    }

    .agriculteurs{
        padding-top: 80px;
        padding-bottom: 80px;
    }
    .agriculteurs .poussesc{
        display: block;
    }

    .bg-agriculteurs {
        /*background: #fff url(img/elements/bg-agriculteurs.jpg) no-repeat top center;*/
        background-size: cover;
    }
    .agriculteurs .personne{margin:0;padding:20px 20px 0;}
    .agriculteurs .personne.imageleft .contourt {
        background: url(img/elements/personne-contour-leftt.png) right top no-repeat;
    }
    .agriculteurs .personne.imageleft .contourb {
        background: url(img/elements/personne-contour-leftb.png) left top no-repeat;
    }
    .agriculteurs .personne.imageright .contourt {
        background: url(img/elements/personne-contour-rightt.png) right top no-repeat;
    }
    .agriculteurs .personne.imageright .contourb {
        background: url(img/elements/personne-contour-rightb.png) left top no-repeat;
    }
    .agriculteurs .image .photo{
        max-width:363px;
    }

    .agriculteurs .personne{
        min-height: 472px;
    }
    .agriculteurs .personne{
        margin: 0 0 50px;
    }
    .agriculteurs .imageleft .infos{
        float: right;
        width: 55%;
        padding: 20px 40px 20px 100px;
    }
    .agriculteurs .imageright .infos{
        float: left;
        width: 55%;
        padding: 20px 60px 20px 20px;
    }
    .agriculteurs .imageleft .image{
        position: absolute;left: 0;bottom: 0;
    }
    .agriculteurs .imageright .image{
        position: absolute;right: 0px;bottom: 0;
    }
    .agriculteurs .personne.imageleft .contour {
        display: block;
    }
    .agriculteurs .personne.imageright .contour {
        display: block;
    }
    .agriculteurs .imageleft{
        background: #fff url(img/elements/pathleft.png) 20px top no-repeat;
    }
    .agriculteurs .imageright{
        background: #fff url(img/elements/pathright.png) 90% -12px no-repeat;
    }

    .agriculteurs .personne.imageleft .marker {
        position: absolute;
        width: 45px;
        top: 20px;left: 337px;bottom: auto;right: auto;margin-left: 0;
    }
    .agriculteurs .personne.imageright .marker {
        position: absolute;
        width: 45px;
        top: 37px;right: 376px;bottom: auto;left: auto;
    }
    .agriculteurs .imageleft .image img,
    .agriculteurs .imageright .image img{
        left: 0;right: 0;
        float: none;
    }

    .kitc{
        padding: 0px 0 64px 0;
    }
    .kitc .pictos{
        height: auto;
    }
    .kit .plante{ 
        display: inline-block;
    }
    .kit .offer{
        font-size: 24px;
    }

    .kit .sachet{width: 104px;position: absolute; top: 150px;left: 65px}
    .kit .bocal{ width: 60px;position: absolute; top: 372px;left: 55px}
    .kit .etiquette{width: 83px;position: absolute; top: 590px;left: 55px}
    .kit .notice{ width: 93px;position: absolute; top: 252px;right: 100px;}
    .kit .ardoise{width: 57px;position: absolute; top: 510px;right: 130px}

    .galerie{
        padding: 70px 0 120px;
    }
}
@media screen and (min-width: 992px) {

    header{
        height: auto;
        padding: 20px 0 8px;
    }
    .menu-top-container{
        position: static;
    }
    .menu-top-container ul li a {
        border-left: 1px solid #dbdbdb;
        border-top: none;
    }
    .menu-top-container{
        display: block;
    }
    .menumobilecontainer{
        display: none;
    }
    .menu-top-container ul li{
        display: inline-block;
    }
    .menu-top-container ul li a {
        display: inline-block;
    }
    .menu-top-container ul li a {
        position: relative;
        padding: 0 46px 0 14px;
        height: 55px;line-height: 56px;
    }
    .menu-top-container ul li.current-menu-item a svg{
        position: absolute;
        display: block;
        bottom: 0px;
        left: 13px;
        width: 68%;
        height: 8px;
        max-width: none;
    }
    .menu-top-container ul li#menu-item-96 a svg{
        bottom: -4px;
    }

    .news-all .videos .item .text{
        min-height: 60px;
        line-height: 60px;
    }

    /*
    .pousseheader1{
        position: absolute;
        top: -13px;right: -113px;
        z-index:20;
        width: 162px;height: 125px;
        background: url(img/elements/pousseheader1.svg) no-repeat;
        background-size: 162px;
    }
    .pousseheader2{
        position: absolute;
        width: 99px;height: 68px;
        top: -6px;left: 50%;margin-left: 344px;
        z-index: 20;
        background: url(img/elements/pousseheader2.svg) no-repeat;
        background-size: 99px;
        -ms-transform: rotate(-45deg);
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg);
    }*/

    .agriculteurs .personne{
        padding: 50px 50px 0;
    }


    .agriculteurs .imageleft .infos{
        padding: 0;
    }
    .agriculteurs .imageright .infos{
        padding: 0;
    }

    .galerie .items{
        max-width:656px;
        margin: 0 auto;
    }
    .galerie .item{
        width: 164px;height: 164px;
    }

    .metier-person .text{
        float: left;
        width: 480px;
    }
    .metier-person .text blockquote{
        text-align: justify;
    }
    .metier-person .text blockquote br{
        display: inherit;
    }

    .metier-person .photo{
        position: relative;
        float: right;
        background: #fff;
        width: 326px;height: 400px;
        /*overflow: hidden;*/
    }

    .persons{
        width: 900px;
        margin: 0 auto;
    }

    .persons .text{
        min-height: 160px;
    }
    .persons .item .photo{
        height: 316px;
    }
    .persons .frame{
        position: absolute;
        width: 324px;height: 402px;
        background: url(img/elements/metier-photo-cadre.png) no-repeat 20px 0px;
        background-size: 260px;
    }
    .persons .item .photo img.p{
        height: 238px;
    }

    .news-all{
        height: 685px;
        padding: 0;
    }
    .news-all .videos .item.left{
        float: left;
    }
    .news-all .videos .item.right{
        float: right;
    }
    .news-all .videos .item .text{
        padding-bottom: 10px;
    }

    article.metiers{
        padding: 60px 0 0;
    }

    .kitc .contour-top{
        position: absolute;
        left: 0;top:0;
        background: url(img/cornichons-maisons/contour-top.png) no-repeat center center;
        width: 783px;height: 339px;
        z-index: 10;
    }
    .kitc .contour-bottom{
        position: absolute;
        left: 0;bottom: 0;
        background: url(img/cornichons-maisons/contour-bottom.png) no-repeat center center;
        width: 783px;height: 278px;
        z-index: 10;
    }
    .kitc .plante-left{
        position: absolute;
        left: 50%;top: -174px;margin-left: -946px;
        background: url(img/cornichons-maisons/plante-left.jpg) no-repeat center center;
        width: 750px;height: 844px;
        z-index: 10;

    }
    .kitc .corner{
        position: absolute;
        right: -1px;top:2px;
    }
    .kit .notice{ width: 93px;position: absolute; top: 268px;right: 182px;}
    .kit .notice img{
        float: left;
    }
    .kit .notice .texte{
        position: relative;
        left: -10px;
        top: 60px;
    }

    .kit .sachet{width: 104px;position: absolute; top: 150px;left: 65px}
    .kit .bocal{ width: 60px;position: absolute; top: 334px;left: 55px}
    .kit .etiquette{width: 83px;position: absolute; top: 526px;left: 55px}
    .kit .notice{ width: 93px;position: absolute; top: 268px;right: 182px;}
    .kit .ardoise{width: 57px;position: absolute; top: 478px;right: 130px}

    .kit .etiquette img{
        -webkit-transform: rotate(-22deg) translate(20px, 0);  
        -moz-transform:    rotate(-22deg) translate(20px, 0);  
        -ms-transform:     rotate(-22deg) translate(20px, 0); 
        -o-transform:      rotate(-22deg) translate(20px, 0);  
        transform:         rotate(-22deg) translate(20px, 0);
    }

    .kit .bocal::before{
        position: absolute;
        content: "";
        top:-34px;
        left:60px;
        width: 22px;height:21px;
        background:url(img/cornichons-maisons/plus.svg);
        background-size: 22px;
    }
    .kit .etiquette::before{
        position: absolute;
        content: "";
        top:-49px;
        left:38px;
        width: 22px;height:21px;
        background:url(img/cornichons-maisons/plus.svg);
        background-size: 22px;
    }
    .kit .notice::before{
        position: absolute;
        content: "";
        top:-49px;
        left:38px;
        width: 22px;height:21px;
        background:url(img/cornichons-maisons/plus.svg);
        background-size: 22px;
    }
    .kit .ardoise::before{
        position: absolute;
        content: "";
        top:-60px;
        left:0px;
        width: 22px;height:21px;
        background:url(img/cornichons-maisons/plus.svg);
        background-size: 22px;
    }

    .where-find-products .image{
        width: 25%;
    }
    
    .relancer .contour{
        display: block;
    }

    /*.bgbottom{background: url(img/bgtop.jpg);padding-bottom:0px; position: relative;}*/
}

@media screen and (min-width: 1200px) {

    .galerie .items{
        max-width: 840px;
        margin: 0 auto;
    }
    .galerie .item{
        overflow: hidden;
        width: 210px;height: 210px;
    }
    .galerie .item img{
        -webkit-transform: scale(1);  
        -moz-transform:    scale(1);  
        -ms-transform:     scale(1); 
        -o-transform:      scale(1);  
        transform:         scale(1);
        -webkit-transition: all 2s ease;
        -moz-transition: all 2s ease;
        transition: all 2s ease;
    }
    .galerie .item:hover img{
        -webkit-transform: scale(1.3);  
        -moz-transform:    scale(1.3);  
        -ms-transform:     scale(1.3); 
        -o-transform:      scale(1.3);  
        transform:         scale(1.3);
    }

    .kitc .plante-right{
        position: absolute;
        right: 50%;margin-right:-830px;top:245px;
        background: url(img/cornichons-maisons/plante-right.jpg) no-repeat center center;
        width: 471px;height: 833px;
        z-index: 10;
    }
}
@media screen and (min-width: 1400px) {

    .kitc .plante-right{
        position: absolute;
        right: -100px;top:245px;margin-right:0;
        background: url(img/cornichons-maisons/plante-right.jpg) no-repeat center center;
        width: 471px;height: 833px;
        z-index: 10;
    }

}