/*
Theme Name: Thème Trëma
Theme URI: 
Description: Thème sur mesure et éco-conçu développé par le studio Trëma
Version: 1.0
Author: Loïc Bocquier-Ancelin
Author URI: https://tremagency.com
Tags: Sur mesure, éco-conçu, perfomances
*/
.aiowps-site-lockout-box{
    border:none
}
@media (min-width:0){
    .topnav a,h1.wp-block-heading,h1.wp-block-heading span{
        text-align:center
    }
    strong,b{
        font-weight:600
    }
    .uagb-tabs__wrap.uagb-tabs__vstyle6-tablet ul.uagb-tabs__panel,header{
        max-width:100%
    }
    a{
        position:relative;
        transition:.3s cubic-bezier(.2,.54,.79,1.24)
    }
    .topnav,header{
        position:fixed
    }
    a:active,a:focus,a:hover{
        color:var(--tertiary);
        transition:.3s cubic-bezier(.2,.54,.79,1.24)
    }
    a::after{
        position:absolute;
        content:'';
        width:25%;
        height:.063rem;
        bottom:-.188rem;
        left:0;
        background:var(--tertiary);
        transition:.3s cubic-bezier(.2,.54,.79,1.24)
    }
    a:active::after,a:active::before,a:focus::after,a:focus::before,a:hover::after,a:hover::before{
        width:100%;
        transition:.3s cubic-bezier(.2,.54,.79,1.24)
    }
    a.button,a.btn-tertiary::after,a.btn-tertiary::before,a.nofx::after,a.nofx::before{
        position:absolute;
        content:none;
        width:0;
        height:0;
        background:0 0
    }
    a.btn-primary::after,a.btn-primary::before,a.btn-secondary::after,a.btn-secondary::before{
        background:none
    }
    .topnav,.topnav ul{
        transition:.5s cubic-bezier(.47,.07,1,.83)
    }
    h1.wp-block-heading{
        line-height:2.25rem
    }
    header{
        width:100%;
        height:3.75rem;
        height:fit-content;
        padding:.625rem .985rem;
        background:var(--primary);
        z-index:10
    }
    .lo{
        width:3.125rem;
        height:3.75rem
    }
    .main-nav .topnav ul{
        flex-direction:column
    }
    .topnav{
        width:100%;
        height:0;
        left:0;
        top:5rem;
        background:#4C9397C4;
        opacity:0;
        overflow:hidden;
        z-index:1;
        clip-path: polygon(100% 0, 100% 90%, 50% 100%, 0 90%, 0 0);
        transition-delay:.2s
    }
    .topnav ul{
        position:absolute;
        width:100%;
        height:100%;
        top:-100%;
        padding-top:.938rem;
        justify-content:flex-start;
        background-color:var(--primary);
        clip-path: polygon(100% 0, 100% 90%, 50% 100%, 0 90%, 0 0);
        opacity:0
    }
    .topnav a{
        padding:.938rem;
        display:flex;
        justify-content:space-between;
        border-bottom: 1px solid var(--tertiary);
        text-align:left;
        color:var(--white);
        text-decoration:none
    }
    .topnav a::after{
        width:0;
        height:0;
        background:none
    }
    .topnav.responsive{
        height:100%;
        opacity:1;
        transition:.3s cubic-bezier(.17,.67,.76,.98)
    }
    .topnav.responsive ul{
        top:0;
        border-top: 1px solid var(--tertiary);
        opacity:1;
        transition:.7s cubic-bezier(.17,.67,.76,.98) .3s
    }
    /*    .topnav.responsive a{
            padding:.938rem;
            display:flex;
            justify-content:space-between;
            border-bottom: 1px solid var(--tertiary);
            text-align:left
        }*/
    /*    .active{
            background-color:#04aa6d;
            color:#fff
        }*/
    .topnav ul li[class*=current-menu-]>a{
        color:var(--white);
        font-weight:900;
        border-color: var(--white);
        border-width:2px
    }
    /*    .topnav ul li[class*=current-menu-]>a::after{
            position:absolute;
            content:'';
            width:100%;
            height:.063rem;
            left:0;
            right:auto;
            background:var(--tertiary);
            transition:.3s cubic-bezier(.2,.54,.79,1.24)
        }*/
    .burger-anim{
        width:2.5rem;
        height:2rem;
        cursor:pointer
    }
    .burger-anim span,.burger-anim span::before,.burger-anim span::after {
        background:var(--white);
        content:'';
        position:absolute;
        width:2.5rem;
        height:.125rem;
        margin-top:.813rem;
        transition:.3s cubic-bezier(.2,.54,.79,1.24)
    }
    .burger-anim span::before {
        margin-top:-12px;
    }
    .burger-anim span::after {
        margin-top:12px;
    }
    .burger-anim.active span {
        background: transparent;
        transition:.3s cubic-bezier(.2,.54,.79,1.24);
        transform:rotate(-90deg);
    }
    .burger-anim.active span::before {
        margin-top:0;
        transform:rotate(-45deg);
        transition-delay:.5s
    }
    .burger-anim.active span::after {
        margin-top:0;
        transform: rotate(45deg);
        transition-delay:.5s
    }
    .contact-box{
        width:100%;
        padding:0 .938rem;
        flex-direction:row;
        gap:.313rem;
        top:auto;
        right:0;
        bottom:0
    }
    .contact-box section{
        width:100%;
        padding:.313rem 0 0;
        border:.063rem solid #fff;
        border-bottom:none
    }
    ::backdrop{
        position:fixed;
        background:var(--primary);
        opacity:.75;
        mix-blend-mode:multiply
    }
    dialog.modal-form{
        width:100%;
        height:100%;
        margin:auto;
        padding:1.25rem;
        border:none;
        overflow-y:scroll;
        scrollbar-width:none;
        background-color:var(--white)
    }
    dialog.modal-form::-webkit-scrollbar{
        display:none
    }
    dialog[open]{
        opacity:1;
        animation:.7s cubic-bezier(.17,.67,.76,.98) modalanimopen
    }
    @keyframes modalanimopen{
        from{
            top:-62.5rem;
            opacity:0
        }
        to{
            top:0;
            opacity:1
        }
    }
    main{
        padding-top:5rem
    }
    .home-padding{
        padding-top:0
    }
    .wp-block-image.nodrop figure img{
        filter:none
    }
    .pict-id>figure{
        position:relative;
        transform: rotate(-7deg);
        padding: .625rem .625rem 3.75rem .625rem;
        background: var(--light_white);
        box-shadow: var(--shadow),var(--med_shadow),var(--deep_shadow)
    }
    .pict-id>figure::before{
        position:absolute;
        content:'';
        width:1.875rem;
        height:2.188rem;
        top:-.938rem;
        left:45%;
        clip-path: polygon(50% 0%, 73% 10%, 73% 10%, 100% 0, 100% 100%, 79% 91%, 48% 100%, 21% 91%, 0 100%, 0 0, 22% 8%);
        background: #4C9397;
        background:linear-gradient(0deg,rgba(76, 147, 151, 0.12) 40%, rgba(255, 255, 255, 1) 50%, rgba(76, 147, 151, 0.25) 55%, rgba(255, 255, 255, 1) 60%, rgba(76, 147, 151, 0.12) 100%);
        mix-blend-mode:multiply;
    }
    .heading{
        position:relative;
        height:10.938rem;
        padding:.625rem 0;
        background:none;
        border-bottom:1px solid var(--primary);
        z-index:1
    }
    .thumb{
        background-color:var(--light_white)
    }
    .thumb img,.thumb svg{
        opacity:.1;
        object-fit:cover;
        object-position:center
    }
    .projects{
        row-gap:.938rem
    }
    .post-img{
        height:17.5rem;
        display: block;
        overflow: hidden
    }
    .post-img img{
        width:100%;
        height:100%;
        object-fit:cover;
        object-position:center
    }
    .post-img h3{
        bottom:.625rem;
        left:.625rem
    }
    .post-categ{
        top:.625rem;
        left:0;
        z-index:1
    }
    .post-categ span{
        width: fit-content;
        padding:0 .313rem;
        color: var(--white);
        font-weight:400;
        font-size:.875rem;
        background-color: var(--tertiary)
    }
    .accordion .open-accordion{
        cursor: pointer;
    }
    .accordion .open-accordion .plus{
        width: 2.5rem;
        height: 2.5rem;
        padding: 0 .188rem .188rem 0;
        bottom: 0;
        right: 0;
        cursor: pointer;
        clip-path: polygon(100% 0, 0% 100%, 100% 100%);
        transition: .3s cubic-bezier(.47,.07,1,.83)
    }
    .accordion .open-accordion:hover .plus,.accordion .open .plus{
        background-color: var(--secondary);
        color: var(--white) !important;
        transition: .3s cubic-bezier(.17,.67,.76,.98)
    }
    .accordion .accordion-info{
        display: none;
    }
    .accordion .accordion-info p{
        text-align:left
    }
    .exc p{
        font-size:.875rem
    }
    .clipath-box{
        clip-path: polygon(100% 0, 100% 90%, 50% 100%, 0 90%, 0 0)
    }
    .oblique-box{
        transform:rotate(-5deg) skew(-5deg)
    }
    .oblique-box>.wp-block-columns,.oblique-box>.wp-block-uagb-container{
        transform:rotate(5deg) skew(5deg)
    }
    .contact-main>div{
        flex-direction:column-reverse!important
    }
    .skin-roadjob .wp-block-columns,.skin-about .wp-block-columns{
        position:relative;
    }
    .skin-about .wp-block-columns::after{
        background:url('/wp-content/themes/trema/assets/img/conception_web_et_graphisme-loic_bocquier-ancelin-section_a_propos.svg') 50%;
        right:0
    }
    .skin-roadjob .wp-block-columns::after{
        background:url('/wp-content/themes/trema/assets/img/conception_web_et_graphisme-loic_bocquier-ancelin-section_parcours.svg') 50%;
        left:0
    }
    .skin-roadjob .wp-block-columns::after,.skin-about .wp-block-columns::after{
        position:absolute;
        content:'';
        width:100%;
        height:100%;
        top:0;
        opacity:.12;
        z-index:0;
        background-repeat:no-repeat;
        background-position:center;
        background-size:contain;
        mix-blend-mode:multiply
    }
    .wpcf7 form .wpcf7-response-output{
        margin:1.25rem auto;
        padding:.938rem;
        border:3px solid var(--secondary);
        color:var(--primary);
        text-align:center;
        font-weight:600;
        border-radius:.313rem
    }
    .wpcf7 form.invalid .wpcf7-response-output,.wpcf7 form.payment-required .wpcf7-response-output,.wpcf7 form.unaccepted .wpcf7-response-output{
        border-color:#ffb900;
        background-color:#ffb90021
    }
    .wpcf7 form.sent .wpcf7-response-output{
        border-color:var(--tertiary);
        background:rgba(94,172,158,.25)
    }
    .wpcf7-form-control-wrap{
        display:flex;
        flex-direction:column-reverse
    }
    .wpcf7-not-valid-tip{
        color:var(--red);
        font-size:.938rem;
        font-weight:500
    }
    .wpcf7-spinner{
        position: absolute;
        left: 43.5%;
        bottom: -2.5rem;
        background-color:var(--tertiary);
        opacity:1;
        margin:0
    }
    .wpcf7-list-item{
        margin:0 0 0 .938rem
    }
    .wpcf7-checkbox label,.wpcf7-radio label{
        display:flex;
        align-items:center;
        font-weight:500
    }
    .wpcf7-checkbox label input,.wpcf7-radio label input{
        margin-left:.625rem
    }
    .consent-box .wpcf7-list-item{
        margin-left:0
    }
    .consent-box .wpcf7-list-item-label{
        line-height:1.5rem!important
    }
    .wpcf7-checkbox{
        display:flex;
        flex-direction:column
    }
    .uagb-tabs__wrap.uagb-tabs__hstyle1-desktop ul.uagb-tabs__panel{
        width:100%;
        margin:0 auto;
        justify-content:center;
        border-bottom:1px solid var(--primary)
    }
    .uagb-tabs__wrap.uagb-tabs__hstyle1-desktop .uagb-tab{
        width:100%;
        margin:0!important;
        padding:0
    }
    .uagb-tabs__wrap.uagb-tabs__hstyle1-desktop .uagb-tab::before{
        content:'';
        width:0;
        height:0;
        border-radius:0;
        background:0 0;
        padding:0
    }
    .uagb-tabs__wrap ul.uagb-tabs__panel li.uagb-tab a{
        display:block
    }
    .uagb-tabs__wrap .uagb-tabs__body-container{
        padding:.938rem 0 0
    }
    .uagb-tabs__wrap.uagb-tabs__vstyle6-tablet{
        flex-direction:column
    }
    .cust-rad-chkbx [type=checkbox],.cust-rad-chkbx [type=radio],.wpcf7-list-item [type=checkbox],.wpcf7-list-item [type=radio]{
        position:absolute;
        left:-9999px
    }
    .cust-rad-chkbx [type=checkbox]+.wpcf7-list-item-label,.cust-rad-chkbx [type=radio]+.wpcf7-list-item-label{
        position:relative;
        padding-left:30px;
        line-height:20px
    }
    .cust-rad-chkbx [type=checkbox]+.wpcf7-list-item-label::after,.cust-rad-chkbx [type=checkbox]+.wpcf7-list-item-label::before,.cust-rad-chkbx [type=radio]+.wpcf7-list-item-label::after,.cust-rad-chkbx [type=radio]+.wpcf7-list-item-label::before{
        content:'';
        position:absolute;
        box-sizing:border-box
    }
    .cust-rad-chkbx [type=radio]+.wpcf7-list-item-label::after,.cust-rad-chkbx [type=radio]+.wpcf7-list-item-label::before{
        border-radius:50%
    }
    .cust-rad-chkbx [type=checkbox]+.wpcf7-list-item-label::before,.cust-rad-chkbx [type=radio]+.wpcf7-list-item-label::before,dialog .consent-box [type=checkbox]+.wpcf7-list-item-label::before{
        top:0!important;
        left:0;
        width:1.25rem;
        height:1.25rem;
        background:var(--light_white);
        border:2px solid var(--primary)
    }
    /*    .consent-box [type=checkbox]+.wpcf7-list-item-label::before{
            top:.313rem!important
        }*/
    .cust-rad-chkbx [type=checkbox]+.wpcf7-list-item-label::after,.cust-rad-chkbx [type=radio]+.wpcf7-list-item-label::after,dialog .consent-box [type=checkbox]+.wpcf7-list-item-label::after{
        top:4px!important;
        left:4px;
        width:12px;
        height:12px;
        background:var(--tertiary);
        transition:.5s cubic-bezier(.47,.07,1,.83)
    }
    /*    .consent-box [type=checkbox]+.wpcf7-list-item-label::after{
            top:.569rem!important
        }*/
    .cust-rad-chkbx [type=checkbox]:not(:checked)+.wpcf7-list-item-label::after,.cust-rad-chkbx [type=radio]:not(:checked)+.wpcf7-list-item-label::after{
        opacity:0;
        transform:scale(.01);
        transition:.3s cubic-bezier(.17,.67,.76,.98)
    }
    .cust-rad-chkbx [type=checkbox]:checked+.wpcf7-list-item-label::after,.cust-rad-chkbx [type=radio]:checked+.wpcf7-list-item-label::after{
        opacity:1;
        transform:scale(1);
        transition:.3s cubic-bezier(.17,.67,.76,.98)
    }
    .cust-rad-chkbx [type=checkbox]:focus+.wpcf7-list-item-label::before,.cust-rad-chkbx [type=radio]:focus+.wpcf7-list-item-label::before{
        border:2px solid var(--secondary)
    }
    .input-box{
        flex-wrap:wrap
    }
    .input-box label{
        width:100%
    }
    .grecaptcha-badge{
        display:none!important
    }
    /*    .page-id-33 .grecaptcha-badge{
            display:block!important
        }*/
    .pfg-lightbox {
        --pfg-lb-bg:#42210bd4!important;
        background:#42210bd4!important
    }
    .pfg-lightbox-counter{
        display:none
    }
    .pfg-lightbox-nav,.pfg-lightbox-close{
        border:.063rem solid white!important;
        background:var(--tertiary)!important;
        border-radius:0!important
    }
    .pfg-lightbox-nav svg {
        width:2.5rem!important;
        height:2.5rem!important;
        min-width:2.5rem;
        flex-shrink:0;
        stroke-width:.063rem
    }
    footer{
        background-color:var(--light_white)
    }
    footer>.container{
        gap:var(--gap20)
    }
    footer>section>div{
        margin-bottom:.938rem
    }
    footer>section>div:last-child{
        margin-bottom:0
    }
    .copy{
        padding-bottom:3.125rem
    }
    .page-id-33 .copy{
        padding-bottom:1.25rem
    }
    .forofor svg{
        width:75%;
        height:auto;
        margin:0 auto
    }
    .cky-revisit-bottom-left{
        bottom:4.188rem!important
    }
    .cky-btn-revisit-wrapper{
        border:1px solid #fff!important;
        background:var(--tertiary)!important
    }
    .cky-btn-revisit-wrapper .cky-btn-revisit img{
        filter:drop-shadow(-1px 0 0 var(--primary)) drop-shadow(1px 1px 0 var(--primary))
    }
    .uagb-block-250f3d8a.uagb-timeline__outer-wrap .uagb-timeline__events-inner-new{
        border:1px solid var(--primary)
    }
    .uagb-timeline__center-block .uagb-timeline__day-right .uagb-timeline__arrow::after,.uagb-timeline__day-left .uagb-timeline__arrow::after{
        border:none!important
    }
    .page-id-25 .spectra-image-gallery *{
        text-align:center
    }
    .page-id-25 .spectra-image-gallery__media-thumbnail--masonry {
        width:2.5rem
    }
}
@media (min-width:768px){
    .baseline{
        margin-left:6.875rem
    }
    .clipath-box{
        clip-path:polygon(0 0, 50% 0%, 100% 0, 100% 85%, 50% 100%, 0 85%)
    }
    /*    .thumb img,.thumb svg{
            width:50%
        }*/
}
@media (min-width:992px){
    header{
        position: fixed;
        padding:0;
        height:6.875rem;
        top:0;
        transition:.6s cubic-bezier(.09,.78,.52,1.24) .4s all
    }
    .home header{
        background:transparent
    }
    .home header .header-logo svg path{
        fill:var(--primary);
        transition:.2s cubic-bezier(.09,.78,.52,1.24) .2s all
    }
    /*    header::after{
            position:absolute;
            content:'';
            height:1px;
            width:100%;
            background:var(--tertiary);
            bottom:-1px;
            left: 0
        }*/
    .main-logo{
        position: relative;
        left: 31%;
        top:1.875rem;
        display: block;
        height: auto;
        transition: .4s ease-out all;
    }
    .logo-box{
        /*        width: 250px;
                height: 80px;
                display: flex;
                flex-wrap: wrap;
                justify-content: center;
                align-content: space-between;*/
    }
    .home .lo{
        position:relative;
        width:6.25rem;
        height:6.875rem;
        transition:.4s ease-in-out all
    }
    .lo{
        position:relative;
        transition:.6s ease-in-out all .4s
    }

    .baseline{
        position: absolute;
        top: 60px;
        opacity:1;
        transition: .6s ease-in-out .6s all;
    }
    /* RESIZE ANIMATION */
    header.resizer {
        height: 4.063rem;
        transition: .6s cubic-bezier(.09,.78,.52,1.24) .4s all
    }
    .home header.resizer {
        background:var(--primary)
    }
    .home header.resizer .header-logo svg path{
        fill:var(--white);
        transition:.6s cubic-bezier(.09,.78,.52,1.24) .3s all
    }
    header.page-header.resizer {
        height: 3.438rem;
        transition: .6s cubic-bezier(.09,.78,.52,1.24) .1s all
    }

    .resizer .main-logo{
        left: 0;
        top:0;
        transition: .3s ease-in-out
    }
    .resizer .lo{
        width:3.125rem;
        height: 2.813rem;
        top:0;
        transition: .6s ease-in-out all
    }

    .resizer .spots{
        top:44px;
        transition: .6s ease-in-out all .4s
    }
    .resizer .baseline{
        opacity: 0;
        transition: .2s ease-in-out all
    }

    /* Resize nav */
    .home .resizer nav ul li:nth-child(1){
        top: 0;
        transition: .5s cubic-bezier(0,.41,.68,1.32) .5s all
    }
    .home .resizer nav ul li:nth-child(2){
        top: 0;
        transition: .5s cubic-bezier(0,.41,.68,1.32) .6s all
    }
    .home .resizer nav ul li:nth-child(3){
        top: 0;
        transition: .5s cubic-bezier(0,.41,.68,1.32) .7s all
    }
    .home .resizer nav ul li:nth-child(4){
        left: 0;
        opacity:1;
        transition: .5s cubic-bezier(0,.41,.68,1.32) all;
        transition-delay: 1.7s;
    }
    .home .resizer nav ul li:nth-child(5){
        top: 0;
        transition: .5s cubic-bezier(0,.41,.68,1.32) .9s all
    }
    .topnav,.topnav ul{
        width:100%;
        background:0 0;
        opacity:1;
        position:relative
    }
    .topnav ul li,header{
        display:block
    }
    .topnav,.topnav ul,.topnav ul li a{
        position:relative
    }
    h1.wp-block-heading{
        line-height:3.125rem
    }
    h1.wp-block-heading span{
        text-align:right
    }
    @-webkit-keyframes animatetop{
        from{
            top:-300px;
            opacity:0
        }
        to{
            top:0;
            opacity:1
        }
    }
    .main-nav .topnav ul{
        flex-direction:row;
        opacity:1
    }
    .topnav{
        height:fit-content;
        overflow:visible;
        display:flex;
        justify-content:center;
        top:0
    }
    .topnav ul{
        padding:0;
        left:0;
        justify-content:flex-end;
        box-shadow:none
    }
    .topnav ul li a{
        padding: 0;
        border-bottom: none
    }
    .topnav ul li a:active,.topnav ul li a:focus,.topnav ul li a:hover{
        color:var(--tertiary)
    }
    .topnav ul li a::after{
        position:absolute;
        content:'';
        width:0;
        height:.063rem;
        background:var(--tertiary);
        transition:.3s cubic-bezier(.2,.54,.79,1.24)
    }
    .topnav ul li a::after{
        bottom:.5rem;
        right:.938rem
    }
    /*    .topnav ul li:last-child a::after{
            right:0
        }*/
    .topnav ul li a:active::after,.topnav ul li a:focus::after,.topnav ul li a:hover::after{
        width:50%;
        transition:.3s cubic-bezier(.2,.54,.79,1.24)
    }
    /*    .topnav ul li:last-child a{
            padding-right:0
        }*/
    .main-nav .icon{
        display:none
    }
    /*    .topnav ul li[class*=current-menu-]>a::after{
            height:.063rem;
            width:100%;
            left:auto;
            right:.938rem
        }*/
    nav{
        position: relative;
        transition: .2s ease-out
    }
    .home nav ul{
        display:flex
    }
    .home nav li{
        position: relative;
        text-align: center;
        list-style: none;
        display: inline-block;
        padding: 12px
    }
    .home nav ul li{
        position: relative;
        top: -6.25rem;
        transition: .6s ease-in-out all
    }
    .home nav ul li:nth-child(4){
        opacity:0;
        top:0;
        left:-6.25rem
    }
    .home nav ul li a,nav ul.inside-menu li a{
        position: relative;
        font-family: var(--font_primary), sans-serif;
        font-weight: 400;
        text-transform: uppercase;
        transition:.3s cubic-bezier(.2,.54,.79,1.24)
    }
    .home nav ul li a::after,nav ul.inside-menu li a::after{
        position: absolute;
        content: '';
        width: 25%;
        background:var(--white);
        right: 0;
        bottom: -2px;
        transition:.3s cubic-bezier(.2,.54,.79,1.24)
    }
    .home nav ul li a:hover,nav ul.inside-menu li a:hover{
        color:var(--white);
        transition:.3s cubic-bezier(.2,.54,.79,1.24)
    }
    /*    nav.menu ul li.menu-item-56 a,nav ul.inside-menu li.menu-item-56 a{
            color: var(--primary);
            font-weight:700
        }
        nav.menu ul li.menu-item-56 a:hover,nav ul.inside-menu li.menu-item-56 a:hover{
            color:var(--tertiary);
        }
        nav.menu ul li.menu-item-56 a::after,nav ul.inside-menu li.menu-item-56 a::after{
            background:var(--primary)
        }
        nav.menu ul li.menu-item-56 a:hover::after,nav ul.inside-menu li.menu-item-56 a:hover::after{
            background:var(--tertiary)
        }*/
    .home nav ul li a:hover::after,nav ul.inside-menu li a:hover::after{
        background:var(--white);
        width:100%;
        transition:.3s cubic-bezier(.2,.54,.79,1.24)
    }
    .home nav ul li a img,nav ul.inside-menu li a img{
        position: relative;
        top: 3px;
        transform: scale(1);
        transition: .2s cubic-bezier(0,.41,.68,1.32) all
    }
    .home nav ul li a img:hover,nav ul.inside-menu li a img:hover{
        transform: scale(1.25);
        transition: .2s cubic-bezier(0,.41,.68,1.32) all
    }
    /*nav.menu ul li:nth-child(4){
        position: relative;
    }
    nav.menu ul li:nth-child(4) a{
        cursor: default;
    }
    nav.menu ul li:nth-child(4)::after{
        position: absolute;
        content: '';
        width: 11px;
        height: 6px;
        top: 37px;
        left: 42.5%;
        opacity: 0;
        background: url("https://loic-a.fr/wp-content/themes/Digilo/images/integrateur-web_designer-developpeur-frontend-loic_bocquier_ancelin-goToSub.svg") no-repeat 100%;
        transition: .6s ease-in-out all;
    }*/

    /* SUB */
    /*nav.menu ul li:nth-child(4):hover > .sub-menu{
        display: block;
    }
    nav.menu ul ul li:nth-child(4)::after{
        position: absolute;
        content: '';
        background: none;
    }
    nav.menu ul li ul{
        position: absolute;
        top: 61px;
        left: 0;
        width: 265px;
        padding: 0;
        background: #f9f9f9;
        box-shadow: 0 3px 6px #2A191880, 0 1px 2px #2A191880;
        display: none;
    }
    nav.menu ul ul li:nth-child(3)::after{
        background: none;
    }
    
    nav.menu ul li ul li{
        display: block;
        text-align: left;
    }*/
    /* END SUB */
    /*
============
NAVIGATION PAGES
============
    */
    nav{
        position: relative;
        transition:.2s ease-out
    }
    nav ul.inside-menu{
        display:flex
    }
    nav ul.inside-menu li{
        position:relative;
        text-align:center;
        list-style:none;
        display:inline-block;
        padding:.75rem
    }
    /*nav.inside-menu ul li,
    nav.inside-menu ul li:nth-child(1),
    nav.inside-menu ul li:nth-child(2),
    nav.inside-menu ul li:nth-child(3),
    nav.inside-menu ul li:nth-child(4),
    nav.inside-menu ul li:nth-child(5){
        position: relative;
        top: -100px;
        transition: .6s ease-in-out all;
    }*/

    /*    nav.inside-menu ul li:first-child a::before,
        nav.inside-menu ul li:first-child a::after{
            position: absolute;
            content: '';
            width: 0;
            height: 0;
            background: none;
        }
        nav.inside-menu ul li a::before,
        nav.inside-menu ul li a::after{
            position: absolute;
            content: '';
            width: 0;
            height: 1px;
            background: #d7827e;
    
            transition: .3s ease-in;
        }
        nav.inside-menu ul li a::before{
            left: 0;
            top: -3px;
        }
        nav.inside-menu ul li a::after{
            right: 0;
            bottom: -2px;
        }
        nav.inside-menu ul li a:hover{
            color:#d7827e;
            transition: .3s ease-out;
        }
        nav.inside-menu ul li a:hover::before,
        nav.inside-menu ul li a:hover::after{
            width: 50%;
            background: #412725;
            transition: .3s ease-out;
        }
        nav.inside-menu ul li a img{
            position: relative;
            top: 3px;
            transform: scale(1);
            transition: .2s cubic-bezier(0,.41,.68,1.32) all;
        }
        nav.inside-menu ul li a img:hover{
            transform: scale(1.25);
            transition: .2s cubic-bezier(0,.41,.68,1.32) all;
        }*/
    /*Animation*/
    nav ul.inside-menu li:nth-child(1){
        /*transform: translateY(-100px);*/

        animation: cmon_1 .5s cubic-bezier(0,.41,.68,1.32) .5s 1 backwards;
        -webkit-animation: cmon_1 .5s cubic-bezier(0,.41,.68,1.32) .5s 1 backwards;
    }
    nav ul.inside-menu li:nth-child(2){
        /*top: 0;*/

        animation: cmon_2 .5s cubic-bezier(0,.41,.68,1.32) .6s 1 backwards;
        -webkit-animation: cmon_2 .5s cubic-bezier(0,.41,.68,1.32) .6s 1 backwards;
    }
    nav ul.inside-menu li:nth-child(3){
        /*top: 0;*/

        animation: cmon_3 .5s cubic-bezier(0,.41,.68,1.32) .7s 1 backwards;
        -webkit-animation: cmon_3 .5s cubic-bezier(0,.41,.68,1.32) .7s 1 backwards;
    }
    nav ul.inside-menu li:nth-child(4){
        /*top: 0;*/

        animation: cmon_4 .5s cubic-bezier(0,.41,.68,1.32) .8s 1 backwards;
        -webkit-animation: cmon_4 .5s cubic-bezier(0,.41,.68,1.32) 2s 1 backwards;
    }
    nav ul.inside-menu li:nth-child(5){
        /*top: 0;*/

        animation: cmon_5 .5s cubic-bezier(0,.41,.68,1.32) .9s 1 backwards;
        -webkit-animation: cmon_5 .5s cubic-bezier(0,.41,.68,1.32) .9s 1 backwards;
    }
    @keyframes cmon_1{
        0% {
            transform: translateY(-100px);
            opacity:0;
        }
        100% {
            transform: translateY(0);
            opacity:1;
        }
    }
    @-webkit-keyframes cmon_1{
        0% {
            transform: translateY(-100px);
            opacity:0;
        }
        100% {
            transform: translateY(0);
            opacity:1;
        }
    }
    @keyframes cmon_2{
        0% {
            transform: translateY(-100px);
            opacity:0;
        }
        100% {
            transform: translateY(0);
            opacity:1;
        }
    }
    @-webkit-keyframes cmon_2{
        0% {
            transform: translateY(-100px);
            opacity:0;
        }
        100% {
            transform: translateY(0);
            opacity:1;
        }
    }
    @keyframes cmon_3{
        0% {
            transform: translateY(-100px);
            opacity:0;
        }
        100% {
            transform: translateY(0);
            opacity:1;
        }
    }
    @-webkit-keyframes cmon_3{
        0% {
            transform: translateY(-100px);
            opacity:0;
        }
        100% {
            transform: translateY(0);
            opacity:1;
        }
    }
    @keyframes cmon_4{
        0% {
            transform: translatex(-100px);
            opacity:0;
        }
        100% {
            transform: translatex(0);
            opacity:1;
        }
    }
    @-webkit-keyframes cmon_4{
        0% {
            transform: translatex(-100px);
            opacity:0;
        }
        100% {
            transform: translatex(0);
            opacity:1;
        }
    }
    @keyframes cmon_5{
        0% {
            transform: translateY(-100px);
            opacity:0;
        }
        100% {
            transform: translateY(0);
            opacity:1;
        }
    }
    @-webkit-keyframes cmon_5{
        0% {
            transform: translateY(-100px);
            opacity:0;
        }
        100% {
            transform: translateY(0);
            opacity:1;
        }
    }
    nav ul li.menu-item-176,nav ul li.menu-item-47{
        background:var(--primary);
        z-index:9999
    }
    .contact-box{
        width:auto;
        padding:0;
        flex-direction:column;
        align-items:end;
        gap:.313rem;
        top:15.938rem;
        right: 0;
        bottom:auto
    }
    .contact-box section{
        height: 3.125rem;
        width: 3.125rem;
        padding:.313rem;
        border-bottom:.063rem solid #fff;
        border-right:none
    }
    .contact-box section.phone-box{
        position:relative;
        width:11.938rem;
        height:3.125rem;
        right:-8.813rem;
        padding-left:.625rem;
        transition:.5s cubic-bezier(.47,.07,1,.83)
    }
    .contact-box section.phone-box:hover{
        right:0;
        transition:.3s cubic-bezier(.17,.67,.76,.98)
    }
    .input-box label,.uagb-tabs__wrap.uagb-tabs__hstyle1-desktop .uagb-tab,dialog.modal-form{
        width:50%
    }
    main{
        padding-top:6.875rem
    }
    .skin-about .wp-block-columns::after{
        transform:rotate(-10deg);
        right:-10%
    }
    .skin-roadjob .wp-block-columns::after{
        transform:rotate(10deg);
        left:-15%
    }
    .skin-roadjob .wp-block-columns::after,.skin-about .wp-block-columns::after{
        width:21.25rem;
    }
    .projects{
        row-gap:1.875rem
    }
    aside.sticky{
        top:4.875rem
    }
    .contact-main>div{
        flex-direction:row!important
    }
    .input-box{
        gap:.625rem;
        flex-wrap:nowrap
    }
    #menu-footer-1,#menu-footer-2{
        padding:0;
        line-height:2.25rem
    }
    footer>.container{
        gap:0
    }
    footer section div{
        margin-bottom:0
    }
    .copy{
        padding-bottom:.625rem
    }
    .has-thumbnail{
        margin-top:17.313rem
    }
    .cky-revisit-bottom-left{
        bottom:.938rem!important
    }
}
@media(min-width:1200px){
    .skin-cogs-left::after,.skin-leaves::after{
        left:-5%;
        background-size:cover
    }
    .skin-graduate::after{
        left:-5%;
        background-size:contain
    }
    .skin-cogs::after{
        right:-5%;
        background-size:cover
    }
    .skin-roi::after{
        right:-5%
    }
}
@media (min-width:1440px){
    .skin-cogs-left::after,.skin-graduate::after,.skin-leaves::after{
        left:-20%
    }
    .skin-cogs::after,.skin-roi::after{
        right:-20%
    }
}