.banniere {
    /* Chemin de votre image */
    background-image: url('../ban332degr.jpg');
    
    /* Couleur de secours pendant le chargement */
    background-color: #181818; 
    
    /* Empêche l'image de se répéter */
    background-repeat: no-repeat;
    
    /* Centre l'image dans son conteneur */
    background-position: center center;
    
    /* L'image couvre tout le conteneur sans se déformer */
    background-size: cover;
    
    /* Hauteur de la bannière (ajustable selon vos besoins) */
    height: 500px; 
    width: 100%;
}

h1 {
    text-shadow: -0.5px -0.5px 0 #181818,  /* Contour en noir */
                  0.5px -0.5px 0 #181818,
                 -0.5px 0.5px 0 #181818,
                  0.5px 0.5px 0 #181818;
    font-size: 30px;
    margin-left: 20px;
    letter-spacing: 8px;
    color: #8A8C8B;  /* Texte en blanc */
}
 
h2 {
    text-shadow: -0.5px -0.5px 0 #181818,  /* Contour en noir */
                  0.5px -0.5px 0 #181818,
                 -0.5px 0.5px 0 #181818,
                  0.5px 0.5px 0 #181818;
    font-size: 25px;
    margin-left: 20px;
    letter-spacing: 3px;
    color: #8A8C8B;  /* Texte en blanc */
}
 
a:link {
    text-decoration: none;    
    text-shadow: -0.5px -0.5px 0 #181818,  /* Contour en noir */
                  0.5px -0.5px 0 #181818,
                 -0.5px 0.5px 0 #181818,
                  0.5px 0.5px 0 #181818;
    font-size: 20px;
    color: #F4F1EA;  /* Texte en blanc */
}
 
a:hover {
    text-shadow: -0.5px -0.5px 0 #181818,  /* Contour en noir */
                  0.5px -0.5px 0 #181818,
                 -0.5px 0.5px 0 #181818,
                  0.5px 0.5px 0 #181818;
    font-size: 20px;
    color: #B86A2B;  /* Texte en blanc */
}

a:active {
    text-shadow: -0.5px -0.5px 0 #181818,  /* Contour en noir */
                  0.5px -0.5px 0 #181818,
                 -0.5px 0.5px 0 #181818,
                  0.5px 0.5px 0 #181818;
    font-size: 20px;
    color: #8E2E2E;  /* Texte en blanc */
}

/* 1. Define the default state of the element */
.my-button {
  font-size: 15px;
  font-weight: 500;
  background-color: #181818;
  color: #F4F1EA;
  padding: 10px 20px;
  border: none;
  cursor: pointer;
  opacity: 0.5;
  /* 2. Optional: Add a transition for a smooth animation effect */
  transition: background-color 0.3s ease; 
}

/* 3. Define what changes when the user hovers over it */
.my-button:hover {
  background-color: #8E2E2E; /* Changes to a darker blue */
}