/* ---------------------------- ---------- ---------------------------- */
/* ---------------------------- ---------- ---------------------------- */
/* ---------------------------- - FOOTER - ---------------------------- */
/* ---------------------------- ---------- ---------------------------- */
/* ---------------------------- ---------- ---------------------------- */

.Footer-Global-Container{
    position: absolute;
    left: 0px;
    width: 100vw;
    top: var(--Footer-Global-Container-Top);
    height: var(--Footer-Global-Container-Height);
    z-index: 600;
    background-color: var(--light);
}

.Footer-Principal-Container{
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 100vw;
    height: var(--Footer-Principal-Container-Height);
    background-color: var(--light);
    z-index: 600;
}

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

.Footer-Full-Container{
    position: absolute;
    left: 0px;
    width: 100vw;
}

.Footer-Top-Full-Container{
    bottom: var(--Footer-Top-Full-Container-Bottom);
    height: var(--Footer-Top-Full-Container-Height);
}

.Footer-Mid-Full-Container{
    bottom: var(--Footer-Mid-Full-Container-Bottom);
    height: var(--Footer-Mid-Full-Container-Height);
}

.Footer-Low-Full-Container{
    bottom: 0px;
    height: var(--Footer-Low-Full-Container-Height);
}

/* ---------------------------- ---------- ---------------------------- */
/* ---------------------------- FOOTER TOP ---------------------------- */
/* ---------------------------- ---------- ---------------------------- */

.Footer-Logo-Main-Container{
    position: absolute;
    top: 0px;
    left: var(--Site-Margins);
    width: var(--Site-Content-Width);
    height: var(--Footer-Logo-Main-Container-Height);
}

.Footer-Logo{
    position: absolute;
    top: 0px;
    left: 0px;
    width: var(--Footer-Logo-Width);
    height: auto;
}

.Footer-Logo:hover{
    cursor: pointer;
}

/* ---------------------------- ---------- ---------------------------- */
/* ---------------------------- FOOTER MID ---------------------------- */
/* ---------------------------- ---------- ---------------------------- */

.Footer-Mid-Main-Container{
    position: absolute;
    top: 0px;
    left: var(--Site-Margins);
    width: var(--Site-Content-Width);
    height: var(--Footer-Mid-Main-Container-Height);
}

.Footer-Comm-Container{
    position: absolute;
    top: var(--Footer-Comm-Container-Top);
    left: 0px;
    width: var(--Site-Content-Width);
    height: var(--Footer-Comm-Container-Height);
}

.Footer-Insta-Link{
    position: absolute;
    top: 0px;
    left: 0px;
}

.Footer-Mail-Link{
    position: absolute;
    left: 0px;
    top: var(--Footer-Mail-Link-Top);
}

.Footer-Insta-Link:hover{
    cursor: pointer;
    color: var(--second);
}

.Footer-Mail-Link:hover{
    cursor: pointer;
    color: var(--second);
}

.Footer-Mid-Time-Container{
    position: absolute;
    top: var(--Footer-Mid-Time-Container-Top);
    height: var(--Footer-Mid-Time-Container-Height);
    width: 270px;
    right: 0px;
}

/* ---------------------------- ---------- ---------------------------- */
/* ---------------------------- FOOTER BTN ---------------------------- */
/* ---------------------------- ---------- ---------------------------- */

.Footer-Btn-Main-Container{
    position: absolute;
    top: 0px;
    left: var(--Site-Margins);
    width: var(--Site-Content-Width);
    height: var(--Footer-Btn-Main-Container);
}
.Footer-Btn-Container{
    display: none;
    position: absolute;
    top: 0px;
    left: 50%;
    transform: translateX(-50%);
    width: var(--Footer-Btn-Container-Width);
    height: var(--Footer-Btn-Container-Height);
    background-color: var(--light);
    border: 1px solid var(--dark);
    box-sizing: border-box;
    border-radius: 30px;
}

.Footer-Btn-Container:hover{
    background-color: var(--dark);
    cursor: pointer;
}

.Footer-Btn-Container:hover * {
    color: var(--light);
}

.Footer-Link{
    position: absolute;
    width: 100%;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
}


/* ---------------------------- ---------- ---------------------------- */
/* ---------------------------- FOOTER LOW ---------------------------- */
/* ---------------------------- ---------- ---------------------------- */

.Footer-Low-Main-Container{
    position: absolute;
    top: 0px;
    left: var(--Site-Margins);
    width: var(--Site-Content-Width);
    height: var(--Footer-Low-Main-Container-Height);
    border-top: 1px solid var(--dark);
    box-sizing: border-box;
}

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

.Footer-Copyright-Container{
    position: absolute;
    top: var(--Footer-Copyright-Container-Top);
    left: 0px;
    height: var(--Footer-Copyright-Container-Height);
    width: var(--Site-Content-Width);
}

.Footer-Copyright{
    position: absolute;
    top: 0px;
    left: 0px;
}

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

.Footer-Low-Time-Container{
    display: none;
    position: absolute;
    top: var(--Footer-Low-Time-Container-Top);
    width: 260px;
    height: var(--Footer-Low-Time-Container-Height);
    left: 50%;
    transform: translateX(-50%);
}

/* ---------------------------- ---------- ---------------------------- */
/* ---------------------------- FOOTER TME ---------------------------- */
/* ---------------------------- ---------- ---------------------------- */

.Footer-Time-Container:hover{
    cursor: pointer;
}

.Footer-Time-Container:hover *{
    color: var(--second);
}

@media (hover: none) {
    .Footer-Time-Container:hover *{
        color: var(--dark) !important;
    }
}

.Footer-Time-Mask{
    position: absolute;
    top: 0px;
    right: 0px;
    width: 270px;
    height: var(--Lh-Footer-Time);
    z-index: 10;
}