@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700&display=swap');

:root{
    --rouge:#fc535c;
    --bleu:#000037;
    --vert:#004927;
    --gris:#63656a;
    --blanc:#FFF;
    --noir:#000;
	--parDefaut:#454545;
}

html {box-sizing:border-box;}
*, *:before, *:after {box-sizing: inherit;}
body {overflow-x:clip;margin:0px;font-family:'Montserrat',sans-serif;font-size:14px;color:var(--parDefaut);height:100vh;display:flex;flex-direction:column;justify-content:space-between;}
a{text-decoration:none;color:inherit;}
/*a:hover{color:inherit;}*/
p{margin:10px;}
fieldset{border:none;}
form{width:100%;max-width:550px;}
label{text-align:left;margin-left:5px;display:block;margin-top:10px;}
input:focus{outline:none;}
input::placeholder{color:var(--parDefaut);font-size:1.2em;}
input, textarea{padding-left:10px;}
input[type="text"], input[type="tel"], input[type="email"], input[type="password"]{width:100%;border:1px solid #ccc;height:25px;}
input[type="number"]{border:1px solid #ccc;height:25px;}
select{width:25%;border:1px solid #ccc;height:25px;}
textarea{width:100%;border:1px solid #ccc;height:100px;}
button:focus{outline:none;}
::placeholder {color:inherit;opacity:1;}/* Firefox */
:-ms-input-placeholder {color:inherit;}/* Internet Explorer 10-11 */
::-ms-input-placeholder {color:inherit;}/* Microsoft Edge */
h1{font-weight:normal;font-size:2.5em;}
h2, h3{font-weight:normal;margin:10px 0;}

#sidr{display:none;}
#mask{display:none;background:var(--noir);position:fixed;left:0;top:0;width:100%;height:100%;opacity:0.8;z-index:999;}
#menuMobile{display:none;}
#ariane{width:100%;padding:4px 4px 4px 10px;color:rgba(0,0,0,0.50)}
#retourHaut{position:fixed;z-index:100;bottom:50px;right:50px;opacity:0;}
#header{width:100%;display:inline-block;z-index:2;}
#headerBandeHaut{width:100%;height:72px;display:flex;position:fixed;top:0px;}
#logo{display:inline-block;margin:auto 45px;padding:5px;}
#logo img{width:140px;}
#headerBackground{aspect-ratio:5/1;width:100%;z-index:-2;background-color:rgb(0 0 0 / 30%);background-blend-mode: multiply;display:flex;margin-bottom:10px;}
#headerBackground{opacity:0;}
#headerBackground.is-ready{opacity:1;transition-duration:1000ms;}
#cssmenu{text-transform:uppercase;text-align:center;display:flex;position:absolute;right:10px;}
#cssmenu > ul{list-style-type:none;margin:auto;display:inline-flex;}
#cssmenu > ul li.has-sub{position:relative;z-index:2;}
#cssmenu > ul li.has-sub:hover ul{display:block;}
#cssmenu > ul li.has-sub ul{display:none;position:absolute;margin:0;padding:0;list-style-type:none;border-bottom:1px solid #e5e5e5;width:100%;}
#cssmenu > ul li.has-sub ul li{display:block;padding:0px;border:none;border-bottom:1px solid #e5e5e5;text-align:left;}
#cssmenu > ul li{margin:auto;}
#cssmenu > ul li a{display:block;text-decoration:none;color:#FFF;padding:20px;}
#cssmenu > ul li span{display:block;text-decoration:none;color:#FFF;padding:20px;}
#cssmenu > ul li a.active, #cssmenu > ul li a:hover{background:#fc535c;color:#FFF;}
#cssmenu > ul li span:hover{background:#fc535c;color:#FFF;}
#panierTotal{position:absolute;padding:4px;border-radius:20px;aspect-ratio:2.8/1;text-align:center;right:5px;top:8px;}
#container{width:100%;margin-bottom:auto;margin-top:54px;}
#container{opacity:0;}
#container.is-ready{opacity:1;transition-duration:500ms;}
#containerGauche{float:left;width:50%;aspect-ratio:1/1;background-position:center;background-size:80%;background-repeat:no-repeat;}
#containerDroite{float:right;width:50%;}
#footer{width:100%;padding:10px;position:relative;}

.spacer{display:block;padding:40px;}
.mobile{display:none;}
.popup{display:none;background:#FFF;padding:10px;border:2px solid #ddd;float:left;position:fixed;top:50%;left:50%;z-index:99999;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px 3px 3px 3px;width:100%;max-width:310px;}
.close{cursor:pointer;position:relative;margin-bottom:10px;display:block;text-align:right;}
.x0{font-size:0.8rem;}
.x1{font-size:1rem;}
.x2{font-size:1.5em;}
.x3{font-size:3em;}
.x4{font-size:4em;}
.x5{font-size:5em;}
.x7{font-size:7em;}
.svgBlanc{filter:invert(97%) sepia(97%) saturate(13%) hue-rotate(196deg) brightness(103%) contrast(103%);}
.rouge{color:var(--rouge);}
.rougeFond{background-color:var(--rouge);}
.bleu{color:var(--bleu);}
.bleuFond{background-color:var(--bleu);}
.vert{color:var(--vert);}
.vertFond{background-color:var(--vert);}
.gris{color:var(--gris);}
.grisFond{background-color:var(--gris);}
.blanc{color:var(--blanc);}
.blancFond{background-color:var(--blanc);}
.gras{font-weight:700;}
.majuscule{text-transform:uppercase;}
.centre{text-align:center;}
.gauche{text-align:left;}
.droite{text-align:right;}
.justifier{text-align:justify;}
.parDefaut{clear:both;}
.fixe{position:fixed;}
.noselect{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}
.rowParagraphe{display:inline-flex;position:relative;width:100%;place-content:space-evenly;}
.rowParagraphe img{width:100%;object-fit:scale-down;}
.rowParagrapheScore{display:inline-flex;position:relative;width:inherit;place-content:space-evenly;}
.galerie{display:grid;grid-template-columns:repeat(4, 1fr);grid-gap:5px;}
.galerieThumbnail{break-inside:avoid-column;}
/*.galerie2{display:grid;grid-template-columns:repeat(3, 1fr);grid-gap:5px;padding:20px;}*/
.galerie1{display:grid;grid-template-columns:repeat(1, 1fr);}
.galerie2{display:grid;grid-template-columns:repeat(2, 1fr);grid-column-gap:3%;}
.galerie2fixe{display:grid;grid-template-columns:repeat(2, 1fr);grid-column-gap:4%;}
.galerie3{display:grid;grid-template-columns:repeat(3, 1fr);grid-column-gap:4%;}
.galerie3b{display:grid;grid-template-columns:repeat(3, 1fr);}
.galerie3fixe{display:grid;grid-template-columns:repeat(3, 1fr);grid-column-gap:4%;}
.galerie4{display:grid;grid-template-columns:repeat(4, 1fr);grid-column-gap:1%;grid-row-gap:1%;}
.galerie4b{display:grid;grid-template-columns:repeat(4, 1fr);grid-column-gap:1%;}
.galerie5{display:grid;grid-template-columns:repeat(5, 1fr);}
.miniature{width:100%;aspect-ratio:1/1;background-size:contain;background-position:center;background-repeat:no-repeat;justify-content:space-around;display:flex;flex-direction:column;padding:10px;text-align:center;}
.miniatureInfos{opacity:0;}
.miniature:hover{background-color:rgb(0 73 39 / 70%);background-blend-mode:multiply;transition-duration:500ms;}
.miniature:hover .miniatureInfos{opacity:1;transition-duration:500ms;}
.galerieDetail{margin:auto;}
.galerieImage img{border:2px solid;-moz-border-radius:50%;-webkit-border-radius:50%;border-radius:50%;margin:10px;width:100px;height:100px;}
.detail{width:90%;margin:auto;}
.button{border:none;-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;cursor:pointer;display:inline-block;padding:10px;margin-top:10px;align-content:center;min-height:38px;}
.button:hover{background-image:linear-gradient(-16deg, #ffffff63 45%, #00000000 59%, #ffffff7a);}
.containerForm{width:100%;max-width:550px;margin:auto;}
.containerContenu{clear:both;width:100%;max-width:1280px;margin:auto;position:relative;z-index:0;}
.col2{width:100%;}

.slide{-webkit-animation:slidetoLeft 900ms forwards;-moz-animation:slidetoLeft 900ms forwards;-ms-animation:slidetoLeft 900ms forwards;-o-animation:slidetoLeft 900ms forwards;animation:slidetoLeft 900ms forwards;}
.slideReverse{-webkit-animation:slidetoRight 900ms forwards;-moz-animation:slidetoRight 900ms forwards;-ms-animation:slidetoRight 900ms forwards;-o-animation:slidetoRight 900ms forwards;animation:slidetoRight 900ms forwards;}
.slideTop{-webkit-animation:slidetoTop 900ms forwards;-moz-animation:slidetoTop 900ms forwards;-ms-animation:slidetoTop 900ms forwards;-o-animation:slidetoTop 900ms forwards;animation:slidetoTop 900ms forwards;}

@media (max-width:1370px) {
	#cssmenu{font-size:0.9em;}
	#cssmenu > ul li a{padding:20px 10px;}
    .galerie{display:grid;grid-template-columns:repeat(3, 1fr);grid-gap:5px;}
}
@media (max-width:684px) {
    select{width:100%;}
    h1, h2{text-align:center;}
    #sidr{display:block;}
    #menuMobile{display:block;margin:auto 20px;width:100%;text-align:right;}
    #menuMobile span{font-size:xx-large;}
    #cssmenu{display:none;}
	#headerBackground{aspect-ratio: 1.5 / 1;}
    #containerGauche{width:100%;float:none;}
	#containerGauche {width:100%;float:none;align-content:center;display:grid;aspect-ratio:1.5 / 1;background-position:center;background-size:60%;background-repeat:no-repeat;}
    #containerDroite{width:100%;margin:auto;float:none;padding:0 15px;}
	#retourHaut {bottom:20px;right:10px;}
    .fixe{position:relative;}
    .galerie{display:grid;grid-template-columns:repeat(2, 1fr);grid-gap:5px;}
    .galerie2{display:grid;grid-template-columns:repeat(1, 1fr);grid-column-gap:4%;}
    .galerie3{display:grid;grid-template-columns:repeat(1, 1fr);grid-column-gap:4%;}
	.galerie3b{display:grid;grid-template-columns:repeat(1, 1fr);padding:30px;}
    .pc{display:none;}
    .mobile{display:block;}
    .rowParagraphe{display:block;}
}

/* Animations  //////////////////////////////////////////////////////////////////////////////*/
@-webkit-keyframes 	slidetoTop {0% {transform: translateY(-1000px);opacity:0;} 50% {opacity:0.5;} 100% {transform: translateY(0px);opacity:1;}}
@-moz-keyframes 	slidetoTop {0% {transform: translateY(-1000px);opacity:0;} 50% {opacity:0.5;} 100% {transform: translateY(0px);opacity:1;}}
@-ms-keyframes 		slidetoTop {0% {transform: translateY(-1000px);opacity:0;} 50% {opacity:0.5;} 100% {transform: translateY(0px);opacity:1;}}
@-o-keyframes 		slidetoTop {0% {transform: translateY(-1000px);opacity:0;} 50% {opacity:0.5;} 100% {transform: translateY(0px);opacity:1;}}
@keyframes 			slidetoTop {0% {transform: translateY(-1000px);opacity:0;} 50% {opacity:0.5;} 100% {transform: translateY(0px);opacity:1;}}

@-webkit-keyframes 	slidetoLeft {0% {transform: translateX(-1000px);opacity:0;} 50% {opacity:0.5;} 100% {transform: translateX(0px);opacity:1;}}
@-moz-keyframes 	slidetoLeft {0% {transform: translateX(-1000px);opacity:0;} 50% {opacity:0.5;} 100% {transform: translateX(0px);opacity:1;}}
@-ms-keyframes 		slidetoLeft {0% {transform: translateX(-1000px);opacity:0;} 50% {opacity:0.5;} 100% {transform: translateX(0px);opacity:1;}}
@-o-keyframes 		slidetoLeft {0% {transform: translateX(-1000px);opacity:0;} 50% {opacity:0.5;} 100% {transform: translateX(0px);opacity:1;}}
@keyframes 			slidetoLeft {0% {transform: translateX(-1000px);opacity:0;} 50% {opacity:0.5;} 100% {transform: translateX(0px);opacity:1;}}

@-webkit-keyframes 	slidetoRight {0% {transform: translateX(1000px);opacity:0;} 50% {opacity:0.5;} 100% {transform: translateX(0px);opacity:1;}}
@-moz-keyframes 	slidetoRight {0% {transform: translateX(1000px);opacity:0;} 50% {opacity:0.5;} 100% {transform: translateX(0px);opacity:1;}}
@-ms-keyframes 		slidetoRight {0% {transform: translateX(1000px);opacity:0;} 50% {opacity:0.5;} 100% {transform: translateX(0px);opacity:1;}}
@-o-keyframes 		slidetoRight {0% {transform: translateX(1000px);opacity:0;} 50% {opacity:0.5;} 100% {transform: translateX(0px);opacity:1;}}
@keyframes 			slidetoRight {0% {transform: translateX(1000px);opacity:0;} 50% {opacity:0.5;} 100% {transform: translateX(0px);opacity:1;}}