div[id].popup-form-wrapper {
	width: 100%;
	height: 100vh;
	position: fixed;
	display: none;
	align-items: center;
	justify-content: center;
	left: 0;
	top: 0;
	z-index: -1111;
	background: rgba(164, 164, 164, 0.50);
	backdrop-filter: blur(10px);
}

div[id].popup-form-wrapper.active {
	display: flex;
	z-index: 1111;
}

div[id].popup-form-wrapper .form-block {
	background-color: #FFF;
	padding: 60px;
	height: fit-content;
	position: relative;
	width: 50%;
	max-height: 100vh;
	box-sizing: border-box;
	overflow-y: auto;
}

div[id].popup-form-wrapper .form-block > h3 {
	font-family: 'Cormorant Garamond',sans-serif;
	font-size: 40px;
	color: #000;
	text-transform: uppercase;
	font-weight: 700;
}

div[id].popup-form-wrapper .rules {display: none;}

div[id].popup-form-wrapper button.close {
	position: absolute;
	width: 60px;
	height: 60px;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	z-index: 111;
	right: 10px;
	top: 10px;
}

div[id].popup-form-wrapper button.close:before,
div[id].popup-form-wrapper button.close:after {
	content: '';
	height: 3px;
	width: 70%;
	background-color: #000;
	position: absolute;
}

div[id].popup-form-wrapper button.close:before {transform: rotate(-45deg);}
div[id].popup-form-wrapper button.close:after {transform: rotate(45deg);}

div[id].popup-form-wrapper form {
	display: flex;
	flex-direction: column;
	margin-top: 40px;
}

div[id].popup-form-wrapper .label {
	display: flex;
	flex-direction: column;
}

div[id].popup-form-wrapper form .label:not(:last-child) {margin-bottom: 20px;}

div[id].popup-form-wrapper .title {
	margin-bottom: 10px;
	font-size: 14px;
	position: relative;
	color: #ABABAB;
	display: block;
	width: fit-content;
}

div[id].popup-form-wrapper .label--required .title:after {
	content: '*';
	position: absolute;
	right: -4px;
	top: -4px;
	font-size: inherit;
	color: #E4000D;
}

div[id].popup-form-wrapper .label input {
	padding: 12px;
	border: 1px solid #DCDCDC;
	display: block;
	width: 100%;
	box-sizing: border-box;
	color: #000;
}

div[id].popup-form-wrapper .label input::placeholder {
	font-size: inherit;
	color: #9A9A9A;
	line-height: inherit;
}

div[id].popup-form-wrapper .label input:focus::placeholder {font-size: 0;} 

div[id].popup-form-wrapper .forgotten-btn {
	margin-top: 20px;
	margin-bottom: 20px;
	color: #EF4751;
	font-size: 14px;
}

div[id].popup-form-wrapper .buttons-block {
	display: flex;
	flex-direction: column;
}

div[id].popup-form-wrapper button[type=submit],
div[id].popup-form-wrapper .buttons-block > a {
	font-size: 16px;
	font-weight: 600;
	text-transform: uppercase;
	padding: 20px 40px;
	box-sizing: border-box;
	width: 100%;
	text-align: center;
	cursor: pointer;
	border: solid 1.5px #EF4751;
}

div[id].popup-form-wrapper .buttons-block:after {
	content: '';
	width: 100%;
	margin: 30px 0;
	height: 1.5px;
	background-color: #DCDCDC;
	order: 2;
}

div[id].popup-form-wrapper button[type=submit],
div[id].popup-form-wrapper .buttons-block button {
	background-color: #EF4751;
	color: #FFF;
	order: 1;
}

div[id].popup-form-wrapper .buttons-block a {
	order: 3;
	color: #161616;
}



div[id].popup-form-wrapper .rules span {
	font-size: 14px;
	color: #161616;
	line-height: 1.3;
}

div[id].popup-form-wrapper .rules a {
	color: #E4000D;
	font-size: inherit;
	font-weight: inherit;
	line-height: inherit;
}

div[id].popup-form-wrapper .rules input {
	display: none;
}

div[id].popup-form-wrapper .top-block {
	margin-bottom: 40px;
	display: flex;
	flex-direction: column;
}

div[id].popup-form-wrapper .top-block h3 {
	margin-bottom: 20px;
	font-size: 40px;
	font-family: 'Cormorant Garamond', sans-serif;
	text-transform: uppercase;
	color: #000;
}

div[id].popup-form-wrapper .top-block span {
	color: #161616;
	font-size: 14px;
	line-height: 1.3;
}

@media only screen and (max-width: 1020.99px) {
	div[id].popup-form-wrapper .form-block {
		padding: 40px;
	}

	div[id].popup-form-wrapper button.close {
		top: 0;
		right: 0;
		width: 40px;
		height: 40px;
	}

	div[id].popup-form-wrapper .form-block {
		width: 100%;
		max-width: 480px;
	}

	div[id].popup-form-wrapper .form-block > h3 {
		font-size: 30px;
	}

	div[id].popup-form-wrapper .title {font-size: 12px;}

	div[id].popup-form-wrapper form {margin-top: 30px;}

	div[id].popup-form-wrapper form .label:not(:last-child) {margin-bottom: 15px;}

	div[id].popup-form-wrapper .label input {
		padding: 8px 10px;
		font-size: 14px;
	}

	div[id].popup-form-wrapper button[type=submit], 
	div[id].popup-form-wrapper .buttons-block > a {font-size: 14px;}

	div[id].popup-form-wrapper .buttons-block:after {margin: 20px 0;}
}

@media only screen and (max-width: 1020.99px) {
	div[id].popup-form-wrapper .form-block > h3,
	div[id].popup-form-wrapper .top-block h3 {
		font-size: 20px;
	}

	div[id].popup-form-wrapper form {margin-top: 20px;}

	div[id].popup-form-wrapper .title {
		font-size: 10px;
		margin-bottom: 5px;
	}

	div[id].popup-form-wrapper .label input {font-size: 12px;}

	div[id].popup-form-wrapper button.close {
		top: 10px;
		right: 10px;
		width: 30px;
		height: 30px;
	}

	div[id].popup-form-wrapper button[type=submit], 
	div[id].popup-form-wrapper .buttons-block > a {
		padding: 12px 0;
		font-size: 12px;
	}

	div[id].popup-form-wrapper .buttons-block:after {margin: 10px 0;}

	div[id].popup-form-wrapper .top-block {margin-bottom: 20px;}

	div[id].popup-form-wrapper .top-block span {font-size: 10px;}
}