@import url('https://fonts.googleapis.com/css2?family=Poppins&display=swap');


/* Pour la page acceuil */
.body {
  background-image: url('../../assets/img/Bg.png');
  font-family: 'Poppins';  
}
#button_commencer {
  display: inline-block;
  padding: 10px 20px;
  background: #0CCBA4;
  color: white;
  text-decoration: none;
  border-radius: 27px;
  box-shadow: 0px 6px 8px #00000029;
  transition: background 0.3s, box-shadow 0.1s;
  position: absolute;
  top: 70%;
  left: 50%;
  transform: translate(-50%, -50%);
}

#button_commencer:hover {
  background: #0AA988;
  box-shadow: 0px 8px 10px #0000003d;
}

/* Fin de la page accueil */

/* Pour les pages form_1, form_2 */
.body_form{
  font-family: 'Poppins';
  background: #FFFFFF;
  color: #7B7B7B;
}

#contenu_form{
  margin-top: 30px;
}

#button_suivant {
  display: inline-block;
  padding: 10px 0px;
  width: 250px;
  background: #429DCC;
  color: white;
  text-decoration: none;
  border-radius: 50px;
  border: none;
  box-shadow: 0px 6px 8px #00000029;
  transition: background 0.3s, box-shadow 0.1s;
  font-weight: bold;
}
#button_suivant:hover {
  background: #E3A11B;
  box-shadow: 0px 8px 10px #0000003d;
  border: none;
}

#button-enregister{
  display: inline-block;
  padding: 10px 0px;
  width: 250px;
  background: #E3A11B;
  color: white;
  text-decoration: none;
  border-radius: 50px;
  border: none;
  box-shadow: 0px 6px 8px #00000029;
  transition: background 0.3s, box-shadow 0.1s;
  font-weight: bold;
}

#button-enregister:hover {
  background: #429DCC;
  box-shadow: 0px 8px 10px #0000003d;
  border: none;
}

input[type="email"], input[type="text"], 
  input[type="date"], input[type="tel"], input[type="password"]{
    border-radius: 18px;
    height: 36px;
    background-color: rgb(229, 229, 229);
    font-size: 15px;
    padding: 20px;
    color: #7B7B7B;
    outline: none;
    border-color: rgb(229, 229, 229);
  }
  #id_select_pays{
    height: 42px;
    border-radius: 18px;
    background-color: rgb(229, 229, 229);
    color: #7B7B7B;
    outline: none;
    border-color: rgb(229, 229, 229);
  }
  #id_select_age, #id_select_genre{
    height: 42px;
    border-radius: 18px;
    background-color: rgb(229, 229, 229);
    color: #7B7B7B;
    outline: none;
    border-color: rgb(229, 229, 229);
  }
  .custom-password {
    width: 100%;
  }

@media (min-width: 768px) {
  input[type="email"], input[type="text"], 
  input[type="date"], input[type="tel"], input[type="password"]{
    width: 500px;
    color: #7B7B7B;
  }
  #id_select_pays{
    width: 500px;
  }
  #id_select_age, #id_select_genre{
    width: 230px;
  }

  .custom-input-group {
    width: 500px;
  }

  .custom-password {
    width: 100%;
  }
}

/* Fin pour la page form_1 */