/* Новая форма */

#contact-container {
	display: flex;
	justify-content: center;
	padding-inline: 10%;
	background-image: transparent;

	@media all and (min-width: 0px) and (max-width: 950px) {
		padding-inline: 0%;
	}
	@media all and (min-width: 950px) {
		padding-inline: 10%;
	}
}

#contact-container:hover {
	border-color: transparent;
}

#contact {
	color: white;
	width: 100%;
	
	border: solid 2px;
	border-color: transparent;
	border-radius: 10px;
	transition: border-color 0.3s ease-in-out;
}

#contact a {
	color:rgb(211, 161, 25);
	text-decoration-color: rgb(211, 161, 25);
}

#contact h2 {
		text-align: center;
		font-weight: 100;
		font-size: 1.3rem;
		margin-bottom: 10px;
}

#contact:hover {
	border-color: transparent;
}

#inline-form {
	display: flex;
	flex-direction: column;
	padding-inline: 30%;
	@media all and (min-width: 0px) and (max-width: 950px) {
		padding-inline: 5%;
	}
	@media all and (min-width: 950px) {
		padding-inline: 30%;
	}

	font-size: 1em;
	.normal {
		display: flex;
		align-items: baseline;
		margin-block: 5px;
		flex-direction: row;
		label {
			width: 40%;
			text-align: left;
			margin-bottom: 0px;
		}
		* {
			font-family: "Rubik", sans-serif;
			font-size: 1em;
			font-weight: 100;
		}
		input {
			width: 60%;
		}
		select {
			width: 60%;
		}
		textarea {
			width: 60%;
		}

		@media all and (min-width: 0px) and (max-width: 575px) {
			align-items: center;
			flex-direction: column;
			label {
				width: 100%;
				text-align: center;
				margin-bottom: 5px;
			}
			input {
				width: 100%;
			}
			select {
				width: 100%;
			}
			textarea {
				width: 100%;
			}
		}
		@media all and (min-width: 575px) {
			align-items: baseline;
			flex-direction: row;
			label {
				width: 40%;
				text-align: left;
				margin-bottom: 0px;
			}
			input {
				width: 60%;
			}
			select {
				width: 60%;
			}
			textarea {
				width: 60%;
			}
		}
		#phoneInput {
			letter-spacing: 1px;
		}
	}
	#consent-container {
		display: flex;
		justify-content: center;
	}
	#submit-div {
		text-align: center;
		#submit {
			margin-top: 10px;
			padding-block: 10px;
			padding-inline: 25px;
			font-size: 1em;
		}
	}
}
.errors {
	display: flex;
	flex-direction: column;
	margin-block: 0em;
	li {
		color: lightcoral;
	}
}



/* Всплывающее окно */
#after-submit-popup {
	display: none;
	justify-content: center;
	align-items: center;
	text-align: center;
	flex-direction: column;
	position: fixed;
	width: 100vw;
	height: 100vh;
	background-color: rgba(0, 0, 0, 0.8);
	z-index: 12;
	#close {
		display: flex;
		flex-direction: row;
		justify-content: center;
		align-items: center;
		width: 100%;
		height: 20vw;
		border-radius: 20px;
		background-color: transparent;
		transition: background-color 0.2s ease-in-out;
		text-decoration: goldenrod solid 2px;
		#close-text {
			font-size: 2em;
			color: goldenrod;
		}
		#close-img {
			height: 30px;
		}
		* {
			margin-inline: 20px;
		}
	}
	#close:hover {
		background-color: rgba(255, 255, 255, 0.5);
	}
	#popup-header {
		margin-top: 0px;
		font-size: 5em;
		font-weight: 100;
		color: white;
		text-shadow: -5px -5px 0 green;
		
		@media all and (min-width: 0px) and (max-width: 600px) {
			font-size: 3em;
			text-shadow: -3px -3px 0 green;
		}
		@media all and (min-width: 600px) {
			font-size: 5em;
			text-shadow: -5px -5px 0 green;
		}
	}
	#checkmark {
		width: 50%;
		height: 50%;
		@media all and (min-width: 0px) and (max-width: 600px) {
			width: 80%;
		}
		@media all and (min-width: 600px) {
			width: 50%;
		}
	}
	#popup-desc {
		font-weight: 100;
		color: white;
		text-shadow: -2px -2px 0 green;
	}
}