/*
Theme Name: Boes Pliage
Theme URI: https://www.boes.alsace
Author: Numéro Web
Author URI: https://www.numeroweb.com
Version: 1.0
*/

@CHARSET "UTF-8";

@font-face {
    font-family: 'regular';
    src: url('assets/fonts/inter-regular.woff2') format('woff2'),
        url('assets/fonts/inter-regular.woff') format('woff'),
        url('assets/fonts/inter-regular.svg#inter-regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'title';
    src: url('assets/fonts/eurostile-unicase.woff2') format('woff2'),
        url('assets/fonts/eurostile-unicase.woff') format('woff'),
        url('assets/fonts/eurostile-unicase.svg#eurostile-unicase') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

* {box-sizing:border-box; padding:0; margin:0; -webkit-backface-visibility:hidden; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; outline:none;}

:root {
	
	--blanc:#ffffff;
	--rouge:#bb1e27;	
	--rouge2:#9f1f26;
	--noir:#212121;
	--pad:1rem;
	--pad35:2rem;
	--pad50:2.5vw;
	--pad90:4.5vw;
	--pad100:5vw;
	--pad180:9vw;
	--logo:110px;
	
} 

html {background:var(--rouge);}
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var,
b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup,
main, menu, nav, output, ruby, section, summary, time, mark, audio, video {margin: 0; padding: 0; border: 0; vertical-align: baseline;}
body {background:var(--rouge); color:var(--blanc); overflow-x: hidden; webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; counter-reset:item; transition:background .4s ease-out;}

a {color:inherit; outline:none; webkit-transition:all .35s; -moz-transition:all .35s; transition:all .35s; -o-transition:all .35s; -ms-transition:all .35s; text-decoration:none;}
a:focus, a:active {outline: none;}
a:link, a:visited, a:hover, a:active, a:focus, button {outline:0;}
:focus, :hover {-webkit-appearance: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);}

sup {font-size:.6em; vertical-align:super;}
 
button {font-size:inherit;}
button:hover {cursor:pointer;}
 
section {position:relative; clear:both; transform-style:preserve-3d;}

button {border:0;}
li {list-style: none; margin-bottom:0;}
li:last-child {margin-bottom:0;}

p {margin-bottom:var(--pad50);}
p:last-child {margin-bottom:0!important;}

.grecaptcha-badge {visibility: hidden!important; pointer-events:none!important; display:none!important;}

img {pointer-events:none;}
.noise {z-index:80; position:fixed; top:0; left:0; width:100ww; height:100vh; pointer-events:none; opacity:.07;}

ul {display:flex; flex-direction:column;}
li {position:relative;}



/* FONTS */
 
body, .font-n {font-family:'regular', sans-serif; font-optical-sizing: auto; font-style: normal; font-size:1.55rem; line-height:1.4; font-weight:400;}
h1, h2, h3 , h4 {line-height:1; font-weight:400;}

.font-size--a {font-family:'title'; text-transform:uppercase; font-size:5vw; line-height:1;}
.font-size--b {font-family:'title'; text-transform:uppercase; font-size:4vw; line-height:1.1;}
.font-size--c {font-family:'title'; text-transform:uppercase; font-size:3vw; line-height:1.1;}
.font-size--d, .article h2 {font-size:1.9rem; line-height:1.2;}
.font-size--e, .article h3, .formulaire .label {font-size:1.2rem; line-height:1.4;}
.wpcf7-list-item-label {font-size:1rem; line-height:1.4; width:80%;}
.article h2 {font-family:'title'; text-transform:uppercase;}

.center {text-align:center;}
.left {text-align:left;}
.right {text-align:right;}
.uppercase {text-transform:uppercase;}

.underline a {position:relative; white-space:nowrap;}
.underline a:before, button[type="submit"]:before {content:''; position:absolute; bottom:-5px; left:0; width:100%; min-height:2px; height:2px; transform-origin:left; transform:scaleX(1); 
transition:transform .75s cubic-bezier(0.165, 0.84, 0.44, 1); background-color:var(--blanc);}
.underline a:hover::before, button[type="submit"]:hover::before {transform-origin:right;transform:scaleX(0);}



/* GENERAL */

.splitting .word, .splitting .char {display:inline-block;}
.splitting .char {position:relative;}
.splitting .char::before, .splitting .char::after {content:attr(data-char); position: absolute; top: 0; left: 0; visibility: hidden; transition: inherit; user-select: none;}
.splitting {--word-center: calc((var(--word-total) - 1) / 2); --char-center: calc((var(--char-total) - 1) / 2); --line-center: calc((var(--line-total) - 1) / 2);}
.splitting .word {--word-percent: calc(var(--word-index) / var(--word-total)); --line-percent: calc(var(--line-index) / var(--line-total));}
.splitting .char {--char-percent: calc(var(--char-index) / var(--char-total)); --char-offset: calc(var(--char-index) - var(--char-center)); 
--distance: calc((var(--char-offset) * var(--char-offset)) / var(--char-center)); --distance-sine: calc(var(--char-offset) / var(--char-center));
--distance-percent: calc((var(--distance) / var(--char-center)));}
.char-wrap {display: inline-block; position: relative; overflow: hidden;}

.is-ready #Accueil .font-size--a .char, .is-ready #Page .font-size--a .char {opacity: 1; transform: none; transition-delay: calc(.1s + ( 0.01s * ( var(--char-index)) ));}
#Accueil .font-size--a .char, #Page .font-size--a .char {display: inline-block; opacity: 0; transform:translateX(50%); transform-style:preserve-3d;
transition:opacity 2s cubic-bezier(.15,.61,.5,1), transform .8s cubic-bezier(.15,.61,.5,1), filter .6s cubic-bezier(.15,.61,.5,1);}

#Accueil .content-50, #Page .content-50 {opacity: 0; transform: translateX(3rem); transition: opacity .5s cubic-bezier(.215,.61,.455,1), transform .8s cubic-bezier(.215,.61,.455,1);}
.is-ready #Accueil .content-50, .is-ready #Page .content-50 {opacity:1; transform:none; transition-delay:.2s;}



/* GRID + FLEX + WRAPPER */

.absolute {position:absolute;}
.grid {display:grid;}
.flex {display:flex;}
.aligncenter {justify-content:center;}
.itemscenter {align-items:center;}
.alignleft {align-items:flex-start;}
.alignright {justify-content:flex-end;}
.alignbottom {justify-content: flex-end;}
.itemstbottom {align-items: flex-end;}
.justify {justify-content:space-between;}
.baseline {align-items:baseline;}
.direction {flex-direction:column;}
.center {text-align:center;}

.grid-pad {grid-gap:var(--pad);}
.grid-pad35 {grid-gap:var(--pad35);}
.grid-pad50 {grid-gap:var(--pad50);}
.grid-pad90 {grid-gap:var(--pad90);}
.grid-pad100 {grid-gap:var(--pad100);}
.grid-pad180 {grid-gap:var(--pad180);}

.column-gap90 {column-gap:var(--pad90);}

.row-gap90 {row-gap:var(--pad90);}

.col-1-2 {grid-template-columns:1fr 2fr;}
.col-2 {grid-template-columns:1fr 1fr;}
.col-3 {grid-template-columns:1fr 1fr 1fr;}
.col-5 {grid-template-columns:1fr 10px 1fr 10px 1fr;}

.hidden {overflow:hidden;}
.inline-block {display:inline-block;}
.block {display:block;}

.relative {position:relative;}
.absolute {position:absolute;}

#Accueil.wrapper {padding:var(--pad90) calc(var(--pad180) + var(--pad180)) var(--pad180) calc(var(--pad90) + var(--logo) + var(--pad90) + var(--pad180));}
#Boes-Pliage.wrapper {padding:var(--pad90) var(--pad180) var(--pad180) calc(var(--pad90) + var(--logo) + var(--pad90));}
#Produits .wrapper, #Découvrir, #Contactez-nous {padding:var(--pad180) calc(var(--pad90) + var(--logo) + var(--pad90));}
#Page.wrapper {padding:var(--pad180) calc(var(--pad180) + var(--pad180)) var(--pad180) calc(var(--pad90) + var(--logo) + var(--pad90) + var(--pad180));}
.wrapper-img {padding:0 var(--pad180) var(--pad180) calc(var(--pad90) + var(--logo) + var(--pad90));}
.wrapper {padding:var(--pad180) var(--pad90) var(--pad180) calc(var(--pad90) + var(--logo) + var(--pad90));}
.wrapper-lr {padding:0 var(--pad90) var(--pad180) calc(var(--pad90) + var(--logo) + var(--pad90));}
.footer-copyright {background:var(--rouge2); padding:var(--pad90) var(--pad90) var(--pad90) calc(var(--pad90) + var(--logo) + var(--pad90));}

.mar-180 {margin-top:var(--pad180);}
.mar-100 {margin-top:var(--pad100);}
.mar-50 {margin-top:var(--pad50);}
.mar-35 {margin-top:var(--pad35);}

.content-90 {width:90%;}
.content-85 {width:85%;}
.content-80 {width:80%;}
.content-75 {width:75%;}
.content-70 {width:70%;}
.content-65 {width:65%;}
.content-60 {width:60%;}
.content-55 {width:55%;}
.content-50 {width:50%;}
.content-45 {width:45%;}
.content-40 {width:40%;}
.content-35 {width:35%;}
.content-30 {width:30%;}
.content-25 {width:25%;}
.content-20 {width:20%;}

.height-80 {height:80vh;}
.height-100 {height:100vh;}

.zindex {z-index:10;}
.nowrap {white-space:nowrap;}



/* OVERLAY */

.overlay-grid {position:fixed; height:100vh; width:100vw; padding:var(--pad90); pointer-events:none; z-index:10;}
.overlay-grid svg, .croix svg {width:10px; height:10px; fill:var(--blanc);}
.overlay-grid .croix-1 {position:absolute; left:25%; top:var(--pad90);}
.overlay-grid .croix-2 {position:absolute; left:50%; top:var(--pad90);}
.overlay-grid .croix-3 {position:absolute; left:75%; top:var(--pad90);}
.overlay-grid .croix-4 {position:absolute; left:var(--pad90); top:50vh;}
.overlay-grid .croix-5 {position:absolute; right:var(--pad90); top:50vh;}
.overlay-grid .croix-6 {position:absolute; left:var(--pad90); bottom:var(--pad90);}
.overlay-grid .croix-7 {position:absolute; left:25%; bottom:var(--pad90); transition:opacity .3s cubic-bezier(.215,.61,.455,1), transform .4s cubic-bezier(.215,.61,.455,1);}
.overlay-grid .croix-8 {position:absolute; left:50%; bottom:var(--pad90); transition:opacity .3s cubic-bezier(.215,.61,.455,1), transform .4s cubic-bezier(.215,.61,.455,1);}
.overlay-grid .croix-9 {position:absolute; left:75%; bottom:var(--pad90); transition:opacity .3s cubic-bezier(.215,.61,.455,1), transform .4s cubic-bezier(.215,.61,.455,1);}
.overlay-grid .croix-1, .overlay-grid .croix-2, .overlay-grid .croix-3, .overlay-grid .croix-4, .overlay-grid .croix-5, .overlay-grid .croix-6,
.overlay-grid .croix-7, .overlay-grid .croix-8, .overlay-grid .croix-9 {transform:scale(0); opacity:0;
transition:opacity .3s cubic-bezier(.215,.61,.455,1), transform .4s cubic-bezier(.215,.61,.455,1);}
.is-ready .overlay-grid .croix-1, .is-ready .overlay-grid .croix-2, .is-ready .overlay-grid .croix-3, .is-ready .overlay-grid .croix-4, .is-ready .overlay-grid .croix-5, 
.is-ready .overlay-grid .croix-6, .is-ready .overlay-grid .croix-7, .is-ready .overlay-grid .croix-8, .is-ready .overlay-grid .croix-9 {transform:none; opacity:1;}
.overlay-grid.scroll .croix-1, .overlay-grid.scroll .croix-2, .overlay-grid.scroll .croix-3, .overlay-grid.scroll .croix-7, .overlay-grid.scroll .croix-8,
.overlay-grid.scroll .croix-9 {transform:scale(0); opacity:0;}

.overlay-logo {position:fixed; z-index:5; width:var(--logo); left:var(--pad90); top:var(--pad50); opacity:0; transform:translateY(-3rem);
transition:opacity .5s cubic-bezier(.215,.61,.455,1), transform .6s cubic-bezier(.215,.61,.455,1);}
.overlay-logo svg {fill:var(--blanc);}

.overlay-contact {position:fixed; z-index:5; right:var(--pad90); top:var(--pad90); opacity:0; transform:translateY(-3rem);
transition:opacity .5s cubic-bezier(.215,.61,.455,1), transform .6s cubic-bezier(.215,.61,.455,1);}

.is-ready .overlay-logo, .is-ready .overlay-contact {transform:none; opacity:1;}



/* CONTENU */

.btn-discover {position:absolute; right:var(--pad90); bottom:var(--pad90);  width:var(--pad90); height:var(--pad90); display:flex; align-items:center; justify-content:center;
transform:scale(0); opacity:0; transition:opacity .3s cubic-bezier(.215,.61,.455,1), transform .4s cubic-bezier(.215,.61,.455,1); z-index:5;}
.is-ready .btn-discover {transform:none; opacity:1;}
.btn-discover:before {content:''; position:absolute; background:var(--blanc); width:100%; height:100%; left:0; top:0; border-radius:8rem; z-index:-1; transform-origin:50% 50%;
transform:translate(0); transition:transform .45s cubic-bezier(0.23, 1, 0.32, 1), background .4s cubic-bezier(.215,.61,.355,1); transform-style: preserve-3d;}
.btn-discover:hover::before {transform:scale(0.9) translateZ(0);}
.btn-discover svg {fill:var(--rouge); width:1rem;}

.thumb {position:relative; width:100%; height:100%;}
.thumb-img {position:absolute; top:0; left:0:; width:100%; height:100%; background-size:cover; background-position:center center;}

.icone svg {height:4rem; width:fit-content; fill:var(--blanc);}

.noir {background:var(--noir);}

.galerie {overflow:hidden;}
.marquee {height:30vw; width:100%; position:relative; top:0; left:0; user-select:none;}
.marquee--line {transition:.3s; animation-direction:reverse; animation-delay:-3s; flex-shrink:0; display:flex; align-items:center; min-width:100%; grid-gap:var(--pad35);
animation:marquee 20s linear infinite;}
.marquee--item img {height:100%; width:auto;}
.marquee--item {display:flex; align-items:center; justify-content:center; height:30vw; width:auto; position:relative; padding:0 var(--pad30);}
@keyframes marquee {from {transform: translateX(0);} to {transform: translateX(-100%);}}

.wrapper-img img {width:100%; height:auto;}

.btn-contact .btn-contact--icon {position:relative; width:var(--pad90); height:var(--pad90); display:flex; align-items:center; justify-content:center;}
.btn-contact .btn-contact--icon:before {content:''; position:absolute; background:var(--blanc); width:100%; height:100%; left:0; top:0;
border-radius:8rem; z-index:-1; transform-origin:50% 50%; transform:translate(0);
transition:transform .45s cubic-bezier(0.23, 1, 0.32, 1), background .4s cubic-bezier(.215,.61,.355,1); transform-style: preserve-3d;}
.btn-contact:hover .btn-contact--icon:before {transform:scale(0.9) translateZ(0);}
.btn-contact svg {fill:var(--rouge); width:1rem; transform:rotate(-90deg);}

.underline a.btn-contact:before {content:''; position:absolute; bottom:-10px; left:0; width:100%; min-height:6px; height:6px; transform-origin:right; transform:scaleX(0); 
transition:transform .75s cubic-bezier(0.165, 0.84, 0.44, 1); background-color:var(--blanc);}
.underline a.btn-contact:hover::before {transform-origin:left;transform:scaleX(1);}

.article a:before {bottom: -2px;}
.article h2:first-child {margin:0 0 var(--pad50) 0;}
.article h2 {margin:var(--pad90) 0 var(--pad50) 0;}
.article h3 {margin:var(--pad90) 0 var(--pad35) 0;}
.article ul {margin:var(--pad90) 0; border-left:2px solid var(--blanc); padding-left:var(--pad90); grid-gap:1.5rem; width:60%;}
.contact ul {border-left:2px solid var(--blanc); padding-left:var(--pad90); grid-gap:1.5rem; width:100%;}
.article li, .contact li {position:relative;}
.article li:before {content:''; border-radius:7rem; background:var(--blanc); position:absolute; width:15px; height:15px; left:-2.5vw; top:.6vw;}
.contact li:before {content:''; border-radius:7rem; background:var(--blanc); position:absolute; width:15px; height:15px; left:-2.5vw; top:.3vw;}



/* CONTACT */

.form-item--message {margin-bottom:0!important;}

.label {margin-bottom:var(--padm);}

button[type="submit"] {position:relative; font-family:inherit; background:none; color:var(--blanc);}
button[type="submit"]::before {bottom:-10px;}
input, textarea {font-family:"neue-haas-unica", sans-serif; font-weight:400; color:var(--noir); font-size:inherit; padding:1.5rem; transition:.3s;}
input {border:0;}
textarea {border:0;resize: none; height:10rem;}

.formulaire .label {margin-bottom:1rem;}
.formulaire input, .formulaire textarea {width:100%; border:0; background:var(--blanc);}
.formulaire input:hover, .formulaire textarea:hover, .formulaire input:focus, .formulaire textarea:focus {background:rgba(255,255,255,.65);}

.mailerlite-form-inputs {grid-gap:1.5rem;}
.mailerlite-form input {border:0; height: var(--pad50);}

.mailerlite-form-error {color:var(--gris2)!important;}

.wpcf7-checkbox {display:inline-block;}
.wpcf7-form input[type="radio"], .wpcf7-form input[type="checkbox"] {display: none;}
.wpcf7-list-item-label {cursor:pointer; left:3rem; width:calc(100% - 3rem); position:relative; display: flex;}

.wpcf7-radio {display:flex; column-gap: 3rem; row-gap:1rem; margin-bottom:0; flex-wrap: wrap;}
.wpcf7-form input[type="radio"] + .wpcf7-list-item-label::before, .wpcf7-form input[type="checkbox"] + .wpcf7-list-item-label::before {position: absolute; top:3px; left:-3rem;
background: none; background:none; border:0; border-radius:50%; display:inline-block; vertical-align:middle; height:25px; width:25px; content:''; transition:.2s;
border:2px solid var(--blanc);}
.wpcf7-form input[type="radio"]:checked + .wpcf7-list-item-label::before, .wpcf7-form input[type="checkbox"]:checked + .wpcf7-list-item-label::before {background:var(--blanc);}

::-webkit-input-placeholder {opacity:.5; -webkit-transition: opacity .5s; transition: opacity .5s;}
:-moz-placeholder {opacity:.5; -moz-transition: opacity .5s; transition: opacity .5s;}
::-moz-placeholder {opacity:.5; -moz-transition: opacity .5s; transition: opacity .5s;}
:-ms-input-placeholder {opacity:.5; -ms-transition: opacity .5s; transition: opacity .5s;}
::placeholder {opacity:.5; transition: opacity .5s;}

*:focus::-webkit-input-placeholder {opacity:.5;}
*:focus:-moz-placeholder {opacity:.5;}
*:focus::-moz-placeholder {opacity:.5;}
*:focus:-ms-input-placeholder {opacity:.5;}
*:focus::placeholder {opacity:.5;}

:invalid {box-shadow: none;}
:-moz-submit-invalid {box-shadow: none;}
:-moz-ui-invalid {box-shadow:none;}

.wpcf7-not-valid {background:var(--rouge)!important; color:var(--blanc);}
.wpcf7-acceptance.wpcf7-not-valid {border:0!important;}
.screen-reader-response, .wpcf7-response-output {display:none;}
.wpcf7-not-valid-tip, .mailerlite-form-error {color:rgba(255,255,255,.8); opacity:.5; font-size: .9rem; width: 100%; position: absolute; display: block; margin-top:.5rem;}
.mc4wp-alert.mc4wp-success {font-size: .9rem; margin-top:1.5rem; text-align: center;}

.wpcf7-form-control-wrap {display:none!important;}



/* FOOTER */

.footer {overflow:hidden;}
.footer-copyright a:before {content:''; position:absolute; bottom:-5px; left:0; width:100%; min-height:2px; height:2px; transform-origin:right; transform:scaleX(0); 
transition:transform .75s cubic-bezier(0.165, 0.84, 0.44, 1); background-color:var(--blanc);}
.footer-copyright a:hover::before {transform-origin:left;transform:scaleX(1);}
.numeroweb svg {width:85px; fill:var(--blanc);}
.marsrouge svg {height:auto; width:40px; position:relative; fill:var(--blanc);}



/* RESPONSIVE DESIGN */

@media screen and (max-width:1790px) {
	
	body, .font-n {font-size:1.4rem;}
	.font-size--d, .article h2 {font-size: 1.7rem;}
	.icone svg {height:3rem;}
	
}

@media screen and (max-width:1450px) {
	
	:root {
	  --logo: 90px;
	}
	
	body, .font-n, .contact .font-size--e {font-size:1.3rem; line-height:1.6;}
	.font-size--a {font-size:4.5vw;}
	.font-size--b {font-size:3vw;}
	.font-size--d, .article h2 {font-size: 1.5rem;}
	.font-size--e, .article h3, .formulaire .label {font-size:1rem;}
	.underline a.btn-contact::before {bottom:-15px; min-height:4px; height:4px;}
	
	.col-1-2 {grid-template-columns:1fr;}
	.contact {display: grid; grid-template-columns: 2fr 1fr 1fr;}
	
	.formulaire .grid-pad50 {grid-gap:4vw;}
	
	#Accueil.wrapper, #Page.wrapper {padding:var(--pad180) calc(var(--pad180) + var(--pad180)) var(--pad180) calc(var(--pad90) + var(--logo) + var(--pad90));}
	
	.article li:before, .contact li:before {width:10px; height:10px; top:12px;}
	
	#Accueil .content-50, #Page .content-50 {width:60%;}
	
}

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

	:root {
	--pad: 1rem;
	--pad35:1.5rem;
	--pad50:2rem;
	--pad90:3rem;
	--pad100:4rem;
	--pad180:5rem;
	}

	body, .font-n, .contact .font-size--e, .font-size--d, .article h2 {font-size:1.2rem; line-height:1.5;}

	.overlay-grid .croix-8, .overlay-grid .croix-9 {display:none;}
	.overlay-grid.scroll .croix-1, .overlay-grid.scroll .croix-2, .overlay-grid.scroll .croix-3, .overlay-grid.scroll .croix-4, .overlay-grid.scroll .croix-5, 
	.overlay-grid.scroll .croix-6, .overlay-grid.scroll .croix-7, .overlay-grid.scroll .croix-8, .overlay-grid.scroll .croix-9 {transform:scale(0); opacity:0;}

	#Accueil.wrapper, #Page.wrapper {padding:10rem var(--pad90) var(--pad90) var(--pad90); justify-content:flex-start;}
	#Accueil .content-50, #Page .content-50 {width:50%; margin-right:10%;}
	#Produits .wrapper, #Découvrir, #Contactez-nous, #Boes-Pliage.wrapper, .wrapper, .wrapper-lr {padding:var(--pad180) var(--pad90);}
	.wrapper-img {padding:var(--pad180) var(--pad90) var(--pad90) var(--pad90);}
	.footer-copyright {padding: var(--pad90);}
	
	.icone svg {height: 2rem;}
	
	.btn-discover svg, .btn-contact svg {width: .7rem;}
	
	.article li:before, .contact li:before {top:10px;}
	
	.col-5 {grid-template-columns: 1fr 1fr 1fr;}
	.col-5 .croix {display:none;}
	
	.formulaire .grid-pad50 {grid-gap:3rem;}
	.article ul, .contact ul {padding-left: var(--pad100); width: 80%;}
	.article li:before, .contact li:before {left:-2.1rem;}
	
}

@media screen and (max-width:1080px) {
	
	:root {
	--logo: 80px;
	}
	
	.wrapper-lr {padding: var(--pad90) var(--pad90) var(--pad180) var(--pad90);}
	
	#Accueil .content-50, #Page .content-50 {width:45%; margin-right:15%;}
	.overlay-grid .croix-3 {display:none;}
	
	.col-2, .col-5 {grid-template-columns:1fr;}
	
	.marquee, .marquee--item {height: 40vw;}
	.thumb {height: 27rem;}
	
	#Materiaux .col-3 {grid-template-columns:1fr;}
	
	.contact {grid-template-columns:1fr;}
	
	.footer-copyright {padding:var(--pad90); flex-direction:column; grid-gap:var(--pad90); align-items: flex-start;}
	
	.wpcf7-form input[type="radio"] + .wpcf7-list-item-label::before, .wpcf7-form input[type="checkbox"] + .wpcf7-list-item-label::before {height:15px; width:15px;}
	
}

@media screen and (max-width:690px) {
	
	body, .font-n, .contact .font-size--e, .font-size--d, .article h2 {font-size:1.1rem;}
	.font-size--a {font-size:5.5vw; line-height:1.2;}
	.font-size--b, .font-size--c {font-size: 4vw;}
	
	.overlay-grid {display:none;}
	
	.col-3 {grid-template-columns: 1fr 1fr;}
	.content-65, .content-70 {width: 100%;}
	
	#Accueil .content-50, #Page .content-50 {width:80%; margin-right:20%;}
	#Materiaux .row-gap90 {row-gap: var(--pad100);}
	#Contactez-nous .grid-pad90 {grid-gap:var(--pad100);}
	
	.btn-contact {display:flex; flex-direction:column; align-items:center; grid-gap:var(--pad);}
	.underline a.btn-contact:before {content:none;}
	
	.marquee, .marquee--item {height: 50vw;}
	
	.article h2 {margin: var(--pad100) 0 1rem 0;}
	.article h2:first-child {margin: 0 0 1rem 0;}
	.article ul, .contact ul {width: 100%;}
	
	.footer-copyright a:before {bottom: -3px;}
	
}

@media screen and (max-width:520px) {
	
	:root {
	--pad: 1rem;
	--pad35: 1.5rem;
	--pad50: 2rem;
	--pad90: 2rem;
	--pad100: 4rem;
	--pad180: 4rem;
	--logo: 70px;
	}
	
	input, textarea {padding: 1rem;}
	
	body, .font-n, .contact .font-size--e, .font-size--d, .article h2 {font-size: 1rem; line-height: 1.6;}
	.font-size--a {font-size:6.5vw;}
	.btn-contact .font-size--a {font-size:6vw;}
	.font-size--b, .font-size--c {font-size:5.5vw;}
	.font-size--e, .article h3, .formulaire .label {font-size:.9rem;}
	
	.underline a:before, button[type="submit"]:before {min-height:1px; height:1px;}
	
	.col-3 {grid-template-columns: 1fr;}
	
	.btn-discover, .btn-contact .btn-contact--icon {width:3rem; height:3rem;}
	
	.height-100 {height:90vh;}
	
	#Arguments {text-align:center;}
	.icone {grid-gap:1rem;}
	.col-5 .icone {align-items: center;}
	
	.thumb {height: 15rem;}
	
	.footer-copyright .underline {flex-direction:column; grid-gap: 1rem; align-items: flex-start;}
	
}