header {
        display: flex ; 
	flex-direction: row ; 
	justify-content: space-around;
	background-color: white ;
	color: black ; 
}



nav {
	flex: 2 ;

}

/* ============================== */
/* Barre de navigation principale */
/* ============================== */

.navigation {
	list-style: none ;
	display: flex ;
	flex-direction: row ;
	max-height: 80px ; 
	justify-content: space-around ;
	background-color: #aaaaff ; 
}

.navigation a {
	display: block ;
	padding: 1em;
	text-decoration: none ;
	text-align: center ;
	background-color:"#ccff00";
}

.navigation a:hover {
	display: block ;
	padding: 1em;
	text-decoration: none ;
	text-align: center ;
	background-color:"#ccff00";
    	color:red ; 
}


/* =============== */
/* Page principale */
/* =============== */

.main {display: flex; 	
	flex-direction: row ;
	justify-content: space-around  ;
}

.main section {
	width: 80%; 
	margin: 10px ;
	padding: 10px ; 
	border-style: solid;
	border-color: #aaaaff ; 
	border-width: 10px ; 
	border-radius: 10px ; 
}


.main section article {
	width: 95%; 
	margin: 10px ;
	padding: 10px ; 
	border-style: none;
	border-color: #aaaaff ; 
	border-width: 10px ; 
	border-radius: 10px ; 
}

.main aside   {
	width: 20%; 
	margin: 10px ;
	padding: 10px ; 
	border-style: solid;
	border-color: #aaaaff ; 
	border-width: 10px ; 
	border-radius: 10px ; 
}

.main nav   {
	display: flex ;
	flex-direction: column ; 
	justify-content: flex-start ;
	align-items: stretch ; 
	width: 20%; 
	margin: 10px ;
	padding: 10px ; 
	border-style: solid;
	border-color: #aaaaff ; 
	border-width: 10px ; 
	border-radius: 10px ; 
}


.ligne {
	display: flex ;
	flex-direction: row ;
	justify-content: flex-start ; 
}

/* ==== */
/* SLAT */
/* ==== */



div.slat {
	display : flex ;
	align-items : flex-start ; 
}

div.slat div.slat-copy {
	padding: 10px ;
	flex: 1 ;
}


/* ============================ */
/* Pour la page historique.html */
/* ============================ */

#histoire {
	width: 100% ; 
	column-count: 3 ;
	column-rule-style: solid ;
	column-rule-width: 0.1rem ; 
	text-align: justify ;
}




/* ---------------- */
/* Galerie d'images */
/* ================ */


.galerie-150 {
	display: flex ;
	flex-direction: row ;
	flex-wrap: wrap ; 
	justify-content: space-around  ;
	align-items: stretch ; 
}

/* ============================== */
/* Actualités                     */
/* ============================== */

.actu  {
        display: flex ;
	flex-direction: column ;
	background: white ; 
	border: 2px solid #00F ;
	border-radius: 10px ; 
	margin: 5px;
 
}

.actu .entete {
	display: flex ;
	flex-direction: row ;
	justify-content: space-between ; 
}

.actu h4 {
	text-align: center ;
	color: blue ;
	border-radius: 5px  ;
}