@font-face
	{
		font-family:'nixie_oneregular';
		src:url('Polices/nixieone-webfont.woff') format('woff'),
			url('Polices/nixieone-webfont.woff2') format('woff2');
		font-weight:normal;
		font-style:normal;
	}
	
:root
	{
		--rouge:#bd0a0a;
		--jaune:#f1a706;
		--gris:#797979;
		--grisFonce:#212832;
		--texteGris:#808080;
		--fondGris:#eee;
	}
	
#listeCompetence15 .elementOuvrable, #listeCompetence15 select, label, #mobilisation .lien input[type="checkbox"], #contenusDivers .ouvrirBoite.plus ~ input[type='checkbox'], #contenusDivers .ouvrirBoite.fleche ~ input[type='checkbox'], #contenusDivers .ouvrirBoite.fleche select, .carrousel .flecheG, .carrousel .flecheD
	{
		cursor:pointer;
	}

	
body
	{
		font-family:'Open Sans', sans-serif;
		/*background:linear-gradient(rgb(50,50,50),black);*/
	}
	
a
	{
		text-decoration:none;
		color:inherit;
	}

main
	{
		max-width:1024px;
		margin:auto;
	}
	
header
	{
		margin-top:1em;
		display:inline-block;
		width:100%;
		position:relative;
	}
	
/* Menu */
nav ul
	{
		/*display:flow-root list-item;*/
		height:calc(1em + (0.075em * 2) + (0.1em * 2));
		
		list-style-type:none;
		
		margin:0;
		padding:0.075em 0;
		/*background:linear-gradient(90deg, var(--fondGris) 49%, transparent 50%);*/
		background-color:var(--fondGris);
		border-radius:0.25em;
	}
	
nav ul li:first-child
	{
		float:left;
	}
	
nav ul li:first-child a
	{
		padding:0.1em 0.5em;
	}
	
nav ul li
	{
		float:right;
	}
	
nav ul li:last-child a
	{
		margin-right:3px;/* Right au lieu de left à cause du float:right*/
	}
	
nav ul li a
	{
		outline:3px solid white;
		border-radius:0.25em;
		padding:0.1em 1em;
		
		background-color:var(--fondGris);
		font-weight:bold;
		font-size:min(1em, 2.25dvw);
	}

nav ul li a.actif, nav ul li a:hover
	{
		color:white;
		background-color:black;
	}
	
nav ul li a .light
	{
		font-weight:normal;
	}
/* FIN menu */

/* Bannière */
header #logo
	{
		display:block;
		
		position:absolute;
		z-index:-1;
		margin-top:-2em;
		margin-left:-15%;
		height:-webkit-fill-available;
		
		user-select:none;
	}
	
header h1
	{
		font-size:3em;
		font-weight:900;
		line-height:1.1em;
		
		width:70%;
		margin-top:5em;
		float:right;
	}

header h1 .etiquette
	{
		background:white;
		border-radius:0.25em;
		padding:0.05em 0.25em;
		margin:0.05em 0.1em;
		display:inline-block;
	}

header h1 .secondaire
	{
		font-size:0.68em;
	}
	
header h1 .tertiaire
	{
		font-size:0.6em;
	}
	
header h1 .light
	{
		font-weight:400;
	}
	
header h1 .lighter
	{
		font-weight:100;
	}

header h1 .rouge, #listeCompetence15 select option:nth-child(1), #listeCompetence15 select:has(option:nth-child(1):checked) + p, .ouvrirBoite select:has(option:nth-child(1):checked)
	{
		background-color:var(--rouge);
		color:white;
	}
	
header h1 .jaune, #listeCompetence15 select option:nth-child(2), #listeCompetence15 select:has(option:nth-child(2):checked) + p, .ouvrirBoite select:has(option:nth-child(2):checked)
	{
		background-color:var(--jaune);
		color:#313338;
	}
	
header h1 .gris, #listeCompetence15 select option:nth-child(3), #listeCompetence15 select:has(option:nth-child(3):checked) + p, .ouvrirBoite select:has(option:nth-child(3):checked)
	{
		background-color:var(--gris);
		color:white;
	}
	
header h1 .rouge, header h1 .jaune, header h1 .gris
	{
		line-height:1.25em;
	}

header h1 .ligne2
	{
		float:right;
	}
	
header h1 .ligne3
	{
		clear:both;
		display:block;
		text-align:center;
	}
	
header h1 .ligne4:after
	{
		content:"";
		background-image:url(Img/ligne.png);
		background-repeat:no-repeat;
		background-size:contain;
		
		width:110%;
		height:1em;
		
		display:block;
		position:absolute;
		left:0;
		z-index:-1;
		
		margin-top:-0.5em;
		margin-left:-5%;
	}
	
header h1 .ligne4
	{
		float:right;
	}
	
header h1 .ligne5
	{
		float:right;
		clear:both;
		transform:translate(-3em);
	}

header h1#entete span span:not(.etiquette)
	{
		text-shadow:0 0 0.5em white, 0 0 0.5em white, 0 0 0.5em white, 0 0 0.5em white, 0 0 0.5em white;
	}

	/* * * Sur 2 lignes * * */
header:has(.sansLogo)
	{
		display:flex;
		flex-flow:column;
	}
/*	
header nav:has(+img +h1.sansLogo)
	{
		order:2;
	}
*/

header nav:has(+img +h1.sansLogo)
	{
		margin-bottom:1em;
	}
	
#logo:has(+h1.sansLogo)
	{
		display:none;
	}
	
header:has(.sansLogo) h1 .light
	{
		font-weight:100;
	}
	
header h1.sansLogo
	{
		font-size:2.6em;
		width:100%;
		margin-top:0;
		margin-block-end:0.5em;
		float:unset;
		text-align:center;
		line-height:1em;
	}
	
header h1.sansLogo .etiquette:first-child
	{
		margin-right:-0.1em;
		padding-right:0;
	}
	
header h1.sansLogo .ligne2, header h1.sansLogo .ligne3, header h1.sansLogo .ligne4, header h1.sansLogo .ligne5
	{
		float:unset;
		clear:unset;
		display:inline-block;
		transform:unset;
	}
	
header h1.sansLogo .ligne4:after
	{
		width:100%;
		margin-left:unset;
		margin-top:-0.7em;
		transform:scaleY(-100%);
	}

/* FIN bannière */

/* Contenu */
header:has(.sansLogo) ~ article
	{
		margin-top:0;
		border-radius:0.5em;
	}

article
	{
		margin-top:2.5em;
		width:92%;
		padding:2% 4%;
		background-color:var(--fondGris);
		border-radius:2em;
		
		/*overflow:hidden;/* Pour le HR qui dépasse, les titres FatFace et autres */
	}
	
article:not(article +footer)
	{
		margin-bottom:10em;
	}
	
article hr
	{
		border:1px solid white;
		width:calc(100% + 5%);
	}

article p, article ul li, footer p
	{
		line-height:1.4em;
		font-weight:lighter;
	}
	
article b
	{
		font-weight:bold;
	}

article ul
	{
		padding-left:1em;
	}
	
article ul li
	{
		margin-bottom:1em;
	}
	
article h1, h1:has(+ a + #mobilisation)
	{
		font-family:"Abril Fatface", serif;
		line-height:1em;
		font-size:2.25em;
		color:#1a1a1a;
		text-align:center;
		
		margin:1.5em 0 1.5em -5%;
		width:45%;
		padding:0.4em 0;
		background-color:white;
		border-radius:0 0.25em 0.25em 0;
	}
	
article h1 .pale, h1:has(+ a + #mobilisation) .pale
	{
		color:var(--texteGris);
	}
	
	
article h2
	{
		color:var(--rouge);
		font-size:1.25em;
		font-style:italic;
		font-weight:normal;
		font-family:arial;
	}
	
article:has(#listeCompetence15) a
	{
		font-family:"nixie_oneregular";
	}
	
#listeCompetence15
	{
		font-size:1.25em;
		
		width:60%;
		margin:auto;
	}
	
#listeCompetence15 .elementOuvrable:before
	{
		content:"";
		
		display:inline-block;
		background-color:var(--grisFonce);
		width:1.25em;
		height:1em;
		
		position:absolute;
		left:-2.5em;
		margin-top:0.1em;
		
		opacity:20%;
	}
	
#listeCompetence15 .elementOuvrable.ouvert:before
	{
		opacity:100%;
	}

#listeCompetence15 .elementOuvrable, #mobilisation .lien
	{
		position:relative;
		
		font-family:arial;
		color:var(--texteGris);
		display:inline-block;
		width:100%;
		margin-bottom:1.25em;
		
		transition-duration:0.25s;
	}

#mobilisation .lien:last-child
	{
		margin-bottom:0;
	}
	
#listeCompetence15 .elementOuvrable.ouvert
	{
		color:white;
		font-weight:bold;
		background-color:#1a1a1a;
		border-radius:0.5em;
		padding:0.5em 0.5em;
		width:calc(100% - 1em);
	}

#listeCompetence15 .elementOuvrable + div
	{
		display:none;
	}

#listeCompetence15 .elementOuvrable.ouvert + div
	{
		overflow:hidden;
		
		font-size:0.75em;
		
		display:block;
		background-color:white;
		color:var(--grisFonce);
		margin:-2em auto 2em;
		border-radius:0 0 0.25em 0.25em;
		padding:0 2em;
	}

#listeCompetence15 select
	{
		font-size:1em;
		text-transform:uppercase;
		font-weight:bold;
		
		border-radius:0.25em;
		background-color:white;
		padding:0.25em 0.5em;
		margin-left:calc(-0.5em - 1px);
		width:calc(100% + 1em + 4px);
		display:inline-block;
	}

/*#listeCompetence15 select:after
	{
		content:"🞃";
		float:right;
	}*/
	
#listeCompetence15 select:has(option:nth-child(1):checked)
	{
		border:2px solid var(--rouge);
		color:var(--rouge);
	}
	
#listeCompetence15 select:has(option:nth-child(2):checked)
	{
		border:2px solid var(--jaune);
		color:var(--jaune);
	}
	
#listeCompetence15 select:has(option:nth-child(3):checked)
	{
		border:2px solid var(--gris);
		color:var(--gris);
	}

#listeCompetence15 .elementOuvrable.ouvert + div .nixieOne
	{
		font-family:"nixie_oneregular";
		margin-block-end:0;
	}

#listeCompetence15 .nixieOne + div
	{
		color:white;
		margin-top:0em;
	}
	
#listeCompetence15 select + p
	{
		margin-block-start:0;
		width:calc(100% - 2em + 4px);
		padding:1.5em;
		margin-top:-0.5em;
		margin-bottom:1em;
		margin-left:calc(-0.5em - 1px);
		border-radius:0 0 0.5em 0.5em;
		
		font-weight:bold;
		color:white !important;
		text-transform:uppercase;
	}

#listeCompetence15 select + p span
	{
		display:none;
	}
	
/* Afficher les bons textes dépendant du <select> */
#listeCompetence15 select:has(option:nth-child(1):checked) + p span.rouge,
#listeCompetence15 select:has(option:nth-child(2):checked) + p span.jaune,
#listeCompetence15 select:has(option:nth-child(3):checked) + p span.gris
	{
		display:initial;
	}
/* FIN Compétence15 */

/* Mobilisation des perspectives autochtones */
h1:has(+ a + #mobilisation)
	{
		line-height:1.25em;
		font-size:1.25em;
		text-align:right;
		
		width:calc(45% - 2em);
		padding:1em 2em 1em 0;
		border-radius:0 0.5em 0.5em 0;
	}

a.blocFonce
	{
		background-color:var(--grisFonce);
		color:white;
		width:30%;
		max-width:265px;
		padding:0.25em 1em;
		border-radius:inherit;
		
		display:inline-block;
		
		/*float:right;
		margin-top:-7.5em;*/
		margin-left:9%;
	}

#mobilisation, #contenusDivers p.premierBloc
	{
		display:block;
		width:60%;
		padding:0.75em 1em;
		margin:auto;
		
		background-color:white;
		border-radius:inherit;
		font-size:1.25em;
		font-weight:bold;
	}

#mobilisation > .lien
	{
		text-align:right;
		width:75%;
	}

#mobilisation .lien a
{
	font-family:inherit;
}

#mobilisation .lien p, #mobilisation .blocDeplie p
{
	font-weight:bold;
	margin-block:0;
	opacity:0.5;
	cursor:not-allowed;
}

#mobilisation .blocDeplie p
{
	margin-block:0.25em;
}

#mobilisation .lien input[type='checkbox'], #contenusDivers .ouvrirBoite.plus ~ input[type='checkbox'], #contenusDivers .ouvrirBoite.fleche ~ input[type='checkbox']
	{
		position:absolute;
		
		appearance:none;
		
		/*background-color:transparent;
		border:3px solid var(--grisFonce);*/
		margin-top:1px;
		margin-left:0.5em;
		height:1.05em;
		/*aspect-ratio:1;
		
		text-align:center;*/
		font-size:inherit;
		/*font-weight:inherit;
		line-height:0.75em;
		color:var(--grisFonce);
		border-radius:0.15em;*/
	}

#mobilisation .blocDeplie .lien input[type="checkbox"]
	{
		height:1.1em;
		line-height:0.6em;
	}
	
#mobilisation .lien input[type='checkbox']::before, #contenusDivers .ouvrirBoite.plus ~ input[type='checkbox']::before, #contenusDivers .ouvrirBoite.fleche ~ input[type='checkbox']::before
	{
		/*content:url("Img/plus.png") / "+";*/

		content: "";
		
		height:inherit;
		aspect-ratio:1;
		display:block;
		
		background-image:url("Img/plus.png");
		background-size:contain;
		background-repeat:no-repeat;
		background-position:center;
	}
	
#mobilisation .lien input[type='checkbox']:checked::before, #contenusDivers .ouvrirBoite.plus ~ input[type='checkbox']:checked::before, #contenusDivers .ouvrirBoite.fleche ~ input[type='checkbox']:checked::before
	{
		/*content:url("Img/moins.png") / "-";*/
		
		background-image:url("Img/moins.png");
	}
	
#mobilisation .blocDeplie, #contenusDivers .blocDeplie
	{
		display:none;
	}
	
#mobilisation .lien:has(input[type='checkbox']:checked)
	{
		margin-bottom:0.75em;
	}
	
#mobilisation .lien:has(input[type='checkbox']:checked) label span, #mobilisation .lien a:hover, #mobilisation .lien label:hover, #contenusDivers .ouvrirBoite.plus, #contenusDivers .ouvrirBoite.fleche
	{
		background-color:var(--grisFonce);
		color:white;
		text-transform:uppercase;
		padding:0 1em;
		border-radius:0.25em;
		
		transition-duration:0.25s;
	}
	
#mobilisation .lien a:hover, #mobilisation .lien label:hover
	{
		padding:0 0.25em;
		margin-left:-0.25em;
		margin-right:-0.25em;
		text-transform:none;
		
		display:inline-block;
	}
	
#mobilisation .blocDeplie .lien a:hover, #mobilisation .blocDeplie .blocDeplie a:hover, .blocDeplie .hoverDouble
	{
		background-color:var(--grisFonce);
		color:white;
		padding:0 0.2em;
		margin:0 -0.2em;
		border-radius:0.25em;
		display:block;
		
		transition-duration:0.25s;
	}

#mobilisation .lien:has(input[type='checkbox']:checked) + .blocDeplie
	{
		display:grid;
		grid-template-columns:auto minmax(auto, 50%) minmax(auto, 50%);
		gap:0.25em;
		margin-bottom:1em;
	}

.blocDeplie div.gris {background-color:var(--gris);}
.blocDeplie div.jaune {background-color:var(--jaune); text-align:right;}
.blocDeplie div.rouge {background-color:var(--rouge); text-align:left;}

.blocDeplie div
	{
		color:white;
		padding:0.75em;
		border-radius:0.5em;
		
		/*font-size:0.75em;*/
	}
	
.blocDeplie div:not(.gris)
	{
		height:fit-content;
		min-height:2.5em;
	}

.blocDeplie div > .lien
	{
		color:white !important;
	}
	
#mobilisation .blocDeplie div > .lien:has(input[type='checkbox']:checked) + .blocDeplie
	{
		grid-template-columns:unset;
	}
	
#mobilisation .blocDeplie div > .lien:has(input[type='checkbox']:checked) + .blocDeplie a:not(:last-child)
	{
		margin-bottom:0.5em;
	}

#mobilisation .blocDeplie div a:has(+ .plusPetit)
	{
		margin-bottom:0 !important;
	}

#mobilisation .blocDeplie div a + .plusPetit
	{
		padding-top:0;
	}
/* FIN Mobilisation des perspectives autochtones */

/* Pages de contenu divers */
article h1:has(+#contenusDivers), h1:has(~ #listeCompetence15), h1:has(~ #mobilisation)
	{
		display:inline-flex;
		gap:0.5em;
		align-items:center;
		
		text-align:left;
		padding-left:1.5em;
		padding-right:0.25em;
		min-width:fit-content;
		width:calc(45% - 0.5em);
		margin-block:1em;
		position:relative;
	}

article h1:has(+#contenusDivers):has(a img), h1:has(~ #listeCompetence15):has(a img), h1:has(~ #mobilisation):has(a img)
	{
		padding-left:0.5em;
	}

/*h1:has(+#contenusDivers) img
	{
		position:absolute;
		top:0;
		bottom:0;
		left:-0.75em;
		margin:auto;
	}*/

#contenusDivers
	{
		border-radius:inherit;
	}

#contenusDivers a
	{
		text-decoration:underline;
	}

#contenusDivers p.premierBloc
	{
		width:calc(100% - 4em);
		font-size:1em;
		font-weight:normal;
		padding:1.5em 2em;
		margin-block:0;
		
		white-space:pre-wrap;
	}

#contenusDivers p .rouge
	{
		color:var(--rouge);
		font-weight:bold;
	}

.rougeNormal
	{
		color:var(--rouge);
		font-weight:normal;
	}

.rougeMaj
{
	color:var(--rouge);
	font-variant:small-caps;
	font-weight:bold;
}

/* Boites Compétence 15 et Compétences en enseignement */
.blocPositionInterchangeable
	{
		margin-top:2em;
		margin-bottom:2em;
		display:grid;
		grid-template-columns:calc(50% - 1.5em) auto calc(50% - 1.5em) auto;
		gap:1em;
	}
	
#contenusDivers .ouvrirBoite.plus ~ input[type="checkbox"], #contenusDivers .ouvrirBoite.fleche ~ input[type="checkbox"]
	{
		position:relative;
		margin:unset;
		font-size:1.25em;
	}
	
#contenusDivers .ouvrirBoite.plus, #contenusDivers .ouvrirBoite.fleche
	{
		font-weight:bold;
		background-color:transparent;
		position:relative;
		height:fit-content;
		
		transition-duration:0.25s;
	}
	
#contenusDivers .ouvrirBoite.plus
	{
		display:inline-block;
		text-align:right;
		border:1px solid var(--grisFonce);
	}
	
#contenusDivers .ouvrirBoite.plus label
	{
		display:block;
		width:100%;
		background-color:var(--grisFonce);
		margin-left:-1em;
		padding:0 1em;
		border-radius:inherit;
	}
	
#contenusDivers:has(select option:nth-child(1):checked) .ouvrirBoite.fleche {border:1px solid var(--rouge);}	
#contenusDivers:has(select option:nth-child(2):checked) .ouvrirBoite.fleche {border:1px solid var(--jaune);}
#contenusDivers:has(select option:nth-child(3):checked) .ouvrirBoite.fleche {border:1px solid var(--gris);}
/*
#contenusDivers:has(select option:nth-child(1):checked) #chkAfficherContenuSelect {background-color:var(--rouge);}	
#contenusDivers:has(select option:nth-child(2):checked) #chkAfficherContenuSelect {background-color:var(--jaune);}
#contenusDivers:has(select option:nth-child(3):checked) #chkAfficherContenuSelect {background-color:var(--gris);}
*/
#contenusDivers .ouvrirBoite.fleche select option:nth-child(1) {background-color:var(--rouge);}
#contenusDivers .ouvrirBoite.fleche select option:nth-child(2) {background-color:var(--jaune);}
#contenusDivers .ouvrirBoite.fleche select option:nth-child(3) {background-color:var(--gris);}

/* Cacher les autres textes */
#contenusDivers .ouvrirBoite .blocDeplie span {display:none;}

/* Afficher les bons textes dépendant du <select> */
#contenusDivers .ouvrirBoite.fleche select:has(option:nth-child(1):checked) + .blocDeplie span.rouge,
#contenusDivers .ouvrirBoite.fleche select:has(option:nth-child(2):checked) + .blocDeplie span.jaune,
#contenusDivers .ouvrirBoite.fleche select:has(option:nth-child(3):checked) + .blocDeplie span.gris
	{
		display:initial;
	}

#contenusDivers .ouvrirBoite select
	{
		font-size:1em;
		text-transform:uppercase;
		font-weight:bold;
		
		border-radius:0.25em;
		border:2px solid;
		border-color:inherit;
		color:white;
		padding:0 0.5em;
		margin-left:calc(-1em - 1px);
		width:calc(100% + 2em + 1px);
		display:inline-block;
	}

#contenusDivers .ouvrirBoite.plus:has(~ input#chkCompetence15[type="checkbox"]:checked) .blocDeplie, #contenusDivers .blocPositionInterchangeable:has(input#chkCompetence15[type="checkbox"]:checked) .ouvrirBoite.fleche .blocDeplie
	{
		display:block;
		
		background:var(--fondGris);
		width:calc(100% - 2px);
		margin-left:calc(-1em + 1px);
		border-radius:inherit;
		padding:1em;
		margin-bottom:1px;
		
		color:var(--texteGris);
		text-transform:none;
	}
/* Cacher la checkbox du <select> */
#contenusDivers #chkAfficherContenuSelect {display:none;}

#contenusDivers .blocPositionInterchangeable .blocDeplie ul
	{
		text-align:left;
	}

ul.numerique
	{
		list-style-type:decimal;
	}

ul.sansPoint
	{
		list-style-type:none;
		padding:0;
	}

#contenusDivers .blocPositionInterchangeable .blocDeplie ul li
	{
		font-weight:bold;
	}
/* FIN boites Compétence 15 et Compétences en enseignement */	


.ligneCote:before
	{
		content:"";
		height:100%;
		padding:0 0.5em;
		border-radius:0.25em;
		
		position:absolute;
		top:0;
		bottom:0;
		margin:auto 0 auto -5%;
		z-index:1;
	}
	
.ligneCote.rouge:before {background-color:var(--rouge);}
.ligneCote.grisFonce:before {background-color:var(--grisFonce);}
.ligneCote.jaune:before {background-color:var(--jaune);}
.ligneCote.gris:before {background-color:var(--gris);}
.ligneCote.grisPale:before {background-color:var(--fondGris); outline:1px solid #d8d8d8;}

.ligneCote
	{
		clear:both;
		position:relative;
		margin-bottom:1.5em;
		border-radius:inherit;
		font-weight:normal !important;
		
		padding-left:6%;
		margin-left:-6%;
	}

.ligneCote > p
	{
		color:#595959;
	}

.ligneCote > p, .contenusDivers ul li, .blocDeplie span.rouge, .blocDeplie span.jaune, .blocDeplie span.gris
	{
		white-space:pre-wrap;
	}
	
.ligneCote p
	{
		font-weight:normal;
	}

.texteEncadre
	{
		border-radius:inherit;
		border:1px solid #c7c8ca;
		
		font-weight:normal;
		font-size:1.25em;
		color:var(--grisFonce);
		
		padding:0 1.5em;
		margin-bottom:1em;
	}

.texteEncadre:last-child
	{
		margin-bottom:0;
	}

.texteEncadre p
	{
		white-space:pre-wrap;
	}

.texteEncadre ul
	{
		padding-left:revert;
	}

.texteEncadre.abril
	{
		font-family:"Abril Fatface", serif;
		
		display:flex;
	}

.ligneCote:not(.decalage) .texteEncadre.alternance:nth-child(even), .decalage .texteEncadre.alternance:nth-child(2n + 3)
	{
		background-color:#c7c8ca;
	}

.ligneCote .majusculesGrasses, span.majusculesGrasses
	{
		text-transform:uppercase;
		font-weight:bold;
	}

.normal
	{
		font-weight:normal;
	}

.plusPetit
	{
		font-size:0.65em;
	}

.italic
	{
		font-style:italic;
	}

.marge
	{
		/*display:inline-block;*/
		margin-left:2em;
	}

.flexGrid
	{
		display:flex;
	}

.imgLivre
	{
		max-height:9em;
		margin:0 1em;
		align-self:center;
		justify-self:center;
	}

.texteBleu
	{
		color:#318b98;
	}
	
/*.listeLiens li
	{
		white-space:pre-wrap;
		line-height:1em;
		margin-bottom:1.5em;
	}*/

.texteEncadre ul li a:not(.normal)
	{
		font-weight:bold;
	}

.imgLarge
	{
		display:block;
		margin:auto;
		
		max-width:100%;
		max-height:90dvh;
		margin-bottom:1.25em;
	}
	
.titresColoresFondementsApproches
{
	font-variant:small-caps;
	color:#935409;
}

.titresColoresFondementsApproches2
{
	font-variant:small-caps;
	color:#b55374;
}

.principeCle
{
	display:inline-block;
	outline:1px solid grey;
	border-radius:0.25em;
	padding:1em;
}

/* Cacher/Afficher l'excès */
.ligneCote .texteEncadre ~ label
	{
		position:absolute;
		bottom:0;
		
		box-shadow:0 0 2em 3em var(--fondGris);
		
		display:inline-block;
		width:94.5%;
		border-radius:inherit;
		border-bottom:1px solid #c7c8ca;
		
		text-transform:uppercase;
		text-align:center;
		background-color:white;
		color:var(--grisFonce);
		font-size:0.75em;
		font-weight:bold;
		
		user-select:none;
	}

.ligneCote label:has(input[type="checkbox"]:checked)
	{
		width:100%;
		border:none;
		box-shadow:unset;
		position:sticky;
		bottom:1em;
		outline:1px solid gray;
	}

.ligneCote label:after
	{
		content:"plus";
	}

.ligneCote label:has(input[type="checkbox"]:checked):after
	{
		content:"moins";
	}

.ligneCote .texteEncadre ~ label input[type="checkbox"]
	{
		appearance:none;
		margin-right:1em;
		transform:scaleX(150%);
		
		cursor:pointer;
	}

.ligneCote label input[type="checkbox"]:before
	{
		content:"▼";
	}

.ligneCote label input[type="checkbox"]:checked:before
	{
		content:"▲";
	}

/*.ligneCote .texteEncadre:nth-of-type(n + 5)
	{
		display:none;
	}

.ligneCote:has(input[type="checkbox"]:checked) .texteEncadre:nth-of-type(n + 5)
	{
		display:block;
	}*/

.ligneCote:has(input[type="checkbox"])
	{
		max-height:max(400px, 75dvh);
		overflow-y:clip;
	}

.ligneCote:has(input[type="checkbox"]:checked)
	{
		max-height:unset;
		overflow-y:unset;
	}
/* FIN cacher/Afficher l'excès */


/* Carrousels */
.carrousel
	{
		display:flex;
		border-radius:inherit;
	}

#contenusDivers .carrousel a
	{
		text-decoration:none;
	}

.carrousel > .texteEncadre
	{
		margin-bottom:0;
	}

.carrousel .flecheG, .carrousel .flecheD
	{
		font-size:1.5em;
		border-radius:inherit;
		
		align-content:center;
		background-color:#b0b0b0;
		color:white;
		
		user-select:none;
		transition-duration:0.25s;
	}

.carrousel .flecheG:hover, .carrousel .flecheD:hover
	{
		filter:contrast(150%);
	}

.carrousel .flecheG
	{
		margin-left:-1em;
		order:1;
	}

.carrousel .flecheG:before, .carrousel .flecheD:before
	{
		content:"";
		
		display:block;
		width:0;
		height:0;
		border-top:0.4em solid transparent;
		
		border-bottom:0.4em solid transparent;
		
		margin:0 0.25em;
	}

.carrousel .flecheG:before {border-right:0.5em solid white;}
.carrousel .flecheD:before {border-left:0.5em solid white;}

.carrousel .flecheD
	{
		margin-right:-1em;
		order:3;
	}

.ligneCote.jaune .carrousel .flecheG, .ligneCote.jaune .carrousel .flecheD
	{
		background-color:var(--jaune);
	}

.cacherFleche
	{
		opacity:0;
		cursor:default !important;
	}

#carrouselRessources, #carrouselRessources2, #carrouselExemplesPratiques
	{
		order:2;
	}

#carrouselRessources, #carrouselRessources2
	{
		display:grid;
		grid-auto-flow:column;
		grid-auto-columns:20%;
		gap:1em;
		justify-content:space-evenly;
		
		padding:1.5em;
		background-color:white;
		overflow-x:auto;
		scroll-behavior:smooth;
	}

#carrouselRessources a, #carrouselRessources2 a
	{
		display:block;
		text-align:center;
		text-wrap:balance;
		font-size:0.75em;
	}

#carrouselRessources a img, #carrouselRessources2 a img
	{
		width:100%;
		aspect-ratio:1/1.4;
		object-fit:cover;
		
		/*border:3px solid var(--grisFonce);*/
		border-radius:1em;
		margin-bottom:1em;
	}

#carrouselExemplesPratiques
	{
		width:100%;
		background-color:transparent;
		border:3px solid white;
		display:grid;
		grid-auto-flow:column;
		grid-auto-columns:100%;
		gap:1.5em;
		padding:1.5em;
		
		overflow-x:hidden;
		
		align-items:center;
		
		scroll-behavior:smooth;
		scroll-snap-type:x mandatory;
	}
	
#carrouselExemplesPratiques div
	{
		scroll-snap-align:center;
		display:grid;
		justify-items:center;
	}
	
#carrouselExemplesPratiques iframe
	{
		aspect-ratio:16/9;
	}

#carrouselExemplesPratiques img
	{
		border-radius:0.25em;
		max-width:100%;
		max-height:481px;
	}
	
#carrouselExemplesPratiques p
	{
		margin-block-end:0;
		font-size:0.75em;
	}
/* FIN carrousels */


.references
	{
		background-color:white;
		font-size:1em;
	}

.references:has(input[type="checkbox"])
	{
		padding:0 2em;
	}
	
.references input[type="checkbox"]
	{
		appearance:none;
		display:block;
		text-align:center;
		
		cursor:pointer;
	}

.references input[type="checkbox"]:before
	{
		content:"";
		
		display:inline-block;
		
		width:0;
		height:0;
		border-left:0.75em solid transparent;
		border-right:0.75em solid transparent;
		border-top:1em solid var(--grisFonce);
	}

.references input[type="checkbox"]:checked:before
	{
		content:"";
		display:inline-block;
		
		width:0;
		height:0;
		border-top:none;
		border-left:0.75em solid transparent;
		border-right:0.75em solid transparent;
		border-bottom:1em solid var(--grisFonce);
	}
	
.references input[type="checkbox"]:checked
	{
		margin:2em 0 -1em;
	}
	
.references:has(input[type="checkbox"]:checked)
	{
		padding:1.5em 2em;
	}
	
.references #references
	{
		display:none;
	}
	
.references:has(input[type="checkbox"]:checked) #references
	{
		display:inline;
	}

.references a 
	{
		text-decoration:underline;
		font-weight:bold;
		word-break:break-word;
	}









/* FIN pages de contenu divers */

/* FIN contenu */

footer
	{
		margin:5em auto 10em;
		display:grid;
		grid-template-columns:repeat(3, 1fr);
	}
	
footer img
	{
		margin:auto;
		height:5em;
	}
	
footer p
	{
		grid-column:1 /span 3;
		margin:5em auto 0;
	}
	
/* * * * * * * * * * * * Mobile vertical * * * * * * * * * * * */
@media only screen and (orientation: portrait) and (width <= 1024px)
	{
		body
			{
				background:white;
			}
		
		main
			{
				max-width:100%;
			}
		
		header
			{
				display:inline-grid;
			}
		
		header #logo
			{
				height:inherit;
				max-width:100%;
				max-height:100%;
				margin-left:-5%;
				
				align-self:end;
			}
		
		nav ul
			{
				background-color:unset;
				display:unset;
			}
		
		nav ul li
			{
				display:inline-flex;
			}
		/*	
		nav ul li:nth-child(2)
			{
				order:3;
			}
			
		nav ul li:nth-child(3)
			{
				order:2;
			}
			*/
		header h1#entete:not(.sansLogo)
			{
				font-size:1.5em;
				margin-top:8vh;
				
				max-width:fit-content;
				justify-self:center;
			}
		
		header h1 .ligne4:after
			{
				width:100%;
				
				margin-left:0;
			}
			
		header h1#entete.sansLogo
			{
				/*font-size:1em;*/
				font-size:4dvw;
				max-width:unset;
			}
		
		article h1, h1:has(+ a + #mobilisation)
			{
				width:fit-content;
			}
		
		article h1:has(+#contenusDivers)
			{
				padding-left:0.5em;
			}

		article h1:has(+#contenusDivers):has(a img)
			{
				padding-left:0;
				gap:0.25em;
			}
			
		h1:has(+ #listeCompetence15), h1:has(+ #contenusDivers)
			{
				padding:0.4em 0.25em;
			}
			
		h1:has(+ a + #mobilisation)
			{
				padding:1em;
			}
			
		a.blocFonce
			{
				width:fit-content;
				max-width:fit-content;
				float:unset;
				margin:1em auto;
			}
		
		article:not(article + footer)
			{
				margin-bottom:unset;
			}
			
		article h1:has(:not(a img))
			{
				padding-left:unset;
			}
		
		#listeCompetence15
			{
				width:calc(100% - 1.5em);
				margin-left:1.5em;
			}
			
		#listeCompetence15 .elementOuvrable::before
			{
				left:-1.75em;
			}
		
		#mobilisation .blocDeplie div
			{
				font-size:0.9em;
			}
		
		#mobilisation .blocDeplie .lien:has(input[type="checkbox"]:checked) label span
			{
				padding:0 0.25em;
			}
			
		#mobilisation, #contenusDivers p.premierBloc
			{
				width:calc(100% - 1em);
				padding:0.75em 0.5em;
			}
			
		#mobilisation > .lien
			{
				width:calc(100% - 1.5em);
			}
			
		#mobilisation .blocDeplie div > .lien:has(input[type='checkbox']:checked) + .blocDeplie a
			{
				margin-bottom:1em;
			}
			
		.blocPositionInterchangeable
			{
				grid-template-columns:calc(100% - 1.5em) auto;
			}
			
		#contenusDivers #chkAfficherContenuSelect {display:initial;}
		
		
		
		#contenusDivers .ouvrirBoite.plus:has(~ input#chkCompetence15[type="checkbox"]:checked) .blocDeplie
			{
				display:block;
			}
			
			
		#contenusDivers .ouvrirBoite.fleche:has(~ :is(:not(input#chkAfficherContenuSelect[type="checkbox"]:checked))) .blocDeplie
			{
				display:none !important;
			}
			
		#contenusDivers .ouvrirBoite.fleche:has(~ :is(input#chkAfficherContenuSelect[type="checkbox"]:checked)) .blocDeplie
			{
				display:block;
				
				background:var(--fondGris);
				width:calc(100% - 2px);
				margin-left:calc(-1em + 1px);
				border-radius:inherit;
				padding:1em;
				margin-bottom:1px;
				
				color:var(--texteGris);
				text-transform:none;
			}
			
		.texteEncadre
			{
				padding:0 0.75em;
			}
		
		.texteEncadre.abril
			{
				flex-direction:column-reverse;
			}
		
		.ligneCote:before
			{
				margin:auto 0 auto calc(-4% - 0.5em);
			}
		
		.flexGrid
			{
				display:grid;
			}
		
		.carrousel .flecheG, .carrousel .flecheD
			{
				margin:unset;
				font-size:2.5em;
			}
		
		#carrouselRessources, #carrouselRessources2
			{
				padding:0.75em;
				grid-auto-columns:75%;
				
				scroll-snap-type:x mandatory;
			}
		
		#carrouselRessources div, #carrouselRessources2 div
			{
				scroll-snap-align:center;
			}
		
		#carrouselExemplesPratiques
			{
				gap:0.75em;
				padding:0.75em;
			}
		
		
		
		
		
		footer
			{
				display:initial;
			}
			
		footer img
			{
				display:block;
				margin:2.5em auto;
			}
			
		footer p
			{
				margin:0 auto 1em;
			}
	}