.form,
.form * {
	box-sizing: border-box;
	position: relative
}
.form {
	color: #707070;
	font-size: 14px
}
.form_narrow {
	width: 580px
}
.form_accent {
	background: #E5E5E5;
	margin-top: 40px;
	padding: 45px 20px 30px 20px
}

.form_accent .form__title {
	background: var(--color-main);
	-webkit-box-shadow: 3px 3px 0 var(--color-accent_dark);
			box-shadow: 3px 3px 0 var(--color-accent_dark);
	-webkit-clip-path: polygon(0% 0%, 107% 2%, 121% 109%, 0% 112%);
			clip-path: polygon(0% 0%, 107% 2%, 121% 109%, 0% 112%);
	color: #FFF;
	font-weight: 600;
	font-size: 14px;
	padding: 16px 20px;
	position: absolute;
	top: -25px;
	text-align: center;
	text-transform: uppercase
}

.form__field {
	margin-bottom: 16px
}
.form__field-buttons {
	margin-top: 20px
}

.form__label {
	display: block;
	font-weight: 700;
	margin-bottom: 8px
}

.form__input-wrapper {
	width: 100%
}

.form__input,
.form__textarea,
.form__select {
	background: #FFF;
	border: 1px solid #C4C4C4;
	color: #000;
	width: 100%
}
.form__input {
	line-height: 40px;
	padding: 0 12px;
	height: 40px
}
.form__input[type="password"] {
	padding-right: 36px
}
.form__input_readonly {
	background-color: #EEE
}
.form__textarea {
	padding: 12px;
	height: 120px
}
.form__select {
	padding: 0 12px;
	height: 40px
}

.form__input.input-right,
.form__textarea.input-right {
	box-shadow: inset 0 0 0 4px var(--color-main) !important
}
.form__input.input-wrong,
.form__textarea.input-wrong {
	box-shadow: inset 0 0 0 4px var(--color-alert) !important
}

.form__pass-eye {
	background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABEAAAALCAMAAACu/pY1AAAAM1BMVEUAAABwcHBwcHBwcHBxcXFwcHBxcXFwcHBwcHBwcHBwcHBwcHBwcHBwcHBwcHBwcHBwcHBc/jsoAAAAEHRSTlMAECBQX2BvcH+Aj5CfoN/vmRlCKAAAAGdJREFUeNo1jAESxCAIA0N6nKK28v/XNmXaHUYDJKAwjxEH8cG1M1W5iOKnZhoYGjeIrmWATkypDvxTkDs3LUXDk7/ger30Rkth5WF5gNA3QOd7UTSZO2FDEUfB88mrFvHBI2a4lb4BQn0F2C6is2gAAAAASUVORK5CYII=') 50% 50% no-repeat;
	border: 0;
	cursor: pointer;
	padding: 0;
	position: absolute;
	right: 10px; top: 50%;
	-webkit-transform: translateY(-50%);
			transform: translateY(-50%);
	width: 20px; height: 20px;
	z-index: 8
}
.form__pass-eye.active {
	-webkit-filter: sepia(100%) hue-rotate(-40deg) saturate(600%);
			filter: sepia(100%) hue-rotate(-40deg) saturate(600%)
}

.form__checkbox {
	display: block;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	width: 16px; height: 16px
}
.form__checkbox-input {
	position: absolute;
	opacity: 0;
	height: 0; width: 0
}
.form__checkbox-mark,
.styled-checkbox {
	background-color: #FFF;
	border: 3px solid var(--color-alert);
	display: block;
	-webkit-box-shadow: 3px 3px 0 var(--color-accent_dark);
			box-shadow: 3px 3px 0 var(--color-accent_dark);
	width: 16px; height: 16px
}
.form__checkbox-input:not(:disabled) + .form__checkbox-mark {
	cursor: pointer
}
.form__checkbox:hover > .form__checkbox-input:not(:checked):not(:disabled) + .form__checkbox-mark,
.form__checkbox-input:focus + .form__checkbox-mark,
.styled-checkbox:focus {
	background-color: var(--color-alert)
}
.form__checkbox-input:not(:focus):checked + .form__checkbox-mark,
.styled-checkbox.active {
	background-color: var(--color-main);
	border-color: var(--color-main)
}
.form__checkbox-mark::after,
.styled-checkbox::after {
	-webkit-box-shadow: inset 1em 1em #FFF;
			box-shadow: inset 1em 1em #FFF;
	content: '';
	display: block;
	-webkit-clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
			clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
	-webkit-transform: scale(0);
			transform: scale(0);
	transform-origin: bottom left;
	transition: 120ms transform ease-in-out;
	width: 90%; height: 90%
}
.form__checkbox-input:checked ~ .form__checkbox-mark::after,
.styled-checkbox.active::after {
	-webkit-transform: scale(1);
			transform: scale(1)
}

.form__input-file {
	position: absolute;
	visibility: hidden
}
.form__input-file-closure {
	color: #FF1616;
	cursor: pointer;
	display: inline-block;
	font-weight: 600;
	padding: 5px
}

.form__note {
	margin-top: 6px
}
.form__footnote {
	font-style: italic;
	font-size: 12px;
	margin: 20px 0;
	padding-left: 20px
}
.form__footnote::before {
	color: var(--color-alert);
	content: '*';
	font-size: 24px;
	position: absolute;
	left: 0; top: -2px
}

.form-signup__variants {
	border: 1px solid #C4C4C4;
	font-size: 14px;
	max-width: 580px
}
.form-signup__variant {
	border: 1px solid #C4C4C4;
	cursor: pointer;
	padding: 10px
}
.form-signup__variant:hover {
	background-color: #C4C4C4;
}
.form-signup__variant-data:not(:last-child) {
	margin-bottom: 10px
}
.form-signup__variant-data_accent {
	color: #000;
	font-weight: 700
}

.form_feedback-wrapper {
	-webkit-filter: drop-shadow(3px 4px 0 var(--color-accent_dark));
			filter: drop-shadow(3px 4px 0 var(--color-accent_dark))
}
.form_feedback {
	background: var(--color-accent_light);
	-webkit-clip-path: polygon(2% 0%, 99% 1%, 101% 100%, 0% 99%);
			clip-path: polygon(2% 0%, 99% 1%, 101% 100%, 0% 99%);
	padding: 35px 25px 40px 25px;
	margin-top: 40px
}
.form_feedback .form__label {
	color: var(--color-accent_dark)
}
.form__field-buttons_feedback {
	position: absolute;
	left: 25px; bottom: -16px
}

.custom-checkbox__input {
	cursor: pointer
}