Вопрос Помощь в выборе спавна

[JerryMorality]

В общем не пойму как сделать чтобы в respawn.html(выбор спавна), сзади не было черного фона а чисто как в авторизации вид с камеры на город, и в css поставить картинку не помогает перелазит и на авторизацию и вид с камеры там тоже пропадает а этого не нужно (Сборка Shadow) - стандартный respawn.html (Фото)

 

[Aiden]

<div style="background: transparent;">
Или в css файле .background (условно) { background: transparent; }

P.S.: не знаю что там в сборке и как оно выглядит

 

[JerryMorality]

Вот css и html, пробывал не получилось посмотри и скажи мне что не так делаю?

CSS:

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;500;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Russo+One&display=swap');

*, *::before, *::after {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
    -ms-user-select: none;
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
}

html, body {
    height: 100%;
    filter: brightness(90%)
}

body {
    margin: 0;
    line-height: 1;
    font-family: 'Montserrat', sans-serif;
    background: transparent;
}

.bold {
    font-weight: 700;
}

.flex-item:nth-child(2n) {
    box-sizing: border-box;
    margin: 0 75px;
    margin-top: 0px;
}

#spawn-select {
    height: 100%;
    padding: 0;
    margin: 0;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    align-items: center;
    justify-content: center;
}

.select-block {
    width: 330px;
    height: 500px;
    background: #000;
    position: relative;
    z-index: 2;
    border-radius: 15px;
}


.home {
    background-image: url(../images/1.png);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.last {
    background-image: url(../images/2.png);
    background-size: cover;
    background-repeat: no-repeat;
}

.org {
    background-image: url(../images/3.png);
    background-size: cover;
    background-position: 55%;
    background-repeat: no-repeat;
}

.title-block {
    background: linear-gradient(56deg, rgb(7, 232, 150, 0.6) 37%, rgb(7, 232, 150, 0.9) 56%);
    padding: 20px 0;
    position: absolute;
    top: 40%;
    left: 5%;
    width: 90%;
    transform: rotate(356deg);
}

.title-block .title-text > span {
    display: block;
    text-align: center;
    color: rgb(0, 0, 0);
    text-transform: uppercase;
}


.title-block .title-text > span:first-child {
    font-size: 32px;
    font-family: 'Russo One', sans-serif;
}

.button-block {
    position: absolute;
    bottom: 10%;
    width: 100%;
    text-align: center;
}

.button-block button {
    font-family: 'Montserrat', sans-serif;
    border: 0;
    padding: 10px 55px;
    color: rgb(12, 12, 12);
    border-radius: 5px;
    background: linear-gradient(56deg, rgb(7, 232, 150, 0.6) 37%, rgb(7, 232, 150, 0.9) 56%);
    text-transform: uppercase;
    -webkit-box-shadow: 0px 0px 17px 7px rgba(7, 232, 150, 0.5);
    -moz-box-shadow: 0px 0px 17px 7px rgba(7, 232, 150, 0.5);
    box-shadow: 0px 0px 17px 7px rgba(7, 232, 150, 0.5);
}

.button-block button:hover {
    scale: 1.1;
    animation: entry 1s linear 1;
    transition: .5s all ease;
    color: rgb(14, 13, 13);
    background: linear-gradient(56deg, rgb(7, 232, 150, 0.6) 37%, rgb(7, 232, 150, 0.9) 56%);
    -webkit-box-shadow: 0px 0px 17px 7px rgba(7, 232, 150, 0.5);
    -moz-box-shadow: 0px 0px 17px 7px rgba(7, 232, 150, 0.5);
    box-shadow: 0px 0px 17px 7px rgba(7, 232, 150, 0.5);
}

.button-block button[disabled]:active,
.button-block button[disabled]:hover,
.button-block button[disabled]{
    cursor: not-allowed;
    pointer-events: none;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    color: #ffffff;

}

.disabled {
    filter: grayscale(100%);
}

#footer {
    opacity: 0.5;
    text-align: center;
    position: fixed;
    left: 0; bottom: 0;
    padding: 5px;
    color: #fff;
    width: 100%;
}

HTML:

<!DOCTYPE html>
<html lang="ru">
<head>
    <title>Spawn</title>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link type="text/css" rel="stylesheet" href="assets/css/respawn.css" />
   
    <script type="text/javascript" src="assets/js/jquery.min.js"></script>
    <script type="text/javascript" src="assets/js/respawn.js"></script>
</head>
<body style="background: none">
    <div id="spawn-select" style="display: none;">
        <div id="home-spawn" class="flex-item select-block home">
            <div class="title-block">
                <div class="title-text">
                    <span class="bold">В доме</span>
                    <span class="desc-text">Дом милый дом</span>
                </div>
            </div>
            <div class="button-block">
                <button onclick="spawn(2)" type="button" class="button">Появиться</button>
            </div>
        </div>
        <div id="last-spawn" class="flex-item select-block last">
            <div class="title-block">
                <div class="title-text">
                    <span class="bold">Место выхода</span>
                    <span class="desc-text">Ровно там где и вышел</span>
                </div>
            </div>
            <div class="button-block">
                <button onclick="spawn(0)" type="button" class="button">Появиться</button>
            </div>
        </div>
        <div id="org-spawn" class="flex-item select-block org">
            <div class="title-block">
                <div class="title-text">
                    <span class="bold">Во фракции</span>
                    <span class="desc-text">Сразу за работу</span>
                </div>
            </div>
            <div class="button-block">
                <button onclick="spawn(1)" type="button" class="button">Появиться</button>
            </div>
        </div>
    </div>
</body>
</html>

 

[Sweets]

Напиши в дс di3lakdevka#6383