html {
    font-family: "area-normal", sans-serif;
    background:#161925;
    font-size:16px;
    box-sizing:border-box;
    padding:0;
    margin:0;
}

* {
    box-sizing:border-box;
}

body {
    margin:0;
    padding:0;
    background:url('170750275_m_normal_none-resize.jpg');
    background-size:cover;
    background-position:center center;
    height:100vh;
    overflow:hidden;
}

.site-header {
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:2rem;
    letter-spacing:0.1rem;
    position:absolute;
    z-index:100;
    width:100%;
}

.site-header a {
    color:#fff;
    text-decoration-color:transparent;
    display:none;
}

.site-header img {
    max-width:240px;
    filter:brightness(0) invert(1);
    position:absolute;
    left:0;
    right:0;
    margin:0 auto;
}

.page-cover {
    width:100%;
    height:100vh;
    display:flex;
    flex-direction:column;
    /* flex-wrap:wrap; */
    align-items:center;
    justify-content:center;
    text-align:center;
    padding:1rem;
    padding-top: 4rem;
    padding-bottom: 4rem;
    background:rgba(22,25,37,0.49);
    overflow-y: scroll;
}

@media(max-width:767px){
    .page-cover {
        padding-top: 22rem;
        padding-bottom: 12rem;
    }
}

.page-cover ul{
    list-style: none;
    margin:0;
    padding:0;
    margin-bottom: 2rem;
}

.page-cover h1 {
    font-size:calc(1.5rem + 0.2vw);
    max-width:900px;
    font-weight:400;
    letter-spacing:0.2rem;
    text-transform:uppercase;
    color:rgba(255,255,255,0.8);
    padding:0 0 2rem 0;
    margin:0 0 2rem 0;
    position:relative;
}

.page-cover h1:after {
        content:' ';
        position:absolute;
        width:100px;
        height:2px;
        left:0;
        right:0;
        bottom:0;
        margin:0 auto;
        background:#3D52D5;
}

.page-cover p {
    font-size:1.2rem;
    color:rgba(255,255,255,0.8);
    max-width:900px;
    margin-top:0;
    z-index:100;
}

.buttons {
    margin-top:2rem !important;
    display:block;
}

.btn {
    background:#3d52d5;
    padding:0.6rem 1.2rem 0.8rem 1.2rem;
    border-radius:40px;
    min-width:200px;
    margin-top:1rem;
    text-transform:uppercase;
    color:#fff;
    text-decoration-color:transparent;
    font-size:1rem;
    letter-spacing:0.1rem;
    transition:.3s;
    z-index:10;
}

.btn:hover, .btn:focus {
    background:#fff;
    color:#3d52d5;
}

.btn-alt {
    background:#6BBAA2;
    margin-left:1rem;
}

.compass {
    width:100%;
    max-width:800px;
    position:absolute;
    bottom:-300px;
    filter:brightness(0) invert(1);
    opacity:0.1;
    left:0;
    right:0;
    margin:0 auto;
    z-index:0;
}

@media (min-width:767px) {
    .page-cover h1 {
        font-size:calc(2rem + 0.2vw);
    }
    .site-header a {
        display:inline;
    }
    .compass {
        bottom: -400px;
    }
}
