html {
	overflow: hidden;
}

body {
	display: flex;
	margin: 0;
	width: 100vw;
	height: 100vh;
	justify-content: center;
	align-items: center;
	background-color: #313131;
	transition: background-color 4s linear;
}

#Основной_блок {
	position: relative;
	display: flex;
	width: 940px;
	height: 680px;
	justify-content: center;
	align-items: center;
	overflow: hidden;
	background-color: #272727;
}

#Фон {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: url(bg.png) round no-repeat;
}

#Текст_1 {
	position: absolute;
	top: 50px;
	left: 30px;
	color: #D3663F;
	font: normal 14px sans-serif;
}

#Текст_2 {
	position: absolute;
	top: 45px;
	left: 320px;
	width: 265px;
	filter: drop-shadow(0px 0px 0px #D3663F);
}

#Текст_3 {
	position: absolute;
	top: 46px;
	left: 605px;
	width: 261px;
}

.Глаз {
	position: absolute;
	width: 11px;
	height: 9px;
	top: 0;
	left: 0;
	background: url("eye.png") round;
}

.Глаз.Закрыт {
	background: url("cleye.png") round;
}

#Значок { cursor: pointer; }

.Значок {
	position: absolute;
	width: 129px;
	height: 200px;
	left: 278px;
	top: 160px;
	background-repeat: round no-repeat;
	opacity: 0;
}

#Карта {
	position: absolute;
	width: 200px;
	height: 113px;
	left: 28px;
	top: 230px;
	background-repeat: round;
	mix-blend-mode: difference;
	filter: brightness(0.3);
	opacity: 0.8;
}

#Подпись_к_карте {
	position: absolute;
	left: 28px;
	top: 325px;
	font: 10.5px sans-serif;
	color: #FD9D6F;
}

#Подпись_к_карте::before, #Подпись_к_карте::after {
	content: "";
	position: absolute;
	width: 3px;
	height: 3px;
	border-radius: 50%;
}

#Подпись_к_карте::before { top: -68px; left: 41px; background-color: #FFF; }
#Подпись_к_карте::after { top: -58px; left: 109px; background-color: #F90; }

a { font-weight: bold; cursor: pointer; text-decoration: none; color: #8A8A8A; }

#Текст_слева, #Текст_справа {
	position: absolute;
	left: 35px;
	top: 425px;
	width: 868px;
	font: 11px 'Arial', sans-serif;
	line-height: 14px;
	color: #8A8A8A;
}

#Текст_справа {
	left: 500px;
	width: 250px;
}

#Текст_справа a {
	font-weight: normal;
}

.Ползунок {
	appearance: none;
	width: 100px;
	height: 1px;
	background: #8A8A8A;
	outline: none;
	vertical-align: middle;
}

.Ползунок::-webkit-slider-thumb {
	appearance: none;
	width: 12px;
	height: 12px;
	background: url("rngbtn.png") round;
	border-radius: 50%;
	opacity: 0.8;
	cursor: pointer;
}

.Ползунок::-moz-range-thumb {
	width: 12px;
	height: 12px;
	background: #4CAF50;
	background: url("rngbtn.png") round;
	border-radius: 50%;
	opacity: 0.8;
	cursor: pointer;
}

@keyframes Сообщение_о_загрузке {
	0% { color: #000; }
	50% { color: #FFF; }
	100% { color: #000; }
}

#Сообщение_о_загрузке {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	font: normal 18px monospace;
	animation: Сообщение_о_загрузке 5s linear infinite;
	background-color: #333;
	z-index: 98;
}

#Накладка {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background-color: #000;
	transition: opacity 4s linear;
	opacity: 0;
	z-index: -1;
}

#Накладка > div {
	position: absolute;
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background-color: #FFFC;
}

#Накладка > div:nth-child(1) { top: 40px; left: 75px; }
#Накладка > div:nth-child(2) { top: 31px; left: 321px; }
#Накладка > div:nth-child(3) { top: 25px; left: 376px; }
#Накладка > div:nth-child(4) { top: 100px; left: 460px; }
#Накладка > div:nth-child(5) { top: 103px; left: 515px; }
#Накладка > div:nth-child(6) { top: 26px; left: 623px; }
#Накладка > div:nth-child(7) { top: 21px; left: 631px; }
#Накладка > div:nth-child(8) { top: 63px; left: 796px; }

#Управление_ветром, #Управление_ветром_над_накладкой, #Управление_размером {
	transition: opacity 3s linear;
}

#Управление_ветром_над_накладкой, #Управление_размером {
	position: absolute;
	left: 0px;
	opacity: 0;
	z-index: -1;
}

#Управление_размером {
	left: 300px;
}

.Картинка_для_предзагрузки {
	position: absolute;
	left: -9999px;
	top: 0;
}