html, body {
    overflow-x: hidden;
}

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

main {
    font-family: 'Bebas Neue', cursive;
    font-weight: bold;
    margin-top: 55px;
    position: relative;
}

section {
    position: relative;
    overflow: hidden;
    width: 100%;
    aspect-ratio: 18/8;
    font-family: 'Bebas Neue', sans-serif;
    font-weight: bold;
    color: #ffffff;
}

.bg {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

section a {
    color: inherit;
    text-decoration: none;
    transition: all ease-in-out 300ms;
}

#section-1 {
    background: url("../images/bg.jpg?v=10");
    background-size: auto 130%;
    background-position: 50% 15%;
    background-repeat: no-repeat;
}

#section-1:after {
    content: "";
    z-index: 1;
    position: absolute;
    bottom: -5%;
    left: 0;
    width: 100%;
    height: 5%;
    box-shadow: 0 0 4rem 4rem #faf5ed;
}

#section-1 .img2,
#section-1 .img3,
#section-1 .img4,
#section-1 .img5,
#section-1 .img6,
#section-1 .img7{
    position: absolute;
}

#section-1 .img1 {
    height: 40%;
    max-width: 500%;
    z-index: 7;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
}

#section-1 .img2 {
    top: 21%;
    width: 91%;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1;
}

#section-1 .img6 {
    top: 79.4%;
    left: 50%;
    transform: translateX(-50%);
    width: 11%;
    z-index: 4;
    transition: all 300ms ease-in-out;
}

#section-1 .img6:hover {
    width: 12%;
}

#section-1 .img7 {
    top: 87%;
    left: 50%;
    transform: translateX(-50%);
    width: 16%;
    z-index: 5;
}

#section-1 .decor-left,
#section-1 .decor-right,
#section-1 .decor-bottom {
    position: absolute;
}

#section-1 .decor-left {
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 9%;
}

#section-1 .decor-right {
    right: 0;
    top: 45%;
    transform: translateY(-50%);
    width: 10%;
}

#section-1 .decor-bottom {
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 85%;
}

#section-1 .lottery {
    position: absolute;
    z-index: 1;
    bottom: -4%;
    right: 17%;
    width: 11%;
    transition: all 300ms ease-in-out;
    filter: grayscale(1);
}

#section-1 .lottery:hover {
    bottom: -2%;
    filter: grayscale(0);
}

@media screen and (max-width: 991.99px) and (orientation: portrait) {
    main {
        margin-top: 50px;
    }

    #section-1 {
        aspect-ratio: 4/5;
        background-size: auto 120%;
    }

    #section-1 .img1 {
        height: 25%;
        left: 64%;
        top: 0;
    }

    #section-1 .img2 {
        width: 155%;
        max-width: 155%;
        top: 24%;
    }

    #section-1 .img6 {
        top: 62%;
        width: 40%;
    }

    #section-1 .img6:hover {
        width: 40%;
    }

    #section-1 .img7 {
        top: 72%;
        width: 65%;
    }

    #section-1 .decor-left {
        top: 33%;
    }

    .decor-right {
        top: 27%;
    }

    #section-1 .decor-bottom {
        bottom: 5%;
        width: 176%;
        max-width: 500%;
    }

    #section-1 .lottery {
        bottom: -1%;
        right: 1%;
        width: 28%;
    }

    #section-1 .lottery:hover {
        bottom: 0;
    }
}