.slider{
    height:55vh;
    background-color: var(--grism);
    position: relative;
    overflow: clip
}
.slider .filtre{
    position:absolute;
    left:0; top:0;
    width:100%; height: 100%;
    background-color: rgba(0,0,0,.35);
    z-index:6;
}
.slider .swiper{
    width:100%;
    height:100%;
}
.slider .accroche{
    position:absolute;
    left:50%;
    top:50%;
    width:80%;
    z-index:10;
    font-size:2rem;
    color: var(--blanc);
    font-weight: bold;
    line-height: 1.1;
    -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%);
    text-transform: uppercase;
}
.swiper-pagination{
    z-index:20;
}
.swiper-pagination-bullet{
    width:15px; height:15px;
    opacity:1;
    background-color: var(--blanc);
    border:1px solid var(--blanc);
}
.swiper-pagination-bullet-active{
    background-color: var(--vertclair);
}
.slider .swiper-pagination{
    top:1rem;
}

.page-content, .single-content{
    padding:0 5%;
    text-align:left;
}
article{
    text-align:left;
}
.vignet{
    overflow:clip;
    border:1px solid var(--gris);
    background-color: var(--grism);
}
.vignet img{
    width:100%;
    height: 100%;
    object-fit: cover;
    -webkit-transition: all 0.2s ease; transition: all 0.2s ease;
}
a:hover .vignet img{
    transform: scale(1.1);
}

.actu-agenda ul.children{
    display:flex;
    flex-wrap: wrap;
    gap:4px;
    justify-content: start;
    margin:0; padding:0;
    list-style: none;
    border-bottom:3px solid var(--bleu);
    position: sticky;
    top:100px;
}
.actu-agenda ul.children li{
    border: 1px solid var(--bleu);
    border-bottom: none;
    transition: all 0.2s ease;
    flex:1 1 auto
}
.actu-agenda ul.children li a{
    display:block;
    padding:1rem 1.5rem;
    font-weight:500;
    text-transform: uppercase;
    color: var(--bleu)
}
.actu-agenda ul.children li:hover a{
    color: var(--blanc)
}
.actu-agenda ul.children li.active, .actu-agenda ul.children li:hover{
    background-color: var(--bleu);
    color: var(--blanc);
    font-weight: bold;
}
.actu-agenda ul.children li.active a{
    color: var(--blanc)
}
.post-infos{
    border-bottom: 1px solid var(--bleufonce);
    padding:1rem 0;
}
.post-infos .date{
    font-weight: bold;
}
.post-infos .categ{
    display:inline-flex;
    padding: 0.25rem 1rem;
    background-color: var(--bleu);
    color: var(--blanc);
    border-radius:2rem;
    margin:2px;
}
.post-infos .categ.vert{
    background-color: var(--vert);
    font-weight: bold;
}

.form-recherche-adh .fields-group{
    gap: 1rem;
}
.form-recherche-adh .fields-group input[type=search], .form-recherche-adh .fields-group select, .form-recherche-adh .fields-group input[type=submit]{
    border:1px solid var(--gris);
    padding:0.5rem;
    font-size:1rem;
    background: none;
    flex: 1 1 auto;
}
.form-recherche-adh .fields-group input[type=submit]{
    background-color: var(--bleu);
    color: var(--blanc);
    font-weight: bold;
    border-color: var(--bleu);
    padding-left:1.5rem; padding-right: 1.5rem;
    text-transform: uppercase;
}
.item-adh{
    border-bottom:1px solid var(--bleufonce);
    text-align:left;
    display:none;
}
.item-adh .logo{
    border-radius:50%;
    width:100%;
    max-width:180px;
    border:1px solid var(--gris);
    overflow: clip;
}
.item-adh .logo img{
    width:100%; height:100%;
    object-fit: cover
}
.item-adh .icones, .fiche-adh .icones{
    gap: 0 1rem;
}
.item-adh h3{
    font-weight: 500;
    color: var(--bleu);
    text-transform: uppercase
}
.item-adh h3 a{
    color: var(--bleu);
}
.item-adh .icones a, .fiche-adh .icones a{
    overflow:clip;
    width: 42px; height:42px;
    background-position: center;
    background-repeat: no-repeat;
}
.item-adh .icones a.web, .fiche-adh .icones a.web{
    background-image: url(../img/web.svg);
    background-size: contain;
}
.item-adh .icones a.web, .fiche-adh .icones a.email{
    background-image: url(../img/mail.svg);
    background-size: contain;
}
.item-adh .icones a.fiche{
    background-color: var(--bleu);
    border-radius: 50%;
    background-image: url(../img/arrow-button.svg);
    background-size: 50%;
}
.fiche-adh .icones a.phone{
    background-color: var(--bleu);
    border-radius: 50%;
    background-image: url(../img/mobile.svg);
    background-size: contain;
}
.fiche-adh .nom{
    font-weight: 500;
    color: var(--bleu);
}
.fiche-adh .activite{
    font-weight: bold;
    text-transform: uppercase;
}
.fiche-adh .top > div{
    flex:1 0 50%
}
.fiche-adh .top .secteur{
    font-size:0.9rem;
    line-height:1;
    background-color: var(--bleu);
    color: var(--blanc);
    display:inline-block;
    padding:0.5rem 1rem;
    margin:0.25rem;
    border-radius:1rem;
}
.fiche-adh .logo{
    border-radius: 50%;
    border:1px solid var(--gris);
    overflow:hidden;
    width:100%;
    padding: 1rem
}
.fiche-adh .logo img{
    width:100%;
    height:100%;
    object-fit: contain
}
.fiche-adh .dirigeant img{
    width:100%;
}
.fiche-adh .connect{
    padding:1rem;
    background-color: var(--bleu);
    color: var(--blanc);
    font-size:0.85rem;
    text-align: center
}
/* .fiche-adh .connect:hover{
    background-color: var(--vertclair);
} */
.fiche-adh .connect img{
    width: 45px;
}
.map img{
    width:100%; height:100%;
    object-fit: cover;
    position:absolute;
    left:50%; top:50%;
    -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%);
}
.single-content #loginform{
    width:100%;
    max-width:450px;
    margin:0 auto;
}
.single-content #loginform p{
    text-align:left;
}
.single-content #loginform input{
    background: var(--blanc);
    font-size:1rem;
    padding:0.5rem 1rem;
    width:100%;
    border: 1px solid var(--gris);
}
.single-content #loginform input[type=submit]{
    background: var(--bleu);
    color: var(--blanc);
    width:auto;
    border: 1px solid var(--bleu);
}
.single-content #loginform input[type=checkbox]{
    width:18px; height:18px;
    border: 1px solid var(--bleu);
}
.single-content #loginform label{
    display: inline-block;
    text-align:left;
    padding:3px 0;
    font-size:0.9rem;
}
.detail-annonce .vignet{
    width:100%;
}
.detail-annonce .file{
    gap:0 0.5rem;
    color: var(--bleu)
}
.detail-annonce .file .ico{
    width:80px;
    background: url(../img/file-arrow.svg) no-repeat center / contain
}
.detail-annonce .contact{
    gap:1rem
}
.detail-annonce .contact a{
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    gap:0.5rem;
    color: var(--bleu);
}
.detail-annonce .contact a .icone{
    display:block;
    width:80px; height:80px;
    border:2px solid var(--bleu);
    border-radius: 50%;
    background-position: center;
    background-repeat: no-repeat;
}
.detail-annonce .contact a.mail .icone{
    background-image: url(../img/mail.svg);
    background-size: 50%;
}
.detail-annonce .contact a.phone .icone{
    background-color: var(--bleu);
    background-image: url(../img/phone-call.svg);
    background-size: 85%;
}
.detail-annonce .contact a:hover .icone{
    background-color: var(--bleufonce);
    border-color: var(--bleufonce)
}
@media screen and (min-width:992px){
    .slider{
        height:75vh;
    }
    .slider::before{
        content:"";
        display: block;
        width:6.5vw;
        height: 6.5vw;
        position:absolute;
        right:0; top:0;
        background-color: var(--blanc);
        z-index:11;
        clip-path: polygon(0 0, 100% 0, 100% 100%);
    }
    .slider::after{
        content:"";
        display: block;
        width: 10vw;
        height: 10vw;
        position:absolute;
        left:0; bottom:-1px;
        background-color: var(--blanc);
        z-index:11;
        clip-path: polygon(0 0, 0 100%, 100% 100%);
    }
    .slider .accroche{
        width:50%;
        font-size:3rem;
    }
    .fiche-adh .top > div{
        flex:1 0 auto
    }
}

@media screen and (min-width:1440px){
    .slider .accroche{
        width:50%;
    }
    .page-content, .single-content{
        padding:0 6.5%
    }
    
}
@media screen and (min-width:1440px){
    .single-content{
        padding: 0 15%;
    }
}
@media screen and (min-width:1680px){
    .slider .accroche{
        font-size:3.5rem;
        width:40%;
    }
    .single-content{
        padding: 0 20%;
    }
}