/* ---------- 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:.4;
    transition:
        transform .35s ease,
        opacity .35s ease,
        filter .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:120px;
    max-width:80%;
}