@media screen and (min-width: 1000px){
    body {
    font-family: Arial, sans-serif;
    background-image: url('img.jpg'); /* Remplacez 'chemin/vers/votre/image.jpg' par le chemin de votre image */
    background-size: cover; /* Ajuster la taille de l'image pour couvrir l'ensemble du fond */
    background-repeat: no-repeat; /* Ne pas répéter l'image */
    overflow: hidden;
}
}
@media screen and (max-width: 1000px) {
    body {
    font-family: Arial, sans-serif;
    background-image: url('bigo3.jpg'); /* Remplacez 'chemin/vers/votre/image.jpg' par le chemin de votre image */
    background-size: auto; /* Ajuster la taille de l'image pour couvrir l'ensemble du fond */
    background-repeat: no-repeat; /* Ne pas répéter l'image */
    overflow: hidden;
}
}
/* Styles pour le conteneur des coeurs */
#heartsContainer {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none; /* Les coeurs ne doivent pas interférer avec les interactions utilisateur */
  z-index: 0; /* Assurez-vous que les coeurs apparaissent au-dessus du contenu */
}

/* Styles pour les coeurs */
.heart {
  position: absolute;
  top: -20px; /* Démarre les coeurs au-dessus de la fenêtre */
  width: 50px;
    height: 45px;
    background-image: url('coeur.png'); /* Chemin vers votre image */
    background-size: cover; /* Ajuster la taille de l'image pour couvrir l'élément */
    background-repeat: no-repeat; /* Ne pas répéter l'image */
  pointer-events: none; /* Empêcher les coeurs d'interférer avec les interactions utilisateur */
  animation: heartsAnimation 12s linear infinite; /* Animation des coeurs */
}

/* Animation des coeurs */
@keyframes heartsAnimation {
  0% { transform: translateY(-20px) rotate(0deg); opacity: 1; }
  100% { transform: translateY(100vh) rotate(360deg); opacity: 0; }
}


.counter-container {
  max-width: 600px;
  margin: 0 auto;
  text-align: center;
  padding: 20px;
  background-color: #fff;
  border-radius: 20px;
  position: fixed;
  /*opacity:0.7;*/
  top: 30%;
  left: 50%;
  transform: translate(-50%, -30%);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

#counter {
    font-size: 2em;
    font-weight: bold;
}

h1 {
  font-size: 1.8em;
  margin-bottom: 20px;
}


h2 {
  font-size: 1.5em;
  margin-bottom: 10px;
}

p {
  font-size: 1.1em;
}