@media screen and (max-width: 1600px) {
    .menu {
        right: 65px;
    }
    .menu>li {
        margin-right: 10px;
        height: 200px;
        width: 200px;
    }
    .menu>li a {
        font-size: 20px;
    }
    .menu>li::after{
        height: 86px;
    }
}
@media screen and (max-width: 1450px) {
    .menu>li {
        margin-right: 10px;
        height: 170px;
        width: 170px;
    }
    .menu>li::after{
        height: 78px;
    }
    #header{
        grid-template-columns: 225px 1fr;
    }
    #logo-container img {
        width: 185px;
    }
    .sub-menu{
        top: 90px;
    }
}
@media screen and (max-width: 1330px) {
    .green-banner{
        grid-template-columns: 1fr 1fr;
        grid-gap: 40px;
    }
    .img-schema{
        width: 100%;
    }

    .lt-h2 {
        font-size: 18px;
        margin-bottom: 13px;
    }
    .flex-ft{
        display: grid;
        grid-template-columns: 1.2fr 2fr;
        grid-gap: 40px;
        position: relative;
    }
    .flex-ft>div:first-of-type{
        display: none;
    }
    .flex-ft div:nth-of-type(2), .flex-ft div:nth-of-type(3){
        padding-top: 0;
    }
    .img-first{
        height: 450px;
    }
    p, li {
        font-size: 20px;
        line-height: 30px;
    }

    .menu>li .sub-menu a{
        font-size: 16px;
        line-height: 21px;
    }
    .menu>li.menu-item-has-children>a::after{
        height: 6px;
        width: 10px;
    }
    .contenu-ref{
        padding: 20px;
    }
    h1 {
        font-size: 38px;
    }
    h2, .h2 {
        font-size: 34px;
    }
    h3, .h3 {
        font-size: 24px;
        line-height: 28px;
    }
    .menu-sec li a {
        font-size: 16px;
        line-height: 20px;
    }
    .grid-services{
        grid-template-columns: repeat(3,1fr);
    }
    :root{
        --left-mg: 32vw;
    }
    .flex-ft .custom-logo-link img{
        width: 180px;
    }
}

@media screen and (max-width: 1250px) {
    #menu .menu {
        /*flex-direction: column;*/
        /*align-items: flex-start;*/
        position: static;
        width: 100%;
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-gap: 10px;
        padding: 0 var(--side-mg);
    }
    .menu-cdrec{
        display: none;
    }
    #main-menu-container {
        position: fixed;
        top: 0;
        right: 0;
        width: 100%;
        background: white;
        height: 100vh;
        overflow-x: hidden;
        overflow-y: scroll;
        transition: 0.4s ease-in-out all;
        clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);
        padding: 100px 0 60px 0;
        z-index: 10000;
        align-items: unset;
        justify-content: center;
        flex-direction: column;
    }

    #menu > .menu-toggle {
        display: block;
        position: fixed;
        right: 7.5%;
        /*top: 41px;*/
        top: 36px;
        z-index: 10001;
    }

    .toggled #main-menu-container {
        clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    }

    .menu a {
        color: var(--Noir);
        font-size: 30px;
        line-height: 38px;
    }
    .menu>li:hover>a, #menu .menu>.current_page_item:hover>a{
        color: var(--Noir);
    }
    #close-bar1, #close-bar2, #close-bar3 {
        background-color: var(--vert);
        transition: 0.4s ease-in-out all;
        /*height: 2px;*/
        border-radius: 40px;
    }
    #menu.toggled #close-bar1, #menu.toggled #close-bar2, #menu.toggled #close-bar3 {
        background-color: var(--vert);
    }

    #branding {
        position: relative;
        z-index: 10001;
    }

    .sub-menu {
        display: none;
        position: static;
        clip-path: unset;
        width: 100%;
        padding: 15px 0;
        background: var(--vert);
    }
    #menu.toggled #close-bar1{
        transform: translateY(12px) rotate(45deg);
    }
    #menu.toggled #close-bar3 {
        transform: translateY(-12px) rotate(-45deg);
    }
    .menu li {
        /*padding-top: 15px;*/
        /*margin-bottom: 15px;*/
        margin: 0px 0;
        padding: 0;
        width: 100%;
        /*height: 20vw;*/
        height: auto;
        border: 0;
    }
    .menu li a{
        display: block;
        width: 100%;
        height: 41vw;
        border: 1px solid var(--Noir);
        font-size: 18px;
        margin: 0;
        line-height: 18px;
        padding: 20px;
    }
    /*.menu>li{*/
    /*    padding-left: var(--side-mg);*/
    /*    padding-right: var(--side-mg);*/
    /*}*/
    #menu .menu > .current_page_item > a{
        color: var(--Noir);
    }
    .menu>li.menu-item-has-children>a::after{
        display: none;
    }
    .menu>li::before,
    .menu>li:after
    {
        display: none;
    }
    #main-menu-container a {
        /*padding: 0 var(--side-mg);*/
        font-size: 22px;
        margin: 0;
    }
    #main-menu-container .menu>li .sub-menu a{
        font-weight: 300;
        text-transform: unset;
        padding-bottom: 10px;
        margin-bottom: 10px;
        font-size: 16px;
    }
    #main-menu-container .menu>li .sub-menu li:last-of-type a{
        padding-bottom: 0;
        margin-bottom: 0;
    }
    #main-menu-container a:hover {
        color: var(--Noir) !important;
    }

    #menu .menu > .current_page_item > a {
        /*color: white;*/
        line-height: 26px;
        text-decoration: none;

        border: 1px solid var(--vert);
        color: var(--vert);
    }

    .menu li:last-of-type {
        margin-bottom: 0;
    }
    #header{
        padding-top: 30px;
        padding-bottom: 30px;
    }
    .mobile-menu{
        display: block;
        position: static;
        height: auto;
        width: 100%;
        transform: unset;
        padding: 40px var(--side-mg);
    }
    #main-menu-container .menu-cd-spe a{
        padding: 20px 0;
    }
    #main-menu-container .menu-cd-spe a>svg{
        max-width: 120px;
    }
    .menu-cd-spe .h3 {
        font-size: 18px;
        line-height: 22px;
    }
    .menu-cd-spe a p {
        font-size: 14px;
        line-height: 20px;
        margin-top: 4px;

    }
    .page-template-template-cd-rec #branding svg {
        width: 140px;
        height: 30px;
    }

    .grid-cd{
        display: block;
        grid-gap: 0;
    }
    .grid-cd>div:first-of-type{
        margin-bottom: calc(var(--up-mg) / 2);
    }
    .accordeon .icone-accordeon{
        top: 17px;
    }
    .txt li::after{
        top: 11px;

    }
}

@media screen and (max-width: 1050px) {
    .grid-services{
        grid-template-columns: repeat(2, 1fr);
        grid-gap: 20px;
    }
    .bloc-service img{
        height: 27vw;
    }
    .grid-ref{
        display: block;
        grid-gap: 0;
    }
    .galerie-ref{
        margin-top: var(--up-mg);
    }
}
@media screen and (max-width: 850px) {
    :root{
        --left-mg: 7.5vw;
        --side-mg: 7.5vw;
        --up-mg: 50px;
        --space-mg: 50px;

    }
    .grid-other {
       display: block;
        padding: 0;
    }
    .references-home{
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        grid-gap: 15px;
        margin-top: calc(var(--up-mg) / 2);
    }
    .reference-item img{
        height: 78vw;
    }
    .green-banner{
        display: block;
        grid-gap: 0;
    }
    .img-schema{
        margin-top: var(--up-mg);
    }
    .flex-ft{
        display: block;
        grid-gap: 0;
    }
    .flex-ft ul{
        columns: 1;
        margin-top: calc(var(--up-mg) / 2);
    }
    #copyright, .flex-link{
        margin-top: calc(var(--up-mg) / 2);
    }
    .green-banner .h2{
        margin-top: calc(var(--up-mg) / 2);

    }
    .other-society{
        right: unset;
        left: var(--side-mg);
    }

    .img-first {
        height: 350px;
    }
    #header{
        padding-top: 20px;
        padding-bottom: 20px;
    }
    #logo-container img {
        width: 155px;
    }
    #menu > .menu-toggle{
        top: 23px;
    }
    .grid-contenu{
        display: block;
    }
    .grid-contenu>div:first-of-type{
        display: none;
    }
    .txt-img{
        padding-left: var(--side-mg);
        display: flex;
        flex-direction: column-reverse;
        grid-gap: 0;
    }

    .txt-img:not(.historique)>div:first-of-type>a,
    .historique>div:nth-of-type(2)>a{
        height: 84.7vw;
        padding: 15px;
    }
    .txt-img>div:first-of-type{
        margin-top: calc(var(--up-mg) / 2);
    }
    .banner-force{
        transform: unset;
        padding: var(--up-mg) var(--side-mg);
        display: block;
        grid-gap: unset;
        width: 100%;
    }
    .banner-force div:nth-of-type(2){
        margin-top: calc(var(--up-mg) / 2);
    }
    .historique{
        flex-direction: column;
    }
    .historique>div:first-of-type{
        margin-top: 0;
    }
    .historique>div:nth-of-type(2){
        margin-top: calc(var(--up-mg) / 2);
    }
    .grid-services{
        grid-template-columns: repeat(1, 1fr);
        grid-gap: 20px;
    }
    .bloc-service{
        padding: 15px;
    }
    .bloc-service img {
        height: 58vw;
    }
    .contenu-services,
    .other-ref{
        padding-left: var(--side-mg);
        padding-right: var(--side-mg);
    }
    .grid-ref-client{
        grid-template-columns: repeat(1, 1fr);
        grid-gap: 15px;
    }
    .grid-ref-client>div{
        margin-bottom: 0;
    }
    .grid-ref-client>div:last-of-type{
        margin-bottom: 40px;
    }
    .galerie-ref{
        margin-top: calc(var(--up-mg) / 2);
        grid-template-columns: repeat(1, 1fr);
        grid-gap: 15px;
    }
    .galerie-ref img {
        height: 84.7vw;
    }
    .line-base {
        width: 100px;
        height: 3px;
    }
    p, li {
        font-size: 18px;
        line-height: 28px;
    }
    .txt li{
        padding-left: 25px;
    }
    .txt li::after{
        height: 7px;
        width: 7px;
        left: 5px;
        top: 9px;
    }
    .grid-ref-client span {
        margin-bottom: 4px;
        font-size: 14px;
    }
    .other-society{
        display: none;
    }
    .pomzed-badaboum {
        width: 120px;
    }
    #copyright{
        font-size: 11px;
    }
    .flex-ft a, .flex-ft p{
        font-size: 18px;
        line-height: 28px;
    }
    h1{
        margin-bottom: 20px;
    }
    h1 br, h2 br {
        display: none;
    }
    h2, .h2 {
        font-size: 30px;
    }
    .lt-h2 {
        font-size: 15px;
        margin-bottom: 8px;
    }
    h3, .h3 {
        font-size: 22px;
        line-height: 26px;
    }
    .date{
        font-size: 20px;
        line-height: 28px;
    }
    .historique>div>div>div:not(:last-of-type){
        margin-bottom: 15px;
    }
    .grid-contact{
        grid-template-columns: 1fr;
    }
    .contact-form input{
        padding: 10px 0;
    }
    .page-template-template-services .img-first{
        display: none;
    }
    .page-template-template-services .bloc-service{
        padding: 0;
        border: 0;
    }
    .page-template-template-services .bloc-service img{
        display: none;
    }
}