


@media (max-width: 1590px) {
    .vert_en_avant {
        font-size: 32px;
    }
}


@media (max-width: 1500px) {

    .liens_cibles {
        gap: 50px 29px;
    }

    .liens_cibles .btn_plein {
        font-size: 28px;
    }


    .avantages .avantage:nth-of-type(2){
        top: auto;
        bottom: 84%;
        left: 60%;
    }

    .avantages .avantage:nth-of-type(4) {
        top: 80%;
        bottom: auto;
    }

    .vert_en_avant {
        font-size: 26px;
    }
}

@media (max-width: 1300px) {

    .liens_cibles {
        gap: 40px 29px;
    }

    .liens_cibles .btn_plein {
        font-size: 24px;
    }

    .vert_en_avant {
        font-size: 22px;
    }
}


@media (max-width: 1150px){


    .avantages .avantage:nth-of-type(2){
        top: auto;
        bottom: 84%;
        left: 60%;
    }


    .liens_cibles {
        gap: 34px 29px;
    }

    .liens_cibles .btn_plein {
        font-size: 20px;
        padding: 14px 30px 12px;
    }

    .vert_en_avant {
        font-size: 21px;
    }


    #footer .bonhomme{
        position: absolute;
        max-width: 656px !important;
        width: 60vw;
        bottom: 170px;
        left: auto;
        right: 0;
        transform: translateX(0%);

    }

    #footer.with_homme .ronds_classique{
        margin-bottom: 20vw;
    }

}

@media (max-width: 1100px){

    /* header */

    #menu>#main-menu-container {
        background: var(--Blanc);
        overflow: hidden;
        /*align-items: flex-start;*/
        padding: 0 var(--side-base);
    }

    #close-bar1, #close-bar2, #close-bar3 {
        background-color: var(--Noir);
        border-radius: 10px;
    }

    #menu .menu {
        display: flex;
        justify-content: flex-end;
        align-items: flex-start;
        height: 100%;
    }

    #menu .menu>li>a {
        border-left: 0px solid rgba(255, 255, 255, 0);
        margin-left: 0;
        padding-left: 0;
        padding-top: 20px;
        padding-bottom: 20px;
    }

    #menu .menu>li>a::after {
        display: none;
    }

    /****************/

    .cibles {
        column-count: 1;
    }

    .gril_col_2 {
        grid-template-columns: repeat(1, 1fr);
    }

    .rupture>a {
        grid-area: 1 span / 1 span;
    }

    .vert_en_avant{
        margin-top: var(--ltspace);
    }

    .rect_rondi {
        width: 100%;
    }

    .img_deplace{
        grid-area: 4 / 1;
    }

    .gril_col_2 .rond {
        width: 40vw;
        bottom: 20%;
        right: 20vw;
    }

    .rupture .rond {
        width: 34vw;
        bottom: auto;
        top: -15%;
        right: 28vw;
    }

    .descriptions {
        grid-template-columns: 1fr;
    }

    .descriptions>div{
        max-width: 650px;
    }

    .descriptions>div:last-child {
        margin-top: 0;
        margin-left: auto;
        margin-right: 0;
    }


    .avantages .avantage:nth-of-type(4){
        top: 80%;
        bottom: auto;
        left: auto;
        right: 22%;
    }

    .vert_en_avant {
        font-size: 35px;
    }

}



@media (max-width: 1000px){
    .liens_cibles {
        gap: 30px 20px;
    }

    .liens_cibles .btn_plein {
        font-size: 16px;
        padding: 14px 28px 12px;
    }
}

@media (max-width: 900px){

    .section_histoire {
        flex-direction: column-reverse;
    }

    .section_histoire>div:last-of-type, .section_histoire>div:first-of-type {
        width: auto;
    }

    .section_histoire>div:last-of-type{
        margin-bottom: var(--ltspace);
    }

    .liste_cible>div {
        align-items: flex-end;
        gap: 0;
        flex-direction: column;
    }

    .btn_cible {
        width: 110px;
        margin-top: 0;
    }

    .btn_cible>svg {
        width: 60px;
    }

    .btn_cible  {
        margin: 20px auto 0 auto;
    }
}


@media (max-width: 800px){

    .meubles {
        flex-direction: column;
    }

    .meubles img{
        object-fit: contain;
        height: 60vw;
        margin-left: auto;
        margin-right: auto;
        display: flex;
    }

    /*.meubles pic*/


    .avantages .avantage:nth-of-type(3){
        top: 35%;
        left: auto;
        right: 60%;
    }


    .liens_cibles {
        flex-wrap: nowrap;
        justify-content: flex-start;
        overflow: auto;
        padding-bottom: 10px;
        margin-bottom: var(--small-margin);
    }


    .liens_cibles::-webkit-scrollbar {
        height: 3px;              /* épaisseur de la scrollbar horizontale */
    }

    /* Track (fond) */
    .liens_cibles::-webkit-scrollbar-track {
        background: var(--Blanc);       /* couleur du fond */
        border-radius: 6px;
    }

    /* Handle (curseur) */
    .liens_cibles::-webkit-scrollbar-thumb {
        background: #72837c;           /* couleur du curseur */
        border-radius: 6px;
        cursor: pointer;
    }

    /* Au survol du handle */
    .liens_cibles::-webkit-scrollbar-thumb:hover {
        background: var(--Blanc);
    }


    .liens_cibles .btn_plein {
        white-space: nowrap;
        /*font-size: 16px;*/
        /*padding: 14px 28px 12px;*/
    }

    .vert_en_avant {
        font-size: 30px;
    }


    #footer .bonhomme{
       display: none;
    }

}

@media (max-width: 700px){
    :root {
        /*--small-margin: 40px;*/
        /*--medium-margin: 70px;*/
        /*--ltspace: 60px;*/
        /*--tinyspace: 115px;*/
        --mdspace: 110px;
        /*--bigspace: 180px;*/
        /*--side-base: 7vw;*/

        --big-radius: 60px;
        /*--border-radius: 49px;*/
        /*--btn-radius: 28px;*/
    }


    *, #footer {
        font-size: 18px;
    }

    h1{
        font-size: 50px;
    }

    h2{
        font-size: 34px;
    }

    .intro, .vert_en_avant {
        font-size: 21px;
    }

    .btn {
        font-size: 18px;
    }

    #header {
        padding-top: 40px;
    }

    #header #logo-container img, .menu-toggled #header.top_home #logo-container img {
        /*top: 40px;*/
    }

    #site-title #logo-container {
        height: 66px;
    }

    #header #logo-container img, #site-title #logo-container {
        width: 70px;
    }

    #site-title .screen-reader-text {
        font-size: 21px;
    }

    .titre_intro {
        padding-top: 260px;
    }

    #site-title>a {
        gap: 8px;
    }

    #header.top_home #logo-container img {
        transform: translateX(calc(50vw - 50% - var(--side-base))) translateY(201px) scale(2.7);
    }

    .vert_en_avant {
        padding: 32px 28px
    }


    .btn_contact {
        margin-top: 16px;
        width: 180px;
        height: 180px;
    }

    .btn_contact svg{
        width: 60px;
    }


    .header-edit-link {
        right: 5px;
    }

    .rupture .rond, .gril_col_2 .rond, .accueil_1>.rond:last-of-type {
        display: none;
    }

    .page-template-page-a-propos-php .ronds_classique {
        margin-top: var(--ltspace);
        margin-bottom: var(--ltspace);
    }

    .ronds_accueil {
        margin-top: var(--ltspace);
        margin-bottom: var(--ltspace);
    }

    .page-template-page-contact-php .avantages {
        display: flex;
        flex-direction: column;
    }

    #site-title-footer>a>span{
        font-size: 26px;
    }

    #site-title-footer>a>img {
        width: 90px;
    }

    #site-title-footer>a {
        gap: 16px;
    }

    #footer {
        gap: 0 40px;
    }


    .classique_page{
        padding-top: 200px;
    }


    .home #content{
        overflow: hidden;
    }

    .home .avantages>div:first-of-type {
        flex-direction: column;
    }

    .home .avantages>div:first-of-type {
        grid-area: 1 / 1;
        align-items: flex-start;
        min-height: 512px;
        height: 100vw;
        justify-content: space-evenly;
    }

    .home .avantages .homme_debout {
        grid-area: 1 / 1;
        position: absolute;
        z-index: 5;
        max-width: 1060px !important;
        width: 120vw;
        min-width: 600px;
        right: 0;
        margin: auto 0 auto auto;
        transform: translateX(46%);
    }

    .home .avantages>div:first-of-type picture:first-of-type img {
        margin-top: 100px;
    }

    .home .avantages>div img{
        height: 28vw;
        min-height: 120px;
    }

    .home .avantages>div:first-of-type picture:last-of-type img{
        margin-bottom: 60px;
    }

    .home .avantages {
        margin-top: var(--small-margin);
    }


    .avantages .avantage>span{
        font-size: 13px;
        max-width: 100px;
    }

    .avantages .avantage>div {
        height: 40px;
    }


    .avantages .avantage:nth-of-type(2) {
        top: auto;
        bottom: 84%;
        left: 20%;
    }

    .avantages .avantage:nth-of-type(3) {
        top: 47%;
        left: auto;
        right: 30%;
    }

    .avantages .avantage:nth-of-type(4) {
        top: 85%;
        bottom: auto;
        left: auto;
        right: 50%;
    }

    .infos_footer a{
        padding: 6px 0;
    }

    .infos_footer a:first-of-type{
        padding-top: 20px;
    }

    .infos_footer a:last-of-type{
        padding-bottom: 20px;
    }
}

@media (max-width: 500px){

    :root {
        /*--small-margin: 40px;*/
        /*--medium-margin: 70px;*/
        /*--ltspace: 30px;*/
        /*--tinyspace: 115px;*/
        /*--mdspace: 130px;*/
        /*--bigspace: 180px;*/
        /*--side-base: 7vw;*/

        --big-radius: 40px;
        /*--border-radius: 49px;*/
        /*--btn-radius: 28px;*/
    }

    .section_histoire>div {
        gap: 30px;
    }

    .vert_en_avant {
        font-size: 18px;
        padding: 30px 23px;
    }

    .page-template-page-contact-php .avantages {
        gap: 40px;
    }

    .page-template-page-contact-php .avantages>div:first-of-type {
        flex-direction: column;
        gap: 25px;
    }

    .descriptions .btn_plus {
        margin: 4px auto 8px auto;
    }


    #footer {
        grid-template-columns: 1fr;
    }

    #footer .ronds_classique, #copyright{
        grid-area: 1 span / 1 span;
    }

    #footer .infos_footer{
        margin-top: 20px;
    }
}


@media (max-width: 400px){
    h2{
        font-size: 28px;
    }

    .vert_en_avant {
        font-size: 16px;
        padding: 30px 20px;
    }
}
