/* XXL */
/* = desktop first */

/* XL */
@media (max-width: 1400px)
{
        /*
        * Agenda
        */
        .timeline .months .month .month-label .label-long {
                display:none;
        }
        .timeline .months .month .month-label .label-short {
                display:inline;
        }

        /*
        * Accueil 
        */
        #bandeau-diaporama .anim-wrapper video{
                /* height: calc( calc(100vw - 30px ) / 3.093); */
        }
}

/* LG */
@media (max-width: 1200px)
{

        /*
        * Top navigation
        */
        #header #top-menu{
                display: none;
        }

        /*
        * Main navigation
        */
        #header #main-menu .container{
                display: grid;
                grid-template-columns: 1fr 2fr 1fr;
                align-items: center;
                padding: 10px 15px;
        }

        #header #main-menu .container #navbar{
                display: flex !important;
                justify-content: center;
                align-items: center;
                position: fixed;
                top: 0;
                left: -350px;
                height: 100vh !important;
                width: 350px;
                background-color: var(--main-color);
                z-index: 2;
                transition: left .4s;
                overflow: hidden;
        }

        #header #main-menu .container #navbar.active{
                left: 0;
        }

        #header #main-menu .background-navbar-open.active{
                opacity: 1;
        }

        #header #main-menu .container #navbar #menu-menu-principal{
                margin: 0;
                height: 80%;
                width: 100%;
                padding: 0 40px;
                display: flex;
                flex-direction: column;
                border-top: 2px solid #fff;
                padding-top: 10px;
        }

        #header #main-menu .navbar-brand{
                position: relative;
                transform: none;
                left: 0;
                top: 0;
                grid-column: 2;
                grid-row: 1;
                display: flex;
                justify-content: center;
                align-items: center;
        }

        #header #main-menu .navbar-brand img{
                height: 70px;
        }   

        #header #main-menu .container .account-toggler-container{
                display: flex;
                justify-content: end;
                align-items: center;
        }

        #header #main-menu .menu-toggle{
                display: block;
        }

        #header #main-menu .menu-toggle .burger-menu{
                grid-column: 1;
                grid-row: 1;
        }

        #header #main-menu .cross-menu-container{
                display: block;
        }

        #menu-menu-principal .menu-item{
                padding: 15px 0;
                height: 70px;
                flex-grow: initial;
                display: inline-block;
                width: fit-content;
        }

        #menu-menu-principal .menu-item:nth-child(3) {
                margin-right: 0px;
        }

        #menu-menu-principal .menu-item .nav-link{
                display: flex;
                align-items: center;
                padding: 0;
                font-size: 1.2rem;
                height: 100%;
        }

        #menu-menu-principal .menu-item .nav-link::after {
                left: 41px;
                bottom: 7px;
        }

        #menu-menu-principal .menu-item:hover .nav-link::after, #menu-menu-principal .menu-item.current-menu-item .nav-link::after{
                width: calc(100% - 41px);
        }

        #menu-menu-principal .menu-item .nav-link .nav-link-icon{
                position: relative;
                top: 0;
                left: 0;
                transform: none;
                margin: 0;
                margin-right: 15px;
                display: flex;
                width: 24px;
                align-items: center;
        }   

        #header #navbar .logo-navbar-mobile {
                display: block;
                position: absolute;
                width: 110px;
                top: 20px;
                left: 40px;
        }

        /*
        * MENU FIXED
        */
        #main-menu.fixed{
                display: none !important;
        }

        /*
        * Facet
        */
        .facetwp-filters .facetwp-facet input.facetwp-search, 
        .facetwp-filters .facetwp-facet input.facetwp-location{
                min-width: 190px;
        }

        /*
        * Blog
        */
        .single-post .entry-title .main-col .title-container h1 {
                font-size: 2rem;
        }
        .single-post .entry-title .main-col .title-container .blog-post-meta .blog-post-date {
                font-size: 1em;
        }
        .single-post .entry-title .main-col .title-container .blog-post-meta {
                font-size: 0.55em;
        }
}

/* MD */
@media (max-width: 992px)
{
        /*
        * Général
        */

        .page-container .right-col {
                width: 100%;
                margin-left: 0;
        }
        .single-post .breadcrumb{
                margin-bottom: 0;
        }

        /*
        * Column
        */
        .page-container .left-col {
                width: 100% !important;
                margin-bottom: 30px;
        }
        .page-container .main-col {
                width: 100%;
        }
        .page-container {
                flex-direction: column;
        }
        .page-container.three-cols .main-col,
        .page-container.three-cols .left-col,
        .page-container.three-cols .right-col{
                width: 100%;
                margin: 0;
        }

        /*
        * Facet
        */
        .facetwp-filters input, .facetwp-filters select, .facetwp-filters .fs-label-wrap {
                height: 36px;
        }
        .facetwp-filters .fs-label-wrap {
                line-height: 1.4;
        }
        .location-result {
                font-size: 14px;
        }

        /*
        * Annonce
        */
        .search-block-annonces,
        .search-block-offres{
                display: none;
        }

        .modal .search-block-annonces,
        .modal .search-block-offres{
                display: block;
        }

        /*
        * Single
        */
        .single .breadcrumbs.container{
                margin-bottom: 20px;
        }
        .single .breadcrumbs.container .breadcrumb{
                margin-bottom: 0;
        }
        .single .left-col{
                margin-bottom: 0;
        }
        .single .left-col .content-image{
                display: none;
        }
        .single .left-col .share{
                display: none;
        }
        .single .main-col .share{
                display: block;
        }
        .single .main-col .entry-title{
                font-size: 32px;
        }
        .single .author-block{
                padding-top: 1em;
                border-bottom: solid 3px var(--main-color);
        }
        .single #comments {
                margin-bottom: 0;
        }
        .single .right-col{
                margin: 0;
                width: 100%;
                margin-left: 0;
                position: relative !important;
                left: initial !important;
                top: initial !important;
        }
        .single .right-col .type-annonce{
                display: none;
        }
        .single .page-info {
                display: grid;
                grid-template-columns: 1fr 1fr;
                margin-top: 0;
        }
        .single .stripes {
                display: none;
        }
        .single .tags .tag{
                font-size: .8em;
        }

        /*
        * Result
        */
        .search-page .results-col .results .result-title {
                font-size: 1.1rem;
        }

        /*
        * Modal filter
        */
        .search-page .search-col .btn-mobile-facet-filter{
                display: block;
        }
        .facet-not-mobile{
                display: none;
        }
        .modal-filter .facetwp-link,
        .modal-filter .facetwp-checkbox {
                margin-bottom: 4px;
                margin-bottom: 10px;
                font-size: 16px;
        }


        /*
        * FacetWP Page Footer
        */
        .facetwp-facet.facetwp-facet-nombre_resultats_page.facetwp-type-pager {
                display: none;
        }
        .facetwp-facet.facetwp-facet-pagination.facetwp-type-pager {
                margin-top: 10px;
                width: 100%;
                display: flex;
                justify-content: space-between;
        }
        .facetwp-pager {
                width: 100%;
                display: flex;
                justify-content: end;
        }
        .results-footer {
                justify-content: space-between;
                flex-direction: column;
                align-items: center;
        } 
        .search-page .facetwp-pager > .facetwp-page {
                padding: 5px 13px;
        }

        /*
        * En tête
        */
        #bandeau-entete.with-img .bandeau-entete-sous-titre {
                padding-bottom: 30px;
        }
        #bandeau-entete.with-img .entry-title h1 {
                font-size: 2.5rem;
        }

        .register-login-page .row{
                flex-direction: column;
        }

        .register-login-page .row .register,
        .register-login-page .row .login{
                display: flex;
                align-items: center;
        }


        /*
        * Login & Register
        */
        .container .login{
                margin-top: 80px;
        }

        .container .register {
                margin-top: 100px;
                margin-bottom: 50px;
        }

        #register_new_user,
        form#loginform{
                min-width: 450px;
                padding: 0;
        }

        #register_new_user:after,
        .login .form-container-inside::after{
                top: -90px;
                height: 30px;
                width: 100%;
        }    
        
        .login .form-container-inside {
                padding: 0;
        }

        /*
        * Blog
        */
        .search-page .facetwp-facet{
                height: 100%;
        }

        .blog-container .facetwp-filters input, 
        .blog-container .facetwp-filters select, 
        .blog-container .facetwp-filters .fs-label-wrap {
                padding: 0;
                height: 100%;
        }

        .blog-container .facetwp-filters input{
                padding: 6px 22px 6px 12px;
        }

        .blog-container .facetwp-filters select,
        .blog-container .fs-label-wrap .fs-label{
                padding : 6px 22px 6px 8px;
        }
        /*
        * Post
        */

        .single-post .chapeau{
                padding-top: 25px;
                border-top: 1px solid rgba(0,0,0,0.1);       
        }

        #page-content .main-col p > img{
                margin: 0;
        }

        .single-post .entry-title .main-col .title-container::after{
                display: none;
        }

        .single-post .entry-title .main-col .title-container::before{
                background-size: 45px 50px;
        }

        #page-content .sharethis-inline-reaction-buttons {
                position: initial;
                top: initial;
                left: initial;
                flex-direction: row;
                justify-content: space-between;
                margin-top: 15px !important;
                padding-bottom: 10px;
                margin-bottom: 10px;
                margin-top: 0;
                border-bottom: 1px solid rgba(0,0,0,0.1);
                display: none !important;

        }
        /*
        #page-content .sharethis-inline-reaction-buttons .st-btn {
                width: calc(100% / 6.5) !important;
                color: var(--inverse-current-page-color);
                background-color: #fff;
                border-radius: 8px;
                transition: .1s;
        }

         #st-2:not(.st-reacted) .st-btn:hover{
                transition: .1s;
        }

        #page-content .sharethis-inline-reaction-buttons .st-btn > span.st-count{
                margin-bottom: 2px;
                font-weight: bold;
        }

        #page-content .sharethis-inline-reaction-buttons .st-btn .st-text{
                font-size: .35em !important;
        } */

        .single-post .main-col > h2{
                margin-top: 15px;
                font-size: 1.6rem;
        }

        /*
        * Commentaire
        */
        .commentlist .avatar {
                position: relative;
                top: 0;
                left: 0;
                height: 30px;
                width: 30px;
                margin-right: 10px;
        }
      
        .commentlist {
                margin: 0;
                width: 100%;
                padding: 0;
        }
      
        .commentlist > li.comment {
                padding: 0;
        }
      
        .comment-meta {
                height: auto;
                padding-bottom: 10px;
                position: relative;
        }

        .comment-meta:after{
                content: '';
                position: absolute;
                bottom: 10px;
                left: 40px;
                height: 1px;
                width: calc(100% - 40px);
                background-color: rgba(0,0,0,0.1);
        }
      
        .comment-content {
                margin-bottom: 10px;
                padding-left: 40px;
        }
              
        .comment-author.vcard {
                color: var(--current-page-color);
        }

        .commentlist .reply {
                margin-top: 10px;
                padding-left: 40px;
        }
      
        .comment-reply-link.btn.btn-outline-secondary {
                font-size: 12px;
        }
      
        #respond {
                border-bottom: 3px solid var(--main-color);
                padding-bottom: 30px;
        }
            
        .comment-author.vcard .fn {
                font-weight: bold;
        }        
        
        .comment-author.vcard .fn a {
                font-weight: bold;
        }
      
      
        .comment-author.vcard a {
                font-weight: normal;
        }
      
        #page-content .sharethis-inline-share-buttons {
                margin-bottom: 1.5em;
        }

        /*
        * Form step
        */
        .ccn-form.form-one-col .header-form ,
        .ccn-form.form-one-col .form-container {
                padding: 30px 40px;
        }

        .ccn-form.form-one-col h2 {
                font-size: 2rem;
        }

        /*
        * Dashboard
        */

        #dashboard #bandeau-entete .page-container{
                flex-direction: row;
        }
        #dashboard #bandeau-entete .page-container .main-col{
                width: 60%;
        }
        #dashboard #bandeau-entete .page-container .right-col {
                width: 40%;
        }
        #dashboard .results-col .reseau-content {
                grid-template-columns: 1fr;
        }
        #dashboard .results-col .reseau-content > .reseau-col:first-of-type {
                display: none;
        }
        #dashboard .results-col .reseau-content h2::before {
                width: 30%;
        }


        #dashboard .right-col.resume-block {
                width: 100%;
                margin-left: 0;
                display: grid;
                grid-template-columns: 1fr 1fr;
                grid-gap: 20px;
        }
      
        #dashboard .right-col.resume-block .suggestion-block.block-container {
                grid-column: 2;
        }
      
        #dashboard .right-col.resume-block .content-block {
                grid-row: 1/3;
        }

        /*
        * Profil
        */
        .profil-content-block.galerie .galerie-inner {
                height: 300px;
        }
        /*
        * Accueil
        */
        #bandeau-diaporama .anim-wrapper {
                overflow: hidden;
        }
}
      

/* SM */
@media (max-width: 768px)
{
        /*
        * Général
        */
        #main {
                margin-top:0px;
                margin-bottom:30px;
                overflow:hidden;
        }
        .right-col .author-block::after{
                right: -1px;
        }

        .title-block:after{
                right: -1px;
        }
        .single #comments-title{
                font-size: 1rem;
                
        }

        /*
        * Header
        */
        #header #main-menu .cross-burger-menu, #header #main-menu .menu-toggle .burger-menu {
                width: 35px;
                height: 28px;
        }
              
        #header #main-menu .cross-burger-menu .item-cross-burger-menu, #header #main-menu .menu-toggle .burger-menu .item-burger-menu {
                height: 5px;
        }
              
        
        #header #main-menu .navbar-brand img {
                height: 55px;
        }

        #header #main-menu .container .account-toggler-container .account-button i::before,
        #header #main-menu .container .account-toggler-container a i::before {
                font-size: 32px;
        }

        #header #main-menu .container .account-button,
        #header #main-menu .container .account-toggler-container a {
                width: 42px;
                height: 42px;
        }

        #header #main-menu .container, #header #main-menu .container-sm{
                padding: 0;
        }

        #header #main-menu .container{
                padding: 5px 0;
        }

        /*
        * Footer
        */
        #footer .container {
                grid-template-columns: 1fr;
                row-gap: 40px;
        }

        #footer .container .mention-cd88{
                grid-row: 4;
                grid-column: 1;
        }
      
        #footer .container .adresse-cd88 {
                grid-column: 1;
                grid-row: 2;
                width: 100%;
                position: relative;
        }
      
        #footer .container .adresse-cd88 img {
                width: 50px;
                height: auto;
                margin-right: 20px;
                padding: 0 0px;
        }

        #footer .container .liens-utils#text-5 {
                grid-column: 1;
                grid-row: 3;
                justify-content: start;
        }

        #footer .container .menu-menu-pied-de-page-container{
                position: relative;
        }

        #footer .container .menu-menu-pied-de-page-container:after {
                content: '';
                position: absolute;
                bottom: -15px;
                left: 0;
                width: 100%;
                height: 1px;
                background-color: rgba(255,255,255,.1);
        }
      
        #footer .container .adresse-cd88:after {
                content: '';
                position: absolute;
                bottom: -25px;
                left: 0;
                width: 100%;
                height: 1px;
                background-color: rgba(255,255,255,.1);
        }

        #footer .container #text-5{
                position: relative;
        }
        #footer .container #text-5:after {
                content: '';
                position: absolute;
                bottom: -25px;
                left: 0;
                width: 100%;
                height: 1px;
                background-color: rgba(255,255,255,.1);
        }

        #footer .container .menu-menu-pied-de-page-container .menu.nav {
                display: grid;
                grid-template-columns: 1fr 1fr;
                height: 100%;
        }

        #footer .container .menu-menu-pied-de-page-container .menu-item::after{
                display: none;
        }

        #footer .container #text-3 .textwidget {
                /* display: grid;
                grid-template-columns: 1fr 1fr; */
        }

        #footer .container #text-3 .textwidget p{
                margin: 0;
        }
      
        #footer .container #text-3 .textwidget > p:last-child {
                margin-bottom: auto;
        }

        /*
        * Blog
        */

        .blog-post .tags .tag{
                font-size: .7em;
        }

        .page-blog .facetwp-filters {
                row-gap: 10px;
                flex-direction: column;
        }
      
        .page-blog .search-page .facetwp-facet {
                width: 100%;
        }
        .page-blog .facetwp-input-wrap {
                width: 100%;
        }
      
        .page-blog .facetwp-filters input, .page-blog .facetwp-filters select, .page-blog .facetwp-filters .fs-label-wrap {
                width: 100%;
        }
      
        .page-blog .fs-wrap {
                width: 100%;
        }
        
        /*
        * Blog post
        */
        .single-post #bandeau-entete.with-img .entry-title{
                padding-right: 0;
        }
        .single-post #bandeau-entete.with-img .entry-title .main-col{
                padding-right:0 ;
        }

        .single-post #bandeau-entete .entry-title .main-col .title-container h1 {
                font-size: 1.8rem;
        }
        .single-post .main-col h2 {
                font-size: 1.7rem;
        }
        .single-post .entry-title .main-col .title-container .blog-post-meta .blog-post-date {
                font-size: 0.9em;
        }
        .single-post .entry-title .main-col .title-container .blog-post-meta {
                font-size: 1rem;
        }
        .title-container .tags .tag {
                font-size: .7rem;
        }
        .chapeau {
                margin-bottom: 1em;
        }
        
        /*
        * Agenda
        */
        .search-page .results-col .event .event-picture {
                display:none;
        }
        .block-sortir-vosges {
                display:none;
        }
        .date-filter-types {
                order: 1;
                flex-direction: row;
                margin-bottom: 3em;
                column-gap: 30px;
                justify-content: center;
                background: var(--current-page-color);
                padding: 10px 10px 0 10px;
                margin-left: 0;
                color: #fff;
        }
        .date-filter-types label input {
                margin-right: 7px;
        }
        .timeline-container {
                margin-top: 10px;
                flex-direction: column;
        }
        .timeline-wrapper {
                order: 2;
        }
        .timeline .months .month {
                padding:15px 0;
        }
        .timeline .months .month {
                font-size: 1.3em;
        }
        .timeline .months .month .year {
                top:-37px;
        }
        .timeline .months .month .year.overlap {
                top:-44px;
        }
        .search-page .results-header {
                margin-top: 30px;
        }
        .search-page.page-container .left-col {
                margin-bottom:0;
        }
        .period-selector {
                top: 1px;
                bottom: 1px;
        }
        .period-selector.type-date {
                background: var(--agenda-color);
        }
        .period-selector.type-date:before, .period-selector.type-date:after {
                content: '';
                position: absolute;
                left: -7px;
                width: 20px;
                border:solid 5px var(--agenda-color);
                background:#fff;
                height: 20px;
                border-radius: 50%;
        }
        .period-selector.type-date:before {
                top:-10px;
        }
        .period-selector.type-date:after {
                bottom: -10px;
        }
        .period-selector .period-start, .period-selector .period-end {
                bottom: -27px;
        }
        .period-selector.type-period .left-handle:before, .period-selector.type-period .left-handle:after,
        .period-selector.type-period .right-handle:before, .period-selector.type-period .right-handle:after {
                content: '';
                position: absolute;
                left: -7px;
                width: 20px;
                border:solid 5px var(--agenda-color);
                background:#fff;
                height: 20px;
                border-radius: 50%;
        }
        .period-selector.type-period .left-handle:before,
        .period-selector.type-period .right-handle:before {
                top:-10px;
        }
        .period-selector.type-period .left-handle:after,
        .period-selector.type-period .right-handle:after {
                bottom: -10px;
        }

        /*
        * Form step
        */
        .ccn-form .item-steps-bar .step-text {
                display: none;
        }
        .ccn-form .item-steps-bar .step-circle {
                width: 32px;
                height: 32px;
                font-size: 16px;
                border: 3px solid rgba(0,0,0,0.15);
        }
        .ccn-form.form-one-col .item-steps-bar .container-step-circle::before {
                top: 15px;
                height: 3px;
        }
        .ccn-form.form-one-col .steps-bar-container {
                margin-top: 20px;
        }
        .ccn-form .card-profil-type {
                width: 175px;
                height: 175px;
        }
        .ccn-form .card-profil-type .card-icon-container svg {
                width: 100px;
        }
        .ccn-form .card-profil-type .card-text-container > span:first-of-type {
                font-size: 0.7em;
        }
        .ccn-form .card-profil-type .card-text-container > span:last-of-type {
                font-size: 0.8em;
        }
        .ccn-form .text-or {
                font-size: 24px;
        }

        /*
        * Dashboard
        */
        #dashboard #bandeau-entete .page-container{
                flex-direction: column;
        }
        #dashboard #bandeau-entete .page-container .main-col,
        #dashboard #bandeau-entete .page-container .right-col {
                width: 100%;
        }
        #dashboard #bandeau-entete.with-img .entry-title {
                padding-top: 45px;
                font-size: 2em;
        }
        #dashboard #bandeau-entete .right-col {
                width: 100%;
                margin-left: 0;
                display: grid;
                grid-template-columns: calc(45% - 10px) calc(55% - 10px);
                grid-gap: 20px;
                padding-bottom: 10px;
        }
        #dashboard .dashboard-profil-completion {
                display: none;
        }
        #dashboard .profil-info-container img {
                width: 140px;
                height: 140px;
        }
        #dashboard #bandeau-entete .right-col .dashboard-profil-block.content-block {
                width: 100%;
                grid-row: 1/3;
        }
        #dashboard .bandeau-entete-sous-titre {
                font-size: .9em;
        }
        #dashboard .right-col {
                width: 100%;
                margin-left: 0;
        }
        #dashboard .facetwp-type-pager.facetwp-facet-nombre_resultats {
                display: none;
        }
        #dashboard .profil-info-container h3,
        #dashboard .profil-info-text {
                font-size: 1em;
        }
        #dashboard .dashboard-profil-block .profil-info-text h4 {
                font-size: 1em;
        }
        
        #dashboard .dashboard-profil-block .profil-edit-icon svg {
                top: 11px;
        }
        #dashboard .profil-edit-icon svg {
                width: 16px;
                height: 16px;
        }
        #dashboard .dashboard-profil-actions {
                grid-row: 2;
                margin-bottom: 20px;
        }
        #dashboard .dashboard-profil-actions .ccn-btn.ccn-btn-left {
                padding: 3px 10px 3px 28px;
                font-size: .9em;
        }
        #dashboard .dashboard-profil-actions .ccn-btn .ccn-btn-icn {
                top: 0px;
        }
        #dashboard .dashboard-profil-switcher button {
                font-size: 0.8em;
                margin-bottom: 5px;
        }
        /*
        * Profil
        */
        #profil .modal-dialog{
                max-width: 100%;
        }
        .profil-content-block.galerie .galerie-inner {
                height: 250px;
        }
        #profil .media-container .profil-edit-icon {
                top: 6px;
                right: 20px;
        }
        #profil .profil-edit-icon svg {
                background-color: #fff;
                z-index: 9;
        }
        #profil .profil-edit-icon {
                top: 0px;
                right: 0px;
        }
        #profil .right-col .profil-edit-icon svg {
                background-color: transparent;
        }
        #profil .entry-title .profil-edit-icon{
                top: 0px;
                right: -35px;
        }
        #profil .entry-title .profil-edit-icon svg{
                background-color: transparent;
        }
        #profil .modal .acf-fields > .acf-field{
                width: 100%;
        }
        #profil .profil-content-block.galerie .galerie-inner {
                height: auto;
                display: flex;
                flex-direction: column;
        }
        #profil .profil-content-block.galerie .items-big {
                width: 100%;
                height: 250px;
                overflow: hidden;
        }
        #profil .profil-content-block.galerie .items-thumbs {
                flex-direction: row;
                flex-wrap: unset;
                white-space: nowrap;
                overflow: auto;
                margin-left: 0;
                width: 100%;
                margin-top: 5px;
                /* overflow: unset; */
        }
        #profil .profil-content-block.galerie .items-thumbs .mCSB_container{
                display: flex;
        }
        #profil .profil-content-block.galerie .items-thumbs .item {
                height: 60px;
                margin-right: 5px;
                margin-bottom: 0;
                width: 100px;
        }
        #profil table.table-infos th {
                width:50%;
        }

        /*
        * Annuaire
        */
        .search-col .map-link{
                display: none;
        }

        /*
        * Accueil
        */
        .bandeau-accueil .actions-bandeau .ccn-btn {
                margin-bottom: 10px;
        }
        .horizontal-slider {
                padding-left: 15px;
                padding-right: 15px;
        }
        .horizontal-slider-inner{
                column-gap: 50px;
        }
        .horizontal-slider .btn-next, .horizontal-slider .btn-previous {
                padding: 15px 22px;
        }
        .horizontal-slider.overflow-right .btn-next svg:hover path,
        .horizontal-slider.overflow-right .btn-previous svg:hover path {
                fill: #fff;
        }
        .horizontal-slider.overflow-right .btn-next svg:hover rect,
        .horizontal-slider.overflow-right .btn-previous svg:hover rect {
                fill:var(--current-page-color);
        }
        .horizontal-slider.overflow-right .btn-next svg:active path,
        .horizontal-slider.overflow-right .btn-previous svg:active path {
                fill:var(--current-page-color);
                opacity: 75%;
        }
        .horizontal-slider.overflow-right .btn-next svg:active rect,
        .horizontal-slider.overflow-right .btn-previous svg:active rect {
                fill: transparent;
                opacity: 75%;
        }
        /* Blog */
        #bandeau-blog .derniers-articles article {
                width: calc(100vw - 30px);
        }
        /* Annuaire */
        #bandeau-annuaire #carte-acteurs {
                height: 250px;
        }
        #bandeau-annuaire .carte-acteurs-wrapper:after {
                opacity: 0.3;
        }
        #bandeau-annuaire .selection-acteurs article {
                width: 100px;
        }
        #bandeau-annuaire .horizontal-slider .btn-next, #bandeau-annuaire .horizontal-slider .btn-previous {
                top: -70px;
                width: 80px;
        }
        #bandeau-annuaire .horizontal-slider .horizontal-slider-item .article-img-container {
                height: 100px;
        }
        #bandeau-annuaire .horizontal-slider .horizontal-slider-item .article-img-container .no-img-placeholder {
                height: 100px;
        }
        #bandeau-annuaire .horizontal-slider-item h4 {
                font-size: 0.8rem;
        }
        /* Annonce */
        #bandeau-annonces > .container {
                flex-direction: column;
        }
        #bandeau-annonces > .container .right-col, 
        #bandeau-annonces > .container .left-col {
                width: 100%;
                padding: 0;
        }
        #bandeau-annonces .offre .offre-titre, #bandeau-annonces .annonce .annonce-titre {
                max-width: 60%;
        }
        #bandeau-annonces .offre .offre-date, #bandeau-annonces .annonce .annonce-date {
        max-width: 40%;
        }
        #bandeau-annonces > .container .right-col:before {
                display: none;
        }
        #bandeau-annonces .offre {
                width: 100%;
        }
        /* Agenda */
        #bandeau-agenda .col-md-5 {
                display: none;
        }
        #bandeau-agenda .alt-actions-bandeau {
                display: flex;
                flex-direction: column;
                margin-bottom: 15px;
        }
        #bandeau-agenda .alt-actions-bandeau .ccn-btn-alt {
                margin-bottom: 10px;
                margin-right: 0;
        }
        .agenda-timeline{
                left: -250px;
        }
        .agenda-timeline .event {
                flex-basis: 150px;
        }
        /* Materiel */
        #bandeau-materiel .categories-container {
                grid-template-columns: 1fr;
                width: 100%;
        }
        #bandeau-materiel .link-materiel {
                margin-bottom: 15px;
                font-size: 0.9rem;
                width: 100%;
        }
        #bandeau-diaporama .container{
                padding: 0;
        }
        #bandeau-diaporama .anim-wrapper {
                height: 200px;
        }
        #bandeau-diaporama .anim-wrapper video {
                height: 100% !important;
                transform: scale(1.4);
        }
}      

/* XS */
@media (max-width: 576px){

        /*
        *Body
        */

        /*
        * Container
        */
        .container, .container-sm{
                padding: 0 15px;
        }

        /*
        * Header
        */
        #header #main-menu{
                padding: 0 15px;
        }

        #header .modal-dialog {
                margin-right: auto;
                max-width: calc(100% - 1em);
        }

        /*
        * Footer
        */
        #footer .container .menu-menu-pied-de-page-container .menu-item .nav-link {
                font-size: 12px;
        }

        #footer .container #text-3 .textwidget > p:last-child {
                font-size: 12px;
        }

        #footer .container #block-block-4{
                font-size: 12px;
        }

        /*
        * Login & Register
        */

        #register_new_user,
        form#loginform{
                min-width: 350px;
        }

        .login-submit input,
        .btn-submit{
                font-size: 14px;
        }

        /*
        * Single 
        */
        .single .page-info {
                grid-template-columns: 1fr;
        }
        .single .content-post-meta{
                margin-bottom: 20px;
        }
        .single .main-col .share{
                margin-top: 20px;
        }

        /*
        * Single événement
        */
        .single-evenements .page-container.three-cols .main-col{
                margin-left: 0;
        }
        .single-evenements .content-dates{
                position: relative;
                top: initial;
                right: initial;
                width: 100%;
                display: flex;
                margin-bottom: 20px;
                padding: 8px 10px;
        }
        .single-evenements .item-date{
                display: flex;
                align-items: flex-end;
                margin-bottom: 0;
                margin-right: 18px;
                position: relative;
        }
        .single-evenements .item-date:after{
                content: '';
                position: absolute;
                top: 50%;
                left: calc(100% + 5px);
                transform: translate(0, -50%);
                height: 3px;
                width: 7px;
                background-color: #fff;
        }
        .single-evenements .item-date:last-child:after{
                display: none;
        }
        .single-evenements .item-date-month{
                font-size: 1.5em;
                margin-left: 5px;
        }

        /*
        * Form step
        */
        .ccn-form.form-one-col .header-form ,
        .ccn-form.form-one-col .form-container {
                padding: 20px 15px;
        }
        .ccn-form .text-or {
                display: none;
        }
        .ccn-form .card-profil-type {
                width: 130px;
                height: 130px;
                border: 2px solid var(--main-color);
                margin: -1px;
        }
        .ccn-form .card-profil-type .card-icon-container svg {
                width: 90px;
        }
        .ccn-form .card-profil-type .card-text-container > span:first-of-type {
                font-size: 0.7em;
                display: none;
        }
        .ccn-form .card-profil-type .card-text-container > span:last-of-type {
                font-size: 0.7em;
        }
        .ccn-form .card-profil-type .card-text-container > span:last-of-type {
                line-height: 1;
        }
}