@font-face {
    font-family: 'agrandirtight';
    src: url('/webfonts/Agrandir-HelloFresh_Regular.woff2') format('woff2'),
         url('/webfonts/Agrandir-HelloFresh_Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'agrandirtight_heavy';
    src: url('/webfonts/Agrandir-HelloFresh_Medium.woff2') format('woff2'),
         url('/webfonts/Agrandir-HelloFresh_Medium.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
body {
	font-family: agrandirtight, Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif"; 
	background-color: #96DC14;
	padding: 0px;
	margin: 0px;
	-webkit-font-smoothing: antialiased;  /* for Webkit browsers */
	-moz-osx-font-smoothing: grayscale;   /* for Firefox on macOS */
	overflow: hidden;
}
strong {
	font-family: agrandirtight_heavy, Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif";
    font-weight: normal;
}

.error {
	display: block;
	color: #DD0000;
	text-align: center;
	margin: 20px 0px;
}
.left {
	float: left;
	width: calc(50% - 80px);
	padding: 40px;
	background-color: #fff;
	height: calc(100vh - 80px);
	overflow-x: auto;
}
p {
	font-size: 18px;
	line-height: 28px;
	margin: 50px 0px 40px 0px;
}
.right {
	float: left;
	width: 50%;
	height: 100vh;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	background-image: url("/images/bgimg.jpg");
}
.right.p2 {
	background-image: url("/images/bgimg2.jpg");
}
.left img {
	margin: 0px 0px 30px 0px;
    max-width: 250px;
    width: 80%;
    display: block;
}
.left img.tefal {
	margin: 0px auto;
    max-width: 250px;
    width: 80%;
    display: block;
}
.where {
	display: block;
	position: relative;
	text-align: center;
}
.where span {
	display: none;
	width: 300px;
	background-color: #000;
	color: #fff;
	text-align: center;
	position: absolute;
	top: 20px;
	left: calc(50% - 170px);
	padding: 20px;
}
.where:hover span, .where:focus span {
	display: block;
}
form {
	display: block;
	max-width: calC(1000px - 80px);
	width: calC(100%);
	margin: 0px auto;
	text-align: left;
	background-color: #fff;
}

.blocks-input {
	display: flex;
	gap: 0.75em;
	margin: 30px 0px 0px 0px;
	justify-content: center; 
}

.blocks-input span {
	display: none;
}
.terms {
	display: block;
	text-align: center;
	text-decoration: none;
	color: #067a46;
}
input {
	height: 50px;
	text-align: left;
	line-height: 55px;
	font-size: 28px;
	font-family: agrandirtight, Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif"; 
	font-weight: bold;
	border: 2px solid #067a46;
	border-radius: 8px;
	background: #fff;
	transition: border-color 0.2s, box-shadow 0.2s;
	outline: none;
	color: #067a46;
	box-shadow: 0 2px 8px rgba(60,60,60,0.03);
	padding: 5px 10px 0px 10px;
}
input::placeholder {
	font-family: agrandirtight, Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif"; 
	color: #067a46;        /* Set your desired color here */
	font-weight: 900;  /* Or use 400, 500, etc. */
	font-size: 24px;
}
.blocks-input input {
	height: 65px;
    width: 100%;
	text-align: center;
	text-transform: uppercase;
	padding: 5px 0px 0px 0px;
	font-family: agrandirtight_heavy, Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif";
}
.blocks-input input.mr {
	margin: 0px 20px 0px 0px;
}
.enterdata input {
	display: block;
	margin: 0px auto 10px auto;
	width: 90%;
	text-align: center;
	max-width: 500px;
}
input[type=submit] {
    display: block !important;
    width: 100% !important;
	text-align: center;
    margin: 30px auto 0px auto;
    padding: 2px 20px;
	background: #067a46!important;
	height: 55px!important;
	color: #fff;
}
input[type=submit]:disabled {
	opacity: 0.2;
}

.blocks-input input:focus {
	border-color: #3498db;
	background: #eaf6ff;
}
@media only screen and (max-width: 1400px) {
	/*
	.blocks-input input {
		height: 55px;
		width: 36px;
	}*/
}
@media only screen and (max-width: 1330px) {
	.blocks-input {
		display: flex;
		gap: 0.5em;
		margin: 30px 0px 0px 0px;
		justify-content: center; 
	}
/*
	.blocks-input input {
		height: 55px;
		width: 32px;
		text-align: center;
		line-height: 50px;
		font-size: 26px;
	}
	*/
}
@media only screen and (max-width: 1200px) {
	.blocks-input {
		display: flex;
		gap: 0.5em;
		margin: 30px 0px 0px 0px;
		justify-content: center; 
	}

	/*
	.blocks-input input {
		height: 50px;
		width: 28px;
		text-align: center;
		line-height: 50px;
		font-size: 26px;
	}*/
	
}
@media only screen and (max-width: 1100px) {
	.blocks-input {
		display: flex;
		gap: 0.3em;
		margin: 30px 0px 0px 0px;
		justify-content: center; 
	}
/*
	.blocks-input input {
		height: 50px;
		width: 28px;
		text-align: center;
		line-height: 50px;
		font-size: 26px;
	}*/
	.blocks-input input.mr {
		margin: 0px 10px 0px 0px;
	}	
}
@media only screen and (max-width: 1000px) {
	body {
		overflow: auto;
	}
	.left {
		display: block;
		float: none;
		width: calc(100% - 40px);
		padding: 20px;
		height: auto;
	}
	.left img {
		margin: 0px auto 20px auto;
		max-width: 200px;
		width: 80%;
		display: block;
	}

	.right {
		display: block;
		float: none;
		width: 100%;
		height: 50vh;
	}
/*	.blocks-input {
		display: flex;
		gap: 0.2em;
		margin: 30px 0px 0px 0px;
		justify-content: center; 
	}

	.blocks-input input {
		height: 60px;
		width: 45px;
		padding: 0px;
		text-align: center;
		line-height: 60px;
		font-size: 28px;
	}*/
	.blocks-input input.mr {
		margin: 0px 5px 0px 0px;
	}	

	p {
		font-size: 18px;
		line-height: 24px;
		margin: 20px 0px;
	}
	.blocks-input {
		display: block;
		justify-content: center; 
	}
	.blocks-input span {
		display: block;
		width: 100%;
		height: 10px;
	}
	form {
		display: block;
		max-width: calc(1000px - 80px);
		width: calC(100% - 40px);
		margin: 0px auto;
		text-align: center;
		background-color: #fff;
	}
	.enterdata input {
		font-size: 20px;
		padding: 0px 10px;
		height: 45px;
	}

}