.elementor-2340 .elementor-element.elementor-element-fbfc138{--display:flex;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-size:var( --e-global-typography-primary-font-size );font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-2340 .elementor-element.elementor-element-3b3ed8c > .elementor-widget-container{margin:46px 0px 35px 0px;padding:0px 0px 0px 0px;}.elementor-2340 .elementor-element.elementor-element-3b3ed8c{text-align:center;}.elementor-2340 .elementor-element.elementor-element-428ac20{--display:flex;}@media(max-width:1024px){.elementor-widget-heading .elementor-heading-title{font-size:var( --e-global-typography-primary-font-size );}}@media(max-width:767px){.elementor-widget-heading .elementor-heading-title{font-size:var( --e-global-typography-primary-font-size );}}/* Start custom CSS */#contact-dani {
    cursor: pointer; /* Transforme le curseur en main lorsque vous passez sur le bouton */
  }
  
  .contact-popup-overlay {
    display: none; /* Cache le popup par défaut */
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.4); /* Fond semi-transparent */
    z-index: 1000; /* S'assure que le popup est au-dessus des autres éléments */
   overflow-y: auto; /* Permet de défiler si le contenu est trop grand */
}
  
  .contact-popup-content {
    background-color: #17161c; /* Nouvelle couleur de fond */
    color: #ffffff; /* Assure que le texte standard dans le popup est noir */
    margin: 15% auto; /* Centrage vertical */
    padding: 20px;
    border-radius: 5px;
    width: 80%;
    max-width: 600px; /* Largeur maximale */
      position: absolute;
  top: 20%;
  left: 50%;
  transform: translate(-50%, -50%);
  }
  
  /* Couleur des labels des champs du formulaire en blanc */
  .contact-popup-content label {
    color: #ffffff; /* Couleur des textes des labels */
  }
  
  .close-contact-popup {
    position: absolute;
    top: 0px;
    right: 0px;
    font-size: 30px;
    cursor: pointer;
    color: #ffffff; /* Rend la croix plus visible en blanc */
    padding: 10px; /* Ajout d'espace autour de la croix pour agrandir la hitbox */
    margin: 0px; /* Ajustement de la marge pour que l'ajout de padding ne déplace pas la croix */
  }
  
  /* Assurez-vous que la croix est visible sur le fond sombre */
  .close-contact-popup:hover {
    color: #b430aa; /* Change la couleur au survol pour une meilleure visibilité */
  }
  
  /* Réduire la largeur des champs text, email, et subject à 50% */
.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form input[type="textarea"] {
    width: 50%;
}

/* Cibler les astérisques enveloppés dans la classe 'asterisk' */
.asterisk {
    color: #b430aa; /* Couleur violette */
}

@media (max-width: 600px) {
  .contact-popup-content {
    top: 50%; /* ou un autre pourcentage qui convient mieux pour mobile */
     width: 90%; /* Augmentez la largeur du popup */
    max-width: none; /* Vous pouvez retirer la limite du max-width si nécessaire */
  }

  /* Élargir également les champs de formulaire sur mobile */
  .wpcf7-form input[type="text"],
  .wpcf7-form input[type="email"],
  .wpcf7-form input[type="tel"],
  .wpcf7-form textarea {
    width: 90%; /* Ou une autre valeur pour ajuster la largeur des champs */
  }
  }
    
    .contact-popup-overlay {
    display: none; /* Cache le popup par défaut */
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.4); /* Fond semi-transparent */
    z-index: 1000; /* S'assure que le popup est au-dessus des autres éléments */
   overflow-y: auto; /* Permet de défiler si le contenu est trop grand */
}
    /* Vous pouvez aussi ajuster d'autres propriétés si nécessaire */
  }/* End custom CSS */