html {
    font-size:16px;
}
body {
    margin:0;
    padding:0;
    height:100vh;
    background-color:#3D3C3C;
    background-image:url('/assets/homeBanner1.avif');
    background-size:cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
}
.bodyContainer {
    display:flex;
    background-color:rgba(0,0,0,0.875);
    width:100%;
    height:100%;
    min-height:32rem;
    align-items:center;
    justify-content:center;
}
.homeContainer {
    width:40rem;
    height:32rem;
}
.homeTitle {
    text-align:center;
    font-size:5rem;
    color:#C7A1FA;
}
.homeSubtitle {
    text-align:center;
    font-size:3rem;
    color:#B9ECFE;
}
.homePhrase {
    text-align:center;
    font-size:2rem;
    color:#FFF;
}
a {
    display:block;
    margin:0 auto;
    width:8rem;
    text-decoration:none;
    background: rgb(78,78,223);
    color:#FFF;
    padding:0.75rem 1rem;
    font-size:1rem;
    text-align:center;
    font-weight:bold;
    text-transform: uppercase;
}
.browseLinkContainer {
    text-align:center;
}
.browseLink {
    color:#E4E4E3;
}
.homeButtons {
    width:100%;
    display:flex;
    margin-top:2rem;
    font-size:1.5rem;
    text-align:center;
}
.homeButtons > a {
    display:block;
    background: rgba(9,121,91,1); 
}

@media (max-width:800px) {
    .bodyContainer {
        min-height:22rem;
    }
    .homeContainer {
        width:24rem;
        height:22rem;
    }
    .homeTitle {
        font-size:3rem;
    }
    .homeSubtitle {
        font-size:1.5rem;
    }
    .homePhrase {
        font-size:1rem;
    }
    a {
        width:6rem;
        font-size:0.875rem;
    }
}