html, body {
    margin: 0;
    padding: 0;
    font-family: 'Avenir-Medium';
    line-height: 1.6;
    color: #ffffff;
    scroll-behavior: smooth;
    font-size: 1.1em;
}

@media (min-width: 1200px) {

    .owl-carousel .owl-stage-outer {
        overflow: hidden!important;
    }

    .titre_desktop {
        color:#56BBA8!important;
        text-transform: uppercase!important;
        font-size:55px!important;
        line-height: 55px;
    }

    .bandeau_desktop{
        margin-top:-450px!important;
    }

    .text-qui-somme-nous {
        font-size:40px!important;
        line-height: 40px!important;
        text-transform: uppercase!important;
    }

}

.atelier_link {
    position:relative;
    border: 2px solid #56BBA6;
    padding: 1px 140px 1px 30px;
    color:#56BBA6!important;
    border-radius:50px;
    margin-left: -31px;

}

.atelier_link::before {
    font-family: "bootstrap-icons";
    content: "\F285"; 
    position:absolute;
    top:1px;
    right:10px;
}

.atelier_cat {
    color:#56BBA6!important;
    font-weight: bold;
}

.titre_desktop {
    font-size: 19px;
    color: #56BBA6;
    text-transform: uppercase;
}

.owl-stage {
    padding:0px!important;
}

.owl-carousel .owl-stage-outer {
    overflow:visible!important;
}

.orange {
    color:#56BBA6;
}

.form-control, .form-select, .form-check-input {
    border-radius: 0rem!important;
}

.viewForm {
    text-decoration: underline;
    color:#56BBA6;
}

.nous-contacter-bg-link {
    border: 1px solid #fff;
}

.card {
    border-radius: 0.575rem;
}

.card-desktop {
    border-radius: 15px;
}

.box-shadow {
    box-shadow: 0px 9px 20px #00000029;
}

.title_aga {
    color:#57bba9;
    font-size:24px;
    margin-bottom:30px;
}

.title_aga_desktop {
    color:#57bba9;
    font-size:70px;
    margin-bottom:30px;
}

.change_langue {
    cursor:pointer;
}

.container-flex {
    /* Propriétés Flexbox */
    display: flex; /* Active le mode flexbox */
    align-items: center; /* Centre les éléments enfants le long de l'axe transversal (vertical par défaut) */
    justify-content: center; /* Centre les éléments enfants le long de l'axe principal (horizontal par défaut) */
    /* text-align: center; (Optionnel si vous voulez aussi centrer le texte horizontalement à l'intérieur du <p>) */
}

.border-container{

    background-color: rgba(255,255,255,.5);
    border: 1px solid rgba(255,255,255,.5)!important;
}

/* --- Section de la Vidéo en Arrière-plan (Fullscreen) --- */
.video-background-section {
    position: relative; /* Nécessaire pour positionner l'overlay */
    width: 100vw; /* 100% de la largeur de la fenêtre visible */
    height: 100vh; /* 100% de la hauteur de la fenêtre visible */
    overflow: hidden; /* Cache tout débordement de la vidéo */
    display: flex; /* Utilisé pour centrer le contenu de l'overlay */
    justify-content: center; /* Centre horizontalement l'overlay */
    align-items: center; /* Centre verticalement l'overlay */
    flex-direction: column; /* Organise le contenu de l'overlay en colonne */
    text-align: center;
    margin-top: -1px;
}

.background-video {
    position: absolute;
    top: 50%;
    left: 50%;
    /* Transforme la vidéo pour la centrer précisément */
    transform: translate(-50%, -50%);
    min-width: 100%; /* S'assure que la vidéo couvre toute la largeur */
    min-height: 100%; /* S'assure que la vidéo couvre toute la hauteur */
    width: auto; /* Maintient le ratio d'aspect */
    height: auto; /* Maintient le ratio d'aspect */
    z-index: -1; /* Place la vidéo derrière le contenu de l'overlay */
    object-fit: cover; /* Recadre la vidéo pour couvrir le conteneur sans déformer */
    pointer-events: none; /* Empêche les interactions avec la vidéo elle-même */
}

.video-overlay-content {
    position: absolute; /* Reste dans le flux de la flexbox du parent, mais peut être stylisé */
    bottom:0;left:0;right:0;
    z-index: 1; /* Assure que le contenu est au-dessus de la vidéo */
    padding: 20px;
    background-color: #755285; /* Calque semi-transparent pour une meilleure lisibilité */
    width: 100%; /* Limite la largeur du contenu pour éviter le débordement sur les petits écrans */
}

.scroll-button {
    display: inline-block;
    padding: 12px 25px;
    background-color: #007bff;
    color: white;
    text-decoration: none;
    border-radius: 5px;
    font-weight: bold;
    transition: background-color 0.3s ease;
}

.scroll-button:hover {
    background-color: #0056b3;
}

/* --- Section du Contenu Principal du Site --- */
.main-site-content {
    background-color: #755285; /* Fond blanc pour la section de contenu */
    padding: 0px;
    width: 100%; /* Limite la largeur du contenu pour une meilleure lisibilité */
    margin: 0 auto; /* Centre le contenu principal */
    position: relative; /* Nécessaire pour le z-index si vous voulez qu'il soit au-dessus d'éléments flottants */
    z-index: 2; /* S'assure qu'il est au-dessus de la section vidéo */
}

.main-site-content h2 {
    font-size: 2.2em;
    margin-top: 30px;
    margin-bottom: 30px;
}

.main-site-content h3 {
    font-size: 1.4em;
    color: #fff;
    margin-top: 0px;
    margin-bottom: 30px;
}

.main-site-content ul {
    list-style-type: disc;
    margin-left: 10px;
    margin-bottom: 20px;
}

.main-site-content ul li {
    margin-bottom: 4px;
}

.main-site-content address {
    font-style: normal;
    margin-top: 20px;
}



.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 { position: relative;z-index: 1;}



a{color:#fff;}
a:link {text-decoration: none;}
a:visited {text-decoration: none;}
a:hover {text-decoration: none;}
a:active {text-decoration: none;}

.nav-item {
    margin-top:5px;
}

.scaleHover {
    transition:all 0.7s;
}

.scaleHover:hover {
    scale:1.08;
}

.breadcrumb {font-size: .9em;}


#openMobile {
    position:fixed;
    top:0px;
    left:-100%;
    bottom:0px;
    width:100%;
    background-color: #755285;
    z-index:16000;
}

#openMobile.open {
    left:0px!important;
}

.cBlue{color:#009752;}

.itemLogo {
    display:inline-block;
    width:230px!important;
}

.posMouse{bottom:2em; left: 50%; transform: translateX(-50%);}

.posRs{right:2em; top:2em; z-index:17001;}
.posRs i{color:#fff; font-size:1.8em; margin: 0 0 0 25px;}
.posHamb{left:2em; top:2em; z-index:2;}
.posHamb i{color:#fff; font-size:2em;}

.hidden {opacity: 0; transition: opacity 0.6s;}

#mainContent {padding-top: 70px;}
