
#splash-screen {
    /* Exemple de CSS pour centrer le texte/animation */
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 20px;
    /* Assurez-vous que le fond est suffisamment opaque pour cacher le contenu en chargement */
    background: white;
    transition: opacity 0.5s ease-out; /* Adaptez la durée (ici 0.5s) à vos besoins */
    opacity: 1; /* Commencez avec une opacité pleine */
  }

  .hero-section {
    position: relative;
    overflow: hidden;
  }

  .hero-section img {
    transition: transform 0.5s ease;
    width: 100%;
    height: auto;
  }
  
  #proximite .card {
    display: flex;          /* Active Flexbox pour le layout de la carte */
    flex-direction: column; /* Oriente les enfants de la carte verticalement */
    height: 500px;          /* Hauteur fixe pour toutes les cartes */
  }

  .card-body {
    flex-grow: 1;          /* Permet au corps de la carte de remplir l'espace disponible */
    display: flex;         /* Active Flexbox pour le contenu interne du corps de la carte */
    flex-direction: column; /* Oriente les enfants verticalement */
    justify-content: center; /* Centre le contenu verticalement */
    font-size: 0.85rem; /* Réduit la taille de la police à 85% de la taille normale */
  }

  .card-img-top {
    height: 250px;
    width: 100%;
    object-fit: cover;
  }

  .proximite .card-img-overlay{
    max-height: 200px ;
  }

  footer a {  /* Cible tous les liens dans le footer */
            color: #808080;  /* Définit la couleur des liens en gris */
            text-decoration: none;  /* Optionnel: supprime le soulignement */
  }
  footer a:hover {  /* Cible les liens lors du survol */
      color: #505050;  /* Un gris un peu plus foncé pour le survol */
      text-decoration: underline;  /* Optionnel: ajoute un soulignement au survol */
  }

  .btn{
    color: #000000;
    font-weight: 500;
    background-color: #7177c26b;
  }

  #contact .btn{
    width: 300px;
  }

  html {
  scroll-behavior: smooth;
  }

  .fade-in-section {
    opacity: 0.3;
    transition: opacity 0.5s ease-out;
  }

  .fade-in-section.is-visible {
    opacity: 1;
  }

  .list-group-item{
    background-color: #e4dfda;
  }

  .accordion-button{
    background-color: #c4af9980;
  }

  :focus {
    outline: 0 !important;
    box-shadow: 0 0 0 0 rgba(0, 0, 0, 0) !important;
  }


  .accordion-button:not(.collapsed){
    background-color: #cdb9a4;
  }



  .carousel-item {
    transition: transform 1s ease; /* Ajustez la durée selon vos besoins */
  }

  /* Effet parallaxe pour les images de fond */
  .parallax {
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
  }

  /* Effet hover pour les boutons */
  .btn:hover {
    background-color: #555; /* Couleur de fond au survol */
    color: white; /* Couleur du texte au survol */
  }

  /* lineup class and keyframes */
  .lineUp {
    animation: 1s anim-lineUp ease-out;
  }
  @keyframes anim-lineUp {
    0% {
      opacity: 0;
      transform: translateY(80%);
    }
    20% {
      opacity: 0;
    }
    80% {
      opacity: 0.8;
      transform: translateY(0%);
    }
    100% {
      opacity: 1;
      transform: translateY(0%);
    }
  }

  
  @keyframes zoomIn {
    from {
      transform: scale(1);
    }
    to {
      transform: scale(1.1);
    }
  }

  @keyframes zoomInOut {
    0%, 100% {
      transform: scale(1);
    }
    50%{
      transform: scale(1.1);
    }
  }


  .loading-dots {
    display: flex;
    align-items: center;
    justify-content: center;
}

.dot {
    width: 8px;
    height: 8px;
    margin: 0 4px;
    background-color: #cdb9a4;
    border-radius: 50%;
    animation: dotPulse 1.4s infinite linear;
}

.dot:nth-child(1) { animation-delay: -0.32s; }
.dot:nth-child(2) { animation-delay: -0.16s; }
.dot:nth-child(3) { animation-delay: 0s; }

@keyframes dotPulse {
    0%, 80%, 100% {
        transform: scale(0.8);
        opacity: 0.5;
    }
    40% {
        transform: scale(1.4);
        opacity: 1;
    }
}

.equipmenticon{
width:150px ;
height:150px; 
background-color: #c4af9980;
display: flex; 
align-items: center;
justify-content: center;
}




.img-container {
  height: 90vh; /* 80% de la hauteur de la vue */
  overflow: hidden; /* Masque le dépassement de contenu */
  display: flex;
  align-items: center; /* Centre l'image verticalement */
  justify-content: center; /* Centre l'image horizontalement */
  width: 100%; /* Prend toute la largeur */
}

.img-container img {
  height: 100%; /* Adapte la hauteur au conteneur */
  width: 100%; /* Adapte la largeur au conteneur */
  object-fit: cover; /* Garde les proportions en recadrant l'excès */
}


#fullscreenOverlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.9);
    z-index: 1050;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
}

#fullscreenImage {
    max-width: 90%;
    max-height: 90%;
}
