body {
    font-family: Arial, sans-serif;
    margin: 0;
    padding: 0;
	text-align: center;
    background-color: (12, 60, 96); /* Couleur de fond sombre pour que le texte soit visible */
/*    color: #333;  Couleur du texte sombre pour le contraste */

    justify-content: center; 	/*Centre horizontalement */
    align-items: center;     	/* Centre verticalement */
	
/*    display: flex;			rajouté mais ça plante tout  */
/*    height: 100vh;            Hauteur complète de la fenêtre */

}

header, footer {
    background-color: rgb(12, 60, 96); /* Couleur de fond sombre pour l'en-tête et le pied de page */
    color: #fff; /* Couleur du texte blanche pour l'en-tête et le pied de page */
    text-align: center;
    padding: 1em 0;
}
header h1 {
    color: #fff; /* Couleur du texte blanche pour le h1 dans le header */
}
.logo {
    position: absolute; /* Permet de positionner l'élément par rapport à son conteneur */
    top: 0;             /* Positionne l'élément à 0px du haut */
    right: 0;           /* Positionne l'élément à 0px de la droite */
    margin: 10px;       /* Facultatif : ajoute un peu de marge pour ne pas coller au bord */
    width: 10vw;       
  }
 
.text-red {
    color: red;
}

.text-green {
    color: green;
}

.text-blue {
    color: blue;
}
.font-size-title {
    font-size: clamp(1rem, 3vw, 2rem);
	line-height: 0.5;
	font-weight: bold;
}
.font-size-subtitle {
    font-size: clamp(1rem, 2.5vw, 2rem);
	line-height: 1;
    color: yellow;
}
/* Définir des classes pour le fond */
.bg-red {
    background-color: red;
}

.bg-green {
    background-color: green;
}
.mailto {
    color: white;
}
.bg-blue {
    background-color: blue;
}

.image {
    width : 80%;
    height: auto; /* Garde les proportions de l'image auto */
/*	display: block; */
}
		
.button {
            margin-top: 0px;  /* Espace avant (en haut) réduit */
			margin-bottom: 0px;  /* Espace après (en bas) réduit */
			display: inline-block;
            padding: 10px 1px;
            font-size: clamp(1rem, 1.5vw, 2rem);
            cursor: pointer;
            text-align: center;
            text-decoration: none;
            color: #fff;
            background-color: #007BFF;
            border: none;
            border-radius: 10px;
			width : 32%;
			margin-bottom: 10px;
}
        
.button:hover {
            background-color: #0056b3;
}
.image-container {
            text-align: center; /* Centre l'image */
            margin: 0px; /* Ajoute un espacement autour de l'image */
			background-color: rgb(12, 60, 96);
nav ul {
    list-style: none;
    padding: 0;
}

nav ul li {
    display: inline;
    margin-right: 10px;
}

nav ul li a {
    text-decoration: none;
    color: #333; /* Couleur du texte des liens */
}

main {
    width: 100%; /* ou une autre valeur en pourcentage */
    margin: 0; /* Supprimez les marges si nécessaire */
    padding: 0; /* Supprimez les rembourrages si nécessaire */
}

h1, h2 {
    color: #333; /* Couleur du texte des titres */
}