:root{
	--bleu: #12214b ;
	--saumon: #e69973 ;
}

body, html {
	font-family: 'Open Sans', sans-serif;
	text-rendering: optimizeLegibility !important;
	-webkit-font-smoothing: antialiased !important;
	font-weight: 400;
	width: 100% !important;
	height: 100% !important;
	background-color: wheat;
	margin: 0px ;
}

#cadre_bleu {
	background-color: var(--bleu);
	color: white ;
	width: 90% !important;
	height: 100% !important;
	margin: 0px auto 0px auto ;
}
h1{
	font-family: "Liberation Serif Italic" ;
	font-size: 64pt ;
	font-style: italic ;
	font-weight: 400 ;
	text-align: center ;
	padding-top: 40px ;
	margin: 0px ;
}
a {
	color: white ;
}
table {
	margin: 64px auto 0px auto ;
	border-collapse: collapse ;
}
th {
	padding: 20px ;
	font-family: "Liberation Serif" ;
	font-size: 20pt ;
}
td {
	width: 500px ;
	padding: 12px 40px 12px 40px ;
	line-height: 1.75 ;
	text-align: justify;
	text-justify: inter-word;
}
td.gauche {
	border-right: 1px solid white ;
	margin-right: 0px ;
}
#vignette:hover {
	cursor: pointer ;
}
.conteneur_image {
	width: fit-content ;
	height: fit-content ;
	margin: 40px auto 40px auto ;
}

.conteneur_modal {
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	display: none ;
}
.fond_modal {
	position: fixed;
	background-color: black;
	top: 0px;
	width: 100%;
	height: 100%;
	opacity: 0.4;
	z-index: 21;
}
.conteneur_image_modal {
	position: relative ;
	background-color: white ;
	border: 5px solid var(--saumon) ;
	border-radius: 20px ;
	z-index: 22;
	margin: 80px auto auto auto ;
}
.image_modal {
	margin: 40px ;
}

footer {
	font-size: 10pt ;
	text-align: center ;
	margin: 10px auto 100px auto ;
}