/* Ajoutez un sélecteur pour le style du menu */
ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-color: #3f61fa;
  position: fixed;
  top: 12%; /* Ajustez la position en fonction de la hauteur de votre bandeau */
  width: 100%;
  z-index: 1; /* Assurez-vous que le menu apparaît au-dessus du bandeau */
}

li {
  float: left;
}

li a {
  display: block;
  color: white;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

li a:hover {
  background-color: #111;
}

/* Ajoutez un sélecteur pour le style du bandeau */
#bandeau {
  position: fixed;
  top: 0;
  width: 100%;
  align-items: center;
  display: flex;
  box-shadow: 10px 5px 5px #c4c4c4;
  height: 10%;
  background-color: #fff;
  z-index: 2; /* Assurez-vous que le bandeau apparaît au-dessus du menu */
}



#bandeau .logo {
  max-width: 100%;
  max-height: 100%;
  height: auto;
  margin-left: 1%;
}

#bandeau .texte {
  justify-content: center;
  text-align: center;
  font-size: 1.8rem;
  margin-left: 35%;
  color: #086cbc;
}
.content-container {
  margin-top: 5%; /* Ajustez la marge en fonction de la hauteur de votre menu */
  text-align: center;
  /*padding: 150px; /* Ajoutez une marge intérieure pour l'espace du contenu */
  /*background-color: #f0f0f0; /* Ajoutez une couleur de fond pour distinguer le contenu */
  
}
.content-container img {
  display: block;
  margin: auto;
}
.content-container h1 {
  margin-top: -80px; /* Ajoutez la marge désirée pour remonter le texte */
  text-decoration: underline; /* Ajoute un soulignement au texte */
}
/* Ajoutez un sélecteur pour les styles responsives du bandeau */
@media (max-width: 768px) {
  #bandeau {
      position: fixed;
      top: 0;
      width: 100%;
      display: flex;
      align-items: center;
      left: 0%;
      box-shadow: 10px 5px 5px #c4c4c4;
      height: 10%;
      background-color: #fff;
      z-index: 2; /* Assurez-vous que le bandeau apparaît au-dessus du menu */
  }

  #bandeau .texte {
      font-size: 1rem;
      margin-left: 10%;
      text-align: left;
  }

  #bandeau .logo {
      max-width: 75%;
      max-height: 75%;
      height: auto;
      margin-left: 1%; 
  }

  /* Ajustement du positionnement du menu pour les écrans plus petits */
  ul {
      top: 10%;
  }
}