/***************************************************************************/
/* Vars                                                                    */
/***************************************************************************/

/* Ecrans moyens */
@media (min-width: 992px) and (max-width: 1600px) {
    /*
    :root {
    }
    */

    #banner h1 {
        font-size: calc(.7 * var(--font-size-xx-large));
    }

    #banner h1 p{
        margin-bottom: 1rem;
    }

    .banner__texte{
        font-size: var(--font-size-large);
    }

    .wp-block-media-text p + p {
        line-height: 1.5;
    }

    #main-container h2{
        font-size: calc(.8 * var(--font-size-xx-large));
    }

    #main-container .wp-block-media-text__content {
        padding: 2vw;
    }

    #main-container .wp-block-media-text__content h2{
        font-size: var(--font-size-large);
        margin-bottom: 1rem;
    }

    #main-container .wp-block-media-text em{
        font-size: var(--font-size-small);
    }

    #main-container .post-extrait .entry-content p,
    #banner .banner--projet__element--text p
    {
        line-height: 1.2;
    }

    :where(.wp-block-columns.has-background){
        padding-top: 3rem;
        padding-bottom: 3rem;
    }

    .cible::after {
        right: 3rem;
    }

}

@media (min-width: 992px) and (max-width: 1200px) {

    #banner h1 {
        font-size: calc(.6 * var(--font-size-xx-large));
    }

    #main-container .membre__element h2 {
      margin-top: 6rem;
    }

    .header__rs {
        width: 4rem;
    }

    #main-container .post-extrait h2 {
        margin: 2rem 0;
        line-height: 0.6;
    }

    .wp-block-spacer{
        max-height: 8rem;
    }

    .wp-block-column .wp-block-spacer{
        max-height: 2rem;
    }

    #croix{
        right: -10rem;
    }

    #main-container h2 {
        font-size: calc(.7 * var(--font-size-xx-large));
        max-width: 50vw;
    }

}



/* Tablettes et Smartphones */
@media (max-width: 991px) {
    
    :root {
        --font-size-menu-principal: var(var(--font-size-x-large));
    }
    

    #header-mobile{
        background-color: var(--couleur-4);
    }

    #burger-button>svg .line {
        fill: none;
        stroke: #fff;
    }

    #container-menu-mobile{
        justify-content: center;
    }

    #container-menu-mobile .container-menu .menu>li>a{
        font-size: var(--font-size-xx-large);
        color: var(--couleur-6);
    }

    #container-menu-mobile .container-menu--secondary .menu>li {
        margin-top: 1rem;
    }

    #container-menu-mobile{
        background-color: var(--couleur-4);
    }

    /* #container-menu-mobile .container-menu--secondary{
        padding-left: 0;
    } */
    
    #banner {
        background-color: var(--couleur-1);
        color: var(--couleur-6);
        margin-top: 0;
        padding: var(--header-height) 5vw 10vh 5vw;
        height: auto;
    }

    .banner__element--content {
        width: 100%;
        padding-top: 3vw;
    }

    .banner__element--image {
        width: 100%;
        padding-top: 10vw;
    }

    .banner__element--image {
        transform: none;
        width: 60vw;
        margin: auto;
    }

    #container-header-mobile {
        padding: 0 .4rem;
    }

    body.single #main-container .entry-content :where( .wp-block-heading, p, .wp-block-gallery, .wp-block-quote, ) {
        padding-left: 0;
    }

    article.post-extrait .wp-block-button {
        position: static;
        margin: auto;
        margin-top: 2rem;
    }

    footer#colophon {
        height: fit-content;
        align-items: center;
        justify-content: center;
    }

    #colophon .block-logo {
        width: 100%;
        margin-top: 0;
    }

    .footer-container {
        align-items: center;
        justify-content: center;
    }

    .block-footer-menu ul.menu > li > a {
        font-size: var(--font-size-large);
    }

    .block-footer-menu ul.menu > li {
        margin-right: 0;
    }

    .block-reseaux-sociaux > ul {
        justify-content: center;
    }

    .block-reseaux-sociaux>ul>li>a {
        width: 6rem;
        height: 6rem;
        margin: 3rem 0;
    }

    #menu-menu-footer {
        max-height: none;
        align-items: center;
        justify-content: center;
    } 

    .block-footer-menu {
        margin-left: 0;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    #main-container figure.wp-block-gallery{
        min-width: 0;
        width: 100%;
        margin: 0 auto;
    }

    figure.wp-block-image{
        min-width: 100%;
        margin: 0 auto;
    }

    #main-container h2, #colophon h2 {
        font-size: calc(5 / 6 * var(--font-size-xx-large));
    }

    #colophon .pre-footer > *{
        flex-direction: column;
    }

    #colophon .pre-footer figure{
        display: none;
    }

    .pre-footer__contacts {
        width: 100%;
    }

    .pre-footer__logo {
        transform: none;
        margin: auto;
    }

    .footer-container, .footer-sub-container {
        height: fit-content;
    }

    .pre-footer__element--infos {
        padding-bottom: 4rem;
    }

    .wp-block-spacer{
        max-height: 5vw;
    }

    #croix{
        display: none;
    }

    .cible::after {
        display: none;
    }

    :root{
        --home-gallery-width: 50vw;
    }

    body.home #travail .wp-block-gallery .wp-block-image{
        margin: auto;
        max-width: var(--home-gallery-width);
        min-width: var(--home-gallery-width);
        max-height: var(--home-gallery-width);
        min-height: var(--home-gallery-width);
    }

    #main-container #travail figure.wp-block-gallery > figure.wp-block-image img{
        width: 60%;
        height: 60%;
        object-fit: contain;
    }

    #main-container .wp-block-media-text > * {
        width: 100%;
    }

    #main-container .wp-block-media-text:nth-child(even) {
        flex-direction: column-reverse;
    }

    #lampe{
        display: none;
    }

    :where(.archive,.blog) .post-thumbnail {
        width: 64vw;
        height: 64vw;
    }

    body.single .banner--projet__element--image .post-thumbnail {
        width: 60vw;
        height: 100%;
    }

    #banner.banner--projet {
        margin: 8rem auto 0 auto;
    }

    .display-grid > article.post-extrait{
        width: 80vw;
    }

    body.single .related-posts .post-thumbnail{
        width: 100%;
        height: 80vw;
    }

    .related-posts .display-grid {
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }

    .banner--projet__element--text{
        padding-bottom: 4rem;
    }

    body.single-projet #main-container h2.wp-block-heading{
        margin-top: 4rem;
    }

}

/* Tablettes */
@media (min-width: 768px) and (max-width: 991px) {
    /*
    :root {
    }
    */
}

/* Smartphones */
@media (max-width: 767px) {
    
    :root {
        --font-size-base: .8rem;
        --expertise-picto-width: 40vw;
                --home-gallery-width: 80vw;
    }
    

    .fond-chargement svg {
        width: 60vw;
        max-height: none;
    }
    
    #menu-menu-footer {
        flex-direction: column;
        margin-top: 4rem;
    }
    
    #colophon *{
        flex-direction: column;
    }

    #banner h1 {
        font-size: calc(3 / 5 * var(--font-size-xx-large));
    }

    .container-content {
        padding-top: 2rem;
    }

    .banner__texte {
        font-size: var(--font-size-large);
    }

    .pre-footer__logo{
        max-width: 80vw;
    }
    
    .pre-footer__logo svg{
        width: 100%;
        height: auto;
    }

    .pre-footer__membre{
        margin-top: 2rem;
    }

    .wp-block-heading.has-text-align-center{
        text-align: left;
    }

    #main-container h2, #colophon h2 {
        font-size: calc(4 / 6 * var(--font-size-xx-large));
    }

    #banner.banner--contact{
        padding: 0rem;
    }

    #banner.banner--contact *{
        position: static;
    }
    
    .banner--contact .banner__element--image {
        width: 100vw;
        margin: 0 auto;
        transform: none;
        height: auto;
    }

    .banner__element--infos {
        width: 100%;
        transform: none;
    }

    .banner--contact .banner__element--content {
        width: 100vw;
        padding: 2rem;
    }

    form.wpcf7-form {
        margin-top: 0rem;
    }

    .page-template-page-contact .pre-footer__accroche p {
        width: 90vw;
        float: none;
    }

    .page-template-page-contact .container-content--contact {
        padding-top: 0;
        padding-bottom: 0;
    }

    .page-template-page-contact .pre-footer__accroche p {
        width: 100%;
    }

    #banner.banner--projet {
        padding: 0;
    }

    body.single .banner--projet__element--image .post-thumbnail {
        width: 80vw;
        height: 100%;
    }

}

/* Petit Smartphones */
@media (max-width: 540px) {
    /*
    :root {
    }
    */
}

/***************************************************************************/
/* Layout                                                                  */
/***************************************************************************/

/* Ecrans moyens */
@media (min-width: 992px) and (max-width: 1600px) {}

/* Tablettes et Smartphones */
@media (max-width: 991px) {}

/* Tablettes */
@media (min-width: 768px) and (max-width: 991px) {}

/* Smartphones */
@media (max-width: 767px) {}

/* Petit Smartphones */
@media (max-width: 540px) {}


/***************************************************************************/
/* Boutons                                                                 */
/***************************************************************************/

/* Ecrans moyens */
@media (min-width: 992px) and (max-width: 1600px) {}

/* Tablettes et Smartphones */
@media (max-width: 991px) {}

/* Tablettes */
@media (min-width: 768px) and (max-width: 991px) {}

/* Smartphones */
@media (max-width: 767px) {}

/* Petit Smartphones */
@media (max-width: 540px) {}


/***************************************************************************/
/* Forms                                                                 */
/***************************************************************************/

/* Ecrans moyens */
@media (min-width: 992px) and (max-width: 1600px) {}

/* Tablettes et Smartphones */
@media (max-width: 991px) {}

/* Tablettes */
@media (min-width: 768px) and (max-width: 991px) {}

/* Smartphones */
@media (max-width: 767px) {}

/* Petit Smartphones */
@media (max-width: 540px) {}