/*Ici le code CSS qui gère la structure et la mise en page
des différentes pages du site*/


/*------------------------------------------------------
----------------------- SOMMAIRE -----------------------
1. TOUTE PAGE
2. NAVIGATION
3. HEADER
4. FOOTER
5. ACCUEIL
6. RUBRIQUE
7. RUBRIQUE : Appel à Texte - Conseils aux Auteurs - Qui Sommes Nous
8. ARTICLE
9. ARTICLE : Spécifique
10. MOT CLEF
11. PLAN DU SITE
12. RESULTAT RECHERCHE
--------------------------------------------------------
------------------------------------------------------*/



/*------------------------------------------------------
--------------------- TOUTE PAGE -----------------------
------------------------------------------------------*/

.page {
	width:100%;
	max-width:100%;
	margin:0;
}

.page .wrapper > div {
	padding:40px 55px;
}

/*------------------------------------------------------
--------------------- NAVIGATION -----------------------
------------------------------------------------------*/

nav {
	width:25%;
	float:left;
	position:fixed;
	min-width:340px;
	z-index:10;
}

.nav {
	display:flex;
	flex-direction:column-reverse;
	align-items:center;
}

#wrap {
	display:flex;
	flex-direction:column;
	align-items:center;
	padding-bottom:20px;
	height:calc(100vh - 180px);
	overflow:auto;
}

#wrap li {
	text-align:center;
}

.logo {
	min-height:180px;
	padding-top:33px;
}

.logo img {
	min-height:113px;
}

.burger {
	display:none;
}

.nav ul {
	padding:1rem 0;
	display:flex;
	flex-direction:column;
	align-items:center;
}

/*------------------------------------------------------
----------------------- HEADER -------------------------
------------------------------------------------------*/

header {
	height:180px;
	padding-right:55px;
	padding-left:55px;
	display:grid;
	grid-template-columns:1fr 1fr;
	align-items:center;
}

.arbo, .formulaire_recherche {
	margin-bottom:0;
}

.arbo {
	margin-top:25px;
}

/*------------------------------------------------------
----------------------- FOOTER -------------------------
------------------------------------------------------*/

.footer {
	margin:0;
	min-height:150px;
	padding:30px 55px;
}

/*------------------------------------------------------
----------------------- ACCUEIL ------------------------
------------------------------------------------------*/

.page .main {
	padding:0;
	width:75%;
	float:left;
	margin-left: max(340px, 25%);
}

.page .wrapper {
	width:100%;
}

.flex {
	display:flex;
	align-items:center;
	margin-bottom:30px;
}

.icon {
	height:80px;
	width:80px;
	z-index:2;
}

h2 {
	margin-bottom:0;
	margin-left:-140px;
	padding:10px 50px 10px 150px;
	max-width:max-content;
	z-index:1;
}

.parus_flexbox {
	display:flex;
	column-gap:4%;
	flex-wrap:wrap;
}

.parus_flexbox_vertical {
	display:flex;
	flex-direction:column;
	flex-shrink:0;
	flex-grow:0;
	flex-basis:48%;
	margin:25px 0;
}

.bordure {
	max-height:160px;
	min-height:80px;
	width:100%;
}

.parus_flexbox .titre_paru {
	height:100%;
	padding:0 20px;
}

h3 {
	padding-bottom:10px;
}

.titre_paru a img {
	float:left;
	margin:0 10px 10px 0;
}

/*------------------------------------------------------
----------------------- RUBRIQUE -----------------------
------------------------------------------------------*/

.article_flexbox {
	display:flex;
	flex-wrap:wrap;
	column-gap:4%;
}

.article_flexbox_vertical {
	display:flex;
	flex-direction:column;
	flex-shrink:0;
	flex-grow:0;
	flex-basis:calc(92%/3);
	margin:25px 0;
}

.article_flexbox .article_content {
	height:100%;
	padding:0 20px;
}

.cesure {
	overflow-wrap: anywhere;
}

/*------------------------------------------------------
----------------------- RUBRIQUE -----------------------
Appel à Texte - Conseils aux Auteurs - Qui Sommes Nous - 
------------------------------------------------------*/

.col3 {
	display:flex;
	flex-direction:column;
	flex-shrink:0;
	flex-grow:0;
	flex-basis:100%;
	margin:25px 0;
}

.content_col3 {
	column-count: 3;
	column-gap: 4%;
}

.col3 .padding_50top, .col3 .padding_50bottom {
	padding-top:50px;
	padding-bottom:50px;
}

.rubrique-10 .article_content {
	padding-bottom:30px;
}

.rubrique-4 .content {
	margin-bottom:0;
}

/*------------------------------------------------------
----------------------- ARTICLE ------------------------
------------------------------------------------------*/

.page_article .wrapper, .page_mot .wrapper {
	display:grid;
	grid-template-columns:3fr 1fr;
	margin-bottom:0;
}

.page_article h1{
	margin-bottom:0;
	padding:0 20px;
}

.page_article .cartouche {
	margin:0;
}

.page_article .article_content {
	padding:20px;
}

.page_article .article_description {
	padding-right:20px;
}

/*------------------------------------------------------
----------------- ARTICLE - Spécifique -----------------
------------------------------------------------------*/

.article-1 .article_content, .article-13 .article_content {
	/*display:grid;
	grid-template-columns:2fr 1fr;*/
	overflow:hidden;	
}

.article-1 .article_description, .article-13 .article_description {
	width:66%;
	float:left;
	margin-right:0;
}

.article-1 .spip_logo, .article-13 .spip_logo {
	width:34%;
	float:left;
	margin-left:0;
}

/*------------------------------------------------------
----------------------- MOT CLEF -----------------------
------------------------------------------------------*/

.page_mot .cartouche, .page_mot .menu_articles {
	padding:20px 55px;
}

.page_mot .cartouche h1, .page_mot .menu_articles h2 {
	margin-bottom:20px;
}

.page_mot #content {
	padding:0;
}

.aside h2 {
	margin:0;
	padding:0;
	max-width:100%;
}

.aside {
	width:100%;
}

/*------------------------------------------------------
--------------------- PLAN DU SITE ---------------------
------------------------------------------------------*/

.section_plan {
	margin-bottom: 40px;
	padding-bottom: 20px;
}

/*------------------------------------------------------
------------------ RESULTAT RECHERCHE ------------------
------------------------------------------------------*/

.page_recherche #content {
	padding:0;
}

.page_recherche .cartouche, .page_recherche .menu {
	padding:40px 55px;
}

.page_recherche .menu h2 {
	margin-bottom:20px;
}