/* ------------------------ --------- ------------------------ */
/* ------------------------ --------- ------------------------ */
/* ------------------------ - BASIC - ------------------------ */
/* ------------------------ --------- ------------------------ */
/* ------------------------ --------- ------------------------ */

body{
    height: 2400vh;
    height: var(--Contact-Body-Height);
}



/* ------------------------ -------- ------------------------ */
/* -------------------- ---------------- -------------------- */
/* -------------------- COVER -- SECTION -------------------- */
/* -------------------- ---------------- -------------------- */
/* ------------------------ -------- ------------------------ */

.Contact-Cover-Section{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100vw;
    height: 3000px;
    height: var(--Contact-Cover-Section-Height);
    z-index: 800;
}

/* -------------------- ---------------- -------------------- */
/* -------------------- COVER --- SLOGAN -------------------- */
/* -------------------- ---------------- -------------------- */


.Contact-Cover-Slogan-Principal-Container{
    position: absolute;
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100vw;
    height: 100vh;
    z-index: 120;
}

.Contact-Cover-Slogan-Full-Container{
    position: sticky;
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100vw;
    height: 100vh;
}

/* -------------------- ---------------- -------------------- */

.Contact-Cover-Slogan-Main-Container{
    position: absolute;
    left: 0px;
    width: 100vw;
}

.Contact-Cover-Slogan-Main-Container-1{
    display: flex;
    flex-direction: column;
    top: var(--Contact-Cover-Slogan-Main-Container-1-Top);
    height: var(--Contact-Cover-Slogan-Main-Container-1-Height);
}

.Contact-Cover-Slogan-Main-Container-2{
    display: none;
    top: var(--Contact-Cover-Slogan-Main-Container-2-Top);
    height: var(--Contact-Cover-Slogan-Main-Container-2-Height);
}

/* -------------------- ---------------- -------------------- */

.Contact-Cover-Slogan-Container{
    left: 0px;
    width: 100vw;
}

.Contact-Cover-Slogan-Container-1{
    position: relative;
    height: var(--Contact-Cover-Slogan-Container-1-Height);
}

.Contact-Cover-Slogan-Container-2{
    position: absolute;
    top: 0px;
    height: var(--Contact-Cover-Slogan-Container-2-Height);
}

/* .Cover-Slogan-Container-11{
    background-color: azure;
}

.Cover-Slogan-Container-12{
    background-color: darksalmon;
}

.Cover-Slogan-Container-13{
    background-color: darkseagreen;
} */


/* -------------------- ---------------- -------------------- */

.Contact-Cover-Slogan{
    position: absolute;
    top: 0px;
}

.Contact-Cover-Slogan-Text-1{
    left: var(--Contact-Cover-Slogan-Text-1-Left);
}

.Contact-Cover-Slogan-Text-2{
    left: var(--Contact-Cover-Slogan-Text-2-Left);
}

.Contact-Cover-Slogan-Text-3{
    right: var(--Contact-Cover-Slogan-Text-3-Right);
}

.Contact-Cover-Slogan-Text-4{
    right: var(--Contact-Cover-Slogan-Text-4-Right);
}


/* -------------------- ---------------- -------------------- */

.Contact-Cover-Slogan-211{
    left: var(--Site-Margins-2);
    width: calc(100vw - (var(--Site-Margins-2)));
}

/* -------------------- ---------------- -------------------- */




/* -------------------- ---------------- -------------------- */
/* -------------------- COVER --- IMAGES -------------------- */
/* -------------------- ---------------- -------------------- */

.Contact-Cover-Container{
    position: absolute;
    top: var(--Cover-Collection-Container-Top);
    top: 166px;
    left: 50vw;
    transform: translateX(-50%);
    width: var(--Cover-Container-Width);
    height: var(--Cover-Container-Height);
    overflow: hidden;
}


.Contact-Cover-Bg-Container{
    z-index: 110;
}

.Contact-Cover-Portrait-Container{
    z-index: 130!important;
}

.Contact-Cover-Image{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 101%;
    height: auto;
}



/* ------------------------ -------- ------------------------ */
/* ------------------- ------------------ ------------------- */
/* ------------------- -- SECTION -- 1 -- ------------------- */
/* ------------------- ------------------ ------------------- */
/* ------------------------ -------- ------------------------ */

.Contact-First-Section{
    position: absolute;
    left: 0px;
    top: var(--Contact-First-Section-Top);
    height: var(--Contact-First-Section-Height);
    width: 100vw;
    z-index: 100000;
    background-color: var(--white);
}


.Contact-Action-Full-Container{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100vw;
    height: var(--Contact-Action-Full-Container-Height);
}

.Contact-Action-Main-Container{
    position: absolute;
    top: var(--Contact-Action-Main-Container-Top);
    left: 0px;
    width: 100vw;
    height: var(--Contact-Action-Main-Container-Height);
}

/* ------------------- ------------------ ------------------- */

.Contact-Action-Container{
    position: absolute;
    width: 100vw;
    left: 0px;
}
.Contact-Action-Text-Container{
    top: 0px;
    height: var(--Contact-Action-Text-Container-Height);
}



/* ------------------- ------------------ ------------------- */

.Contact-Btn-Mail{
    position: absolute;
    left: 50vw;
    transform: translateX(-50%);
    width: var(--Contact-Btn-Mail-Width);
    height: var(--Contact-Btn-Mail-Height);
    top: var(--Contact-Btn-Mail-Top);
}

/* ------------------- ------------------ ------------------- */

.Contact-Action{
    display: none;
}

.Contact-Action-1{
    display: block;
}



/* ------------------------ -------- ------------------------ */
/* ------------------- ------------------ ------------------- */
/* ------------------- --- BASIC -- 1 --- ------------------- */
/* ------------------- ------------------ ------------------- */
/* ------------------------ -------- ------------------------ */

.Footer-Principal-Container-Large-Contact{
    top: var(--Footer-Principal-Container-Large-Contact-Top);
}

.Footer-Principal-Container-Small-Contact{
    top: var(--Footer-Principal-Container-Small-Contact-Top);
}

.Footer-Principal-Container-Large-Contact, .Footer-Principal-Container-Small-Contact{
    z-index: 1200;
}

.Contact-Footer-Background-Cache{
    position: absolute;
    top: var(--Contact-Footer-Background-Cache-Top);
    left: 0px;
    width: 100vw;
    height: var(--Contact-Footer-Background-Cache-Height);
    z-index: 900;
    background-color: var(--white);
}
