/input-form

## input-form
<!DOCTYPE html>
<html>
	<head>
	</head>
	<body>
		<div class="order-form">
			<h1>Закажите</h1>
			<div class="order-params">
				<div class="param red">
					<div class="inline-text">3x фазный</div>
					<div class="close-btn">×</div>
				</div>
				<div class="param green">
					<div class="inline-text">1x фазный</div>
					<div class="close-btn">×</div>
				</div>
			</div>
			<div class="order-details">
				<input class="amount-input" type="text" placeholder="Количество" />
				<input class="phone-input" type="text" placeholder="Телефон" />
				<button class="order-btn">ЗАКАЗАТЬ</button>
			<div>
		</div>
	</body>
</html>

<style>
	.order-form {
		color: #435D93;
		font-size: 14px;
		font-family: Arial;
		width: 292px;
	}

	.order-form h1 {
		font-size: 20px;
		font-weight: 100;
	}

	.order-form .order-params {
		display: inline-block;
		border: 1px black solid;
		padding: 4px;
		width: 100%;
	}

	.order-form .param {
		display: inline-block;
		color: white;
		font-size: 18px;
		padding: 4px 12px;
	}

	.order-form .param .inline-text {
		display: inline-block;
	}

	.order-form .param .close-btn {
		display: inline-block;
		border: 1px solid white;
		padding: 0px 6px;
		cursor: pointer;
	}

	.order-form .param.red {
		background-color: #EC8387;
	}

	.order-form .param.green {
		background-color: #3FC271;
	}

	.order-form .order-details input {
		padding: 10px 4px;
		font-size: 18px;
		display: block;
		width: 100%;
		margin: 18px 0;
		border: 1px solid #435D93;
		color: #435D93;
	}

	.order-form .order-details input::-webkit-input-placeholder {
		color: #435D93;
	}

	.order-form .order-btn {
		background-color: #435D93;
		color: white;
		padding: 14px 28px;
	}
</style>

<script>
	var closeBtns = document.querySelectorAll(".order-form .close-btn");
	for(var index = 0; index < closeBtns.length; index++){
		closeBtns[index].onclick = function() {
			this.parentElement.remove();
		};
	}
</script>
	<!DOCTYPE html>
	<html>
	<head>
	</head>
	<body>
	<div class="order-form">
	<h1>Закажите</h1>
	<div class="order-params">
	<div class="param red">
	<div class="inline-text">3x фазный</div>
	<div class="close-btn">×</div>
	</div>
	<div class="param green">
	<div class="inline-text">1x фазный</div>
	<div class="close-btn">×</div>
	</div>
	</div>
	<div class="order-details">
	<input class="amount-input" type="text" placeholder="Количество" />
	<input class="phone-input" type="text" placeholder="Телефон" />
	<button class="order-btn">ЗАКАЗАТЬ</button>
	<div>
	</div>
	</body>
	</html>

	<style>
	.order-form {
	color: #435D93;
	font-size: 14px;
	font-family: Arial;
	width: 292px;
	}

	.order-form h1 {
	font-size: 20px;
	font-weight: 100;
	}

	.order-form .order-params {
	display: inline-block;
	border: 1px black solid;
	padding: 4px;
	width: 100%;
	}

	.order-form .param {
	display: inline-block;
	color: white;
	font-size: 18px;
	padding: 4px 12px;
	}

	.order-form .param .inline-text {
	display: inline-block;
	}

	.order-form .param .close-btn {
	display: inline-block;
	border: 1px solid white;
	padding: 0px 6px;
	cursor: pointer;
	}

	.order-form .param.red {
	background-color: #EC8387;
	}

	.order-form .param.green {
	background-color: #3FC271;
	}

	.order-form .order-details input {
	padding: 10px 4px;
	font-size: 18px;
	display: block;
	width: 100%;
	margin: 18px 0;
	border: 1px solid #435D93;
	color: #435D93;
	}

	.order-form .order-details input::-webkit-input-placeholder {
	color: #435D93;
	}

	.order-form .order-btn {
	background-color: #435D93;
	color: white;
	padding: 14px 28px;
	}
	</style>

	<script>
	var closeBtns = document.querySelectorAll(".order-form .close-btn");
	for(var index = 0; index < closeBtns.length; index++){
	closeBtns[index].onclick = function() {
	this.parentElement.remove();
	};
	}
	</script>