/* Réglages généraux*/

/* le fond de page */ 
body {
    margin: 0;
    background-color: #000000; /* couleur brique */
    color: #fff;
}

/* le bas de page */ 
footer {
    margin-top: 50px;
    padding: 20px;
    font-size: 0.8em;
    background-color: #8B0000;
}

/* les titres */
h1 {
    text-align: center;
    color: white;
    font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
    /*font-weight: 300;*/
}

h2 {
    text-align: center;
    color: aquamarine;
    font-family: Cochin, Cambria, Georgia, Times, 'Times New Roman', serif;
    font-weight: 200;
}

p {
    font-family: Cochin, Cambria, Georgia, Times, 'Times New Roman', serif;
    font-weight: 200;
    margin-left: 48px;
    margin-right: 48px;
}

/* Les images */
.image-container {
    text-align: center; /* Aligne les images au centre */
}

/* Pour les écrans plus grands que 1024px de large */
@media screen and (min-width: 1024px) {
/* Le titre de page */
h1 {
    font-size: 72px;
}

/*Les titre en H2 */
h2 {
    font-size: 36px;
}

/* Le texte des paragraphes */
p {
    font-size: 24px;
}

/* Les images */

.image-container img {
    /* margin: 0 24px; */ /* Ajoute un espace entre les images */
    margin-bottom: 24px;
    max-width: 800px; /* Limite la largeur maximale à 800px */
    max-height: 800px; /* Limite la hauteur maximale à 800 pixels */
    width: auto; /* Conserve les proportions de l'image */
    height: auto; /* Conserve les proportions de l'image */}
}

/* pour les écrans inférieurs à 1023px de large */ 

@media screen and (max-width:1023px) {
/* Le titre de page */
h1 {
    font-size: 36px;
}

/*Les titre en H2 */
h2 {
    font-size: 24px;
}

/* Le texte des paragraphes */
p {
    font-size: 16px;
}

/* Les images */

.image-container img {
    margin: 0 24px; /* Ajoute un espace entre les images */
    margin-bottom: 24px;
    max-width: 100%; /* Limite la largeur maximale à 100% du conteneur */
    max-height: 300px; /* Limite la hauteur maximale à 300 pixels */
    width: auto; /* Conserve les proportions de l'image */
    height: auto; /* Conserve les proportions de l'image */}
}