
  header {
    width: 300px; /* Largeur fixe pour le header */
    display: flex;
	max-width: 800px;
    justify-content: space-between;
    align-items: center;
    padding: 10px;
	margin: 0 auto;
}

@media (max-width: 400px) {
    header {
        width: 90%; /* Ajuster la largeur du header pour les écrans de 400px de large ou moins */
    }
}

.logo-container {
    text-align: left;
}

.subscription {
    text-align: right;
}


        footer {
            text-align: center;
            margin-top: 20px; /* Ajouter un espace entre le contenu et le footer */
        }

.contenu {
    width: 90%; /* Largeur de 90% de la largeur de la fenêtre */
    max-width: 800px; /* Limite la largeur maximale à 800 pixels */
    margin: auto; /* Centre le contenu horizontalement */
    padding: 20px; /* Ajoute un espace autour du contenu */
    background-color: #f9f9f9;
    border-radius: 5px;
    box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.1);
}


#section1 {
    text-align: justify; /* Justifie le texte */
}

#section1 h1 {
    text-align: center; /* Centre le titre */
    margin-bottom: 20px; /* Ajoute un espace en bas du titre */
}

#section1 p {
    margin-bottom: 10px; /* Ajoute un espace en bas de chaque paragraphe */
}

#section1 ul {
    margin-bottom: 10px; /* Ajoute un espace en bas de chaque liste à puces */
}

#section1 ul li {
    list-style-type: square; /* Change le type de puce */
    margin-left: 20px; /* Décale les puces vers la droite */
}

#section1 a {
    color: #007bff; /* Change la couleur des liens */
    text-decoration: none; /* Supprime le soulignement des liens */
}

#section1 a:hover {
    text-decoration: underline; /* Souligne les liens au survol */
}

