/**********************************************************************************************************************************************************/
/**************************************************************************** MAXI 1630PX *****************************************************************/
/**********************************************************************************************************************************************************/

@media only screen and (max-width: 1630px) {

    
}


/**********************************************************************************************************************************************************/
/**************************************************************************** MAXI 1420PX *****************************************************************/
/**********************************************************************************************************************************************************/

@media only screen and (max-width: 1420px) {

    a.cta {
        padding: 0 20px;
        height: 40px;
        line-height: 40px;
        border-radius: 4px;
        font-size: .9rem !important;
    }
    
}



/**********************************************************************************************************************************************************/
/**************************************************************************** MAXI 1300PX *****************************************************************/
/**********************************************************************************************************************************************************/

@media only screen and (max-width: 1300px) {

    
    header.header nav li a {
        font-size: .9rem;
        padding: 40px 8px;
    }
    
    .declenche-search {
        right: 20px;    
    }
    
    .logo-header {
        width: 180px;
        height: 60px;
    }
    
    h1 {
        font-size: 2.2rem;
        line-height: 2.7rem;
    }

    h2 {
        font-size: 1.8rem;
        line-height: 2.3rem;
    }

    h3 {
        font-size: 1.4rem;
        line-height: 1.8rem;
    }

    h4 {
        font-size: 1.2rem;
        line-height: 1.6rem;
    }


    
    
    
}



/**********************************************************************************************************************************************************/
/**************************************************************************** MAXI 1170 PX ****************************************************************/
/**********************************************************************************************************************************************************/

@media only screen and (max-width: 1170px) {

    body:not(.home) #content,
    body.home #content {
        margin-top: 50px;
    }
    
    .declenche-search,
    header.header.scroll .declenche-search {
        top: 15px;    
    }
    
    #shiftnav-toggle-main {
        top: 0 !important;    
    }
    
    header.header .logo-header,
    header.header.scroll .logo-header {
        height: 50px;
    }
    
    .wrap,
    .wrapthin {
        padding-left: 30px;
        padding-right: 30px;
        width: 100%;
        max-width: 100%;
    }
    
    p.big,
    .big p,
    .big {
        font-size: 1.3rem;
        line-height: 1.7rem;
    }
    
    .owl-carousel#carrousel-contenu {
        width: 100%;
    }
    
    .owl-carousel#carrousel-contenu .owl-item.troisieme {
        opacity: 1;
    }
    
    .owl-carousel .owl-nav button.owl-prev,
    .owl-carousel .owl-nav button.owl-next {
        width: 50px;
        height: 50px;
    }

    .owl-carousel .owl-nav button.owl-next::before,
    .owl-carousel .owl-nav button.owl-prev::before {
        font-size: 1.5rem;
        line-height: 50px;
        width: 50px;
        height: 50px;
    }
    
    #carrousel-contenu.owl-carousel .owl-nav {
        top: 30%;
        width: 104%;
        left: -2%;
    }
    
    #toTop {
        display: none !important;
    }
    
    .top-image.top-image-page {
        height: 40vh;    
    }

    h1.titre-page {
        margin-bottom: 10px;
    }

    h1.titre-page::after {
        height: 30px;
        width: 60px;
        bottom: -10px;
    }
    
}


/**********************************************************************************************************************************************************/
/**************************************************************************** MAXI 967 PX *****************************************************************/
/**********************************************************************************************************************************************************/

@media only screen and (max-width: 967px) {

    #inner-header .flex-item-quart.bkg-blanc {
        background: transparent;
        padding-top: 5px;
        padding-bottom: 5px;
    }
    
    .logo-header {
        background-color: #fff;    
    }
    
    .bkg-image {
        min-height: 27vh;
    }
    
    .flex-item-quart {
        width: 48%;
        margin-bottom: 30px;
    }
    
    .flex-item-trois-quart {
        width: 48%;
        margin-bottom: 30px;
    }
    
    section {
        padding: 40px 0;
    }
    
    h1 {
        font-size: 2rem;
        line-height: 2.3rem;
    }

    h2 {
        font-size: 1.6rem;
        line-height: 2rem;
    }

    h3 {
        font-size: 1.3rem;
        line-height: 1.7rem;
    }

    .rangee-page .container-flex .flex-item-moitie:last-child,
    .rangee-page .container-flex .flex-item-tiers:last-child,
    .rangee-page .container-flex .flex-item-deux-tiers:last-child,
    .rangee-page .container-flex .flex-item-quart:last-child {
        margin-bottom: 0;    
    }
    
    .rangee-page + .rangee-page {
        padding-top: 0 !important;
    }
    
    section.section-intro + section.section-page {
        padding-top: 0 !important;    
    }
    
}



/**********************************************************************************************************************************************************/
/**************************************************************************** MAXI 768 PX *****************************************************************/
/**********************************************************************************************************************************************************/

@media only screen and (max-width: 768px) {
    
    section {
        padding: 30px 0;    
    }
    
    .thin {
        padding: 0 25px;
        width: 100%;
        max-width: 100%;
    }
    
    .flex-item-moitie {
        width: 100%;
        margin-bottom: 30px;
    }
    
    #toTop {
        display: none !important;
    }
    
    .padding40 {
        padding: 30px;
    }

    .flex-item-tiers,
    .flex-item-deux-tiers {
        width: 100%;
        margin-bottom: 25px;
    }
    
    .module-post {
        width: 46%;
        margin-bottom: 50px;
    }
    
    p.big,
    .big p,
    .big {
        font-size: 1.1rem;
        line-height: 1.5rem;
    }
    
    .rangee-page {
        padding-top: 20px;
        padding-bottom: 20px;
    }
    
    .filet-epais {
        margin: 17px 0;    
    }
    
    footer,
    footer .right {
        text-align: center;
    }
    
    h3.header-accordion {
        font-size: 1rem;
        line-height: 1.4rem;
        padding: 15px 0 15px 50px;
    }

    h3.header-accordion::before {
        top: 30%;
        font-size: 1.5rem;
    }    
    
    a.share-icone::before {
        font-size: 1.1rem;    
    }
    
    section.section-focus::before {
        display: none;
    }
    
    section.section-focus,
    section.section-modules-cliquables {
        padding: 40px 0;
    }
    
    .flex-item-moitie.module-actu-focus {
        margin-bottom: 50px;
        text-align: center;
    }
    
    .module-actu-focus::before {
        width: 60px;
        left: 50%;
        margin-left: -30px;
        top: 12px;
    }
    
    .projets-map .flex-item-moitie {
        width: 48%;    
    }
    
    .bloc-partage {
        text-align: left;
    }
    
    
    
}



/**********************************************************************************************************************************************************/
/**************************************************************************** MAXI 600 PX *****************************************************************/
/**********************************************************************************************************************************************************/

@media only screen and (max-width: 600px) {

    .container-breadcrumb {
        display: none;
    }
    
    h1 {
        font-size: 1.8rem;
        line-height: 2.1rem;
    }

    h2 {
        font-size: 1.5rem;
        line-height: 1.9rem;
    }

    h3 {
        font-size: 1.2rem;
        line-height: 1.5rem;
    }
    
    .flex-item-trois-quart {
        width: 100%;
        margin-bottom: 25px;
    }
    
    .flex-item-quart {
        width: 100%;
        margin-bottom: 25px;
    }
    
    .module-post {
        width: 100%;
    }
    
    #carrousel-contenu.owl-carousel .owl-nav {
        width: 112%;
        left: -6%;
    }
    
    .citation-guillemets {
        font-size: 1.7rem;
        line-height: 2.2rem;
    }
    
    :root {
        --heightimage: 30vh;
    }
    
    
    
}




/**********************************************************************************************************************************************************/
/**************************************************************************** MAXI 480 PX *****************************************************************/
/**********************************************************************************************************************************************************/

@media only screen and (max-width: 480px) {

    
    

}

/**********************************************************************************************************************************************************/
/**************************************************************************** MAXI 375 PX *****************************************************************/
/**********************************************************************************************************************************************************/

@media only screen and (max-width: 375px) {

    
    
    
}


@media only screen and (max-height: 800px) and (orientation: landscape) {
    :root {
        --heightimage: 45vh;
    }
    

}

@media only screen and (max-height: 450px) and (orientation: landscape) {

}