body, html {
    height: 100%;
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center; /* Centre verticalement le contenu dans la page */
    justify-content: center; /* Centre horizontalement le contenu dans la page */
	background-color: #222222
}

h1, a, p
{
	font-family: Verdana, "Trebuchet MS", Arial, "Arial black";
	color: #FAF0E6;
}
h1
{
	font-size: 3em;
	font-weight: normal;
}
a
{
	font-size: 0.7em;
}
p
{
	font-size: 0.7em;
	width: 700px;
	margin-bottom: 12px;
	margin-left: 0px;
	margin-right: 0px;
	margin-top: 12px;
	text-align: justify;
}

.plusclair
{
	color: #999999#FFEFD5
}
.pluspetit
{
	font-size: 0.7em;
}

.top-left-image {
    position: fixed;
    top: 10px; /* Un peu d'espace du haut */
    left: 10px; /* Un peu d'espace de la gauche */
    max-width: 5%; /* Taille maximale en pourcentage de la largeur de l'écran */
    max-height: 20vh; /* Taille maximale en pourcentage de la hauteur de l'écran */
}

.ligne-images {
    position: absolute;
    width: 98%; /* Largeur relative à la largeur de la fenêtre */
    top: 50%;
	transform: translateY(-50%);
}

.elementimage {
    flex: 1;
    text-align: center;
    max-width: 10%; /* Divise l'espace horizontal équitablement */
}
.elementimagecentrale {
    flex: 1;
    text-align: center;
    max-width: 80%; /* Divise l'espace horizontal équitablement */
}

.second-image,
.third-image,
 .fourth-image {
    position: absolute;
    top: 50%; /* Place le centre de l'image à mi-hauteur */
    transform: translateY(-50%); /* Décale l'image de moitié vers le haut pour la centrer verticalement */
}

.second-image {
    left: 0;
}

.third-image {
    left: 50%; /* Place l'image au centre horizontalement */
    transform: translate(-50%, -50%); /* Décale l'image de moitié vers la gauche et vers le haut pour la centrer */
}

.fourth-image {
    right: 0;
}


img {
     width: 100%; /* Utilise la totalité de la largeur du parent */
    height: auto;
/*    max-width: 900px; /* Taille maximale de l'image */
    max-height: 80vh; /* Taille maximale en pourcentage de la hauteur de l'écran */
}

#conteneuractualite {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    align-content: space-around;
    height: auto;
    width: 69vmin;
    margin-top: 0vmin;
}

.elementtriptyque {
    width: 21vmin; /* Réduire la largeur des images */
    height: auto; 
    margin: 1vmin; /* Ajuster l'espacement */
}
.elementdiptyque {
    width: 32vmin; /* Réduire la largeur des images */
    height: auto; 
    margin: 1vmin; /* Ajuster l'espacement */
}
.elementunique {
    width: 45vmin; /* Réduire la largeur des images */
    height: auto; 
    margin: 1vmin; /* Ajuster l'espacement */
}