/*
Theme Name: Theme To The Moon
Description: Concu et pensé par l'agence To The Moon
Author: Agence To The Moon
Author URI: https://agence-tothemoon.fr/
Requires at least: WordPress 5.0
Version: 1.0
*/

.reveal-loaded [class*="revealleft-"] {
    animation: revealAnimationLeft 1s cubic-bezier(.5, 0, 0, 1) both;
}

.reveal-loaded [class*="revealburger-"] > a {
    animation: revealAnimationLeft 1s cubic-bezier(.5, 0, 0, 1) both;
}

.reveal-loaded .reveal:not(.elementor-element-edit-mode) [class*="reveal-"] {
    opacity: 0 !important;
    animation: none !important;
    transition: 0s !important;
}

.reveal-loaded [class*="reveal-"] {
    animation: revealAnimation 1s cubic-bezier(.5, 0, 0, 1) both;
}

.reveal-loaded .reveal-2, .reveal-loaded .revealleft-2 {
    animation-delay: .1s;
}

.reveal-loaded .reveal-3, .reveal-loaded .revealleft-3 {
    animation-delay: .2s;
}

.reveal-loaded .reveal-4, .reveal-loaded .revealleft-4 {
    animation-delay: .3s;
}


.reveal-loaded .reveal-5, .reveal-loaded .revealleft-5 {
    animation-delay: .4s;
}


.reveal-loaded .reveal-6, .reveal-loaded .revealleft-6 {
    animation-delay: .5s;
}

.reveal-loaded .reveal-7, .reveal-loaded .revealleft-5 {
    animation-delay: .6s;
}


.reveal-loaded .reveal-8, .reveal-loaded .revealleft-6 {
    animation-delay: .7s;
}

.reveal-loaded .reveal h1:before, .reveal-loaded .reveal .menu-mobile-burger > span, body:not(.pagescroll) .menu-mobile-burger > span, .reveal-loaded .reveal h2:before {
    width: 0 !important;
}

.reveal-loaded .reveal.ttm-header > div > div:last-child p:before {
    height: 0;
}

.reveal-loaded header .menu-mobile-burger > span {
    transition: .8s cubic-bezier(0.78, -0.01, 0.39, 1.02);
    transition-delay: .5s;
}

body > .menu-mobile-burger > span {
    transition: .8s cubic-bezier(0.78, -0.01, 0.39, 1.02);
}

.reveal-loaded h1:before, .reveal-loaded h2:before {
    transition: 1s cubic-bezier(.5, 0, 0, 1);
    transition-delay: .5s;
}

@media (prefers-reduced-motion: reduce) {
    .reveal-loaded [class*="reveal-"] {
        animation: none !important;
    }
}

@keyframes revealAnimation {
    0% {
        opacity: 0;
        transform: translateY(30px);
    }
    100% {
        opacity: 1;
        transform: translateY(0px);
    }
}

@keyframes revealAnimationLeft {
    0% {
        opacity: 0;
        transform: translateX(-30px);
    }
    100% {
        opacity: 1;
        transform: translateX(0px);
    }
}

@keyframes revealAnimationLeftMarg {
    0% {
        opacity: 0;
        margin-left: -30px;
    }
    100% {
        opacity: 1;
        margin-left: 0;
    }
}

/*Alexis*/
.logo-ttm {
    text-decoration: none;
}

.logo-ttm span {
    font-size: 16px;
    line-height: 120%;
    font-weight: 300;
    letter-spacing: 1.5px;
    text-align: center;
    color: #000;
    display: block;
    margin-top: 15px;
}

.ttm-copyright p {
    display: flex;
    align-items: center;
    justify-content: center;
}

.ttm-copyright p, .ttm-copyright a {
    color: #fff;
    font-size: 12px;
    line-height: 130%;
    transition: 0.3s;
}

img.ttm-icon-copyright {
    width: 15px;
    height: auto;
    display: inline-block;
    margin-left: 10px;
}

.eclient-body .listesglprjt {
    max-width: 98%;
}

a.listesglprjt span {
    position: relative;
    text-decoration: none!important;
    margin: 0 11px 0 0;
}

a.listesglprjt span:after {
    content: "";
    width: 57px;
    height: 57px;
    background-image: url(/wp-content/themes/tothemoon/assets/icons/vi-editer-proj.png);
    background-size: contain;
    background-repeat: no-repeat;
    display: block;
    position: absolute;
    right: -64%;
    top: 50%;
    transform: translate(0%, -50%);
}

a.btnpopclient.btnajoutprojet,
a.btnpopclient.btnajoutclient {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 7px 35px!important;
    line-height: 1.3;
    height:40px;
}

a.btnpopclient.btnajoutprojet:after {
    content: "";
    width: 25px;
    height: 25px;
    background-image: url(/wp-content/themes/tothemoon/assets/icons/vi-creer-proj.svg);
    background-size: contain;
    background-repeat: no-repeat;
    display: inline-block;
    margin-left: 10px;
}

a.btnpopclient.btnajoutclient:after {
    content: "";
    width: 25px;
    height: 25px;
    background-image: url(/wp-content/themes/tothemoon/assets/icons/vi-ajouter-client.svg);
    background-size: contain;
    background-repeat: no-repeat;
    display: inline-block;
    margin-left: 10px;
}

.eclient-body .headbreadcrumb .logoutbtn {
    color: #C21F22!important;
    background: transparent!important;
    border: 1px solid #C21F22!important;
    padding: 4px 25px!important;
    border-radius: 5px!important;
    font-size: 13px!important;
    font-weight: 600!important;
}

.headtitlecol h1{
    position: relative;
    display: flex;
    align-items: center;
    justify-content: start;
}

.headtitlecol h1:before {
    content: "";
    width: 65px;
    height: 65px;
    background-image: url(/wp-content/themes/tothemoon/assets/icons/vi-profil.svg);
    background-size: contain;
    background-repeat: no-repeat;
    display: inline-block;
    margin-right: 5px;
}

.page-template-template-espaceclient,
.single.single-projetsec,
.timelineproj.etapeune div,
.timelineproj.etapeune {
    position: relative;
}

.page-template-template-espaceclient:before,
.single.single-projetsec:before {
    content: "";
    width: 425px;
    height: 540px;
    background-image: url(/wp-content/themes/tothemoon/assets/icons/villemin-v-favicon.svg);
    background-size: contain !important;
    background-repeat: no-repeat;
    display: block;
    position: absolute;
    left: 0;
    top: 30%;
    transform: translate(-45%,-50%);
    z-index: -1;
}

.gestionprojetgbl a:after {
    display: none!important;
}

.single .eclient-body .col-12.headtitlecol {
    display: flex;
    flex-direction: column;
    justify-content: start;
    margin-bottom: 2em;
}

.col-12.headtitlecol p {
    font-size: 14px;
    text-align: center;
}

.timelineproj p {
    font-size: 14px;
    line-height: 1.5;
}

.timelineproj > div,
.timelineproj {
    position: relative;
}

.timelineproj > div:before {
    content: "";
    width: 54px;
    height: 54px;
    position: absolute;
    background: #C21F22;
    border-radius: 100%;
    left: -75px;
    top: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 25px;
    line-height: 1;
    font-weight: 700;
}

.timelineproj > div:nth-child(1):before {
    content: "1";
}
.timelineproj > div:nth-child(2):before {
    content: "2";
}
.timelineproj > div:nth-child(3):before {
    content: "3";
}
.timelineproj > div:nth-child(4):before {
    content: "4";
}
.timelineproj > div:nth-child(5):before {
    content: "5";
}

.timelineproj h3 {
    font-size: 18px;
    line-height: 1.5;
    margin: 40px 0 5px 0;
}

.timelineproj {
    padding-left: 70px;
    margin-bottom: 4em;
}

.listedocall .doctplsgl img {
    width: 100%!important;
}

.timelineproj:before {
    content: "";
    width: 1px;
    height: 94%;
    position: absolute;
    background: transparent;
    border-left: dashed 2px #1D1D1D;
    left: 23px;
    top: 50%;
    transform: translateY(-50%);
}

.docpartageprojet p {
    font-size: 14px;
}

.col-md-6.docpartageprojet > p strong {
    font-size: 16px;
}

.listeetapeprojet form {
    display: flex;
    flex-wrap: wrap;
    margin: 2em 0;
}

.listeetapeprojet form label {
    width: 100%;
    font-size: 14px;
    min-width: 100%;
    font-weight: 800;
    text-transform: uppercase;
    margin-bottom: 5px;
}

.listeetapeprojet form select {
    height: 40px;
    width: 80%;
    padding: 0 15px;
    border: 1px solid #dedede;
    border-radius: 0;
    background: #fff;
    color: #000;
}

input[type="submit"] {
    background: #C21F22;
    border: 1px solid #C21F22;
    font-weight: bold;
    border-radius: 0;
    color: #fff;
    text-transform: uppercase;
    width: 20%;
    -webkit-appearance: none;
}

input.wpcf7-form-control.wpcf7-submit {
    width: auto;
}

.eclient-body .btnpopclient {
    font-size: 13px;
    padding: 4px 25px!important;
    border-radius: 5px!important;
}

.projetcommercial p {
    font-size: 12px!important;
}

.projetcommercial {
    border-radius: 50px 0!important;
}

.docgbldiv form {
    border: 2px dashed #B4B4B4;
    padding: 0;
    text-align: center;
    margin: 2em auto 3em auto;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    position: relative;
}

input.files {
    opacity: 0;
    height: 130px;
    width: 100%;
    z-index: 1;
    cursor: pointer;
}

.docgbldiv form:before {
    content: "Cliquez ici pour déposer vos documents";
    position: absolute;
    font-size: 20px;
    font-weight: bold;
    width: 100%;
    max-width: 238px;
    line-height: 1.2;
    color: #B4B4B4;
    top: 64%;
    left: 50%;
    transform: translate(-50%,-50%);
}

.docgbldiv form input[type="submit"] {
    position: absolute;
    bottom: -60px;
    height: 40px;
    -webkit-appearance: none;
}

.docgbldiv form:after {
    content: "";
    width: 30px;
    height: 31px;
    background-image: url(/wp-content/themes/tothemoon/assets/icons/icon-upload);
    background-size: contain !important;
    background-repeat: no-repeat;
    display: block;
    position: absolute;
    left: 50%;
    top: 30%;
    transform: translate(-50%,-50%);
    z-index: 0;
}

.popupgestioncompte form {
    text-align: center;
    justify-content: center;
}

.popupgestioncompte button {
    width: auto;
    margin: 0 auto;
    padding: 13px 60px;
    text-transform: uppercase;
    background-color: #1D1D1D;
    border: 0;
    color: white;
    font-weight: 700;
    font-size: 16px;
    border-radius: 6px;
    cursor: pointer;
}

.popupgestioncompte label {
    margin-bottom: 25px;
}

.sglprojetgbl .bodyprojetcontent > div {
    background: #fff;
}

body .vilcoec {
    display: flex !important;
    position: relative;
}

a.vilcoec:after {
    content: "";
    background: url(/wp-content/themes/tothemoon/assets/icons/vil-ecbtn.svg) no-repeat;
    background-size: contain;
    width: 25px;
    height: 25px;
    display: inline-block;
    margin-left: 10px;
    margin-top: -1px;
}

.vilcoecli {
    display: none;
}

/****************
Responsive EC
****************/
@media (max-width: 1150px) {
    .navlnkrs ul > li:last-of-type a,
    .header-menuglb .navheadcol .elementor-element-populated .navcollink ul a {
        font-size: 13px;
    }
}

@media (max-width: 1100px) {
    .eclient-body .listesglprjt,
    .eclient-body .listesglprjt span,
    .eclient-body h3 {
        font-size: 14px!important;
        line-height: 1.5;
    }
}

@media (max-width:992px) {
    a.vilcoec:after {
        filter: invert(1)!important;
    }
    li.vilcoecli {
        display: block;
    }
    .navlnkrs ul > li:last-of-type {
        display: none!important;
    }
    .eclient-body .headtitlecol .btnaction-client {
        -webkit-box-orient: horizontal!important;
        -webkit-box-direction: initial!important;
        -ms-flex-direction: initial!important;
        flex-direction: initial!important;
    }
    .col-12.headtitlecol {
        flex-direction: column;
    }
    a.btnpopclient.btnajoutprojet, a.btnpopclient.btnajoutclient {
        width: 223px;
        max-width: inherit;
        margin: 0 10px 0 10px!important;
    }
    .headtitlecol h1 {
        margin: 0 0 15px 0!important;
    }
    .row.bodyprojetcontent {
        flex-direction: column;
    }
    .sglprojetgbl .bodyprojetcontent > div {
        padding: 30px 25px;

        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }
    .headprojetinfo .projetcommercial {
        top: 170%;
    }
    .single .eclient-body .col-12.headtitlecol {
        margin-bottom: 0;
    }

}

@media (max-width:768px) {
    a.listesglprjt {
        flex-direction: column;
        text-transform: uppercase;
    }
    .eclient-body .listesglprjt span {
        margin: 10px 0 20px 0;
        text-transform: capitalize;
        font-weight: 700!important;
        border: 1px solid #fff;
        /* letter-spacing: 0px; */
        font-size: 13px!important;
        padding: 0 0 0 22px;
        display: inline-flex!important;
        align-items: center;
        justify-content: center;
        border-radius: 30px;
        color: #000;
        background: #fff;
    }
    a.listesglprjt span:after {
        width: 37px;
        height: 37px;
        right: inherit;
        display: inline-block;
        position: relative;
        top: inherit;
        transform: inherit;
        margin-left: 4px;
    }
    .eclient-body .listesglprjt {
        padding: 15px 30px 0 30px!important;
        text-align: center;
    }
    .headtitlecol h1 {
        font-size: 20px;
    }
    .headtitlecol h1:before {
        width: 45px;
        height: 45px;
    }
    .listedocall .doctplsgl p {
        font-size: 12px!important;
    }
    .listedocall .doctplsgl {
        width: 25%!important;
    }
}

@media (max-width:650px) {
    .headprojetinfo .projetcommercial p {
        display: inline-block;
    }
    .headprojetinfo .projetcommercial {
        position: relative!important;
        right: inherit!important;
        top: inherit!important;
        -webkit-transform: inherit!important;
        transform: inherit;
        background-color: white!important;
        -webkit-box-shadow: inherit!important;
        box-shadow: inherit!important;
        border-radius: 0;
        padding: 15px 15px 0 15px!important;
        text-align: center!important;
        margin: 0;
    }
    .listeetapeprojet form {
        display: flex;
        flex-wrap: inherit;
        flex-direction: column;
        margin: 2em 0;
    }
    .listeetapeprojet form select {
        height: 40px;
    }
    input[type="submit"] {
        width: 100%;
        height: 40px;
    }
    .listeetapeprojet form label {
        text-align: center;
    }
    .sglprojetgbl .bodyprojetcontent h2 {
        font-size: 19px!important;
        text-align: center;
        margin-bottom: 0;
    }
    .gestionprojetgbl {
        flex-direction: column;
    }
    a.btnpopclient.btnajoutprojet, a.btnpopclient.btnajoutclient {
        margin: 0 10px 15px 10px!important;
    }
    .listeetapeprojet form select {
        width: 100%;
    }
}

@media (max-width:550px) {
    .eclient-body .headtitlecol .btnaction-client {
        flex-direction: column !important;
    }
    a.btnpopclient.btnajoutprojet, a.btnpopclient.btnajoutclient {
        margin: 0 10px 10px 10px!important;
    }
}