/* ---------- HEADER ---------- */

header{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    z-index:20;
}


.corner-logo{
    position:absolute;
    top:30px;
    left:40px;
    display:flex;
    align-items:center;
}


.corner-logo img{
    height:40px;
    opacity:.75;
}


/* ---------- NAV ---------- */

nav{
    position:absolute;
    top:35px;
    right:50px;
}


.nav-inner{
    display:flex;
    gap:50px;
    align-items:center;
}


.nav-inner a{
    color:#8aa9b8;
    font-size:.95rem;
    transition:.3s;
}


.nav-inner a:hover{
    color:#3fbaeb;
}



/* ---------- HERO ---------- */


.hero{
    position:absolute;
    inset:0;
    display:flex;
    justify-content:center;
    align-items:center;
    z-index:5;
}


.hero-content{
    max-width:1000px;
    text-align:center;
    padding:40px;
}

/* ---------------------------------- */
footer{

position:absolute;

bottom:10px;

left:0;

width:100%;

z-index:20;

}

.page{
    position:absolute;
    inset:0;
    z-index:5;

    display:flex;
    justify-content:center;
    align-items:center;

    padding:
    120px 30px 100px;
}



.page-content{
    max-width:900px;
    width:100%;
    text-align:center;
}


.page{

position:absolute;

top:0;
left:0;
right:0;
bottom:0;

z-index:5;

padding:130px 80px 120px;

overflow-y:auto;

}


.page-content{

max-width:900px;

margin:auto;

padding-bottom:80px;

}


/*---------------QUAD LEAF LOGO-------------*/
.quadleaf_logo {
    text-align: center;
    margin-top: 100px;
}

.quadleaf_logo a {
    display: inline-block;
}

.quadleaf_logo img {
    max-width: 110px;
    width: 100%;
    height: auto;
    opacity: 0.4;
    transition: transform 0.35s ease,
                opacity 0.35s ease,
                filter 0.35s ease;
}

.quadleaf_logo a:hover img {
    transform: scale(1.08);
}


.quadleaf-logo {
    display: block;
    margin: 0 auto 25px auto;
    max-width: 120px;
    width: 100%;
    height: auto;
}




.quadleaf-logo {
    display:block;
    margin:0 auto 25px auto;
    width:170px;
    max-width:80%;
}


.page-content {
    text-align:center;
}


.subtitle {
    letter-spacing:4px;
    font-size:13px;
    opacity:.6;
    margin-bottom:45px;
}


.quadleaf-logo {

    display:block;

    margin:40px auto 35px;

    width:170px;

    max-width:80%;

    filter:
    drop-shadow(0 0 18px rgba(65,184,234,.45));

}
