@font-face{
font-family:'Garaje Monospace 0603 Trial Black';
src:url('../fonts/GarajeMonospace0603Trial-Black.eot');
src:url('../fonts/GarajeMonospace0603Trial-Black.eot?#iefix') format('embedded-opentype'),
url('../fonts/GarajeMonospace0603Trial-Black.woff2') format('woff2'),
url('../fonts/GarajeMonospace0603Trial-Black.woff') format('woff');
font-weight:900;
font-style:normal;
font-display:swap;
}

@font-face {
font-family:'Garaje Monospace 0603 Trial Medium';
src:url('../fonts/GarajeMonospace0603Trial-Medium.eot');
src:url('../fonts/GarajeMonospace0603Trial-Medium.eot?#iefix') format('embedded-opentype'),
url('../fonts/GarajeMonospace0603Trial-Medium.woff2') format('woff2'),
url('../fonts/GarajeMonospace0603Trial-Medium.woff') format('woff');
font-weight:500;
font-style:normal;
font-display:swap;
}

@font-face{
font-family:'AzoSansUberW01';
src:url('../fonts/AzoSansUberW01-Regular.eot');
src:url('../fonts/AzoSansUberW01-Regular.eot?#iefix') format('embedded-opentype'),
url('../fonts/AzoSansUberW01-Regular.woff2') format('woff2'),
url('../fonts/AzoSansUberW01-Regular.woff') format('woff');
font-weight:normal;
font-style:normal;
font-display:swap;
}

@font-face{
font-family:'HelveticaNeue LT 65';
src:url('../fonts/HelveticaNeueLT-Medium.eot');
src:url('../fonts/HelveticaNeueLT-Medium.eot?#iefix') format('embedded-opentype'),
url('../fonts/HelveticaNeueLT-Medium.woff2') format('woff2'),
url('../fonts/HelveticaNeueLT-Medium.woff') format('woff');
font-weight:500;
font-style:normal;
font-display:swap;
}

@font-face{
font-family:'HelveticaNeue LT 95 Italic';
src:url('../fonts/HelveticaNeueLT-BlackItalic.eot');
src:url('../fonts/HelveticaNeueLT-BlackItalic.eot?#iefix') format('embedded-opentype'),
url('../fonts/HelveticaNeueLT-BlackItalic.woff2') format('woff2'),
url('../fonts/HelveticaNeueLT-BlackItalic.woff') format('woff');
font-weight:900;
font-style:italic;
font-display:swap;
}

@font-face{
font-family:'HelveticaNeue LT 95';
src:url('../fonts/HelveticaNeueLT-Black.eot');
src:url('../fonts/HelveticaNeueLT-Black.eot?#iefix') format('embedded-opentype'),
url('../fonts/HelveticaNeueLT-Black.woff2') format('woff2'),
url('../fonts/HelveticaNeueLT-Black.woff') format('woff');
font-weight:900;
font-style:normal;
font-display:swap;
}

@font-face{
font-family:'HelveticaNeue LT 65 Italic';
src:url('../fonts/HelveticaNeueLT-MediumItalic.eot');
src:url('../fonts/HelveticaNeueLT-MediumItalic.eot?#iefix') format('embedded-opentype'),
url('../fonts/HelveticaNeueLT-MediumItalic.woff2') format('woff2'),
url('../fonts/HelveticaNeueLT-MediumItalic.woff') format('woff');
font-weight:500;
font-style:italic;
font-display:swap;
}

*{
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
margin:0;
padding:0;
outline:none;
}

html, body{overflow-x:hidden;}

body{
font-family:'HelveticaNeue LT 65', Arial, sans-serif;
font-size:15px;
color:#000;
background-color:#fff;
width:100%;
-webkit-font-smoothing:antialiased;
-webkit-text-size-adjust:100%;
}

input[type=text], input[type=file], input[type=password], button, select, textarea{
font-family:'HelveticaNeue LT 65', Arial, sans-serif;
font-size:15px;
color:#000;
border:none;
}

textarea{
resize:none;
overflow:auto;
}

::-webkit-input-placeholder{opacity:1;}

:-moz-placeholder{opacity:1;}

::-moz-placeholder{opacity:1;}

input:-ms-input-placeholder, textarea:-ms-input-placeholder{opacity:1;}

button, a{cursor:pointer;}

button{
background:transparent;
border:none;
}

a, a:hover{
border:0;
text-decoration:none;
color:#000;
}

video{
max-width:100%;
height:auto;
}

table{border-collapse:collapse;}

img{
border:none;
max-width:100%;
image-rendering:auto;
}

body.nav_chrome img{image-rendering:-webkit-optimize-contrast;}

ul{list-style-type:none;}

ul, ol{list-style-position:inside;}

label{display:block;}

canvas{-ms-touch-action:double-tap-zoom;}

h1, h2, h3, h4, h5{
font-weight:normal;
display:block;
}

header, nav, footer, section, article, aside, figure, figcaption, mark, time, address{display:block;}

sup, sub{text-transform:none;}

.clrb{clear:both;}

input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active{
-webkit-box-shadow:0 0 0 30px #fff inset !important;
-webkit-text-fill-color:#000 !important;
}

/**** CKEDITOR ****/
.cke > a{
text-decoration:underline;
color:#000;
}

.cke > i, .cke > em{
font-family:'HelveticaNeue LT 65 Italic';
font-style:normal;
}

.cke > strong, .cke > b{
font-family:'HelveticaNeue LT 95';
font-weight:normal;
}

.cke > strong i, .cke > strong em, .cke > b i, .cke > b em, .cke > i strong, .cke > em strong, .cke > i b, .cke > em b{
font-family:'HelveticaNeue LT 95 Italic';
font-style:normal;
font-weight:normal;
}

.cke > sup, .cke > sub{
font-size:70%;
position:relative;
line-height:10px;
}

.cke > sup{top:-0.2em;}

.cke > sub{top:-0.1em;}

.cke > sup a, .cke > sub a{text-decoration:none;}

/**** HEADER ****/
header{
position:fixed;
top:0;
left:0;
z-index:100;
width:100%;
display:flex;
align-items:center;
justify-content:space-between;
padding:40px 210px 0 105px;
transition:all 0.3s;
}

header .logo{
transition:all 0.3s;
width:286px;
}

header .logo img{display:block;}

header .bt_resp{
display:none;
width:30px;
height:30px;
cursor:pointer;
background:url(../img/nav_resp_open.png) no-repeat center center;
background-size:100% auto;
transition:all 1s;
z-index:120;
}

header.open_resp .bt_resp{
background-image:url(../img/nav_resp_close.png);
background-size:20px auto;
}

header nav{
font-family:'Garaje Monospace 0603 Trial Medium';
font-size:20px;
text-transform:uppercase;
display:flex;
align-items:center;
}

header nav a + a{margin-left:40px;}

header.scroll{
background:rgba(250, 233, 217, 0.8);
padding:20px 105px 20px 50px;
}

header.scroll .logo{width:180px;}

/**** BOUTON COMMANDE ****/
.cde{
position:fixed;
bottom:35px;
right:40px;
z-index:50;
display:flex;
cursor:pointer;
align-items:flex-end;
}

.cde.hidden{display:none;}

.cde a + a{margin-left:10px;}

.cde a:first-child + a{margin-left:0;}

.cde a img{
display:block;
max-height:137px;
}

.cde a + a img{max-height:71px;}

/**** GENERAL ****/
section{position:relative;}

section .ariane{
display:inline-block;
font-family:'Garaje Monospace 0603 Trial Medium';
font-size:20px;
text-transform:uppercase;
position:absolute;
top:50%;
left:30px;
z-index:20;
transform:rotate(-90deg) translateY(-50%);
transform-origin:top left;
}

.content{
width:1180px;
max-width:100%;
margin:0 auto;
}

.garaje40{
font-family:'Garaje Monospace 0603 Trial Medium';
font-size:40px;
text-transform:uppercase;
line-height:40px;
}

.garaje30{
font-family:'Garaje Monospace 0603 Trial Medium';
font-size:30px;
text-transform:uppercase;
line-height:30px;
}

.bt{
display:inline-block;
border:3px solid #d62700;
background-color:#f59d00;
position:relative;
border-radius:60px;
padding:17px 45px;
overflow:hidden;
}

.bt::before{
content:'';
background-color:#d62700;
width:0;
height:100%;
position:absolute;
top:0;
left:0;
transition:all 0.3s;
}

.bt span{
display:block;
z-index:1;
font-family:'Garaje Monospace 0603 Trial Black';
font-size:18px;
text-transform:uppercase;
line-height:18px;
color:#d62700;
transition:all 0.3s;
position:relative;
}

.bt.download span{
position:relative;
padding-left:25px;
background:url(../img/telecharger.png) no-repeat left center;
background-size:14px auto;
}

/**** INTRO ****/
section.intro article:first-child{
position:relative;
height:100vh;
}

section.intro article:first-child > img{
display:block;
object-fit:cover;
width:100%;
height:100%;
max-width:none;
}

section.intro article:first-child .sociaux{
position:absolute;
width:100%;
bottom:40px;
left:0;
text-align:center;
}

section.intro article:first-child .sociaux a{
display:inline-block;
vertical-align:middle;
margin:0 20px;
}

section.intro article:first-child .sociaux a img{
display:block;
height:49px;
}

section.intro article.txt{
background-color:#fae9d9;
padding:170px 100px 160px 100px;
text-align:center;
}

section.intro article h1{text-align:center;}

section.intro article h1 + img{
display:block;
width:274px;
margin:100px auto 0 auto;
opacity:0;
position:relative;
}

@-webkit-keyframes introAnim{
0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3);left:-3px;}
10%,30%,50%,70%,90%{left:0;}
20%,40%,60%,80%{left:-3px;}
100%{opacity:1;}
}

@keyframes introAnim{
0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3);left:-3px;}
10%,30%,50%,70%,90%{left:0;}
20%,40%,60%,80%{left:-3px;}
100%{opacity:1;}
}

section.intro article h1 + img.animer{
-webkit-animation-duration:2.5s;
animation-duration:2.5s;
-webkit-animation-name:introAnim;
animation-name:introAnim;
opacity:1;
}

/**** MENU ****/
section.menu{
position:relative;
overflow:hidden;
padding:215px 100px;
}

section.menu figure{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
z-index:-1;
}

section.menu figure img{
display:block;
object-fit:cover;
width:100%;
height:100%;
max-width:none;
transition:all .2s ease-in-out;
}

section.menu article{
width:380px;
max-width:100%;
margin:0 auto;
text-align:center;
color:#fff;
}

section.menu article .bt{margin-top:40px;}

/**** ACCROCHE ****/
section.accroche{
background-color:#000;
padding:130px 100px;
}

section.accroche h2{
display:block;
text-align:center;
font-family:'AzoSansUberW01';
color:#fff;
font-size:150px;
text-transform:uppercase;
line-height:150px;
}

section.accroche .anim{
position:absolute;
/*top:50%;
left:50%;
width:254px;
transform:translate(-50%, -50%);*/
top:-150px;
width:200px;
left:60px;
z-index:20;
}

section.accroche .anim img{
display:block;
opacity:0;
}

@-webkit-keyframes accrocheAnim{
0%{
transform:rotate(0deg);
opacity:0;
}
50%{
opacity:1;
}
100%{
transform:rotate(360deg);
}
}

@keyframes accrocheAnim{
0%{
transform:rotate(0deg);
opacity:0;
}
50%{
opacity:1;
}
100%{
transform:rotate(360deg);
}
}

section.accroche .anim.animer img{
-webkit-animation-duration:2.5s;
animation-duration:2.5s;
-webkit-animation-name:accrocheAnim;
animation-name:accrocheAnim;
opacity:1;
}

/**** CONCEPT ****/
section.concept{padding:115px 100px 190px 100px;}

section.concept .content{
display:flex;
align-items:center;
}

section.concept .content .img, section.concept .content .txt{
position:relative;
width:50%;
}

section.concept .content .img figure img{
display:block;
opacity:0;
}

@-webkit-keyframes conceptImgAnim{
0%{opacity:0;}
100%{opacity:1;}
}

@keyframes conceptImgAnim{
0%{opacity:0;}
100%{opacity:1;}
}

section.concept .content .img figure.animer img{
-webkit-animation-duration:2.5s;
animation-duration:2.5s;
-webkit-animation-name:conceptImgAnim;
animation-name:conceptImgAnim;
opacity:1;
}

section.concept .content .img > img{
display:block;
position:absolute;
width:237px;
bottom:0;
right:0;
transform:translate(68%, 64%);
z-index:20;
}

section.concept .content .txt{padding-left:140px;}

section.concept .content .txt .garaje40{padding:0 70px 50px 0;}

section.concept .content .txt .cke{
width:260px;
max-width:100%;
line-height:20px;
}

section.concept .content .txt > img{
display:block;
width:197px;
position:absolute;
z-index:20;
right:-100px;
top:35%;
}

/**** PRODUITS ****/
section.produits{
background-color:#fae9d9;
padding:125px 100px;
}

section.produits .content{
display:flex;
align-items:center;
}

section.produits .content .img, section.produits .content .txt{
position:relative;
width:50%;
}

section.produits .content .img figure img{
display:block;
opacity:0;
}

section.produits .content .img figure.animer img{
-webkit-animation-duration:2.5s;
animation-duration:2.5s;
-webkit-animation-name:conceptImgAnim;
animation-name:conceptImgAnim;
opacity:1;
}

section.produits .content .img > img{
display:block;
position:absolute;
width:171px;
top:55px;
right:0;
transform:translateX(50%);
z-index:20;
}

section.produits .content .img > img.anim{right:-100%;}

@-webkit-keyframes airpouleAnim{
0%{right:-100%;}
100%{right:0;}
}

@keyframes airpouleAnim{
0%{right:-100%;}
100%{right:0;}
}

section.produits .content .img > img.anim.animer{
-webkit-animation-duration:1.5s;
animation-duration:1.5s;
-webkit-animation-name:airpouleAnim;
animation-name:airpouleAnim;
right:0;
}

section.produits .content .img > img + img{
width:376px;
top:auto;
bottom:-50px;
transform:translateX(40%);
}

section.produits .content .txt{padding-right:140px;}

section.produits .content .txt .garaje40{padding:0 70px 50px 0;}

section.produits .content .txt .cke{
width:260px;
max-width:100%;
line-height:20px;
}

/**** CONTACT ****/
section.contact{
background-color:#000;
color:#fff;
padding:150px 100px 95px 100px;
}

section.contact .content{position:relative;}

section.contact .centre{
width:550px;
max-width:100%;
margin:0 auto;
text-align:center;
}

section.contact .centre h3{
display:inline-block;
font-family:'AzoSansUberW01';
color:#fff;
font-size:150px;
text-transform:uppercase;
line-height:150px;
position:relative;
}

section.contact .centre h3 img{
display:block;
position:absolute;
width:252px;
top:40%;
right:-34%;
z-index:20;
}

section.contact .centre .coords{
display:flex;
flex-flow:row wrap;
justify-content:space-between;
align-items:flex-start;
padding:0 45px;
}

section.contact .centre .coords li{
padding-top:90px;
width:calc((100% - 30px) / 2);
text-align:left;
}

section.contact .centre .coords li .garaje40{padding-bottom:35px;}

section.contact .centre .coords li .cke{line-height:20px;}

section.contact .centre .coords li .cke > a{color:#fff;}

section.contact .centre .coords li .bt{
margin-top:75px;
width:100%;
text-align:center;
}

section.contact .content > img{
display:block;
position:absolute;
width:183px;
top:50%;
left:80px;
z-index:20;
}

section.contact .content > img + img{
width:165px;
left:auto;
right:115px;
transform:translateY(-50%);
}

section.contact .content > img.anim{opacity:0;}

section.contact .content > img.anim.animer{
-webkit-animation-duration:1s;
animation-duration:1s;
-webkit-animation-name:telAnim;
animation-name:telAnim;
opacity:1;
}

@-webkit-keyframes telAnim{
0%{-webkit-transform:translateX(0);transform:translateX(0)}
6.5%{-webkit-transform:translateX(-6px) rotateY(-9deg);transform:translateX(-6px) rotateY(-9deg)}
18.5%{-webkit-transform:translateX(5px) rotateY(7deg);transform:translateX(5px) rotateY(7deg)}
31.5%{-webkit-transform:translateX(-3px) rotateY(-5deg);transform:translateX(-3px) rotateY(-5deg)}
43.5%{-webkit-transform:translateX(2px) rotateY(3deg);transform:translateX(2px) rotateY(3deg)}
50%{-webkit-transform:translateX(0);transform:translateX(0)}
}

@keyframes telAnim{
0%{-webkit-transform:translateX(0);transform:translateX(0)}
6.5%{-webkit-transform:translateX(-6px) rotateY(-9deg);transform:translateX(-6px) rotateY(-9deg)}
18.5%{-webkit-transform:translateX(5px) rotateY(7deg);transform:translateX(5px) rotateY(7deg)}
31.5%{-webkit-transform:translateX(-3px) rotateY(-5deg);transform:translateX(-3px) rotateY(-5deg)}
43.5%{-webkit-transform:translateX(2px) rotateY(3deg);transform:translateX(2px) rotateY(3deg)}
50%{-webkit-transform:translateX(0);transform:translateX(0)}
}

/**** FOOTER ****/
footer{
position:relative;
padding:120px 100px 45px 100px;
text-align:center;
background-color:#fff;
z-index:100;
}

footer .instagram{
position:relative;
display:flex;
flex-flow:row wrap;
justify-content:center;
margin-bottom:42px;
}

footer .instagram.hidden{display:none;}

footer .instagram > div{
position:relative;
width:calc(20% - 3px);
overflow:hidden;
margin:0 3px 3px 0;
}

footer .instagram > div::after{
content:'';
display:block;
padding-bottom:100%;
}

footer .instagram > div img{
position:absolute;
top:0;
left:0;
display:block;
object-fit:cover;
width:100%;
height:100%;
max-width:none;
transition:all .2s ease-in-out;
}

footer .instagram .bt{
position:absolute;
top:50%;
left:50%;
transform:translate(-50%, -50%);
z-index:20;
}

footer .sociaux{
display:flex;
align-items:center;
justify-content:center;
}

footer .sociaux > span{
font-family:'Garaje Monospace 0603 Trial Medium';
font-size:20px;
text-transform:uppercase;
margin-right:22px;
}

footer .sociaux > a{
height:16px;
margin-left:13px;
}

footer .sociaux > a img{
display:block;
height:100%;
}

footer .sociaux > img{
display:block;
width:145px;
margin-left:70px;
position:relative;
left:-100%;
}

@-webkit-keyframes footerAnim{
0%{left:-100%;}
100%{left:0;}
}

@keyframes footerAnim{
0%{left:-100%;}
100%{left:0;}
}

footer .sociaux > img.animer{
-webkit-animation-duration:1.5s;
animation-duration:1.5s;
-webkit-animation-name:footerAnim;
animation-name:footerAnim;
left:0;
}

footer .nash{
position:absolute;
display:block;
right:15px;
bottom:70px;
width:11px;
z-index:20;
}

footer .nash img{display:block;}

footer .legal, footer .openCookies{
margin-top:15px;
display:inline-block;
font-size:13px;
text-decoration:underline;
cursor:pointer;
}

footer .openCookies{margin-left:20px;}

/**** MENTIONS LÉGALES ****/
#bg_pop{
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background:url(../img/close.png) no-repeat right 30px top 50px;
background-size:16px auto;
background-color:rgba(0, 0, 0, 0.8);
cursor:pointer;
z-index:120;
display:none;
}

#bg_pop.noclose{background-image:none;}

#content_pop{
position:fixed;
top:50%;
left:50%;
transform:translate(-50%, -50%);
width:1100px;
max-width:90%;
max-height:90%;
overflow:auto;
padding:50px;
background-color:#fff;
z-index:150;
text-align:center;
display:none;
}

#content_pop .cke{padding-top:30px;}

#content_pop .cke:first-child{padding-top:0;}

#content_pop .cke + .garaje40{padding-top:50px;}

#content_pop > .bt{
display:block;
width:max-content;
width:-moz-max-content;
margin:25px auto 0;
}

#bg_popCookies, #popCookies{
position:fixed;
display:none;
}

#bg_popCookies{
top:0;
left:0;
width:100%;
height:100%;
z-index:5000;
background-color:rgba(246, 241, 238, 0.8);
cursor:pointer;
}

#popCookies {
z-index:7500;
width:1200px;
max-width:90%;
max-height:90%;
overflow:auto;
background-color:#FFF;
padding:50px;
top:50%;
left:50%;
transform:translate(-50%, -50%);
font-size:18px;
}

#popCookies  > .close{
position:absolute;
top:20px;
right:20px;
display:block;
background:url(../img/menu_close.png) no-repeat center center;
background-size:100% auto;
cursor:pointer;
width:18px;
height:18px;
z-index:200;
}

#popCookies .valid{
font-family:'HelveticaNeue LT 95';
margin:15px auto;
display:none;
text-align:center;
color:#22bb33;
}

#popCookies .content > .garaje40, #popCookies .content > .garaje30{
display:block;
text-align:center;
margin-bottom:25px;
}

#popCookies .content > p{
margin-bottom:25px;
text-align:center;
}

#popCookies .content > p > a{text-decoration:underline;}

#popCookies .content .btns{
display:flex;
flex-flow:row wrap;
justify-content:center;
}

#popCookies .content .btns >  label{
opacity:0.5;
min-width:120px;
padding:5px;
font-size:15px;
text-align:center;
}

#popCookies .content .btns >  label.active{opacity:1;}

#popCookies .content .btns .btn.allow{
background-color:#5CB85C;
border-color:#5CB85C;
background-image:none;
}

#popCookies .content .btns .btn.deny{
background-color:#D9534F;
border-color:#D9534F;
background-image:none;
}

#popCookies .content .btns.always{
white-space:nowrap;
font-size:13px;
color:#5CB85C;
}

#popCookies .content .liste{margin-bottom:25px;}

#popCookies .content .bloc_cat{
border-bottom:1px solid #000;
cursor:pointer;
padding:25px 0;
}

#popCookies .content .bloc_cat p{
position:relative;
padding-right:50px;
font-size:15px;
}

#popCookies .content .bloc_cat > p::after{
content:'';
border:solid black;
border-width:0 3px 3px 0;
display:inline-block;
padding:3px;
transform:rotate(45deg) translateY(-50%);
-webkit-transform:rotate(45deg) translateY(-50%);
position:absolute;
top:50%;
right:-15px;
}

#popCookies .content .bloc_cat.open > p::after{
transform:rotate(-135deg) translateY(-50%);
-webkit-transform:rotate(-135deg) translateY(-50%);
}

#popCookies .content .bloc_cat .liste_cookies{
display:none;
padding:15px 30px;
}

#popCookies .content .bloc_cat .liste_cookies li + li{border-top:1px solid #d2d2d2;}

#popCookies .content .bloc_cat .liste_cookies li{
padding:15px 0;
display:flex;
justify-content:space-between;
align-items:center;
width:100%;
}

#popCookies .content .bloc_cat .liste_cookies li > p{max-width:calc(100% - 280px);}

#popCookies .content .bloc_cat .liste_cookies li > p > a{
display:block;
font-size:13px;
text-decoration:underline;
}

#popCookies .content > .bt{
margin:0 auto;
display:block;
width:max-content;
width:-moz-max-content;
}

.cookies_index{
display:flex;
align-items:center;
cursor:pointer;
background-color:#000;
color:#fff;
position:fixed;
bottom:0;
left:0;
padding:15px;
z-index:10000;
}

.cookies_index.hidden{display:none;}

.cookies_index, .cookies_index > *{
user-select:none;
-moz-user-select:none;
-ms-user-select:none;
-webkit-user-select:none;
-webkit-tap-highlight-color:transparent;
}

.cookies_index span{
display:block;
margin-left:15px;
}