:root{
    --couleur1:#74757f;
    --couleur2:#579575;
    --couleur3:#cd8e35;
}

body{
    overflow-x: hidden;
    color: var(--couleur1);
}

.navbar-main{
    border-top: 1px solid lightslategray;
    border-bottom: 1px solid lightslategray;
    font-weight: 500;
    letter-spacing: -1px;
}
.hidden{display:none}
/**************************
* Page de connexion
**************************/
.heading-1{
    color: white;
    font-family: "Oswald", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    font-weight: 300;
    font-size: 48px;
    line-height: 1.4;
    letter-spacing: 0
}
.we-btn {
    background-color: #fff;
    border: 2px solid #000 !important;
    box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12);    
}
.we-btn:hover{
    box-shadow: 0 5px 11px 0 rgba(0,0,0,0.18), 0 4px 15px 0 rgba(0,0,0,0.15)
}
.we-btn:focus{
    box-shadow: 0 0 0 0.2rem rgba(0,0,0,0.18);
}
.c-btn-1{color:#ff3547}
.c-btn-2{color:#00c851}
.c-btn-3{color:#598cc3}
.button.button-primary, .button.button-primary:focus {
    color: #fff;
    background-color: #0095D9;
    border-color: #0095D9;
}
.button.button-primary:hover, .button.button-primary:active {
    color: #fff;
    background-color: #00537b;
    border-color: #00537b;
}
.button {
    position: relative; 
    overflow: hidden; 
    display: inline-block;
    padding: 13px 35px;
    font-size: 14px;
    line-height: 1.25;
    border: 2px solid;
    border-radius: 0;
    font-family: "Oswald", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    font-weight: 500;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    white-space: nowrap;
    text-overflow: ellipsis;
    text-align: center;
    cursor: pointer;
    vertical-align: middle;
}
.modal-header{
    border-bottom: 1px solid #000;
}
.modal-footer{
    background-color: #d3d3d3;
    border-top: 1px solid #000;    
}
.modal-dialog{
    overflow-y: initial !important
}
.breadcrumbs-custom-inner {
    display: flex;
    min-height: inherit;
    width: 100%;
    padding: 25px 0 25px;
}
.bg-primary-darker{
    background-color: #2d3742;
}
.bg-primary-darker-2 {
    background-color: #12394b;
}
.box-cta-1 {
    text-align: center;
    vertical-align: middle;
    padding-top: 10px;
    padding-bottom: 10px;
}
.lien{
    color: white;
}
.lien:hover {
    font-weight: 600;
    color: white;
}
.gray-500 {
    color: #adb5bd;
}
#bandeau-connexion{
    padding-top: 40px;
}
.box-slider-inner{
    background-color: #4f4950;
    padding-top: 40px;
    padding-bottom: 40px;  
}
.box-slider{
    padding-right: 0px;
    padding-left: 0px;
    overflow: hidden;
}
.connexion-text{
    color: white;
}
.v-center {
  margin: 0;
  position: absolute;
  top: 50%;
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 100%
}
/***************************
* Site
***************************/

.we-bouton{color: gray !important; background-color: whitesmoke; border-color: black;}
.hidden-y{overflow: hidden}

.we-navbar-nav-collapse {  
    display: -ms-flexbox!important;
    display: flex!important;
    -ms-flex-preferred-size: auto;
    flex-basis: auto;    
    flex-grow: 1;
    align-items: center;
}
.we-navbar-nav{
    display: -ms-flexbox;
    display: flex;
    flex-direction: row;
    padding-left: 0;
    margin-bottom: 0;
    list-style: none;
}
.fixed-top{
    top:inherit;
}

.fixed-top-1 {
    position: fixed;
    top: 0px;
    right: 0;
    left: 0;
    z-index: 1030;
}
.fixed-top-2 {
    position: fixed;
    top: 55px;
    right: 0;
    left: 0;
    z-index: 1031;
}

#we-section-sortable{ list-style-type: none; margin: 0; padding: 0; }

.we-roundedImage{
    overflow:hidden;
    -webkit-border-radius:50px;
    -moz-border-radius:50px;
    border-radius:50px;
    width:100px;
    height:100px;
    background-repeat: no-repeat;
}

a {color: inherit;text-decoration: none}

.we-action-form{margin-top: 20px;}

.form-group{
    position: relative;
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
}

.form-group label.active {
    font-weight: 700;
    -webkit-transform: translateY(-14px) scale(0.8);
    transform: translateY(-14px) scale(0.8);
}

.form-group label {
    position: absolute;
    top: -8px;
    font-size: 1rem;
    -webkit-transition: color .2s ease-out,-webkit-transform .2s ease-out;
    transition: color .2s ease-out,-webkit-transform .2s ease-out;
    transition: transform .2s ease-out,color .2s ease-out;
    transition: transform .2s ease-out,color .2s ease-out,-webkit-transform .2s ease-out;
    -webkit-transform: translateY(12px);
    transform: translateY(12px);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;    
}

.form-group textarea.md-textarea {    
    overflow-y: hidden;
}

.form-group input:not([type]), .form-group input[type="text"]:not(.browser-default), .form-group input[type="password"]:not(.browser-default), .form-group input[type="email"]:not(.browser-default), .form-group input[type="url"]:not(.browser-default), .form-group input[type="time"]:not(.browser-default), .form-group input[type="date"]:not(.browser-default), .form-group input[type="datetime"]:not(.browser-default), .form-group input[type="datetime-local"]:not(.browser-default), .form-group input[type="tel"]:not(.browser-default), .form-group input[type="number"]:not(.browser-default), .form-group input[type="search"]:not(.browser-default), .form-group input[type="phone"]:not(.browser-default), .form-group input[type="search-md"], .form-group textarea.md-textarea {
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    background-color: transparent;
    border: 0;
    border-bottom: 1px solid #ced4da;
    border-radius: 0;
    outline: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
    -webkit-transition: border-color .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
    transition: border-color .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
}

.form-group .prefix ~ input, .form-group .prefix ~ textarea {
    width: calc(100% - 2.5rem);
    margin-left: 2.5rem;
}
.form-group .form-control {
    -webkit-box-sizing: border-box !important;
    box-sizing: border-box !important;
}

.form-group input {
    -webkit-writing-mode: horizontal-tb !important;
    text-rendering: auto;
    color: -internal-light-dark(black, white);
    letter-spacing: normal;
    word-spacing: normal;
    text-transform: none;
    text-indent: 0px;
    text-shadow: none;
    display: inline-block;
    text-align: start;
    appearance: textfield;
    background-color: -internal-light-dark(rgb(255, 255, 255), rgb(59, 59, 59));
    -webkit-rtl-ordering: logical;
    cursor: text;
    margin: 0em;
    font: 400 13.3333px Arial;
    padding: 1px 2px;
    border-width: 2px;
    border-style: inset;
    border-color: -internal-light-dark(rgb(118, 118, 118), rgb(195, 195, 195));
    border-image: initial;
}

.we-form-check{cursor: pointer;}
.clock{
    width: 300px;
    margin-top: 30px;
    margin-left: auto;
    margin-right: auto;
}

/*jssor slider thumbnail skin 101 css*/
.jssort101 .p {position: absolute;top:0;left:0;box-sizing:border-box;background:#000;z-index:2}
.jssort101 .p .cv {position:relative;top:0;left:0;width:100%;height:100%;border:2px solid #000;box-sizing:border-box;z-index:1;}
.jssort101 .a {fill:none;stroke:#fff;stroke-width:400;stroke-miterlimit:10;visibility:hidden;}
.jssort101 .p:hover .cv, .jssort101 .p.pdn .cv {border:none;border-color:transparent;}
.jssort101 .p:hover{padding:2px;}
.jssort101 .p:hover .cv {background-color:rgba(0,0,0,6);opacity:.35;}
.jssort101 .p:hover.pdn{padding:0;}
.jssort101 .p:hover.pdn .cv {border:2px solid #fff;background:none;opacity:.35;}
.jssort101 .pav .cv {border-color:#fff;opacity:.35;}
.jssort101 .pav .a, .jssort101 .p:hover .a {visibility:visible;}
.jssort101 .t {position:absolute;top:0;left:0;width:100%;height:100%;border:none;opacity:.6;}
.jssort101 .pav .t, .jssort101 .p:hover .t{opacity:1;}

@media (max-width: 992px){.we-d-lg{display: none!important;}}
.we-ico-fa{width: 16px}


.we-titre-page-deco {
    width: 100%;
    height: 2px;
    position: relative;
    margin-bottom: 15px;
    background: var(--couleur1);
}

.we-titre-page-deco .we-titre-page-deco-inner {
    position: absolute;
    top: -1px;
    width: 300px;
    height: 8px;
    margin-left: 15px;
    -webkit-transform: perspective(100px) rotateX(-60deg);
    transform: perspective(100px) rotateX(-60deg);
    background: var(--couleur1);
}

.img-fond-section {
  position: relative;
/*  background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.8)), to(rgba(0, 0, 0, 0.7))), url("../../img/Pronis-Loisirs.png");
  background: linear-gradient(rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.7)), url("../../img/Pronis-Loisirs.png");*/
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
}

/* loading scroll */
.scroll-loading { display:block;position:fixed;top:50px;left:0;background-color:rgba(243,243,243,0.8);width:100%;height:100vh;padding:20px 0;z-index:100000; }
.loader {
    position:absolute;
    top:44%;
    left:46%;    
    width: 120px;
    aspect-ratio: 2;
    --_g: no-repeat radial-gradient(circle closest-side,#cd8e35 90%,#0000);
  background: 
    var(--_g) 0%   50%,
    var(--_g) 50%  50%,
    var(--_g) 100% 50%;
  background-size: calc(100%/3) 50%;
  animation: l3 1s infinite linear;
}
@keyframes l3 {
    20%{background-position:0%   0%, 50%  50%,100%  50%}
    40%{background-position:0% 100%, 50%   0%,100%  50%}
    60%{background-position:0%  50%, 50% 100%,100%   0%}
    80%{background-position:0%  50%, 50%  50%,100% 100%}
}

.titre-navbar{font-size: 0.5em}
label {cursor: pointer;}

.we-conteneur img, .we-section-choix-element img{
    margin-right: auto;
    margin-left: auto;
    max-width: 100%;
    height: auto;    
}

.btn.we-bgc-2:hover{
    color:white;
}

.we-btn-custom{
    text-decoration: none;
    border: solid 1px black;
    font-weight: 700;            
}

.btn.we-btn-custom.we-bgc-1{
    color: var(--couleur1);
}

.we-btn-custom:hover{
    color:currentColor;
    box-shadow: 0 5px 11px 0 rgba(0,0,0,0.18), 0 4px 15px 0 rgba(0,0,0,0.15)
}

.txt-tg{
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;    
}

.btn-nav{
    padding: 8px;
    background: white;
    border: 1px solid var(--couleur1);
    border-radius: 8px;
    cursor: pointer;
    display: inline-block;
    color: var(--couleur1);
    font-weight: bold;
}
.btn-nav i{
     font-size: 1.2em !important;
}

.nav-log i{
     font-size: 1.5em !important;
}

a.btn-nav:hover {
    color: var(--couleur1) !important;
    box-shadow: 0 5px 11px 0 rgba(0,0,0,0.18), 0 4px 15px 0 rgba(0,0,0,0.15);
}

/*check box*/
 .checkbox-wrapper-25 input[type="checkbox"] {
    background-image: -webkit-linear-gradient(hsla(0,0%,0%,.1), hsla(0,0%,100%,.1)),
                      -webkit-linear-gradient(left, #dc0000 50%, #1e953e 50%);
    background-size: 100% 100%, 200% 100%;
    border-radius: 25px;
    cursor: pointer;
    height: 25px;
    padding-right: 25px;
    width: 40px;
    -webkit-appearance: none;
    -webkit-transition: .25s;
}
.checkbox-wrapper-25 input[type="checkbox"]:after {
    background-color: #eee;
    background-image: -webkit-linear-gradient(hsla(0,0%,100%,.1), hsla(0,0%,0%,.1));
    border-radius: 25px;
    content: '';
    display: block;
    height: 15px;
    width: 15px;
    margin: 5px;
    margin-left: 4px;
}
.checkbox-wrapper-25 input[type="checkbox"]:checked {
    background-position: 0 0, 40px 0;
    padding-left: 18px;
    padding-right: 0;
}

.nav-link {
    padding: 0.5rem;    
}

.dropdown-menu-one-col{
    /* min-width: 500px; */
}

/* Pour les écrans mobiles (< 992px) */
@media (max-width: 991.98px) {
    /* Affichage en une colonne avec scroll */
    .navbar-nav > .nav-item.dropdown .dropdown-menu {
        position: absolute !important;
        width: calc(100% - 20px) !important;
        max-height: 40vh !important;
        overflow-y: auto !important;
        left: 10px !important;
        right: 10px !important;
        transform: none !important;
        margin-top: 0 !important;
        padding: 10px;
        background-color: #f8f9fa !important;
        border: 1px solid rgba(0, 0, 0, 0.15) !important;
        color: #333 !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    /* Force l'affichage en une seule colonne */
    .navbar-nav > .nav-item.dropdown .dropdown-menu .row {
        display: block !important;
        margin-right: 0px;
    }

    .navbar-nav > .nav-item.dropdown .dropdown-menu .row > [class*="col-"] {
        width: 100% !important;
        margin-bottom: 0 !important;
    }

    /* Style des items */
    .navbar-nav > .nav-item.dropdown .dropdown-menu .dropdown-item {
        display: block !important;
        width: 100% !important;
        color: #333 !important;
        padding: 0.5rem 1rem;
        background-color: transparent !important;
        opacity: 1 !important;
    }

    /* Masque le dropdown par défaut */
    .navbar-nav > .nav-item.dropdown .dropdown-menu {
        display: none;
    }

    /* Affiche le dropdown uniquement quand il est "open" */
    .navbar-nav > .nav-item.dropdown.show .dropdown-menu {
        display: block;
    }
}

/* Pour les écrans desktop (≥ 992px) */
/* @media (min-width: 992px) { */
    .dropdown-menu-two-col{
    left: 50% !important;
    transform: translateX(-50%) !important;  
/* } */
}

/* Pour les écrans desktop (≥ 992px) */
@media (min-width: 992px) {
    .dropdown-menu-two-col{
       min-width: 900px;
    }

    /* Centrage du sous-menu en 2 colonnes */
    .navbar-nav > .nav-item.dropdown .dropdown-menu {      
        max-height: none !important; /* Désactive la limitation de hauteur */
        overflow-y: visible !important;
    }

    /* Style des colonnes */
    .navbar-nav > .nav-item.dropdown .dropdown-menu .row {
        display: flex;
    }

    .navbar-nav > .nav-item.dropdown .dropdown-menu .row > [class*="col-"] {
        width: 50% !important; /* 2 colonnes égales */
    }
}
