body {
    font-family: var(--font);
    font-size: 22px;
    background-color: #000000;
    overflow-x: hidden;
}

* {
    box-sizing: border-box;
}

img {
    user-select: none;
    -webkit-user-drag: none;
}

.bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to top,
            rgba(0, 0, 0, 1),
            rgba(0, 0, 0, 0.5),
            rgba(0, 0, 0, 0.3),
            rgba(0, 0, 0, 0.1)),
        url('../images/background.webp');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    z-index: -1;
}

.bg-50 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 48%;
    background: linear-gradient(to top,
            rgba(0, 0, 0, 1),
            rgba(0, 0, 0, 0.5),
            rgba(0, 0, 0, 0.3),
            rgba(0, 0, 0, 0.1)),
        url('../images/background.webp');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    z-index: -1;
}

.bg-flex {
    display: flex;
    justify-content: center;
}

.bg-small {
    position: relative;
    top: 12vh;
    width: 90%;
    height: 30vh;
    background: linear-gradient(to top, rgb(0 0 0 / 50%), rgb(0 0 0 / 20%)), url(../images/background.webp);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    border-radius: 4vh;
    border: 0.2vh solid #707070;
    z-index: -1;
}

::-webkit-scrollbar {
    width: 0.5vh;
    height: 0.5vh;
}

::-webkit-scrollbar-track {
    background: transparent;
}

::-webkit-scrollbar-thumb {
    background-color: #FF7B25;
    border-radius: 1vh;
}