body {
    margin: 0;
    font-family: Arial, sans-serif;
}

.bandeau {
    background-color: #1552c3;
    color: #fff;
    padding: 10px;
    text-align: center;
}

.contenu {
    display: flex;
    justify-content: center; /* Centre la colonne de droite */
    align-items: stretch; /* Étend la colonne de gauche à la hauteur maximale */
    height: 100vh; /* 100% de la hauteur de la vue */
    flex: 1;
}

.h1 {
  caret-color: #FFFFFF;
    color: #FFFFFF;
}


.colonne-gauche {
    background-color: #000;
    color: #fff;
    padding: 20px;
    text-align: gauche;
    width: 15%;

}



.colonne-droite {
    width: 85%;
    padding: 30px;
    text-align: center; /* Centre le texte dans la colonne de droite */

}

.texte-blanc {
    color: #fff;
}

.pied-de-page {
    background-color: #1552c3;
    color: #fff;
    text-align: center;
    padding: 10px;
    position: fixed;
    bottom: 0;
    width: 100%;
}
ul {
  list-style-type: none;
  margin:0;
  padding:0;
  background-color: #1552c3;
  overflow: hidden;
}
li {
  float:left;
}

img {
  float:left;

}

li a {
  color:white;
  padding:20px;
  text-decoration: none;
  display: block;
}

table, th, td {
  border: 1px solid white;
  border-collapse: collapse;
  margin-left: auto;
  margin-right: auto;
}

li a:hover {
  background-color: #438ED1;
}
footer {
  padding:20px;
  background-color: #1552c3;
  color:white;
  text-align: center;
}
.submit-button-normal {
  margin-top: 10px; /* Ajoute un espace au-dessus du bouton */
  padding: 7px 14px; /* Ajoute du padding pour rendre le bouton plus grand */
  font-size: 14px; /* Taille de police pour rendre le texte du bouton lisible */
  background-color: #1552c3; /* Couleur de fond du bouton */
  color: white; /* Couleur du texte du bouton */
  border: none; /* Supprime les bordures par défaut */
  cursor: pointer; /* Change le curseur en pointeur pour indiquer que le bouton est cliquable */
  border-radius: 10px; /* Arrondit les bords du bouton */
}
.submit-button-normal:hover {
  background-color: #438ED1; /* Change la couleur de fond du bouton au survol */
}
.submit-button-normallittle {
  margin-top: 1px; /* Ajoute un espace au-dessus du bouton */
  padding: 3px 7px; /* Ajoute du padding pour rendre le bouton plus grand */
  font-size: 14px; /* Taille de police pour rendre le texte du bouton lisible */
  background-color: #1552c3; /* Couleur de fond du bouton */
  color: white; /* Couleur du texte du bouton */
  border: none; /* Supprime les bordures par défaut */
  cursor: pointer; /* Change le curseur en pointeur pour indiquer que le bouton est cliquable */
  border-radius: 10px; /* Arrondit les bords du bouton */
}
.submit-button-normallittle:hover {
  background-color: #438ED1; /* Change la couleur de fond du bouton au survol */
}
.submit-button-alert {
  margin-top: 10px; /* Ajoute un espace au-dessus du bouton */
  padding: 7px 14px; /* Ajoute du padding pour rendre le bouton plus grand */
  font-size: 14px; /* Taille de police pour rendre le texte du bouton lisible */
  background-color: hsl(34, 81%, 42%); /* Couleur de fond du bouton */
  color: white; /* Couleur du texte du bouton */
  border: none; /* Supprime les bordures par défaut */
  cursor: pointer; /* Change le curseur en pointeur pour indiquer que le bouton est cliquable */
  border-radius: 10px; /* Arrondit les bords du bouton */
}
.submit-button-alert:hover {
  background-color: hwb(32 44% 18%); /* Change la couleur de fond du bouton au survol */
}
.submit-button-alertlittle {
  margin-top: 1px; /* Ajoute un espace au-dessus du bouton */
  padding: 3px 7px; /* Ajoute du padding pour rendre le bouton plus grand */
  font-size: 14px; /* Taille de police pour rendre le texte du bouton lisible */
  background-color: hsl(34, 81%, 42%); /* Couleur de fond du bouton */
  color: white; /* Couleur du texte du bouton */
  border: none; /* Supprime les bordures par défaut */
  cursor: pointer; /* Change le curseur en pointeur pour indiquer que le bouton est cliquable */
  border-radius: 10px; /* Arrondit les bords du bouton */
}
.submit-button-alertlittle:hover {
  background-color: hwb(32 44% 18%); /* Change la couleur de fond du bouton au survol */
}
.submit-button-attention {
  margin-top: 10px; /* Ajoute un espace au-dessus du bouton */
  padding: 7px 14px; /* Ajoute du padding pour rendre le bouton plus grand */
  font-size: 14px; /* Taille de police pour rendre le texte du bouton lisible */
  background-color: rgb(202, 35, 51); /* Couleur de fond du bouton */
  color: white; /* Couleur du texte du bouton */
  border: none; /* Supprime les bordures par défaut */
  cursor: pointer; /* Change le curseur en pointeur pour indiquer que le bouton est cliquable */
  border-radius: 10px; /* Arrondit les bords du bouton */
}
.submit-button-attention:hover {
  background-color: hsl(355, 57%, 58%); /* Change la couleur de fond du bouton au survol */
}
.submit-button-attentionlittle {
  margin-top: 1px; /* Ajoute un espace au-dessus du bouton */
  padding: 3px 7px; /* Ajoute du padding pour rendre le bouton plus grand */
  font-size: 14px; /* Taille de police pour rendre le texte du bouton lisible */
  background-color: rgb(202, 35, 51); /* Couleur de fond du bouton */
  color: white; /* Couleur du texte du bouton */
  border: none; /* Supprime les bordures par défaut */
  cursor: pointer; /* Change le curseur en pointeur pour indiquer que le bouton est cliquable */
  border-radius: 10px; /* Arrondit les bords du bouton */
}
.submit-button-attentionlittle:hover {
  background-color: hsl(355, 57%, 58%); /* Change la couleur de fond du bouton au survol */
}
.submit-button-information {
  margin-top: 10px; /* Ajoute un espace au-dessus du bouton */
  padding: 7px 14px; /* Ajoute du padding pour rendre le bouton plus grand */
  font-size: 14px; /* Taille de police pour rendre le texte du bouton lisible */
  background-color: hwb(306 8% 15%); /* Couleur de fond du bouton */
  color: white; /* Couleur du texte du bouton */
  border: none; /* Supprime les bordures par défaut */
  cursor: pointer; /* Change le curseur en pointeur pour indiquer que le bouton est cliquable */
  border-radius: 10px; /* Arrondit les bords du bouton */
}
.submit-button-information:hover {
  background-color: rgb(210, 108, 185); /* Change la couleur de fond du bouton au survol */
}
.submit-button-pn1 {
  margin-top: 10px; /* Ajoute un espace au-dessus du bouton */
  padding: 7px 14px; /* Ajoute du padding pour rendre le bouton plus grand */
  font-size: 14px; /* Taille de police pour rendre le texte du bouton lisible */
  background-color: rgb(255, 255, 0); /* Couleur de fond du bouton */
  color: rgb(102, 153, 255); /* Couleur du texte du bouton */
  border: none; /* Supprime les bordures par défaut */
  cursor: pointer; /* Change le curseur en pointeur pour indiquer que le bouton est cliquable */
  border-radius: 8px; /* Arrondit les bords du bouton */
}

.submit-button-pn1:hover {
  background-color: rgb(204, 204, 0); /* Change la couleur de fond du bouton au survol */
  color: white; /* Couleur du texte du bouton */
}
.submit-button-pn2 {
  margin-top: 10px; /* Ajoute un espace au-dessus du bouton */
  padding: 7px 14px; /* Ajoute du padding pour rendre le bouton plus grand */
  font-size: 14px; /* Taille de police pour rendre le texte du bouton lisible */
  background-color: rgb(255, 192, 0); /* Couleur de fond du bouton */
  color: white; /* Couleur du texte du bouton */
  border: none; /* Supprime les bordures par défaut */
  cursor: pointer; /* Change le curseur en pointeur pour indiquer que le bouton est cliquable */
  border-radius: 8px; /* Arrondit les bords du bouton */
}
.submit-button-pn2:hover {
  background-color: rgb(229, 136, 51); /* Change la couleur de fond du bouton au survol */
}
.submit-button-pn3 {
  margin-top: 10px; /* Ajoute un espace au-dessus du bouton */
  padding: 7px 14px; /* Ajoute du padding pour rendre le bouton plus grand */
  font-size: 14px; /* Taille de police pour rendre le texte du bouton lisible */
  background-color:rgb(196, 0, 0); /* Couleur de fond du bouton */
  color: white; /* Couleur du texte du bouton */
  border: none; /* Supprime les bordures par défaut */
  cursor: pointer; /* Change le curseur en pointeur pour indiquer que le bouton est cliquable */
  border-radius: 8px; /* Arrondit les bords du bouton */
}
.submit-button-pn3:hover {
  background-color: rgb(209, 61, 66); /* Change la couleur de fond du bouton au survol */
}

.submit-button-pn4 {
  margin-top: 10px; /* Ajoute un espace au-dessus du bouton */
  padding: 7px 14px; /* Ajoute du padding pour rendre le bouton plus grand */
  font-size: 14px; /* Taille de police pour rendre le texte du bouton lisible */
  background-color:rgb(114, 112, 112); /* Couleur de fond du bouton */
  color: rgb(255, 255, 255); /* Couleur du texte du bouton */
  border: none; /* Supprime les bordures par défaut */
  cursor: pointer; /* Change le curseur en pointeur pour indiquer que le bouton est cliquable */
  border-radius: 8px; /* Arrondit les bords du bouton */
}
.submit-button-pn4:hover {
  background-color: rgb(178, 171, 171); /* Change la couleur de fond du bouton au survol */
}

.submit-button-moniteur {
  margin-top: 10px; /* Ajoute un espace au-dessus du bouton */
  padding: 7px 14px; /* Ajoute du padding pour rendre le bouton plus grand */
  font-size: 14px; /* Taille de police pour rendre le texte du bouton lisible */
  background-color:rgb(153, 50, 153); /* Couleur de fond du bouton */
  color: white; /* Couleur du texte du bouton */
  border: none; /* Supprime les bordures par défaut */
  cursor: pointer; /* Change le curseur en pointeur pour indiquer que le bouton est cliquable */
  border-radius: 8px; /* Arrondit les bords du bouton */
}
.submit-button-moniteur:hover {
  background-color: rgb(216, 19, 198); /* Change la couleur de fond du bouton au survol */
}

.submit-button-bio {
  margin-top: 10px; /* Ajoute un espace au-dessus du bouton */
  padding: 7px 14px; /* Ajoute du padding pour rendre le bouton plus grand */
  font-size: 14px; /* Taille de police pour rendre le texte du bouton lisible */
  background-color:rgb(54, 229, 5); /* Couleur de fond du bouton */
  color: rgb(255, 255, 255); /* Couleur du texte du bouton */
  border: none; /* Supprime les bordures par défaut */
  cursor: pointer; /* Change le curseur en pointeur pour indiquer que le bouton est cliquable */
  border-radius: 8px; /* Arrondit les bords du bouton */
}

.submit-button-bio:hover {
  background-color: rgb(120, 249, 111); /* Change la couleur de fond du bouton au survol */
}
.submit-button-optionmbr {
  margin-top: 10px; /* Ajoute un espace au-dessus du bouton */
  padding: 7px 14px; /* Ajoute du padding pour rendre le bouton plus grand */
  font-size: 14px; /* Taille de police pour rendre le texte du bouton lisible */
  background-color:rgb(225, 222, 222); /* Couleur de fond du bouton */
  color: rgb(41, 40, 40); /* Couleur du texte du bouton */
  border: none; /* Supprime les bordures par défaut */
  cursor: pointer; /* Change le curseur en pointeur pour indiquer que le bouton est cliquable */
  border-radius: 8px; /* Arrondit les bords du bouton */
}
.submit-button-optionmbr:hover {
  background-color: rgb(157, 153, 153); /* Change la couleur de fond du bouton au survol */
}

.submit-button-payealert {
  margin-top: 10px; /* Ajoute un espace au-dessus du bouton */
  padding: 7px 14px; /* Ajoute du padding pour rendre le bouton plus grand */
  font-size: 14px; /* Taille de police pour rendre le texte du bouton lisible */
  background-color:rgb(247, 164, 4); /* Couleur de fond du bouton */
  color: rgb(41, 40, 40); /* Couleur du texte du bouton */
  border: none; /* Supprime les bordures par défaut */
  cursor: pointer; /* Change le curseur en pointeur pour indiquer que le bouton est cliquable */
  border-radius: 8px; /* Arrondit les bords du bouton */
}
.submit-button-payealert:hover {
  background-color: rgb(252, 210, 126); /* Change la couleur de fond du bouton au survol */
}

.submit-button-payeblocage {
  margin-top: 10px; /* Ajoute un espace au-dessus du bouton */
  padding: 7px 14px; /* Ajoute du padding pour rendre le bouton plus grand */
  font-size: 14px; /* Taille de police pour rendre le texte du bouton lisible */
  background-color:rgb(225, 0, 0); /* Couleur de fond du bouton */
  color: rgb(41, 40, 40); /* Couleur du texte du bouton */
  border: none; /* Supprime les bordures par défaut */
  cursor: pointer; /* Change le curseur en pointeur pour indiquer que le bouton est cliquable */
  border-radius: 8px; /* Arrondit les bords du bouton */
}
.submit-button-payeblocage:hover {
  background-color: rgb(255, 45, 45); /* Change la couleur de fond du bouton au survol */
}

.submit-button-ok {
  margin-top: 10px; /* Ajoute un espace au-dessus du bouton */
  padding: 7px 14px; /* Ajoute du padding pour rendre le bouton plus grand */
  font-size: 14px; /* Taille de police pour rendre le texte du bouton lisible */
  background-color:rgb(1, 200, 67); /* Couleur de fond du bouton */
  color: rgb(41, 40, 40); /* Couleur du texte du bouton */
  border: none; /* Supprime les bordures par défaut */
  cursor: pointer; /* Change le curseur en pointeur pour indiquer que le bouton est cliquable */
  border-radius: 8px; /* Arrondit les bords du bouton */
}
.submit-button-ok:hover {
  background-color: rgb(2, 249, 85); /* Change la couleur de fond du bouton au survol */
}

.submit-button-retour {
  margin-top: 10px; /* Ajoute un espace au-dessus du bouton */
  padding: 7px 14px; /* Ajoute du padding pour rendre le bouton plus grand */
  font-size: 14px; /* Taille de police pour rendre le texte du bouton lisible */
  background-color:rgb(225, 116, 0); /* Couleur de fond du bouton */
  color: rgb(41, 40, 40); /* Couleur du texte du bouton */
  border: none; /* Supprime les bordures par défaut */
  cursor: pointer; /* Change le curseur en pointeur pour indiquer que le bouton est cliquable */
  border-radius: 8px; /* Arrondit les bords du bouton */
}
.submit-button-retour:hover {
  background-color: rgb(248, 165, 41); /* Change la couleur de fond du bouton au survol */
}
  /* Style du bouton */
  .button-container {
    position: relative; /* Nécessaire pour positionner la bulle */
    display: inline-block;
}

/* Style de la bulle */
.tooltip {
  visibility: hidden;
  background-color: #333;
  color: #fff;
  text-align: center;
  padding: 10px 20px; /* Marges internes */
  border-radius: 5px;
  position: absolute;
  top: 50%; /* Centrer verticalement par rapport au bouton */
  left: 110%; /* Décalage à droite du bouton */
  transform: translateY(-50%); /* Ajustement pour centrer verticalement */
  z-index: 1;
  opacity: 0;
  transition: opacity 0.3s;
  width: 250px; /* Largeur de la bulle */
  max-width: 300px; /* Largeur maximale */
  word-wrap: break-word; /* Revenir à la ligne si nécessaire */
}

/* Petite flèche pointant vers le bouton */
.tooltip::after {
  content: '';
  position: absolute;
  top: 50%;
  right: 100%; /* Place la flèche à gauche de la bulle */
  transform: translateY(-50%);
  border-width: 5px;
  border-style: solid;
  border-color: transparent transparent transparent #333; /* Flèche pointant vers la gauche */
}

/* Afficher la bulle au survol */
.button-container:hover .tooltip {
  visibility: visible;
  opacity: 1;
}