/* CSS Document */
html,
body,
.wrapper {
	margin: 0;
	padding: 0;
	height: 100%;
	width: 100%;
	position: relative;
}

body {
	background-color: #e9ece7;
}

body,
input,
textarea,
select,
.p {
	font-family: tablet-gothic-wide;
	font-weight: 300;
	font-size: 14px;
	color: #1e3e13;
	line-height: 20px;
}

.res-txt:not(:empty) {
	text-align: center;
	margin-top: 20px;
}

.wrapper {
	width: 100%;
	height: 100%;
	position: relative;
	background-color: #f8f9f8;
	overflow: auto;
}

.in-box-head {
	height: 70px;
	background-color: #1e3e13;
}

.inner-head {
	display: flex;
	width: 600px;
	margin: auto;
	position: relative;
}

.head-logo {
	width: 85px;
	height: 83px;
	background-position: center;
	background-repeat: no-repeat;
	background-image: url(../images/logo.png?id=284);
	background-size: cover;
	margin: 7px 5px 13px 0px;
}

.lang-txt {
	font-size: 12px;
	color: #fff;
	margin-top: 10px;
}

.lang-hhsk {
	margin-bottom: 4px;
}

.d-flex-in {
	flex-grow: 1;
}

.web_name {
	flex-grow: 1;
	margin: 0 15px;
}

.web_h2_t3 {
	margin-top: 36px;
	color: #879881;
	font-weight: bold;
	text-transform: uppercase;
}

.sign-in-msg {
	margin: 36px 20px 0;
	color: #fff;
	font-weight: bold;
	text-transform: uppercase;
}

.in-foot-left {
	display: flex;
}

.flag {
	width: 25px;
	height: 17px;
	background-position: center;
	background-repeat: no-repeat;
	background-color: #fff;
	background-image: url(../images/uk-flag.jpg);
	background-size: cover;
	margin: 35px 0 10px 0;
}

.se-flag {
	background-image: url(../images/sweden-flag.jpg);
}

.body-box {
	width: 600px;
	margin: auto;
	background-color: #e8ebe7;
	margin-top: 27px;
}

.in-box-body {
	padding: 30px;
}

.stages {
	display: none;
	height: 100%;
}

#stage0 {
	display: block;
}

.stage-h1 {
	font-size: 18px;
	font-weight: 500;
	margin-bottom: 25px;
	height: 24px;
	font-family: richmond-display;
}

.d-flex {
	display: flex;
}

.gut {
	flex-grow: 1;
}

.new-link {
	font-size: 12px;
	margin-top: 6px;
	cursor: pointer;
	color: #ed6608;
}

.inp-sec {
	margin-bottom: 25px;
}

.r-part {
	width: 50%;
}

.gap {
	width: 20px;
}

.inp-input {
	height: 35px;
	position: relative;
}

.input-box,
.select-box {
	box-sizing: border-box;
	border: 1px solid #ccc;
	width: 100%;
	height: 100%;
	border-radius: 3px;
	padding: 5px 10px;
	background: #fff;
}

span.small-txt {
	font-size: 12px;
	margin: 0 5px;
}

.showPassIcon {
	width: 25px;
	height: 17px;
	background-position: center;
	background-repeat: no-repeat;
	background-image: url(../images/eye-open.svg);
	background-size: 17px;
	margin: 10px 3px 10px 0px;
	position: absolute;
	top: 0;
	right: 0;
	cursor: pointer;
	opacity: .5;
}

.showPassIcon[data-id="1"] {
	opacity: 1;
}

.rem,
.rem1,
.rem2 {
	width: 17px;
	height: 17px;
	border: 2px solid #ed6608;
	border-radius: 2px;
	cursor: pointer;
	position: relative;
	background-color: #fff;
}

.rem1[data-id="1"] {
	background-color: #ed6608;
}

.rem[data-id="0"]:after,
.rem1[data-id="1"]:after,
.rem2[data-id="1"]:after {
	content: '';
	position: absolute;
	width: 4px;
	height: 8px;
	border: 3px solid #ffffff;
	border-left: 0;
	border-top: 0;
	left: 5px;
	top: 2px;
	transform: rotate(45deg);
}

.forgap {
	width: 10px;
}

.rem-txt,
.rem-txt-2 {
	cursor: pointer;
	line-height: 21px;
}

.forgot-txt {
	cursor: pointer;
	color: #ed6608;
}

.btn-box {
	margin-top: 20px;
}

.btn {
	text-align: center;
	height: 35px;
	line-height: 35px;
	background-color: #ed6608;
	color: #fff;
	border-radius: 3px;
	cursor: pointer;
	border: 0;
	transition: .2s all;
	box-sizing: border-box;
}

input.btn.submit-btn {
	width: 100%;
}

.footer {
	width: 600px;
	margin: auto;
}

.in-foot {
	padding: 0 25px;
	display: flex;
}

.in-foot-left {
	display: flex;
}

.in-foot-mid {
	flex-grow: 1;
}

.btn:hover {
	background-color: #ed6608;
	letter-spacing: 1px;
}

.bot-icon {
	background-image: url(../images/logo-bot.jpg);
	width: 76px;
	height: 26px;
	margin: 6px 0;
}

.loader-div {
	height: 45px;
	position: relative;
	display: none;
	padding: 0 10px;
	line-height: 45px;
	border-radius: 4px;
	width: 210px;
	margin: 12px auto 0;
	color: #990a0a;
}

.loader-div[data-id="1"] {
	display: block;
}

/* HTML: <div class="loader"></div> */
.loader-div[data-id="1"] .loader {
	width: 20px;
	aspect-ratio: 1;
	--c: no-repeat radial-gradient(farthest-side, #a10000 92%, #0000);
	background: var(--c) 50% 0,
		var(--c) 50% 100%,
		var(--c) 100% 50%,
		var(--c) 0 50%;
	background-size: 6px 6px;
	animation: l18 1s infinite;
	position: absolute;
	top: 13px;
}

.loader-div[data-id="1"] .loader::before {
	content: "";
	position: absolute;
	inset: 0;
	margin: 0px;
	background: repeating-conic-gradient(#0000 0 35deg, #a10000 0 90deg);
	-webkit-mask: radial-gradient(farthest-side, #0000 calc(100% - 2px), #a10000 0);
	border-radius: 50%;
	margin: -5px;
}

@keyframes l18 {
	100% {
		transform: rotate(.5turn)
	}
}

.loader-txt {
	text-align: center;
}

@media only screen and (max-width: 640px) {
	.body-box {
		width: auto;
		margin: 40px 8px;
	}

	.in-box-body {
		padding: 10px;
	}

	.inner-head {
		width: auto;
		margin: 0 15px;
	}
}

select#change-lang {
	border: 0;
	font-size: 13px;
	width: 83px;
	height: 21px;
	outline: none;
}