#form-representation {
  margin-bottom: 120px;
}

#form-representation .container {
  display: flex;
  background-color: #0a5adb;
  color: white;
}

#form-representation .col {
  width: 50%;
}

#form-representation .col-1 {
  padding: 60px;
}

#form-representation .col-2 img {
  position: relative;
  max-width: 100%;
  top: -26px;
  right: -22px;
}

#form-representation .champ {
  margin-bottom: 20px;
}

#form-representation a {
  margin-left: 10px;
}

#form-representation .prenom,
#form-representation .age {
  margin-right: 10px;
}

#form-representation textarea#description {
  width: 100%;
  height: 100px;
}

#form-representation input::placeholder,
#form-representation textarea::placeholder {
  color: rgb(255, 255, 255, 0.5);
}

#form-representation .champ input,
#form-representation textarea,
#form-representation select {
  background-color: transparent;
  border: 1px solid white;
  padding: 10px;
  border-radius: 6px;
  color: white;
}

#form-representation input.submit:hover {
  cursor: pointer;
}

#form-representation .prenom-nom {
  display: flex;
  gap: 25px;
}

#form-representation .prenom,
#form-representation .nom,
#form-representation input#prenom,
#form-representation input#nom {
  width: 100%;
}

/* erreurs */
#form-representation #bouton-envoi.erreur {
  pointer-events: none;
}

#form-representation #bouton-envoi.erreur:hover {
  cursor: not-allowed !important;
}

#form-representation input[type="text"].erreur {
  border: 1px solid red !important;
  color: red !important;
}

#form-representation #bouton-envoi.erreur {
  opacity: 0.5;
}

#form-representation input.erreur #bouton-envoi {
  opacity: 0.5;
}

#form-representation p.erreur {
  color: white;
  margin-bottom: 0px;
  background-color: red;
  border-radius: 4px;
  padding: 10px;
}

#form-representation .message {
  padding: 60px;
}

/************** Infobulles **************/

/*
.case-1::after {
  font-family: "ETmodules";
  content: url("/icons/Icon_Infobulle_Blanc-bleu70.svg");
  padding-left: 5px;
  display: inline-block;
}
*/

.container-infobulle {
  display: inline-flex;
  gap: 10px;
}

.bulle_infobulle {
  position: absolute;
  padding: 20px;
  background-color: white;
  color: #0a5adb;
  border-radius: 6px;
  margin: 0px;
  z-index: 2;
  transform: translate(50px, -40px);
  box-shadow: 6px 6px 18px 0px rgba(0, 0, 0, 0.3);
}

.bulle_infobulle::before {
  font-family: "ETmodules";
  content: url("/images/Infobulle.svg");
  display: inline-block;
  transform: translate(-50px, 2px) scale(0.7);
  position: absolute;
}

@media (max-width: 1200px) {
  #form-representation .col {
    width: 100%;
  }
  #form-representation .col-2 {
    display: none;
  }
  #form-representation a {
    margin-bottom: 20px;
  }
  #form-representation .age input {
    margin-bottom: 20px;
  }
}

@media (max-width: 1000px) {
  #form-representation .col-1 {
    padding: 37px;
  }
}

@media (max-width: 600px) {
  #form-representation {
    margin-bottom: 60px;
  }
  #form-representation .container {
    width: 90%;
  }
}