.titre-special {
    font-family: 'Quicksand', sans-serif;
    font-size: 48px;
    color: white;
    line-height: 50px;
    font-weight: 400; /* regular */
	letter-spacing: -0.5px;
 	padding: 0px 20px 30px 20px;
}

.titre-content {
    font-family: 'Quicksand', sans-serif;
    font-size: 28px;
    color: #5C2481;
    line-height: 50px;
    font-weight: 400; /* regular */
	letter-spacing: -0.5px;
 	padding: 0px 20px 30px 20px;
}

#block-intro {
    max-height: 380px; /* Limite la hauteur du bloc */
  	display: flex; /* Active le mode flex pour gérer le contenu */
    flex-direction: column; /* Aligne le contenu verticalement */
    justify-content: center; /* Centrer le contenu verticalement (optionnel) */
    align-items: center; /* Centrer le contenu horizontalement (optionnel) */
    text-align: center; /* Centrer le texte (si nécessaire) */
    box-sizing: border-box; /* Inclut padding et bordures dans max-height */
 	margin: 0 20px; /* Applique une marge de 20px à gauche et à droite */
}
#block-intro img {
    max-width: 100%; /* L'image ne dépasse pas la largeur du bloc */
    max-height: 100%; /* L'image ne dépasse pas la hauteur du bloc */
    object-fit: contain; /* Ajuste l'image sans la déformer */

}

#block-intro p {
    margin: 0; /* Supprime les marges par défaut */
    padding: 0 10px; /* Ajoute un peu d'espacement si nécessaire */
    overflow: hidden; /* Évite les débordements */
    text-overflow: ellipsis; /* Ajoute "..." si le texte dépasse */
    white-space: nowrap; /* Évite les retours à la ligne */
}



.w-frame { 
	background-color: #ffffff;
	color : #000000;
	border-radius: 25px;
    margin-bottom: 15px;
  padding: 15px;
}


/* Le conteneur parent doit avoir position: relative ou une autre valeur positionnée */
#wrapper2 {
    position: relative; /* Définit un contexte d'empilement pour les enfants */
    z-index: auto; /* Pas de conflit ici */
}

/* Style pour le logo */
#block-logo-accueil {
    position: relative; /* Nécessaire pour z-index */
    z-index: 10; /* Plus élevé pour passer au-dessus de la vidéo */
}

/* Style pour la vidéo */
#block-video {
    margin-top: -50px; /* Remonte la vidéo */
    position: relative; /* Important pour le z-index */
    z-index: 1; /* Plus bas que le logo */
}



#block-tabs {
max-width: 690px;
margin: 0 auto;
float: left;
}

#block-jtab{
max-width: 990px;
margin: 0 auto;
}

#row10 {
max-width: 990px;
margin: 0 auto;
}

.heightfaq {
height:350px;
margin-left: auto;
margin-right: auto;
}

/* Style pour le bouton */
.bouton-1 {
    display: inline-block;
    text-align: center;
    text-decoration: none;
    color: white;
    background-color: blue;
    width: 250px;
    padding: 15px;
    border-radius: 15px;
    transition: background-color 0.3s ease;
}

/* État initial : lien */
.bouton-personnalise:link {
    background-color: blue;
    color: white;
}

/* État : visité */
.bouton-personnalise:visited {
    background-color: orange;
    color: white;
}

/* État : au survol */
.bouton-personnalise:hover {
    background-color: red;
    color: white;
}

/* État : actif (lors du clic) */
.bouton-personnalise:active {
    background-color: red;
    color: white;
}

/* frames */

.w-frame { 
	background-color: #ffffff;
	color : #000000;
	border-radius: 25px;
	padding: 10px;
    margin-bottom: 15px;
}

.v-frame { 
text-align: center;
  border: 2px solid #C58BFF;
  border-radius: 20px; padding: 15px 8px 8px 8px;
  margin-bottom: 30px;
}

.b-frame { 
background-color: #ffffff;
  color : #000000;
border-radius: 25px;
  padding: 5px;
  border: 2px solid #BDEFFF;
  margin-bottom: 15px;
}

.r-frame { 
background-color: #ffffff;
  color : #000000;
border-radius: 25px;
  padding: 5px;
  border: 2px solid #F06179;
  margin-bottom: 15px;
}

.g-frame { 
background-color: #ffffff;
  color : #000000;
border-radius: 25px;
  padding: 5px;
  border: 2px solid #839959;
  margin-bottom: 15px;
}

.clearpurple {
  background-color: #f0e3ff;
  border-radius: 25px;
  padding: 10px;
}


.middlepurple {
  background-color: #7C3DB3;
  border-radius: 25px;
  padding: 10px;
  color: #FFFFFF;
}

/* bouton-v */

.bouton-v {
  all: unset; /* Supprime tous les styles hérités par défaut */
  text-decoration: none; /* Supprimer le soulignement */
  display: inline-block; /* transforme l'élément en élément de bloc  */
  cursor: pointer;
  font-family: "system-ui";
  font-size: 16px;
  color: rgb(255, 255, 255);
  padding: 10px 30px;
  width: 162px;
  box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;
  border-radius: 25px;
  background: linear-gradient(177deg, rgb(200, 163, 240) 0%, rgb(175, 98, 230) 96%);
}

.bouton-v:link {
  color: rgb(255, 255, 255); /* Couleur du texte blanche */
  text-decoration: none; /* Supprimer le soulignement */
}

.bouton-v:hover {
  color: rgb(255, 255, 255); /* Conserve le texte en blanc */
  background: rgb(140, 188, 250); /* Change la couleur de fond en bleu */
}

/* bouton-d */

.bouton-d {
all: unset; /* Supprime tous les styles hérités par défaut */
text-decoration: none; /* Supprimer le soulignement */
text-decoration: none; /* Supprimer le soulignement */
display: inline-block; /* transforme l'élément en élément de bloc  */
cursor: pointer;
border: solid rgb(174, 83, 240);
font-family: "system-ui";
font-size: 18px;
color: rgb(255, 255, 255);
padding: 19px 30px;
transition: 2s;
width: 265px;
box-shadow: rgb(0, 0, 0) 0px 0px 0px 0px;
border-radius: 50px;
background: linear-gradient(90deg, rgb(0, 102, 204) 0%, rgb(197, 0, 204) 100%);
font-weight: 600;
--hover-width: 276px;
--hover-bgc: #168aff;
--hover-color: #ffffff;
}

.bouton-d:link{color: rgb(255, 255, 255); /* Couleur du texte blanche */
text-decoration: none; /* Supprimer le soulignement */
}

.bouton-d:hover{
color: rgb(255, 255, 255);
width: 276px;
background: rgb(22, 138, 255) none repeat scroll 0% 0% / auto padding-box border-box;
border-color: rgb(204, 0, 105);
border-width: 2px;
border-style: solid;
}

/* text link color change djtabs */
.djtabs-article-content a:link {
    color: rgb(79, 39, 135);
}


/* bouton-2 */
.bouton-2 {
    all: unset; /* Supprime tous les styles hérités par défaut */
    display: inline-block;
    cursor: pointer;
    border: 0px solid rgb(187, 204, 0);
    font-family: "system-ui";
    font-size: 16px;
    color: rgb(255, 255, 255);
	text-decoration: none; /* Supprimer le soulignement */
    padding: 10px 30px;
    transition: 494ms;
    width: 198px;
    box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;
    border-radius: 25px;
    background: linear-gradient(181deg, rgb(0, 102, 204) 0%, rgb(0, 163, 204) 0%);
    --hover-borderSize: 0px;
    --hover-width: 224px;
    font-weight: 500;
    text-align: center; /* S'assure que le texte est centré dans le bouton */
}

.bouton-2:link{color: rgb(255, 255, 255); /* Couleur du texte blanche */
    text-decoration: none; /* Supprimer le soulignement */
}

.bouton-2:hover{
color: rgb(255, 255, 255);
width: 224px;
background: rgb(0, 102, 204) none repeat scroll 0% 0% / auto padding-box border-box;
border-color: rgb(204, 0, 105);
border-width: 0px;
border-style: solid;
}



.btn {
cursor: pointer;
border: 0px solid rgba(255, 255, 255, 0);
font-family: Raleway;
font-size: 14px;
color: rgb(255, 255, 255);
padding: 10px 30px;
transition: 2s;
width: 162px;
box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;
border-radius: 50px;
background: linear-gradient(177deg, rgb(200, 163, 240) 0%, rgb(175, 98, 230) 96%);
--hover-width: 151px;
--hover-borderSize: 0px;
--hover-borderc: #ffffff00;
--hover-bgc: #8cbcfa;
}

.btn:hover{
color: rgb(255, 255, 255);
width: 151px;
background: rgb(140, 188, 250) none repeat scroll 0% 0% / auto padding-box border-box;
border-color: rgba(255, 255, 255, 0);
border-width: 0px;
border-style: solid;
}