

/*	Fonts	-	-	-	-	-	-	-	-	-	-	-	*/

	@import "vendor/Plex/css/ibm-plex.min.css";
	 body { font-family: 'IBM Plex Sans'; }
	.mono { font-family: 'IBM Plex Mono'; }
	.cond { font-family: 'IBM Plex Sans Condensed'; }


/*	Colors	-	-	-	-	-	-	-	-	-	-	-	*/

	/*RA post-it yellow */ 
	.RAyellow { background-color: rgba(237,166,0,0.2); }
	.RAcyan { background-color: rgb(124,243,252,0.3); }


/*	Deco	-	-	-	-	-	-	-	-	-	-	-	*/
	/* → online-report-edition202×.css*/ 



/*	LAYOUT GEOMETRY	-	-	-	-	-	-	-	-	-	*/

	/* Initial Layout */
		/*
		body {
			max-width: 40rem;
			margin: auto;
		}
		*/

	* { box-sizing: border-box; }

	html, body {
		margin:0;
		padding:0;
	}

	/*
		MBA: viewport = 1280px = 80rem
			probably about 1260 with brwoser chrome (scrollbar)	78 rem
	
		Other key target widths:
		1900	118 rem
		1680	105 rem
		1349	84 rem

	*/
	
	em { font-style: italic; }



	/* keeping paragraphs from going too long just in case */
	p {
		max-width: 100ch;
	}



/*	DESKTOP MEDIA QUERY	-	-	-	-	-	-	-	-	-	-	*/
	@media screen and (min-width: 50rem){
/*	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	*/




/*	#Layout-Nav-Main + nav#Sidebar + main#Content	-	-	*/

	#Layout-Nav-Main { 
		/* 2023…  */
		/* display: flex; 
		flex-wrap: nowrap; */
	}

	 nav#Sidebar,
	main#Content { }

	nav#Sidebar {
		/* 2023… */
		/* flex-grow: 0;
		flex-shrink: 1;
		flex-basis: 21rem;  */
		/* not necessary, but if we don't define this with a little wiggle room, the bold text on .active items makes this area grow and shrink all the time… */
	}

	nav#Sidebar {
		/* min-width: 21rem; */
		/* minimum necessary size so that no nav items wrap */
		/* nav * { white-space: nowrap; } */
	}


	main#Content {
		/* flex-grow: 1;
		flex-shrink: 1; */
		/*flex-basis: auto;*/
		/*flex-basis: calc(100vw - 22rem);*/
		/*flex: 1 1 auto;*/
	}
	


/*	main#Content layout	-	-	-	-	-	-	-	-	*/


	main#Content section { 
		/* 2023…  */
		/* display: flex;
		flex-wrap: wrap; */
	}

	.contentArea {  }

	.contentArea {
		/* 2023… */
		/* padding: 2.5rem; */
	}

	.contentArea.text { }


	section:not(.hasStats) .contentArea { 
		/* max-width: 50rem;  */
	}
	section:not(.hasStats) .contentArea.wide { 
		/* max-width: 100%;  */
	}


	section.hasStats {}

	section.hasStats .contentArea.text { 
		/* flex: 1 1 30rem;  */
	}

	/*
	section.hasStats .contentArea.text { 
		flex-grow: 0;
		flex-shrink: 0;
		flex-basis: clamp(20rem, 50rem, 80rem);
	}
	*/
	
	section.hasStats .contentArea.stats { /* flex: 0 0 28rem;*/ }
	section.hasStats .contentArea.stats { /* flex: 1 0 28rem; */ /* 2023…*/ } /* setting flex-grow to 1 allows this be 100% when flexwrapping… */

		.contentArea.stats .statBlock { }

		.contentArea.stats .statBlock .dataBlock { display: flex; flex-wrap:wrap;}

		.contentArea.stats .statBlock .dataBlock .col.table { width: 100%;}
		.contentArea.stats .statBlock .dataBlock .col.table table { width: 100%;}
		.contentArea.stats .statBlock table { width: 100%;}

		.contentArea.stats .statBlock .dataBlock .col.chart { margin: 2rem 0; min-width: 21rem; max-width: 21rem; width: 21rem; }

		.contentArea.stats .statBlock .dataBlock .col.chart.bar { min-width: 21rem;}



	main#Content section .contentArea.wide { }

	main#Content section .contentArea.financials { 
		/* flex: 0 1 48rem; */
	}

/* 
	main#Content section.flowStats{
		flex-direction: column;
	}
	
	main#Content section.flowStats .contentArea.text{
		border-right: none;
	}
	main#Content section.flowStats .contentArea.stats {
		display: flex;
		flex-wrap: wrap;
		gap: 1.25rem;
	}
	main#Content section.flowStats .contentArea.stats .statBlock{
		flex: 1 1 20rem;
	}
	
	main#Content section.flowStats .contentArea.stats .statBlock.chiffreCle{
		border-right: var(--borderWidth) solid rgba(30,71,111);
	} */
	
	#Organigramme{
		/* padding: 2.5rem;
		border-top: var(--borderWidth) solid rgba(30,71,111);
		width: 100%; */
	}

	/*
 outline: 1px solid #f1357a; outline-offset: -4px;
 outline: 1px solid #00FFA1; outline-offset: -4px;
	*/



	/* Inner Columns: text on the left, stats on the right */



	/*
	section { width: 100%; }

	section div.contentArea { max-width: 40rem;}
	
	section div.contentArea.wide { max-width: 80rem; }



	section div.contentArea.hasStats { max-width: 80rem; display: flex; flex-wrap: nowrap; }
	
	section div.contentArea.hasStats div.contentText {
		flex-grow: 1;
		flex-shrink: 1;
		flex-basis: 40rem;
		flex: 1 1 40rem;
		max-width: 40rem;
		margin-right: 4rem;
	}
	section div.contentArea.hasStats div.contentStats {
		flex-grow: 1;
		flex-shrink: 1;
		flex-basis: 25rem;
		flex: 1 1 25rem;
		max-width: 40rem;
		padding-left: 2rem;
		margin-right: 1rem;
	}



	section div.contentArea.hasWideStats { max-width: 80rem; }

	section div.contentArea.hasWideStats div.contentText { max-width: 40rem; }
		
	.wideStats { 
		max-width: 100vw;
		display: flex;
		flex-wrap: wrap;
	}
	.wideStats .statBlock {
		flex-grow: 1;
		flex-shrink: 1;
		flex-basis: 25rem;
		flex: 1 1 25rem;
		max-width: 40rem;
		margin: 1rem;
	}


	.contentArea+.contentArea{ margin-top: 4rem; }
*/


	/* vertical sizing */
	section:not(.compactHeight) {
		/* min-height: 100vh; */
	}
	section:last-of-type {
		/*min-height: 100vh;*/
	}

	.contentArea.stats {
		/*min-height: 100vh;*/
	}


	section.compactHeight{
		/* padding-top: 5rem;
		padding-bottom: 10rem; */
	}




/*	DESKTOP MEDIA QUERY	-	-	-	-	-	-	-	-	-	-	*/
	}	/* media ≥ 50rem */
/*	-	-	-	-	-	-	-	-	-	-	-	-	-	-	-	*/

@media screen and (min-width: 50rem) and (max-width: 75rem) {
	/* .contentArea.stats {
		width: 100% !important;
		border-left: none !important;
		border-top: var(--borderWidth) solid rgba(30,71,111);
	} */
}




@media (min-width: 75rem){

	.contentArea.hasChapeau {
		display: flex;
		width: 100% !important;
		max-width: 100% !important;
		
	}

	.contentArea.hasChapeau .chapeau {
		flex: 0 0 30rem;
		padding-right: 2rem;
	}
	.contentArea.hasChapeau .chapeau .chapeauFloat{
		position: sticky;
		top:2rem;
		z-index: 9;
	}

	.contentArea.hasChapeau .chapeau h1 {
		font-size: 3.5rem;
		font-weight: 100;
	}
	.contentArea.hasChapeau .afterChapeau {
		flex: 1 1 auto;
	}

}

.contentArea.hasChapeau .chapeau h1 em {
	/* font-family: 'IBM Plex Serif'; */
	font-style: italic;
	font-weight: 500;
}














/*	PAGE LAYOUT DETAILS	-	-	-	-	-	-	-	-	-	-	*/


	@media (min-width: 70rem){
		.columns{
			display: flex;
			gap: 2rem;
		}
		.columns .col{
			flex: 1; /* <- this works for other widths, but should be cleaned up… there are only 2  .cols in the #Appartenances mission area, and they're 50%… */
		}
	}


	@media (min-width: 80rem) {
		#Activites #Valeurs { columns: 3; column-gap: 2.5rem; margin: 2.5rem 0; }
		#Activites #Valeurs h1 { column-span: all; }
		#Activites #Valeurs div.valeur { break-inside: avoid; }
		#Activites #Valeurs .valeur h3 { column-span: none; }
		#Activites #Valeurs .valeur:first-of-type h3 { margin-top: 0 !important; }
	}

	
	@media (min-width: 120rem){
		#Editorial .afterChapeau,
		#Collaborat .contentArea.text,
		#EspacesFemmes .secteurIntro,
		#EspacesFemmes .secteurReport,
		 #EspaceHommes .secteurIntro,
		 #EspaceHommes .secteurReport,
		          #CPM .secteurIntro,
		          #CPM .secteurReport,
		#InterpretariatCommunautaire .secteurIntro,
		#InterpretariatCommunautaire .secteurReport,
		#Formation .secteurIntro,
		#Formation .secteurReport,
		section .secteurIntro,
		section .secteurReport {
			columns: 2;
			column-gap: 2.5rem;
		}
		#Collaborat .contentArea.text h1,
		 section .secteurIntro h1, 
		section .secteurReport h1, 
		 section .secteurIntro h2, 
		section .secteurReport h2, 
		 section .secteurIntro h3, 
		section .secteurReport h3,
		#Foo
		/* #Organigramme */
		{
			column-span: all;
			margin-top: 2rem;
		}
		
		
		#Activites #activitesIntro { columns: 2; column-gap: 2.5rem; }

		#Activites #Mission { columns: 2; column-gap: 2.5rem; margin-top: 5rem; }
		#Activites #Mission h1 { column-span: all; }
		#Activites #Mission p { break-inside: avoid; }

		#Activites hr { display: none; }

	}


	img { max-width: 100%; }

	h1 + img,
	h2 + img,
	h3 + img,
	h4 + img,
	h5 + img,
	h6 + img{
		margin-top: 2rem;
	}




/*	PAGE LAYOUT BORDERS	-	-	-	-	-	-	-	-	*/

/* 2023… */
	/* nav#Sidebar {
		border-top: var(--borderWidth) solid rgba(30,71,111);
		border-right: var(--borderWidth) solid rgba(30,71,111);
	}

	section {
		border-top: var(--borderWidth) solid rgba(30,71,111);
	}
	section.hasStats {
		border-top: none;
	}
	section.hasStats .contentArea.text {
		border-top: var(--borderWidth) solid rgba(30,71,111);
	}
	@media(min-width:79rem){
		section.hasStats .contentArea.text {
			border-right: var(--borderWidth) solid rgba(30,71,111);
		}
	}
		
	div.ChapterIntro {
		border-top: var(--borderWidth) solid rgba(30,71,111);
	} */



/*	LAYOUT STYLES	-	-	-	-	-	-	-	-	-	-	*/

@media screen {

	#Cover{
		/*min-height: 100vh;*/
		margin:0;
		padding:0;
		/*background-color: rgba(58, 141, 222, 0.03);*/
	}

	#CoverLogo {
		width: 25vw;
		min-width: 14rem;
	}

	#Cover a * { color: #235585; }


	nav#Sidebar,
	nav#Sidebar * {
		/* font-family: 'IBM Plex Sans Condensed'; */
	}

	hr { border: none; border-top: 1px solid #DDD; margin: 1rem; }


	h1 em { font-style: italic; }

	#Organigramme img {
		/* max-width: 80rem; */

		/*background-color: #FFF;*/
	}
	
	.secteurReport h3 {
		/* font-family: 'IBM Plex Serif'; */
		font-weight: 500;
		font-style: italic;
		color: #3B8EDE;
		font-size: 1.75rem;
		line-height: 2rem;
	}

/*	
	.alignRight{ text-align: right; }
	.alignCenter{ text-align: center; }
*/

	img.sideImg {
		width: 20rem;
		max-width: 50%;
		margin-left: 1rem;
		float: right;
	}
	

}/*@media screen… */





@media (min-width: 70rem) {
	#Cover h1 { font-size: 10vw; line-height: 125%; }
	#Cover h1 b { font-size: 15vw; font-weight: 900 !important; }
}




	/*#SecteursIntro { }*/



	.secteurIntro { }
	.secteurIntro p { font-style: italic; }
	
	.secteurReport { }




	#EditoSigs{
		display: flex;
	}
	#EditoSigs > * {
		margin-right: 1rem; 
	}

	img.signature{
		width: 5rem;
	}
	img#sigBonsac{ width: 8rem; }
	img#sigNarbel{ width: 4rem; }



/*	Cover and Intro NAV	-	-	-	-	-	-	-	-	-	-	*/

@media screen {


	#Cover {
	/*	min-height: 100vh; */
	}

	div.ChapterIntro { min-height: 50vh !important; }
	.ChapterIntro > .chapterTitle { /*height: auto !important;*/ }


	#Cover, 
	.ChapterIntro {
		display: flex;
		align-items: center;
		justify-content: center;
		/*flex-direction: column;*/
		/*justify-content: flex-end;*/
		/*justify-content: space-between;*/
	}
	#Cover > *, 
	.ChapterIntro > * {
		/*outline: 1px solid #F0F;*/
	}



} /* media screen*/


@media (min-width: 70rem) {
	.ChapterIntro h1 { font-size: 8rem; font-weight: 200; }
	.ChapterIntro h2 { font-size: 3rem; }
}





/*	Navigation	-	-	-	-	-	-	-	-	-	-	*/

	nav#Sidebar { position: relative; }
	nav#Sidebar ul#mainNavList{
		position: sticky;
		top:0;
	}

	html {
		scroll-behavior: smooth;
	}

	nav#Sidebar ul#mainNavList{}

	nav#Sidebar {
		/*padding-left: 1em;*/
		/*background-color: rgba(58, 141, 222, 0.05);*/
	}
	
	#SidebarNavLogo { width: 9rem;}
	
	
	nav#Sidebar ul { list-style-type: none; padding:0; }

	nav#Sidebar li a.menuItem {  padding-left: 0.5em; }
	nav#Sidebar li a.menuTop { padding-left: 0.5em; }
	nav#Sidebar li a.menuSub { padding-left: 1em; }
	

	nav#Sidebar li { /* border-top: 1px solid #3a8dde; */ }

	/* chapters are bold */
/*	nav#Sidebar > ul > li { font-weight: bold; } */
	nav#Sidebar > ul > li a.menuTop { font-weight: bold; }

	nav#Sidebar li a.menuItem { display: inline-block; width: 100%; }

	/* nav layout with Flexbox */
	nav#Sidebar ul#mainNavList {
		height: 100vh;
		height: 100svh;
		display: flex;
		flex-direction: column;
		flex-wrap: nowrap;
		justify-content: space-between;
		align-items: stretch;
	/*	padding-bottom: 1rem; */
	}

	nav#Sidebar ul#mainNavList li {
		flex-grow: 1;
	}

	/* the <a> elemetns are the buttons, so we need to maximize their size.…*/
	nav#Sidebar ul#mainNavList li a {
		height: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}
	nav#Sidebar ul#mainNavList li a span { display: inline-block; width: 100%; text-align: left; }

	/* micro screens */
/*	@media (max-height:480px){
		nav#Sidebar li a.menuItem,
		nav#Sidebar li b.menuItem { 
			font-size: 60%;
			line-height: 1em;
			   padding-top: 0em;
			padding-bottom: 0em;
		}
	}
*/
/*	@media (max-height:640px){
		nav#Sidebar li a.menuItem,
		nav#Sidebar li b.menuItem { 
			font-size: 80%;
			line-height: 1em;
			   padding-top: 0em;
			padding-bottom: 0em;
		}
	}
*/
	/* short screens*/
/*	nav#Sidebar li a.menuItem,
	nav#Sidebar li b.menuItem {
		   padding-top: 0.25em;
		padding-bottom: 0.25em;
	}
*/
	/* medium screens */
/*	@media (min-height:800px){
		nav#Sidebar li a.menuItem,
		nav#Sidebar li b.menuItem { 
			   padding-top: 0.50em;
			padding-bottom: 0.50em;
		}
	}
*/
	/* tall screens */
/*	@media (min-height:900px){
		nav#Sidebar li a.menuItem,
		nav#Sidebar li b.menuItem { 
			   padding-top: 0.67em;
			padding-bottom: 0.67em;
		}
	}
*/

	nav#Sidebar li a.menuItem:not(.active):hover { 
		/* rgba(58, 141, 222, 0.25); */
		/* background-color: #d8fbfe;  */
	} 

	nav#Sidebar li a.menuItem.active { 
		/* color: #FFF;*/ 
		/*font-weight: bold;*/ 
		/* background-color: rgba(58, 141, 222, 0.75); */
		/* background-color: #abf8ff; */
	}

	nav#Sidebar ul#mainNavList > li:first-child a.menuItem { 
		color: #FFF; 
		font-weight: 300;
		/* background-color: #3B8EDE;  */
		border-bottom: var(--borderWidth) solid #235585;
	}
	nav#Sidebar ul#mainNavList > li:first-child a.menuItem strong {
		font-weight: 900 !important;
	}

	nav#Sidebar ul#mainNavList > li:first-child { position: relative; }
	nav#Sidebar ul#mainNavList > li:first-child a.PDFdownloadButton{ 
		position: absolute;
		top: 1rem; 
		right: 1rem;
		width: 3rem;
		height: 3rem;
		padding: 0.5rem;
		border-radius: 2px;
	}
	nav#Sidebar ul#mainNavList > li:first-child a.PDFdownloadButton svg .fill { 
		fill: #FFF;
	}

	nav#Sidebar ul#mainNavList > li:first-child a.PDFdownloadButton:hover { 
		background-color: rgba(255,255,255,0.67);
		outline: 1px solid #FFF;
	}
	nav#Sidebar ul#mainNavList > li:first-child a.PDFdownloadButton:hover svg .fill { 
		fill: #235585;
	}
	


	/* #MediaControl */
	#MediaControl { display:none;}
	#MediaControl nav{
		background-color: #3B8EDE;
		height: 100%;
		color: #FFF;
		display: flex;
		flex-direction: row;
		justify-content: space-around;
		gap: 1rem;
	}
	#MediaControl nav a {
		flex: 1;
		color: #FFF;
	}
	#MediaControl nav a.active {
		font-weight: bold;
	}
	



/*	Links	-	-	-	-	-	-	-	-	-	-	-	*/

	a, a:link, a:active, a:visited, a:hover {
		color: #036;
		text-decoration: none;
	}
	
	.contentArea a {
		text-decoration: underline;
	}



/*	#Sidebar as mobile nav*/
	/*nope…*/
	/*
	nav#Sidebar ul#mainNavList	li a#mobileNavKey{}

	@media (max-width: 50rem) {
		nav#Sidebar ul#mainNavList	li#mobileNavKey{
			position: sticky;
			top:0;
			background-color: #F1357A;
			z-index: 9999;
		}
	}
	*/



/*	Comite	-	-	-	-	-	-	-	-	-	-	-	*/

	ul#ComiteList,
	ul#ComiteList li.comitePerson {
		list-style-type: none; margin:0; padding:0; text-indent: 0;
	}

@media (min-width: 50rem) {
	ul#ComiteList {
		display: flex;
		flex-wrap: wrap;
	}

	ul#ComiteList li.comitePerson {
		flex: 0 0 calc(100%/3);
		padding-right: 2rem;
	}
}

	.comitePerson { }

	.comitePerson h4,
	.comitePerson p {
		margin:0;
	}
	.comitePerson p {
		font-size: 90%;
		margin-bottom: 2rem;
	}

	.comitePerson .personName,
	.comitePerson .personRole{
		display: inline-block;
		width: 100%;
	}


	.comitePerson .personName{
		/* font-family: 'IBM Plex Serif'; */
		font-weight: 300;
		font-style: italic;
		color: #3B8EDE;
	}


	.comitePerson .personRole {
		font-weight: 300;
		font-size: 80%;
	}






	#chaleureusement{
		/* font-family: 'IBM Plex Serif'; */
		font-weight: 500;
		font-size: 1.4rem;
		font-style: italic;
		color: #3B8EDE;

	}



/*	Tables	-	-	-	-	-	-	-	-	-	-	-	*/

	table {
		border-collapse: collapse;
		border-spacing: 0;
	}

	table tr td {
		border-bottom: 1px solid #a8c4ee;
	}


	table tr td { padding-top: 0.5rem; }




/*	Financial tables	-	-	-	-	-	-	-	-	*/

	#Finances table { width: 100%; }

	#Finances table tr th:first-of-type,
	#Finances table tr td:first-of-type {
		text-align: left;
		padding-right: 1em;
	}

	#Finances table tr th:not(:first-of-type),
	#Finances table tr td:not(:first-of-type) {
		text-align: right;
		padding-left: 1em;
		white-space: nowrap;
	}

	#Finances table tr.h3 td:first-of-type{ color: #369; }
	#Finances table tr.h4 td:first-of-type{ color: #369; }
	#Finances table tr.h3 td{ font-weight: 800; padding-top: 2em; font-size: 120%; }
	#Finances table tr.h4 td{ font-weight: 600; padding-top: 1em; }

	#Finances table tr.subt td{ font-weight: 600; }
	#Finances table tr.totl td{ font-weight: 800; padding-top: 2em;  }

	#Finances table tr.tall td{ padding-top: 3em;  }



	#Finances table tr:hover td { /*background-color: #DEF; */ }


	#Finances table th { font-weight: 300;}

	#Finances table tr th:nth-of-type(2),
	#Finances table tr td:nth-of-type(2) {
		color: #235585;
	}




/*	Stats	-	-	-	-	-	-	-	-	-	-	-	*/

	.contentArea.stats { padding: 0; margin:0; }

	/* TO-DO: fix this hack, it hsould be 2.5 rem, but the border is eating space!!!*/
	.statBlock{ padding: 2.4rem; margin:0; }


	.contentArea.stats {	}
	.contentArea.stats,
	.contentArea.stats * {
			color: rgb(30,71,111);
	}

	/* makind data tables a little easier to read: */
	.statBlock table { font-size: 115%; }


/* 2021-05-25 lots of @medis screen debugging for the print version */
/* THIS IS THE ONE that fixes the zooming problem!!! */
/* TO-DO, remove the other ones and keep this one… */
@media screen {

	.statBlock{
		/*background-color: rgba(255,255,255,0.5);*/
	}
	.contentArea.stats {
		/* border-top: var(--borderWidth) solid rgb(30,71,111); */
		/* background-color: rgba(216,251,254,1); */
	}

	.statBlock.chiffreCle{
		/* background-color: rgb(255,219,233); */
		/* border-bottom: var(--borderWidth) solid rgb(30,71,111); */
	}

	.statBlock.chiffreCle .cleLabel, 
	.statBlock.chiffreCle .cleValue{
		display: block;
		width: 100%;
	}

	.statBlock.chiffreCle .cleLabel{	
		font-size: 1.25rem;
		line-height: 1.75rem;
		font-weight: 200;
		color: rgb(30,71,111);
		border-bottom: 1px solid rgb(30,71,111);
	}
	.statBlock.chiffreCle .cleValue {
		/* font-family: 'IBM Plex Serif'; */
		/* font-size: 7.5rem; */
		font-weight: 500;
		line-height: 100%;
		color: rgb(30,71,111);
		text-align: center;

		font-size: 3rem;
		font-size: 9cqw;
	}
}/* media screen*/


	.statBlock h4 {
		border-top: var(--borderWidth) solid rgb(30,71,111);
		padding-top: 0.5rem; 
	}
	
	.statBlock h5 {
		font-size: 1.25rem;
		line-height: 1.25em;
		font-weight: 200;
		font-style: italic;
	}

	.statBlock table tr td:first-of-type {
		text-align: left;
		padding-right: 1em;
	}

	.statBlock table tr td:first-of-type,
	.statBlock table tr td:first-of-type * {
		color: #235585;
	}
	
	.statBlock table tr td:not(:first-of-type) {
		text-align: right;
		padding-left: 1em;
		white-space: nowrap;
	}
	.statBlock table tr td:not(:first-of-type), 
	.statBlock table tr td:not(:first-of-type) *{
		color: #000;
	}

	.statBlock table tr.sub td{
		font-style: italic;
		font-size: 85%;
	}
	
	.statBlock table tr td.subCol{
		font-style: italic;
		font-size: 85%;
	}

	.statBlock table tr td.subCol, 
	.statBlock table tr td.subCol * {
	}

	.statBlock table tr.sub td:first-of-type{
		padding-left: 1rem;
	}


	.statBlock table tr:hover td { /* background-color: #FFF; */ }




/*	Charts	-	-	-	-	-	-	-	*/

	.ct-chart-pie .ct-series-a path, .ct-chart-donut .ct-series-a path {	fill: rgb(062, 135, 199) !important;	}	/*	rgb(062, 135, 199)	*/	/* prev: #3a8dde */
	.ct-chart-pie .ct-series-b path, .ct-chart-donut .ct-series-b path {	fill: rgb(234, 242, 251) !important;	}	/*	rgb(234, 242, 251)	*/	/* prev: #ffcd00 */
	.ct-chart-pie .ct-series-c path, .ct-chart-donut .ct-series-c path {	fill: rgb(010, 064, 106) !important;	}	/*	rgb(010, 064, 106)	*/	/* prev: #235585 */
	.ct-chart-pie .ct-series-d path, .ct-chart-donut .ct-series-d path {	fill: rgb(242, 242, 242) !important;	}	/*	rgb(242, 242, 242)	*/	/* prev: #ec7700 */
	.ct-chart-pie .ct-series-e path, .ct-chart-donut .ct-series-e path {	fill: rgb(154, 196, 233) !important;	}	/*	rgb(154, 196, 233)	*/	/* prev: #999999 */
	.ct-chart-pie .ct-series-f path, .ct-chart-donut .ct-series-f path {	fill: rgb(153, 153, 153) !important;	}	/*	rgb(153, 153, 153)	*/	/* prev: #666666 */
	
	.ct-chart-bar .ct-series-a line {	stroke: rgb(062, 135, 199) !important;	stroke-width: 15%; }
	.ct-chart-bar .ct-series-b line {	stroke: rgb(062, 135, 199) !important;	stroke-width: 15%; }
	.ct-chart-bar .ct-series-c line {	stroke: rgb(062, 135, 199) !important;	stroke-width: 15%; }
	.ct-chart-bar .ct-series-d line {	stroke: rgb(062, 135, 199) !important;	stroke-width: 15%; }
	.ct-chart-bar .ct-series-e line {	stroke: rgb(010, 064, 106) !important;	stroke-width: 15%; }

	.ct-label {
		fill: rgba(0,0,0,0) !important;
	/*    stroke: #000000;
		stroke-alignment: outer;
	    stroke-width: 1pt;
		*/
		/*text-shadow: 0px 0px 3px black;*/
		font-weight: 800;	
	}
	/*
	svg g .ct-label:nth-of-type(1) { fill: #FFF !important; }
	svg g .ct-label:nth-of-type(2) { fill: #000 !important; }
	svg g .ct-label:nth-of-type(3) { fill: #FFF !important; }
	svg g .ct-label:nth-of-type(4) { fill: #000 !important; }
	svg g .ct-label:nth-of-type(5) { fill: #FFF !important; }
	svg g .ct-label:nth-of-type(6) { fill: #000 !important; }*/
	
	/* TO-DO: make labels appear on hover! */
	
	@media (max-width: 40rem) {
		svg g .ct-label:nth-of-type(1) { fill: #FFF !important; }
		svg g .ct-label:nth-of-type(2) { fill: #000 !important; }
		svg g .ct-label:nth-of-type(3) { fill: #FFF !important; }
		svg g .ct-label:nth-of-type(4) { fill: #000 !important; }
		svg g .ct-label:nth-of-type(5) { fill: #FFF !important; }
		svg g .ct-label:nth-of-type(6) { fill: #000 !important; }
		.ct-label { opacity: 1 !important; }
	}
	
	.ct-chart-bar .ct-label {
		text-shadow: none !important;
	}
	
	.ct-chart-line .ct-label {
		text-shadow: none;
	}

	.statBlock table { width: 100%; }

	.dataBlock table.hasFlags { margin-left: 1em;}

	.dataBlock table tr td:first-of-type {}

	.dataBlock table.hasFlags { position: relative; }
	.dataBlock table.hasFlags tr:nth-of-type(1) td:first-of-type .label::before { background-color: rgb(062, 135, 199);	display: inline-block; content:" "; width: .5em; height: 1em; position: absolute; left: -1em; }
	.dataBlock table.hasFlags tr:nth-of-type(2) td:first-of-type .label::before { background-color: rgb(234, 242, 251);	display: inline-block; content:" "; width: .5em; height: 1em; position: absolute; left: -1em; }
	.dataBlock table.hasFlags tr:nth-of-type(3) td:first-of-type .label::before { background-color: rgb(010, 064, 106);	display: inline-block; content:" "; width: .5em; height: 1em; position: absolute; left: -1em; }
	.dataBlock table.hasFlags tr:nth-of-type(4) td:first-of-type .label::before { background-color: rgb(242, 242, 242);	display: inline-block; content:" "; width: .5em; height: 1em; position: absolute; left: -1em; }
	.dataBlock table.hasFlags tr:nth-of-type(5) td:first-of-type .label::before { background-color: rgb(154, 196, 233);	display: inline-block; content:" "; width: .5em; height: 1em; position: absolute; left: -1em; }
	.dataBlock table.hasFlags tr:nth-of-type(6) td:first-of-type .label::before { background-color: rgb(153, 153, 153);	display: inline-block; content:" "; width: .5em; height: 1em; position: absolute; left: -1em; }

	.contentArea.stats .statBlock .dataBlock .col.table table.hasFlags { width: calc(100% - 1em); /*becasue the flags take up some space… */ }

	.dataBlock table tr.currentYear * { font-weight: bold; }


	.ct-chart-line .ct-label.ct-horizontal { 
		/*	text-anchor: middle;	*/
		/*	text-align: center;		*/
		position: relative;
		left: -1.5em;
	}
	

	.ct-chart-line .ct-series-a .ct-line {
		stroke: #3a8dde;
	}
	.ct-chart-line .ct-series-a .ct-point{
		fill: #3a8dde;
		stroke: #3a8dde;
	}
	
	
	.ct-grid {
		stroke: #999 !important;
		stroke-width: 0.25pt !important;
		stroke-dasharray: 2pt !important;
	}








/* Scroll snap */

main#Content{
	scroll-snap-type: y proximity;
}

section {
	scroll-snap-align: start;
}
div.ChapterIntro {
	scroll-snap-align: start;
}







/*	Fixing mobile	-	-	-	-	-	-	-	*/

@media (max-width: 50rem) {
	
	nav#Sidebar { border-right: none; }
	.statBlock{
		padding-left: 0.5rem;
		padding-right: 0.5rem;
		border-left: none ;
	}
	.contentArea.stats{ border-left: none; }
	#Finances .contentArea { padding-left: 0.5rem; padding-right: 0.5rem;  }
	#Finances table tr th:first-of-type, #Finances table tr td:first-of-type { padding-right: 0.25rem;}
	#Finances table tr th:not(:first-of-type), #Finances table tr td:not(:first-of-type) { padding-left: 0.5rem; }
	
	section { 
		/* 2023… nope */
		/* padding-top: 4rem;  */
	}
	
	.text { padding: 0.5rem; }


	.ChapterIntro h1.chapterTitle { 
		font-size: 60pt ; 
		margin-left: 0.5rem; 
	}

	#Comite .contentArea { padding-left: 0.5rem; }

}


@media (max-width: 40rem) {

	* h1, h1[class^="*"] { font-size: 24pt !important; }

	* h2, h2[class^="*"] { font-size: 21pt !important; }
	
	.statBlock.chiffreCle .cleValue{ font-size: 48pt !important; }
	
	.financials{
		/* overflow-y: scroll; */
	}

	.statBlock.chiffreCle{
		border-top: var(--borderWidth) solid rgb(30,71,111);
	}


	.ChapterIntro > h1.chapterTitle { font-size: 48pt !important; }
}

@media (max-width: 25rem) {

	.financials table {
		font-size: 0.75rem;
		line-height: 1.125em;
	}

	* h1, h1[class^="*"] { font-size: 21pt !important; }

	* h2, h2[class^="*"] { font-size: 18pt !important; }

	.statBlock.chiffreCle .cleValue{  font-size: 48pt !important; }

	.ChapterIntro > h1.chapterTitle { font-size: 40pt !important; }
}













/*	Testing and debugging	-	-	-	-	-	-	-	*/

.ct-chart {
	/*	
	outline: 1px solid #F0F;
	width: 200px;
	*/
}

/*
	section {
		outline: 1px solid #F0F;
		margin: 2rem;
	}

	body section:nth-of-type(even){
		background-color: #F5F5F5;
	}

*/


nav#Sidebar { /*z-index: -1;*/ }
section { /*background-color: white;*/ }







#Soutien{
	padding-bottom: 0rem;
}


#colophon{
	width: 100%;
	margin-top: 10rem;
	
	font-size: 0.8rem;
	opacity: 0.5;

	text-align: right;
	padding-right: 2rem;
}


#Remercions *{
	color: #3B8EDE;
}
#Remercions ul{
	list-style: none;
	padding: 0;
	margin: 0;
}

#Remercions ul{
	/* display: grid; 
	gap: 1rem;
	grid-template-columns: repeat(auto-fill, minmax(min(10rem, 100%), 1fr));
	grid-auto-rows: 1fr; */
	columns: 12rem auto ;
	column-gap: 1rem;
}

#Remercions ul li {
	display: block; /* TO-DO display: inline-block; */
	line-height: 100%;
	margin-bottom: 1em;
	line-height: 1.10em;
	
	/* font-family: 'IBM Plex Mono';  */
	font-style: italic;
	font-weight: 200;
	letter-spacing: -0.033em;
}

#Remercions li span.initialism.expansion{ }



#Valeurs h3{
	/* font-family: 'IBM Plex Mono';  */
	font-style: italic;
	font-weight: 400;
	letter-spacing: -0.033em;
}




/* Mobile Hamburger Menu */
/*https://dev.to/devggaurav/let-s-build-a-responsive-navbar-and-hamburger-menu-using-html-css-and-javascript-4gci*/

div#mobileUI {}
	nav#mobileNav {}
		ul.nav-menu {}
			li.nav-item {}

div#mobileUI {
	position: sticky;
	top:0px;
	background-color: #FFF;
	z-index: 999999;
	border-bottom: 1px solid #E2E8F0;
	border-bottom: var(--borderWidth) solid rgb(30,71,111);
	margin-top:0px;
}


div#mobileUI #mobileNav {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

#mobileNav .nav-logo img { width: 50%; }


#mobileNav .hamburger{
	margin-right: 1rem;
}

#mobileNav .hamburger .bar {
	display: block;
	width: 25px;
	height: 3px;
	margin: 5px auto;
	-webkit-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
	background-color: rgb(30,71,111);
}



nav#mobileNav ul.nav-menu {
	display: flex;
	justify-content: space-between;
}

nav#mobileNav ul li.nav-item {
	/*margin-left: 5rem;*/
	padding: 1rem;
	padding-top: 2rem;
	padding-bottom: 2rem;
	color: rgb(30,71,111);
}

nav#mobileNav a.nav-link{ }

nav#mobileNav a.nav-link:hover{ }

em.small{ font-size: 85%; color: #3B8EDE; }


@media print { div#mobileUI { display: none; } }
@media (min-width: 50rem) { div#mobileUI { display: none; } }
@media (max-width: 50rem) { #Sidebar { display: none; } }



@media only screen and (max-width: 50rem) {
	
	#Sidebar { display: none; }
	
	.nav-logo{
		height: 5rem;
		padding: 1rem;
		color: #3B8EDE;
	}

	nav#mobileNav ul.nav-menu {
		position: fixed;
		left: -100%;
		top: 5rem;
		flex-direction: column;
		background-color: #fff;
		width: 100%;
		text-align: left;
		transition: 0.3s;
		box-shadow: 0 10px 27px rgba(0, 0, 0, 0.05);
	}

	nav#mobileNav ul.nav-menu.active {
		left: 0;
	}

	nav#mobileNav li.nav-item {
		/*margin: 2.5rem 0;*/
		font-size: 1.8rem;
		border-top: 1px solid #DDD;
	}
	nav#mobileNav li.nav-item.ext{
		font-size: 1rem;
	}

	nav#mobileNav .hamburger {
		display: block;
		cursor: pointer;
	}
	
	nav#mobileNav .hamburger.active .bar:nth-child(2) { opacity: 0; }
	nav#mobileNav .hamburger.active .bar:nth-child(1) { transform: translateY(8px) rotate(45deg); }
	nav#mobileNav .hamburger.active .bar:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }
}












#Cover {
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: stretch;
}

#Cover #coverGraphic{
	flex: 1 1 100%;
}

#Cover #coverAddress {
	flex: 0 0 auto;
	padding: 3rem;
	text-align: right;
	font-size: 2rem;
}




.textFlow{
	columns: 30rem auto ;
	column-gap: 2rem;
}