/* ------------------------------------------------------------------------------------ */
/* Réglages généraux */
/* ------------------------------------------------------------------------------------ */
body {
	font-size: 13pt;
	color: #4f4f4f;
	background-color: white;
	font-family: 'Authentic Sans', sans-serif;
}


/* ------------------------------------------------------------------------------------ */
/* En-tête */
/* ------------------------------------------------------------------------------------ */
#header-wrapper {
	background-image: -moz-linear-gradient(top, #8DB2E2, #fff);
	background-image: -webkit-linear-gradient(top, #8DB2E2, #fff);
	background-image: -ms-linear-gradient(top, #8DB2E2, #fff);
	background-image: linear-gradient(top, #8DB2E2, #fff);
	background-color: #fff;
}


#header {
	background-image: none;
	background-image: none;
	background-image: none;
	background-image: none;
	-moz-box-sizing: content-box;
	-webkit-box-sizing: content-box;
	-ms-box-sizing: content-box;
	box-sizing: content-box;
	position: relative;
	margin: 2.5% 0 2.5% 0;
	padding: 0 40px 0 40px;
	border: none;
	box-shadow: none;
	background-color: transparent;
	height: 86px;
}

.image-icons-row {
	display: flex; 
	justify-content: space-between; 
	align-items: center; 
}

.image-left img {
	width: 100px; 
	height: auto;
}

.icons-right {
	display: flex;
	gap: 10px;
}
/* ------------------------------------------------------------------------------------ */
/* Menu */
/* ------------------------------------------------------------------------------------ */
#header nav {
	position: relative;
	right: 40px;
	line-height: 84px;
	text-transform: none;
	letter-spacing: default;
}

#header nav .current-page-item {
	font-size: 16px; 
	color: #2B5852;
	background-image: none;
	background-image: none;
	background-image: none;
	background-image: none;
	background-color: white;
	box-shadow: none;
}


#header nav > .menu li {
	font-size: 16px; 
	color: #2B5852;
	min-width: 130px;
	line-height: 50px;
	text-align: center;
	vertical-align: middle;
	background-image: none;
	background-image: none;
	background-image: none;
	background-image: none;
	background-color: white;
	box-shadow: none;
	border-radius: 50%; 
	border: 2px solid #99C599; /* Bordure bleue */
	margin-right: 10px;
}

#header nav > .menu li:hover {
	background-image: none;
	background-image: none;
	background-image: none;
	background-image: none;
	background-color: white;
	box-shadow: none;
	border-radius: 50%; 
	border: 2px solid #175952; /* Bordure bleue */
}

#header nav a {
	display: inline-block;
	text-decoration: none;
	font-size: 16px; 
	color: #2B5852;
	padding: 0 25px 0 25px;
	outline: 0;
}


#header nav a:hover {
	background-image: none;
	background-image: none;
	background-image: none;
	background-image: none;
	background-color: white;
	box-shadow: none;
	border-radius: 50%; 
	border: none; /* Bordure bleue */
}

#header nav .menu .has-children .menu li:hover {
	background-color: white;
}

#header nav .menu .has-children:hover > .menu,
#header nav .menu .has-children:focus-within > .menu,
#header nav .menu .has-children .menu:hover,
#header nav .menu .has-children .menu:focus {
	visibility: visible;
	opacity: 1;
	display: block;
	background-color: white;
}

/* ------------------------------------------------------------------------------------ */
/* Pied de page */
/* ------------------------------------------------------------------------------------ */
#footer-wrapper {
	background-color: #8BC593;
	padding: 10px 0px 10px 0;
	color:#ffffff;
	font-size: 14px;
}


/* ------------------------------------------------------------------------------------ */
/* Headers */
/* ------------------------------------------------------------------------------------ */
h1 {
	width: 200px; 
	height: 75px; 
	line-height: 75px;
	background-color: white; 
	background: white; 
	color: #2B5852;
	text-align: center;
	font-size: 16px; /* Taille du texte */
	border-radius: 50%; 
	margin: 20px 0 20px 0; 
	display: flex;
	align-items: center; /* Centrage vertical */
	justify-content: center; /* Centrage horizontal */
	border: 2px solid #25645D; /* Bordure bleue */
	line-height: 50px;
	text-transform: none;
}

.dlh1 {
	background-color: #8CC794; 
	color: white;
	font-size: 18px;
	font-weight: bold;
	border: none;
}

/* ------------------------------------------------------------------------------------ */
/* Paragraphes */
/* ------------------------------------------------------------------------------------ */
p {
	line-height: 1.2em;
}

.downloadList {
	color: #175952;
	font-weight: bold;
}


/* ------------------------------------------------------------------------------------ */
/* Format 2 colonnes */
/* ------------------------------------------------------------------------------------ */
.two-columns {
	display: flex;
	gap: 20px;
	flex-wrap: wrap; /* Permet aux colonnes de se réorganiser */
}

.two-columns .column {
	flex: 1;
	min-width: 300px; /* Largeur minimale pour éviter des colonnes trop étroites */
}

@media (max-width: 768px) {
	.two-columns {
		flex-direction: column; /* Empile les colonnes sur petits écrans */
	}
}

/* ------------------------------------------------------------------------------------ */
/* encadré */
/* ------------------------------------------------------------------------------------ */
.bordered-div {
	border: 2px solid #175952; /* 2px d'épaisseur, bordure pleine, couleur noire */
	padding: 10px; /* Espacement interne entre le contenu et la bordure */
	margin: 20px; /* Espacement externe autour du div */
}

.bordered-div-notop {
	border: 2px solid #175952; /* 2px d'épaisseur, bordure pleine, couleur noire */
	padding: 10px; /* Espacement interne entre le contenu et la bordure */
	margin: 20px; /* Espacement externe autour du div */
	margin-top: 0px; /* Espacement externe autour du div */
}
.bordered-div-light {
	border: 2px solid #8CC794; /* 2px d'épaisseur, bordure pleine, couleur noire */
	padding: 10px; /* Espacement interne entre le contenu et la bordure */
	margin: 20px; /* Espacement externe autour du div */
	margin-top: 0px;
}
.hdrBox {
	background-color: #8CC794;
	color: white;
	padding: 10px; /* Espacement interne entre le contenu et la bordure */
	margin: 20px; /* Espacement externe autour du div */
	margin-bottom: 0px; /* Espacement externe autour du div */
}


/* ------------------------------------------------------------------------------------ */
/* encadré sombre*/
/* ------------------------------------------------------------------------------------ */
.encart {
	background-color: #175952;
	color: white;
	padding: 10px; /* Espacement interne entre le contenu et la bordure */
	margin: 20px; /* Espacement externe autour du div */
}

/* ------------------------------------------------------------------------------------ */
/* Questions */
/* ------------------------------------------------------------------------------------ */
.maskedAnswer {
	background-color: #175952;
	border: 2px solid #175952; /* 2px d'épaisseur, bordure pleine, couleur noire */
	color: #175952;
	padding: 10px; /* Espacement interne entre le contenu et la bordure */
	margin: 20px; /* Espacement externe autour du div */
	margin-bottom: 0px; /* Espacement externe autour du div */
}

.maskedAnswer:hover {
	background-color: white;
	border: 2px solid #175952; /* 2px d'épaisseur, bordure pleine, couleur noire */
	color: #175952;
	font-size: 18px;
	padding: 10px; /* Espacement interne entre le contenu et la bordure */
	margin: 20px; /* Espacement externe autour du div */
	margin-bottom: 0px; /* Espacement externe autour du div */
}

/* ------------------------------------------------------------------------------------ */
/* Images cliquables (carto #1) */
/* ------------------------------------------------------------------------------------ */
.image-container {
	position: relative;
	width: 600px; /* Largeur de l'image */
}

.image-container img {
	width: 100%; /* S'adapte à la largeur du conteneur */
}

.link {
	position: absolute;
	top: 0;
	height: 100%; /* Prend toute la hauteur de l'image */
}

.link.left {
	width: 95%; /* Divise l'image en deux */
	left: 0;
}

.link.right {
	width: 5%; /* Divise l'image en deux */
	right: 0;
}