/* ------------------------ *
- Page: Index.html
--------------------------- */

/* CSS pour centrer le header au milieu de la page */
.main-header {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 100vh; /* Hauteur de la vue à 100% pour centrer verticalement */
  text-align: center; /* Pour centrer le texte à l'intérieur du header */
}

/* Style pour l'image si nécessaire */
.hero {
  max-width: 50%; /* Ajustez la largeur de l'image en fonction de vos besoins */
  height: auto; /* Gardez le rapport hauteur/largeur d'origine */
  padding-left: 20px;
  margin-top: 50px;
}

/* Style pour le titre */
.title-1 {
  margin-top: 20px; /* Espacement entre l'image et le titre */
  color: white;
  font-size: 25px;
}

#french{
margin-left: 30px !important;
}

/* Style pour chaque bouton (optionnel) */
.buttons a {
  margin-top: 10px; /* Espacement vertical entre les boutons */
}

/* btn-sm */
.btn-sm {
  height: 48px;
  padding: 0 24px;
  font-size: 14px;
}

/* btn-rounded */
.btn-rounded {
  border-radius: 50px;
}

.snowflakes {
  position: fixed;
  top: 0;
  width: 100%;
  height: 100%;
  pointer-events: none; /* Permet aux événements de souris de passer à travers */
  z-index: 9999;
}

.snowflake {
  position: absolute;
  background: #fff;
  border-radius: 50%;
  width: 10px;
  height: 10px;
  box-shadow: 0 0 10px rgba(255, 255, 255, 0.8);
  animation: snowfall linear infinite;
}

@keyframes snowfall {
  0% {
      transform: translateY(0);
  }
  100% {
      transform: translateY(100vh);
  }
}