html, body {
    overflow-x: hidden;
}

#header {
    z-index: 10 !important;
}

main {
    font-family: 'Bebas Neue', cursive;
    font-weight: bold;
    margin-top: 55px;
    position: relative;
    background: url("../images/bg.jpg");
    background-size: cover;
    background-position: top center;
    height: 92dvh;
    text-indent: -99999px;
    font-size: 1px;
}

.footer-spacer {
    background: #381a10;
    height: 140px;
    position: relative;
}

.footer-spacer::before {
    content: '';
    box-shadow: 0px -20px 60px 50px #faf5ed;
    width: 200%;
    height: 75%;
    position: absolute;
    bottom: -75%;
    left: -50%;
}


@media screen and (max-width: 991.99px) and (orientation: portrait) {
    main {
        margin-top: 50px;
        height: auto;
        aspect-ratio: 4/3;
        background-image: url("../images/bg.mobile.jpg");
    }
    .footer-spacer::before {
        box-shadow: 0px -20px 40px 30px #faf5ed
    }
}