/* 
Theme Name: CRCC Module
Author: Solis Rea
Version: 1.0.4
*/

@font-face{font-display:swap;font-family:'Manrope';font-style:normal;font-weight:300;src: url('../fonts/manrope-v20-latin-300.woff2') format('woff2')}
@font-face{font-display:swap;font-family:'Manrope';font-style:normal;font-weight:400;src: url('../fonts/manrope-v20-latin-regular.woff2') format('woff2')}
@font-face{font-display:swap;font-family:'Manrope';font-style:normal;font-weight:500;src: url('../fonts/manrope-v20-latin-500.woff2') format('woff2')}
@font-face{font-display:swap;font-family:'Manrope';font-style:normal;font-weight:600;src: url('../fonts/manrope-v20-latin-600.woff2') format('woff2')}
@font-face{font-display:swap;font-family:'Manrope';font-style:normal;font-weight:700;src: url('../fonts/manrope-v20-latin-700.woff2') format('woff2')}
@font-face{font-display:swap;font-family:'Manrope';font-style:normal;font-weight:800;src: url('../fonts/manrope-v20-latin-800.woff2') format('woff2')}

/* ROOT
========================================================================== */
:root {
	--system-ui: system-ui, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
	/* Fluide Font Size */
	/* @link https://utopia.fyi/clamp/calculator/?a=480,1280,18%E2%80%9420 */
	--fs-20-18: clamp(1.125rem, 1.05rem + 0.25vw, 1.25rem);
	--fs-15-14: clamp(0.875rem, 0.8375rem + 0.125vw, 0.9375rem);
	--fs-14-13: clamp(0.8125rem, 0.775rem + 0.125vw, 0.875rem);
	/* Espacement facteur 480/14 > 1280/16 */
	/* https://utopia.fyi/space/calculator?c=480,14,1.2,1280,16,1.25,5,2,&s=0.75|0.5|0.25,1.5|2|3|4|6,s-l&g=s,l,xl,12 */
	--space-4: clamp(0.25rem, 0.25rem + 0vw, 0.25rem);
	--space-8: clamp(0.4375rem, 0.4rem + 0.125vw, 0.5rem);
	--space-12: clamp(0.6875rem, 0.65rem + 0.125vw, 0.75rem);
	--space-16: clamp(0.875rem, 0.8rem + 0.25vw, 1rem);
	--space-24: clamp(1.3125rem, 1.2rem + 0.375vw, 1.5rem);
	--space-32: clamp(1.75rem, 1.6rem + 0.5vw, 2rem);
	--space-48: clamp(2.625rem, 2.4rem + 0.75vw, 3rem);
	--space-64: clamp(3.5rem, 3.2rem + 1vw, 4rem);
	--space-96: clamp(5.25rem, 4.8rem + 1.5vw, 6rem);
	/* Couleurs */
	--colBleuNoir:rgb(4, 25, 78); 		/* #04194E */
	--colBleuFonce:rgb(18, 45, 109); 	/* #122D6D */
	--colBleuEffet:rgb(0, 73, 135); 	/* #004987 */
	--colBleuTypo:rgb(11, 37, 99); 	/* #0B2563 */
	--colBleuClair:rgb(235, 240, 245); /* #EAF0F5 */
	--colBleuUi:rgb(59, 91, 168); 		/* #3B5BA8 */
	--colBlanc:rgb(255, 255, 255); 	/* #FFFFFF */
	--colBeige:rgb(247, 244, 241); 	/* #F7F4F1 */
	--colOrange:rgb(231, 84, 14); 		/* #E7540E */
	--colGris: rgb(244, 244, 244);		/* #F4F4F4 */
	--colGrisUi: rgb(210, 210, 210);	/* #F4F4F4 */
	/* Grille */
	--rowA1: calc( (100% - (11 * var(--space-16)) ) / 12 );
	--rowA2: calc( (var(--rowA1) * 2) + (var(--space-16) * 1));
	--rowA3: calc( (var(--rowA1) * 3) + (var(--space-16) * 2));
	--rowA4: calc( (var(--rowA1) * 4) + (var(--space-16) * 3));
	--rowA5: calc( (var(--rowA1) * 5) + (var(--space-16) * 4));
	--rowA6: calc( (var(--rowA1) * 6) + (var(--space-16) * 5));
	--rowA7: calc( (var(--rowA1) * 7) + (var(--space-16) * 6));
	--rowA8: calc( (var(--rowA1) * 8) + (var(--space-16) * 7));
	--rowA9: calc( (var(--rowA1) * 9) + (var(--space-16) * 8));
	--rowA10: calc( (var(--rowA1) * 10) + (var(--space-16) * 9));
	--rowA11: calc( (var(--rowA1) * 11) + (var(--space-16) * 10));
	--rowA12: 100%;
	/* Autres */
	--transitionBtn: color 0.3s ease, background-color 0.3s ease;
	/* Animations */
	--colShapesLog:rgb(68, 48, 10); 			/* #EEE9E3 Toutes les formes de l'anim */
	--colShapesFooter:rgb(238, 233, 227);		/* #EEE9E3 Ex: Toutes les formes du footer */
	--borderRadius: 4px;
	--midBorderRadius: 8px;
	--largeBorderRadius: 16px;
}


/* BASE
========================================================================== */
html{scroll-behavior:smooth}
html,body{height:100%;font-family:var(--system-ui)}
body > footer{position:sticky;top:100vh}
body{font-size:var(--fs-15-14);height:100%;line-height:normal;color:var(--colBleuTypo);background-color:var(--colBlanc);font-family:'Manrope';font-style:normal;font-weight:400; /*;overflow-x:hidden*/ }
a{cursor:pointer;color:inherit;text-decoration:none}
a:hover,a:active,a:focus{outline:0;outline:none;cursor:pointer;text-decoration:none}
::selection{background:var(--colBleuNoir);color:var(--colBlanc);text-shadow:none}
a[href^=tel],a[href^=sms]{color:inherit;cursor:default;text-decoration:none}
select:focus, input:focus{outline:none}
img{display:block;text-align:center;font-size:12px;line-height:1}
img.imgResp{width:100%;max-width:100%;height:auto}
img.imgObFit{width:100%;height:100%;object-fit:cover;object-position:center}
strong{font-style:normal;font-weight:600}
h1,h2,h3,h4{text-wrap:balance}
/* Image Ratio */
.imgRatio1{display:block;width:100%;height:auto;max-width:100%;aspect-ratio:1;border-radius:var(--midBorderRadius)}
.imgRatio54{display:block;width:100%;height:auto;max-width:100%;aspect-ratio:5/4;border-radius:var(--midBorderRadius)}
/* Image object */
.imgFitCover{display:block;width:100%;height:100%;object-fit:cover;object-position:center;border-radius:var(--midBorderRadius)}
/* CTA */
.cta{display:flex;flex-flow:row wrap;justify-content:flex-start;align-items:flex-start;gap:8px;margin:8px 0}
.cta a{display:inline-block;padding:8px 12px;color:var(--colBlanc);background-color:var(--colBleuFonce);white-space:nowrap;border-radius:var(--borderRadius);border:2px solid transparent;transition:all 0.3s ease}
.cta a:hover{background-color:var(--colBlanc);color:var(--colBleuFonce);border:2px solid var(--colBleuFonce);transition:all 0.3s ease}
.cta16{flex:0 0 auto;font-size:16px;font-weight:500;text-transform:uppercase;line-height:1;white-space:nowrap}



/* LOGIN
========================================================================== */
body#crcclog{overflow:hidden}
.fondLogVnoir{position:relative;width:100vw;height:100vh;height:100dvh;background-color:var(--colBleuNoir)}
.fondLogVblanc{position:relative;width:100vw;height:100vh;height:100dvh;background-color:var(--colBlanc)}
	main#blocLog{width:100%;max-width:341px;height:100%;max-height:513px;position:absolute;left:calc(50% - 5px);top:50%;transform:translate(-50%, -50%);background-color:var(--colBleuFonce)}
	.flexLog{display:flex;flex-flow:column nowrap;align-items:center;height:100%}
		.logLogo{flex:0 0 200px;align-content:center}
			.logLogo img{display:block;height:90px;width:auto}
		.logIntro{flex:0 0 auto;width:100%;color:var(--colBlanc);font-size:12px;padding:var(--space-24) 22%;text-align:center}
		.logForm{flex:1 1 auto;width:100%;align-content:center}
			.blocLogInput{width:calc(100% - 100px);margin:0 auto;padding-bottom:var(--space-24)}
				.blocLogInput input[type="text"],.blocLogInput input[type="password"]{width:100%;font-size:14px;color:var(--colBlanc);padding:3px;border:0;border-bottom:1px solid var(--colBlanc)}
				.blocLogInput input::placeholder{font-size:13px;color:var(--colBlanc)}
			.blocLogSubmit{width:100%;margin:0 auto;padding:var(--space-8) 0 var(--space-16) 0}
				.blocLogSubmit input[type="submit"]{display:block;margin:0 auto;padding:10px 24px;background-color:var(--colBleuNoir);color:var(--colBlanc);text-transform:uppercase;font-size:16px;font-weight:500;transition:var(--transitionBtn)}
				.blocLogSubmit input[type="submit"]:hover{background-color:var(--colBeige);color:var(--colBleuTypo);transition:var(--transitionBtn)}
		.logForgot{flex:0 0 auto;width:100%;padding:8px}
			.logForgot a{display:block;font-size:12px;color:var(--colBlanc);padding:8px;text-align:center}
			.logForgot a:hover{text-decoration:underline}
/* AnimLogin */
.boxs{width:601px;height:771px;font-size:0;position:absolute;left:50%;top:50%;transform:translate(-50%, -50%);overflow:hidden}
.boxs .box{position:relative;display:inline-block;width:43px;height:43px;border:2px solid var(--colBleuNoir);overflow:hidden}
.boxs .box > span{position:absolute;background-color:var(--colBleuNoir)}
.boxs .box > span.carre{width:43px;height:43px;background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="27.474" height="36" viewBox="0 0 27.474 36"><path d="M35.4-322a14.086,14.086,0,0,1-7.385-2.011,14.19,14.19,0,0,1-5.352-5.984,21.709,21.709,0,0,1-2-9.824,22.29,22.29,0,0,1,1.967-9.775,14.423,14.423,0,0,1,5.541-6.239A15.867,15.867,0,0,1,36.565-358a23.13,23.13,0,0,1,5.294.635,35.781,35.781,0,0,1,5.771,1.937l-.443,8.9H43.023l-1.2-5.8,1.2,1.137a19.8,19.8,0,0,0-3.279-1.03,14.017,14.017,0,0,0-2.934-.338,7.652,7.652,0,0,0-4.7,1.417,8.664,8.664,0,0,0-2.885,4.08,18.478,18.478,0,0,0-.983,6.387,19.669,19.669,0,0,0,1.147,7.22,9.251,9.251,0,0,0,3.18,4.31,7.828,7.828,0,0,0,4.606,1.426,11.359,11.359,0,0,0,4.065-.824,16.758,16.758,0,0,0,4.295-2.505l2.606,4.088a22.581,22.581,0,0,1-6.335,3.733A18.138,18.138,0,0,1,35.4-322Z" transform="translate(-20.664 358)" fill="%23fff"/></svg>');}
.boxs .box > span.rond{width:43px;height:43px;background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="27.474" height="36" viewBox="0 0 27.474 36"><path d="M35.4-322a14.086,14.086,0,0,1-7.385-2.011,14.19,14.19,0,0,1-5.352-5.984,21.709,21.709,0,0,1-2-9.824,22.29,22.29,0,0,1,1.967-9.775,14.423,14.423,0,0,1,5.541-6.239A15.867,15.867,0,0,1,36.565-358a23.13,23.13,0,0,1,5.294.635,35.781,35.781,0,0,1,5.771,1.937l-.443,8.9H43.023l-1.2-5.8,1.2,1.137a19.8,19.8,0,0,0-3.279-1.03,14.017,14.017,0,0,0-2.934-.338,7.652,7.652,0,0,0-4.7,1.417,8.664,8.664,0,0,0-2.885,4.08,18.478,18.478,0,0,0-.983,6.387,19.669,19.669,0,0,0,1.147,7.22,9.251,9.251,0,0,0,3.18,4.31,7.828,7.828,0,0,0,4.606,1.426,11.359,11.359,0,0,0,4.065-.824,16.758,16.758,0,0,0,4.295-2.505l2.606,4.088a22.581,22.581,0,0,1-6.335,3.733A18.138,18.138,0,0,1,35.4-322Z" transform="translate(-20.664 358)" fill="%2380a4c3"/></svg>');}
.boxs .box > span.coin{width:43px;height:43px;background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="31.518" height="36" viewBox="0 0 31.518 36"><path d="M18.164-316v-3.665l4.688-1.363-.937,1.432v-28.6l1.312,1.534-5.063-1.414v-3.665L29.534-352h4.977q6.136,0,9.264,2.557A8.963,8.963,0,0,1,46.9-342.08a9.96,9.96,0,0,1-2.634,7.1q-2.634,2.8-8.259,3.451l.034-.835a8.947,8.947,0,0,1,3.273.63,5.9,5.9,0,0,1,2.131,1.551,12.066,12.066,0,0,1,1.568,2.386l4.074,7.875-2.08-1.312,4.671,1.568V-316h-8.37l-4.619-9.853a24.773,24.773,0,0,0-1.577-3.017,3.517,3.517,0,0,0-1.628-1.423,7.473,7.473,0,0,0-2.8-.349l-2.659.034,1.21-1.04V-319.6l-.972-1.466,5.148,1.4V-316Zm11.08-17.881-1.21-1.823h4.228a8.311,8.311,0,0,0,5.369-1.483,5.358,5.358,0,0,0,1.807-4.4A5.006,5.006,0,0,0,38-345.4a6.21,6.21,0,0,0-4.406-1.364H28.033l1.21-1.142Z" transform="translate(-18.164 352)" fill="%23bfd1e1" opacity="0.999"/></svg>');}
.boxs .box > span.sphere{width:43px;height:43px;background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="27.474" height="36" viewBox="0 0 27.474 36"><path d="M35.4-322a14.086,14.086,0,0,1-7.385-2.011,14.19,14.19,0,0,1-5.352-5.984,21.709,21.709,0,0,1-2-9.824,22.29,22.29,0,0,1,1.967-9.775,14.423,14.423,0,0,1,5.541-6.239A15.867,15.867,0,0,1,36.565-358a23.13,23.13,0,0,1,5.294.635,35.781,35.781,0,0,1,5.771,1.937l-.443,8.9H43.023l-1.2-5.8,1.2,1.137a19.8,19.8,0,0,0-3.279-1.03,14.017,14.017,0,0,0-2.934-.338,7.652,7.652,0,0,0-4.7,1.417,8.664,8.664,0,0,0-2.885,4.08,18.478,18.478,0,0,0-.983,6.387,19.669,19.669,0,0,0,1.147,7.22,9.251,9.251,0,0,0,3.18,4.31,7.828,7.828,0,0,0,4.606,1.426,11.359,11.359,0,0,0,4.065-.824,16.758,16.758,0,0,0,4.295-2.505l2.606,4.088a22.581,22.581,0,0,1-6.335,3.733A18.138,18.138,0,0,1,35.4-322Z" transform="translate(-20.664 358)" fill="%234077a5"/></svg>');}
.boxs .box > span.vide{width:39px;height:39px;background-color:var(--colBleuNoir)}




/* UI 
========================================================================== */
/* Formulaires */
.blocInput input:invalid, .blocSubmit input:invalid{border-bottom:1px solid var(--colOrBtn)}

button{width:100%;border:1px solid var(--colBleuNoir);padding:4px 8px;font-weight:700;font-size:14px}
select{width:100%;border:1px solid var(--colBleuNoir);padding:4px 8px;font-weight:500}

/* Paragraphes 
p,.paragraphe{display:block;line-height:1.2;padding-bottom:var(--space-16)}
p strong{font-style:normal;font-weight:700}
p a{text-decoration:underline}
*/


/* Call to Action 
.cta{display:inline-flex;flex-flow:column nowrap;justify-content:center;align-items:center}
.cta a{flex:0 0 auto;padding:8px 16px;white-space:nowrap;text-transform:uppercase;transition:var(--transitionAll)}
.cta.t16 a{font-size:15px;text-transform:uppercase;font-weight:700}
.cta.t14 a{font-size:13px;text-transform:uppercase;font-weight:700}
.cta.colNoir a{border:2px solid var(--colBleuNoir);background-color:var(--colBleuNoir);color:var(--colBlanc)}
.cta.colOr a{border:2px solid var(--colOr);background-color:var(--colOr);color:var(--colBlanc)}
.cta.colNoir a:hover{border:2px solid var(--colBleuNoir);background-color:var(--colBlanc);color:var(--colBleuNoir)}
.cta.colOr a:hover{border:2px solid var(--colOr);background-color:var(--colBlanc);color:var(--colOr)}
.cta a:hover{transition:var(--transitionAll)}
.cta.alone{display:inline-flex;align-items:flex-start;margin:0 6px 6px 0}
.cta.centered{display:flex;align-items:center;margin:0}
*/

/* HEADER
========================================================================== */
body#crcc{background-color:var(--colBeige)}
.mainContent{flex:1 0 auto;padding:0 0 var(--space-32) 0}

header{display:block;width:100%;height:auto;background-color:var(--colBleuNoir);overflow:hidden}
	.wrapperHeader{width:100%;max-width:1296px;margin:0 auto}
		.flexHeader{display:flex;flex-flow:row nowrap;justify-content:space-between;padding:var(--space-16);align-items:flex-end}
			.logoClient{flex:0 0 auto;margin-right:var(--space-8)}
				.logoClient img{display:inline-block;vertical-align:bottom;width:auto;height:100%;max-height:70px}
				.logoClient p{display:inline-block;vertical-align:bottom;color:var(--colBlanc);font-size:var(--fs-14-13);padding:2px var(--space-8);line-height:1.2}
			.connexion{flex:0 0 auto;margin-left:var(--space-8)}
				.logUser{display:inline-block;vertical-align:middle;font-size:var(--fs-14-13);color:var(--colBlanc);padding:2px var(--space-8);line-height:1.2}
				.logUser br{display:none}
				.logUser span{white-space:nowrap}
				.logOnOff{display:inline-block;vertical-align:middle}
					.logOnOff img{display:block;width:auto;height:100%;max-height:var(--space-24)}


/* MAIN
========================================================================== */
/* Menu */
.blocMenu{display:block;width:100%;height:auto;background-color:var(--colBlancFond);overflow:hidden}
	.wrapperMenu{width:100%;max-width:1296px;padding:var(--space-24) var(--space-8) var(--space-8) var(--space-8);margin:0 auto}
		.navPrincipale{display:flex;flex-flow:row nowrap;padding:var(--space-8) 0;gap:8px;border-bottom:2px solid var(--colBleuNoir)}
			.navPrincipale .navItems{flex:0 0 auto}
			.navPrincipale .navItems a{display:inline-block;padding:var(--space-8);text-transform:uppercase;font-weight:500;font-size:var(--fs-15-14);background-color:var(--colBlanc);color:var(--colBleuNoir)}
			.navPrincipale .navItems.active a, .navPrincipale .navItems a:hover{background-color:var(--colBleuNoir);color:var(--colBlanc);transition:var(--transitionBtn)}
main.wrapperMain{width:100%;max-width:1296px;padding:var(--space-8);margin:0 auto}	

/* Informations de page */
	.flexContentInfo{display:flex;flex-flow:row wrap;justify-content:flex-start;align-items:flex-start;gap:var(--space-16)}
		.blocPageInfo{flex:0 0 100%;font-size:var(--fs-14-13);margin-bottom:var(--space-16);background-color:var(--colBlanc)}
			ul.blocInfo{display:flex;flex-flow:row wrap;gap:var(--space-16);justify-content:flex-start;align-items:stretch}
			ul.blocInfo li{padding:var(--space-16);text-align:center;background-color:var(--colBeige);border-radius:var(--midBorderRadius)}
			ul.blocInfo li span{font-style:italic;font-size:12px;white-space:nowrap}
			ul.blocInfo a{display:inline-block}
			ul.blocInfo li.suivi{flex:0 0 var(--rowA3);text-align:left}
			ul.blocInfo li.suivi a:hover{text-decoration:underline}
			ul.blocInfo li.charge{flex:0 0 var(--rowA3)}
					.pictoInfo{margin:16px auto 8px auto;width:100%;max-width:50px;height:auto}
			
.rowSem{display:flex;flex-flow:row nowrap;font-weight:800;padding:10px 0 6px 0;border-bottom:1px solid var(--colBleuNoir);align-items:center}
	.semOpen{flex:0 0 25px;padding:4px}
		.semOpen img{display:block;margin:0 auto;width:20px;height:auto}
	.semLib{flex:1 0 auto}
.rowTit{display:flex;flex-flow:row nowrap;padding:32px 10px 10px 10px;align-items:center}
	.semTit{flex:1 0 auto;font-size:var(--fs-20-18);font-weight:700}
.gridFrame{display:block;position:relative;width:100%;overflow:auto;overflow-x:auto;overflow-y:visible;padding:0}
.gridData{display:grid;position:relative;width:100%;grid-template-columns:200px 1fr 1fr 1fr 1fr 1fr 2fr 50px}
.gridTrace{display:grid;position:relative;width:100%;grid-template-columns:200px 1fr 1fr 2fr 1fr}
.gridModule{display:grid;position:relative;width:100%;grid-template-columns:95px 1fr 120px}
	.livHeader{border-right:1px solid var(--colBleuFonce);border-bottom:1px solid var(--colBleuFonce)}
	.livHeader{border-top:1px solid var(--colBleuFonce);border-left:1px solid var(--colBlanc);background-color:var(--colBleuFonce);color:var(--colBlanc)}
	.livHeader{position:sticky;top:0;z-index:1}
	.livHeader.livFixed{z-index:2;border-left:1px solid var(--colBleuFonce)}
	.livHeader{padding:8px;text-transform:uppercase;font-size:14px;font-weight:600}
	.livHeader.libAcces{text-align:center;border-right:1px solid var(--colBleuFonce)}
	.livFixed{position:sticky;left:0;border-left:1px solid var(--colBleuFonce)}
	.livData{background-color:var(--colBlanc);border-left:1px solid var(--colBleuFonce);border-bottom:1px solid var(--colBleuFonce)}
	.livData{padding:8px;font-size:14px;font-weight:500}
	.livData:hover{background-color:var(--colBleuNoir);color:var(--colBleuClair);border-left:1px solid var(--colBleuFonce);transition:var(--transitionBtn)}
	.livData.libAcces{border-right:1px solid var(--colBleuFonce)}
	.livData.libAcces img{display:block;margin:0 auto;width:20px;height:auto}
	.livData.libAcces:hover{background-color:var(--colOrange);color:var(--colBlanc);transition:var(--transitionBtn)}
	.livData.libInfo{text-overflow:ellipsis}
	.livData.livModu:hover{background-color:var(--colBlanc);color:var(--colBleuFonce);border-left:1px solid var(--colBleuFonce);transition:var(--transitionBtn)}
		.libok{background-color:olivedrab;color:var(--colBlanc)}
		.libattente{background-color:lightseagreen;color:var(--colBlanc)}
		.libko{background-color:tomato;color:var(--colBlanc)}
		.libneutre{background-color:var(--colGris);color:var(--colBleuNoir)}
		.libModule{text-align:center}
		.livModule{text-align:center;font-weight:700;font-size:var(--fs-20-18)}
			.imgingrid{display:block;padding:20px 6px}
			.imgingrid img{display:block;width:100%;height:auto;max-width:100%;margin:0 auto}
		.livDown{text-align:center;border-right:1px solid var(--colBleuFonce)}
		.livDown img{margin:0 auto}
		.livData.libFin, .livHeader.libFin{border-right:1px solid var(--colBleuFonce)}
		.traceLogin{background-color:var(--colGris)}
		.traceDownload{background-color:olivedrab;color:var(--colBlanc)}

/* Séparateurs */
.separateur{width:100%;padding:2px 0;margin-bottom:var(--space-16);background-image:url(../img/separateur.png);background-repeat:repeat-x;background-position:left center}
.separateur span{border:6px solid var(--colBlanc)}












.rowValidation{display:flex;flex-flow:row nowrap;gap:var(--space-16);align-items:center}
	.validTempo{flex:1 1 auto}
	.validCta{flex:0 0 var(--rowA4);padding:var(--space-16);text-align:right}
	.validLink{flex:0 0 var(--rowA5);padding:var(--space-16);text-align:right}
		.listeLink{display:block}
			.listeLink li{display:block;padding:2px 0;text-align:right}
			.listeLink li a{display:inline-block;font-weight:600;padding:2px}
			.listeLink li a:hover{text-decoration:underline;background-color:#EEE9E3}


/* FOOTER 
========================================================================== */
footer{flex:0 0 100px;background-image:url(../img/fond-footer.jpg);background-repeat:repeat-x;background-position:top center}
	.paraMentions{display:block;padding:53px 0 13px 0;font-size:13px;font-weight:600;text-align:center}


/* TRANSITIONS BURGER OK
========================================================================== */
.hamburger{cursor:pointer;transition-property:opacity,filter;transition-duration:0.15s;transition-timing-function:linear;font:inherit;color:inherit;text-transform:none;background-color:transparent;border:0;margin:0;overflow:visible}
.hamburger-box{width:44px;height:36px;padding:0;display:inline-block;position:relative}
.hamburger-inner{display:block;top:50%}
.hamburger-inner,.hamburger-inner::before, .hamburger-inner::after{width:36px;height:3px;background-color:var(--colEthiBleu);border-radius:1px;position:absolute;transition:transform 0.15s ease}
.hamburger-inner::before,.hamburger-inner::after{content:"";display:block}
.hamburger-inner::before{top:-10px}
.hamburger-inner::after{bottom:-10px}
.hamburger--spin-r .hamburger-inner{transition-duration: 0.3s;transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19)}
.hamburger--spin-r .hamburger-inner::before{transition: top 0.1s 0.34s ease-in, opacity 0.1s ease-in}
.hamburger--spin-r .hamburger-inner::after{transition: bottom 0.1s 0.34s ease-in, transform 0.3s cubic-bezier(0.55, 0.055, 0.675, 0.19)}
.hamburger--spin-r.is-active .hamburger-inner{transform: rotate(-225deg);transition-delay: 0.14s;transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);background-color:var(--colEthiBleu)}
.hamburger--spin-r.is-active .hamburger-inner::before{top:0;opacity:0;transition: top 0.1s ease-out, opacity 0.1s 0.14s ease-out;background-color:var(--colEthiBleu)}
.hamburger--spin-r.is-active .hamburger-inner::after{bottom:0;transform: rotate(90deg);transition: bottom 0.1s ease-out, transform 0.3s 0.14s cubic-bezier(0.215, 0.61, 0.355, 1);background-color:var(--colEthiBleu)}


/* MEDIA QUERIES
========================================================================== */




/* min 1296px */
@media screen and (min-width:81em){

}

/* max 1296px */
@media screen and (max-width:81em){
.logoClient{background-color:deepskyblue}
}

/* max 1024px */
@media screen and (max-width:64em){
.logoClient{background-color:mediumpurple}
.validTempo{display:none}
.validCta, .validLink{flex:0 0 var(--rowA6)}


}

/* max 960px */
@media screen and (max-width:60em){
.logoClient{background-color:tomato}
}

/* max 800px BREAK MENU */
@media screen and (max-width:50em){
.logoClient{background-color:orange}

.validationHeure{flex:0 0 100%}
.groupeSelector{max-width:480px}
.rowValidation{flex-flow:row wrap;gap:0}
.validCta, .validLink{flex:0 0 100%}
.validCta{padding:var(--space-16) 0;text-align:right}
.validLink{padding:var(--space-16) var(--space-24);text-align:right}


}

/* max 768px BREAK connexion + break minimus space */
@media screen and (max-width:48em){
.logoClient{background-color:yellow}

/* HEADER */
.wrapperHeader{padding:0 4px}
.flexHeader{padding:var(--space-8);align-items:center}
.connexion{text-align:right;padding-right:var(--space-8)}
	.logUser br{display:initial}
	.logUser{vertical-align:bottom;padding-right:var(--space-32)}
	.logOnOff{vertical-align:bottom;padding-bottom:var(--space-8)}

}

/* max 640px */
@media screen and (max-width:40em){
.logoClient{background-color:yellowgreen}
}

/* max 480px */
@media screen and (max-width:30em){
.logoClient{background-color:limegreen}
}

/* max 375px */
@media screen and (max-width:24em){
.logoClient{background-color:olivedrab}
}