/* Main CSS */
@import url('https://fonts.googleapis.com/css2?family=Tinos:ital,wght@0,400;0,700;1,400;1,700&display=swap');



/* -------------------------------------------------------------------------------------------------- */
/* BASIC */
:root {
	--selection_bg: rgba(92, 121, 177, 0.22);
	--link: #1A73E8;
	--black: #000;
	--white: #FFF;
	--gold: #FDD01D;
	--box-shadow:
		rgba(53, 72, 91, 0.14) 0 0 0 1px,
		rgba(0, 0, 0, 0.07) 0 2.75px 2.21px 0,
		rgba(0, 0, 0, 0.043) 0 6.65px 5.32px 0,
		rgba(0, 0, 0, 0.03) 0 12.5px 10px 0,
		rgba(0, 0, 0, 0.03) 0 22px 25px 0,
		rgba(0, 0, 0, 0.02) 0 42px 33.4px 0,
		rgba(0, 0, 0, 0.016) 0 110px 80px 0;
	--cookie_bg: #F8F9FC;
	--cookie_color: #D81F26;
	--cookie_width: calc(100% - 40px);
	--text-shadow:
		-1px -1px 0 #000,
		1px -1px 0 #000,
		1px 1px 0 #000,
		-1px 1px 0 #000,
		-1px -1px 1px #000,
		1px -1px 1px #000,
		1px 1px 1px #000,
		-1px 1px 1px #000;
	--p_color: #6A6969;
	--box_shadow_form_input:
		0 0 0 1px rgba(53, 72, 91, 0.14),
		0 2.75px 2.21px rgba(0, 0, 0, 0.07),
		0 6.65px 5.32px rgba(0, 0, 0, 0.043),
		0 12.5px 10px rgba(0, 0, 0, 0.03),
		0 22px 25px rgba(0, 0, 0, 0.03),
		0 42px 33.4px rgba(0, 0, 0, 0.02),
		0 110px 80px rgba(0, 0, 0, 0.017);
	--border_color_form_input: #252427;
	--border_color_focus_form_input: #F48225;
	--brown: #A52A2A;
}
::selection {
	background: var(--selection_bg);
}
* {
	padding: 0;
	margin: 0;
	box-sizing: border-box;
	transition: all 0.25s ease-in;
	scrollbar-width: thin;
}
html {
	line-height: 1.15;
}
body {
}
.body_with_bg {
	background: url(/img/body_bg.webp);
}
.overflow_hidden {
	overflow: hidden;
}
.el_vis {
	display: block;
}
.el_invis {
	display: none;
}
.el_error {
	color: var(--brown);
}
form {
	position: relative;
}
/* BASIC */
/* -------------------------------------------------------------------------------------------------- */



/* -------------------------------------------------------------------------------------------------- */
/* NAVIGATION */
.navigation {
}
/* NAVIGATION */
/* -------------------------------------------------------------------------------------------------- */



/* -------------------------------------------------------------------------------------------------- */
/* CONTENT */
.wrap {
}
.grid_wrap {
	display: grid;
	position: relative;
	height: 100vh;
	grid-template-columns: 1fr 4fr 1fr;
	grid-template-rows: 0.4fr 3.2fr 0.4fr;
	grid-template-areas:
		'. . .'
		'x x x'
		'. . .';
	gap: 0 0;
	justify-items: center;
	align-items: center;
}
.wrap_bg::after {
	content: '';
	position: absolute;
	left: 0;
	width: 100%;
	height: 100%;
	background: url(/img/basic_bg.webp) center center no-repeat;
	z-index: -1;
}
.content {
}
.grid_content {
	grid-area: x;
	font: 26px/44px monospace;
	color: var(--p_color);
}
.grid_content p:first-of-type {
	font-size: 30px;
}
a {
	background-color: transparent;
	color: var(--link);
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}
.form_input {
	display: block;
	position: relative;
	margin-top: 7px;
	padding-left: 4px;
	padding-right: 4px;
	width: 325px;
	height: 37px;
	background: var(--white);
	border: 1px solid #333;
	filter: drop-shadow(0 2px 0 rgba(0, 0, 0, 0.16));
	font-size: 12px;
	outline: none;
}
.form_input:focus {
	border: 1px solid var(--brown);
}
.form_input:nth-child(2) {
	margin-top: 17px;
}
.form_submit {
	display: block;
	position: relative;
	margin-top: 16px;
	margin-left: 21px;
	margin-right: 30px;
	padding-left: 2px;
	padding-right: 2px;
	float: left;
	width: 283px;
	height: 41px;
	font: 16px/38px Tinos, serif;
	letter-spacing: 1px;
	color: var(--gold);
	text-shadow: var(--text-shadow);
	white-space: nowrap;
	background-image: url(/img/general/general_window_main_btn.webp);
	background-repeat: repeat-x;
	background-position: 0 -41px;
	border: 0;
	cursor: pointer;
	outline: 0;
	clear: both;
}
.form_submit:hover {
	filter: brightness(110%);
}
.form_submit::before,
.form_submit::after {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	width: 21px;
	height: 41px;
	background-image: url(/img/general/general_window_main_btn.webp);
	background-repeat: no-repeat;
}
.form_submit::before {
	left: -21px;
	background-position: 0 0;
}
.form_submit::after {
	right: -21px;
	background-position: -21px 0;
}
input[type='checkbox'] {
	display: none;
}
input[type='checkbox'] + label {
	display: block;
	position: relative;
	margin-top: 17px;
	width: 28px;
	height: 28px;
	background: var(--white);
	border: 1px solid var(--black);
	border-radius: 1em;
	user-select: none;
	transition: background 0.1s ease-in-out;
	filter: drop-shadow(0 2px 0 rgba(0, 0, 0, 0.2));
	cursor: pointer;
	float: left;
}
input[type='checkbox'] + label::before {
	content: '';
	display: block;
	position: absolute;
	top: 2px;
	left: 2px;
	width: 20px;
	height: 20px;
	border-radius: 1em;
	border: 1px solid var(--black);
}
input[type='checkbox']:checked + label::before {
	background: linear-gradient(to bottom, #1D7F46 0%, #145b32 100%);
	box-shadow: -2px 0 5px rgba(0, 0, 0, 0.2);
	filter: drop-shadow(0 0 0 red);
}
label.text_label {
	display: block;
	position: relative;
	margin-left: 40px;
	padding-top: 15px;
	font-family: monospace;
	font-size: 16px !important;
	line-height: 16px;
	color: var(--link);
	cursor: pointer;
}
label.text_label:hover {
	filter: brightness(110%);
	text-decoration: underline;
}
.text_warning {
	margin-bottom: 15px;
	color: var(--brown);
	font-size: 16px;
	line-height: 16px;
}



/* - Achs - */
/* - Achs - */



/* - Contacts - */
/* - Contacts - */



/* - Docs - */
/* - Docs - */



/* - Main - */
.main_content {
	text-align: center;
}
.logo {
	margin-bottom: 30px;
	max-width: 100%;
	max-height: 650px;
}
.main_btn {
	width: 220px;
	text-align: center;
}
.btn_link {
	display: block;
	position: relative;
	width: 250px;
	margin: 0 auto;
}
/* - Main - */



/* - Insert - */
/* - Insert - */



/* - Loading - */
.progress_container,
.progress_bar,
.progress_snow {
	position: absolute;
	background-image: url(/img/loading.webp);
	background-repeat: no-repeat;
	user-select: none;
	transition: none;
}
.progress_container p,
.progress_bar {
	top: 0;
	left: 0;
}
.progress_container {
	top: 50%;
	left: 50%;
	margin-top: -21px;
	margin-left: -355px;
	width: 710px;
	height: 42px;
	background-position: 0 -16px;
	border-radius: 4px;
	text-align: center;
	font: 20px/37px 'Times New Roman', Times, serif;
	color: var(--white);
	text-shadow: var(--text-shadow);
}
.progress_container_mini {
	margin-left: -274px;
	width: 548px;
	background-position: 0 -116px;
	font: 18px/37px 'Times New Roman', Times, serif;
}
.progress_container p {
	position: absolute;
	width: 100%;
	height: 100%;
	z-index: 2;
	transition: none;
}
.progress_bar {
	width: 0%;
	max-width: 710px;
	height: 42px;
	background-position: 0 -58px;
	transition: width 0.5s ease-in;
	z-index: 1;
}
.progress_bar_mini {
	max-width: 548px;
	background-position: 0 -158px;
}
.progress_bar_completed {
	filter: hue-rotate(13deg);
}
.progress_snow {
	top: -16px;
	left: 53px;
	width: 603px;
	height: 16px;
	background-position: 0 0;
	z-index: 3;
}
.progress_snow_mini {
	left: 0;
	width: 548px;
	background-position: 0 -100px;
}
/* - Loading - */



/* - Login - */
/* - Login - */



/* - News - */
.news_all_btn {
	text-align: center;
	text-transform: uppercase;
}
/* - News - */



/* - Payment - */
/* - Payment - */



/* - Restore - */
/* - Restore - */



/* - Signup - */
/* - Signup - */
/* CONTENT */
/* -------------------------------------------------------------------------------------------------- */



/* -------------------------------------------------------------------------------------------------- */
/* FOOTER */
.footer {
}
/* FOOTER */
/* -------------------------------------------------------------------------------------------------- */



/* -------------------------------------------------------------------------------------------------- */
/* COOKIE */
.cookie {
	position: fixed;
	bottom: 20px;
	left: 20px;
	padding: 16px;
	min-width: 562px;
	max-width: 31%;
	background: linear-gradient(to left, var(--cookie_bg), var(--white));
	border-radius: 4px;
	box-shadow: var(--box-shadow);
	font: 16px/21px monospace;
	color: var(--cookie_color);
	cursor: pointer;
	z-index: 10;
}
.cookie:hover {
	color: var(--black);
}
.cookie span {
	border-bottom: 1px dashed;
	color: var(--black);
	opacity: 0.9;
}
.cookie span:hover {
	opacity: 0.6;
}
/* COOKIE */
/* -------------------------------------------------------------------------------------------------- */



/* -------------------------------------------------------------------------------------------------- */
/* MEDIA */
@media (max-width: 840px) {
	.cookie {
		min-width: var(--cookie_width);
		max-width: var(--cookie_width);
	}
}
/* MEDIA */
/* -------------------------------------------------------------------------------------------------- */