body {
    margin: 0;
    font-family: 'FiraSans-Regular', sans-serif;
}

section {
    margin: 15px 8%;
}

.introduction {
    font-size: 2ch;
}

h1,
h2,
h3 {
    font-family: 'FiraSans-Medium', sans-serif;
    font-weight: 100;
}

.fs-regular{
    font-family: 'FiraSans-Regular', sans-serif;
}

.fs-medium{
    font-family: 'FiraSans-Medium', sans-serif;
    font-weight: 100;
}

.fs-light{
    font-family: 'FiraSans-Light', sans-serif;
}

.fs-bold{
    font-family: 'FiraSans-Bold', sans-serif;
}

.justify-center {
    justify-content: center;
}

.justify-between {
    justify-content: space-between;
}

.fs-extralight{
    font-family: 'FiraSans-ExtraLight', sans-serif;
}


@font-face {
    font-family: 'FiraSans-Bold';
    src: url(fonts/FiraSansFonts/FiraSans-Bold.otf) format('opentype');
}

@font-face {
    font-family: 'FiraSans-Medium';
    src: url(fonts/FiraSansFonts/FiraSans-Medium.otf) format('opentype');
}

@font-face {
    font-family: 'FiraSans-Regular';
    src: url(fonts/FiraSansFonts/FiraSans-Regular.otf) format('opentype');
}

@font-face {
    font-family: 'FiraSans-Light';
    src: url(fonts/FiraSansFonts/FiraSans-Light.otf) format('opentype');
}

@font-face {
    font-family: 'FiraSans-ExtraLight';
    src: url(fonts/FiraSansFonts/FiraSans-ExtraLight.otf) format('opentype');
}

@font-face {
    font-family: 'FiraSans-Thin';
    src: url(fonts/FiraSansFonts/FiraSans-Thin.otf) format('opentype');
}

/*début header*/
header {
    position: sticky;
    top: 0;
    z-index: 1000;
    font-family: 'FiraSans-ExtraLight', sans-serif;
    box-shadow: 0 1px 15px black;
}

.redirection {
    width: 70%;
    display: none;
    align-items: center;
    justify-content: space-around;
    max-width: 750px;
}

header .redirection a {
    font-style: inherit;
    color: white;
    text-decoration: none;
    font-size: 2ch;
}

.bande-orange {
    background-color: #FE8D27;
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 74px;
    max-height: 75px;
    padding: 0 10px 0 15px;
}

.redirection a {
    color: white;
    text-decoration: none;
    justify-content: space-between;
    margin-left: 15px;
    margin-right: 15px;
}

.redirectionDepliant {
    background-color: #D9D9D9;
    align-items: flex-start;
    flex-direction: column;
    padding-left: 20px;
    display: none;
    padding-bottom: 15px;
}

.redirectionDepliant a {
    padding-top: 10px;
    color: #363636;
    display: flex;
}

.submenuPHONE {
    list-style-type: none;
}

.imgMenuBurger {
    cursor: pointer;
    padding-right: 15px;
}

.submenuPHONE {
    display: none;
    margin: 0;
    padding-left: 10px;
    margin-right: 20px;
    border-left: #363636 solid 1px;
}

.submenuPHONE a {
    color: #363636;
    font-size: 16px;
    font-family: 'FiraSans-Regular', sans-serif;
    flex-direction: column;
}

.submenu {
    display: none;
    position: absolute;
    background-color: #D9D9D9;
    list-style-type: none;
    padding: 0;
    margin: 24px 0 0 0;
    white-space: nowrap;
}

.submenu li a {
    font-size: 2ch;
    color: #363636;
    text-decoration: none;
    padding: 10px 30px;
    display: block;
    width: 100%;
    margin: 0;
}

.submenu li a:hover {
    background-color: #363636;
    color: white;
}

.menu-itemPHONE {
    display: flex;
    flex-direction: column;
}

@media screen and (min-width: 900px) {

    .redirection {
        display: flex;
    }

    .imgMenuBurger,
    .redirectionDepliant {
        display: none;
    }
}

/*Fin header*/

/*Début boutons call to actions accueil*/
.cta {
    background-color: #FE8D27;
}

.unCta {
    display: flex;
    width: 100%;
}

.deuxCta {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-around;
    border-bottom: white solid 1px;
    padding: 25px 0;
    width: 100%;
}

.ContenuCta {
    width: 100%;
    justify-content: center;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.deuxCta a {
    width: 100%;
}

.ContenuCta h3 {
    margin-top: 10px;
    padding-left: 0;
    color: white;
    font-size: 2ch;
    text-align: center;
    margin-bottom: 0;
    font-family: 'FiraSans-Thin', sans-serif;
}

.ContenuCta img {
    height: 50px;
}

.cta-gauche {
    border-right: white solid 1px;
}

a {
    text-decoration: none;
    color: #363636;
}

@media screen and (min-width: 900px) {
    .cta {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        height: 225px;
    }

    .cta-gauche {
        border: none;
    }

    .ContenuCta img {
        width: 50%;
        height: auto;
    }
}

/*Fin boutons call to actions accueil*/

.images-presentation {
    position: relative;
    display: inline-block;
    vertical-align: bottom;
}

.image-fond {
    width: 100%;
    height: auto;
    display: block;
}

.imgBanner {
    width: 100%;
    height: auto;
    display: block;
    min-height: 400px;
    object-fit: cover;
}

.image-dessus {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 50%;
    height: auto;
}

.motDuPresident {
    margin: 50px 7%;
}

.banniere {
    position: relative;
    display: flex;
    align-items: center;
}

.banniere img {
    width: 100%;
    height: auto;
    display: block;
    margin-bottom: 15px;
}

.banniere h2 {
    position: absolute;
    left: 40%;
    width: 50%;
    height: auto;
    color: white;
    font-size: 2.9vw;
}

.banniereText {
    color: white;
    justify-content: center;
    display: flex;
    font-size: 5vw;
    width: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    height: auto;
    font-family: 'FiraSans-Medium', sans-serif;
}

.orange {
    color: #FE8D27;
}

.signaturePresident p {
    margin: 0;
    padding: 0;
}

.avisContainer {
    background-color: #FE8D27;
}

footer {
    background-color: #363636;
    margin-top: 50px;
    justify-content: space-between;
    display: flex;
    align-items: center;
    flex-direction: column;
    padding: 50px 0;
}

.imgReseau {
    width: 100%;
}

svg {
    width: auto;
    height: 100%;
    max-height: 25px;
    margin-left: 10px;
}

.socialMedia {
    display: flex;
    align-items: center;
    gap: 10px;
    justify-content: center;
}

footer p,
footer a {
    color: white;
}

.socialMedia a {
    width: 30px;
}

.presentationStage-uneDateStage {
    color: white;
    padding: 10px 50px;
    border-radius: 30px;
    margin: 15px 0;
}

.presentationStage-uneDateStage .infoStage {
    font-size: 18px;
}

.presentationStage-uneDateStage p {
    color: white;
    margin: 8px 0;
}

.tarifs h2, .inscriptions h2 {
    margin-top: 50px;
}

.infoSuppTarif {
    font-style: italic;
    font-size: 14px;
}

.descriptionStage {
    font-style: italic;
    margin-top: 5px;
}

.unePersonne {
    max-width: 400px;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    font-family: FiraSans-Medium, sans-serif;
    line-height: 1.4;
    background-color: #f9f9f9;
    padding: 10px;
    margin: 10px;
    border-radius: 8px;
}

.unePersonne img {
    width: 50%;
}

.unePersonne .nom {
    color: #78B464;
    margin-top: 3%;
    font-size: 20px;
    margin-bottom: 5px;
}

.unePersonne .fonction {
    font-size: 18px;
}

.unePersonne .responsibility {
    max-width: 180px;
}

.unePersonne span {
    text-align: center;
    font-size: 16px;
    color: #363636;
    font-family: 'FiraSans-Regular', sans-serif;
}

.equipe {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

a:hover {
    cursor: pointer;
}

.video-container {
    position: relative;
    width: 100%;
    max-width: 800px;
    aspect-ratio: 16 / 9;
    margin: 50px auto auto auto;
}

.video-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.paragraphes {
    margin: 10px 10%;
    text-align: justify;
    font-size: 2ch;
    color: #363636;
}


.rejoindre-uneOffre {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    color: white;
    padding: 25px 10%;
    margin: 25px 0;
    border-radius: 30px;
}

.rejoindre-uneOffre a {
    background-color: white;
    padding: 10px 50px;
    border-radius: 25px;
}

.rejoindre-uneOffre p {
    color: white;
}

/*Devenir Membre*/
.cadreAvancement {
    min-height: 10px;
    width: 100%;
    border-radius: 10px;
    background-color: #D9D9D9;
}

.avancement {
    display: flex;
    flex-direction: row;
    justify-content: space-around;
}

.unAvancement {
    display: flex;
    align-items: center;
    flex-direction: column;
}

.unAvancementFait .cadreAvancement{
    background-color: #FE8D27;
}

.unAvancementFait .titreAvancement {
    color: #FE8D27 !important;
}

.unAvancement p {
    margin-top: 5px;
    color: #D9D9D9;
    text-align: center;
}

.radio-group {
    display: flex;
    justify-content: center;
    margin-top: 15px;
}

.formulaireAdhesion {
    padding: 30px 20%;
}

.radio-label {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 10px;
    cursor: pointer;
    border-radius: 15px;
    transition: border-color 0.3s;
    justify-content: center;
    margin: 15px 0;
    text-align: center;
}

.border2 {
    border: 2px solid;
}

.radio-label img {
    margin: 0;
    height: 100px;
}

.radio-label span {
    /*max-width: 200px;*/
    margin: 0;
}

.radio-label .prix {
    font-size: 60px;
}

.labelPrix {
    background-color: #D9D9D9;
}

input[type="radio"]:checked + label.labelPrix {
    background-color: #FE8D27;
}

.radio-label .titre {
    font-size: 1.8em;
    margin: 0;
}

.radio-label p {
    text-align: center;
    margin-bottom: 0;
}

input[type="radio"]:checked + .radio-label {
    border-color: #007BFF;
    background-color: #e9f5ff;
}

input[type="submit"] {
    background-color: #363636;
    color: white;
    border-radius: 25px;
    border: none;
    font-size: 20px;
    display: block;
    padding: 10px 50px;
    margin-left: auto;
    margin-right: auto;
}

input[type="text"], input[type="date"], input[type="email"], input[type="tel"], textarea {
    width: 100%;
    margin-bottom: 20px;
    border-radius: 10px;
    border: #363636 solid 1px;
}

input[type="text"], input[type="date"], input[type="email"], input[type="tel"] {
    height: 30px;
}

/*test genre*/
.civilite-container {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.civilite-label {
    font-weight: bold;
    min-width: 80px; /* ajuste selon la taille du texte */
}

.radio-grou {
    display: flex;
    gap: 5px 2rem;
    width: 90%;
    flex-wrap: wrap;
}

.radio-grou label {
    display: flex;
    align-items: center;
    gap: 0.3rem;
}

.showDownloadDoc {
    display: flex;
    justify-content: center;
    align-items: stretch;
    width: fit-content;
    border: solid black 1.5px;
    border-radius: 5px;
    background-color: #363636;
    color: white;
}

.showDownloadDoc .textDownloadDoc {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 15px 30px 15px 15px;
    color: white;
}

.showDownloadDoc img {
    width: 50px;
    align-content: center;
    display: flex;
}

label {
    margin-left: 7.5px;
}

.centre {
    display: flex;
    justify-content: center;
}

form hr {
    margin: 50px 0;
}

.mail {
    font-family: 'FiraSans-Light', sans-serif;
    color: #363636;
    padding-top: 5px;
}

.overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(54, 54, 54, 0.5); /* Couleur noire avec une opacité de 0.5 */
}

.actualités {
    margin: 50px 20%;
}

.actualités h2 {
    color: #FE8D27;
    display: flex;
    justify-content: center;
    font-size: 42px;
}

.margePage{
    margin: 0 10%;
}

p{
    color: #363636;
}

.titreVert {
    color: #78B464;
    font-size: 1.2em;
    margin-top: 35px;
}

.d-flex {
    display: flex;
}

.d-none {
    display: none;
}

.iconContact {
    align-items: center;
}

.iconContact img{
    width: 40px;
    margin-right: 20px;
    margin-left: 10px;
}

.dateAgenda {
    border-radius: 15px;
    flex-direction: column;
    align-items: center;
    width: 31%;
    padding: 30px 0;
}

.datesAgenda {
    gap: 30px;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 50px;
}

.datesAgenda, .datesAgenda p, .datesAgenda a {
    color: white;
}

.titreDateAgenda {
    text-align: center;
    font-size: 40px;
    margin: 30px;
}

.dateDateAgenda {
    font-size: 32px;
    margin: 20px 20px 0 20px;
}

.lieuDateAgenda {
    margin: 0 20px 20px;
    font-size: 32px;
}

.reservationDateAgenda {
    font-size: 16px;
    text-decoration: white solid underline;
}

@media screen and (max-width: 1200px) {
    .dateAgenda {
        width: 48%;
    }
}

@media screen and (max-width: 936px) {
    .dateAgenda {
        width: 95%;
    }
}

@media screen and (max-width: 936px) {
    .titreDateAgenda {
        font-size: 30px;
        margin: 30px;
    }

    .dateDateAgenda {
        font-size: 26px;
        margin: 15px 20px 0 20px;
    }

    .lieuDateAgenda {
        margin: 0 20px 20px;
        font-size: 26px;
    }
}

.offrePartenaire {
    display: flex;
    flex-direction: column;
    align-items: center;
    color: white;
    border-radius: 30px;
    width: 30%;
    text-align: center;
    padding: 25px 0;
}

.offrePartenaire h3 {
    color: white;
    margin-bottom: 5px;
}

.offrePartenaire hr {
    width: 70%;
    color: white;
    margin: 15px 0;
}

.offrePartenaire p {
    margin: 0;
    padding: 0;
    color: white;
    margin-bottom: 10px;
}

.fs-40 {
    font-size: 40px;
}

.fs-26 {
    font-size: 26px;
}

.fs-20 {
    font-size: 20px;
}

.width-75 {
    width: 75%;
}

.w-48 {
    width: 48%;
}

.warning {
    color: #DE172B;
}

form hr {
    width: 75%;
}

.d-flex-center {
    display: flex;
    justify-content: center;
    align-items: center;
}

.prixAdhesion {
    background-color: #D9D9D9;
    width: 30%;
    display: flex;
    justify-content: center;
    border-radius: 15px;
}

.prixAdhesion p {
    font-size: 60px;
    color: white;
    margin: 15px;
}

.prixAdhesion--active {
    background-color: #FE8D27;
}

input[type="radio"]:checked + .radio-label {
    border-color: #FE8D27;
    background-color: rgba(254,141,39,0.5);;
}

input.invalidInput, textarea.invalidInput, div.invalidInput, label.invalidInput {
    border: #DE172B solid;
}

input.invalidCheckbox {
    outline: 2px solid red;
}

.dropDownHeader {
    width: 10px;
}

.testimonial {
    margin: 0 24px;
    padding: 16px 0;
}

.testimonial p {
    margin: 0;
}

.testimonial .quote {
    font-style: italic;
    max-height: 100px;
    text-overflow: ellipsis;
    overflow: hidden;
}
.testimonial .author { margin-top: .5rem; font-weight: 600; }
/* ligne verticale uniquement à partir de md */
@media (min-width: 768px) {
    .border-md-end { border-right: 1px solid rgba(255,255,255,.5)!important; }
    .border-bottom { border-bottom: 1px none rgba(255,255,255,.5)!important; }
    .carouselAvisGoogle {
        height: 250px;
        max-height: 250px;
    }
    .testimonial {
        padding: 16px 24px;
        margin: 0;
    }
}
.carousel-dark .carousel-indicators [data-bs-target] { background-color: #333; }

.unAvis {
    display: flex;
    flex-direction: column;
    text-align: center;
}

.unAvis p {
    color: white;
}

.carouselAvisGoogle {
    max-height: 500px;
    display: flex;
    align-items: center;
}

input[type="text"].inputBorderBottomOnly {
    border: none;
    border-bottom: #363636 solid 1px;
    border-radius: 0;
}

.screenSizeMinusHeaderFooter {
    height: 60vh;
}

.unPartenaire img {
    max-height: 200px;
    max-width: 300px;
}