.bouton-retour {
  position: fixed;
    top: 20px; /* Ajustez la valeur pour régler la distance du haut */
    left: 20px; /* Ajustez la valeur pour régler la distance de la gauche */
    z-index: 9999; /* Assurez-vous que le bouton est au-dessus de tout le contenu */
  }
  
  .bouton-edit {
    position: fixed;
    top: 20px; /* Ajustez la valeur pour régler la distance du haut */
    right: 20px; /* Ajustez la valeur pour régler la distance de la droite */
    z-index: 9999; /* Assurez-vous que le bouton est au-dessus de tout le contenu */
    color: white; /* Couleur du texte du bouton */
    background-color: orange; /* Couleur de fond du bouton */
    border: none; /* Supprime la bordure par défaut */
  }
  
  .bouton-edit:hover {
    background-color: darkorange; /* Couleur de fond au survol */
  }
  

  .btn-memo {
    cursor: pointer;
    font-size: 1.2rem;
    color: blue;
}

.question-table {
    display: none;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background-color: white;
    padding: 10px;
    border-top: 1px solid #ccc;
    z-index: 9999;
    max-height: 50vh;
    overflow-y: auto;
}

.question-table.show {
    display: block;
}

.icon-action {
    cursor: pointer;
}

  .btn-add {
      position: fixed;
      top: 20px;
      right: 20px;
      z-index: 9999;
      color: white;
      background-color: orange;
      border: none;
      font-size: 1.2rem;
  }

  .btn-add:hover {
      background-color: darkorange;
  }

  #addForm {
      display: none; /* Formulaire caché initialement */
      position: fixed;
      top: 70px;
      right: 20px;
      z-index: 9999;
      background-color: white;
      padding: 10px;
      border: 1px solid #ccc;
      border-radius: 5px;
  }

  .carousel-item {
    height: 50vh; /* Adjust the height as needed */
    min-height: 300px;
    background: no-repeat center center scroll;
    background-size: cover;
    position: relative;
  }
  .carousel-item::before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5); /* Dark overlay with 50% opacity */
  }
  .carousel-caption {
    z-index: 10;
    bottom: 20px;
  }
  .carousel-caption h5, .carousel-caption p {
    color: #fff;
  }
  @media (max-width: 768px) {
    .carousel-caption {
      bottom: 10px;
    }
    .carousel-caption h5 {
      font-size: 1.25rem; /* Smaller text size */
    }
    .carousel-caption p {
      font-size: 1rem; /* Smaller text size */
    }
  }
  @media (max-width: 576px) {
    .carousel-caption {
      bottom: 5px;
      left: 5px;
      right: 5px;
      padding: 5px;
      text-align: left; /* Align text to left */
      background: rgba(0, 0, 0, 0.5); /* Add background to the caption */
      border-radius: 5px;
    }
    .carousel-caption h5 {
      font-size: 1rem; /* Smaller text size */
    }
    .carousel-caption p {
      font-size: 0.875rem; /* Smaller text size */
    }
  }

  .modal.fade .modal-dialog {
-webkit-transition: -webkit-transform 0.3s ease-out;
   -moz-transition: -moz-transform 0.3s ease-out;
     -o-transition: -o-transform 0.3s ease-out;
        transition: transform 0.3s ease-out;
}

.modal.in .modal-dialog {

}


.modal-content {
    position: relative;
  }
  .modal-image {
    position: absolute;
    bottom: 10px;
    right: 10px;
    max-width: 100px;
    max-height: 100px;
    display: none;
  }
  @media (min-width: 576px) {
    .modal-image {
      display: block;
    }
  }
