/* ==========================================================================
   1. STYLES GENERAUX (HTML & BODY)
   ========================================================================== */

html, body {
  margin: 20px;
  padding: 20px;
}

body {
  background-color: #eef2f5; 
  font-family: Verdana, sans-serif; 
  font-size: 120%;
}

/* ==========================================================================
   2. TEXTES & TITRES
   ========================================================================== */

h1 {
  font-size: 220%;
  color: #0d1b2a; 
  text-align: center;
  border: solid;
}

h2 {
  font-size: 120%; 
  color: #1b263b; 
  text-align: center;
  padding-left: 15px;  
}

p, ul, li, td {
  color: black; 
}

/* ==========================================================================
   3. GESTION DES LIENS
   ========================================================================== */

/* --- L : Liens par défaut (Non visités) --- */
a:link, nav a:link, p a:link {
  color: #1d4ed8;
  text-decoration: underline;
}

/* --- V : Liens visités (Une fois cliqués) --- */
a:visited, nav a:visited, p a:visited {
  color: #6b21a8; /* Votre violet initial */
}

/* --- Focus (Accessibilité clavier) --- */
a:focus, nav a:focus, p a:focus {
  color: #1d4ed8;
  outline: 2px solid #1d4ed8; /* Aide visuelle pour la navigation au clavier */
}

/* --- H : Au survol de la souris --- */
a:hover, nav a:hover, p a:hover {
  color: #CF2023;
  text-decoration: none;
}

/* --- A : Au moment exact du clic --- */
a:active, nav a:active, p a:active {
  color: #C00C0F;
}

/* ==========================================================================
   4. IMAGES & MISE EN PAGE
   ========================================================================== */

img {
  alignment-baseline: center;
  max-width: 100%; /* Permet à l'image de ne pas déborder sur petit écran */
  height: auto;
}

/* Permet de centrer proprement votre image principale en HTML */
.conteneur {
  text-align: center;
  margin: 20px 0;
}

/* Style rapide pour espacer un peu les liens de votre menu de navigation */
nav {
  text-align: center;
  margin-bottom: 30px;
}

nav a {
  margin: 0 15px;
  font-weight: bold;
}

/* Style pour le pied de page */
footer {
  margin-top: 50px;
  padding-top: 20px;
  border-top: 1px solid #ccc;
}