JSFiddle - React, Tailwind, and code Playground

by Fizruke

HTML

<div class="in-feedback">
				<form class="wow fadeInLeftBig" data-wow-delay="0.3s" data-wow-offset="200"  >
					<p class="txt1">РАСЧИТАТЬ ЗАКАЗ</p>
					<p class="txt2">(Введите ваши данные для отправки заявки)</p>
					<input name="name" type="text" placeholder="Ваше имя" >
					<input name="phone-namber" type="text" placeholder="Ваш номер" id="phone" type="tel" name="phone" required="required" pattern="+([0-9]{1}) ([0-9]{3}) [0-9]{3}-[0-9]{2}-[0-9]{2}" >
					<input name="email" type="text" placeholder="E-mail">
					<textarea name="massage" placeholder="Сообщение"></textarea>
					<button>ОТПРАВИТЬ ЗАЯВКУ</button>
				</form>
			</div>

CSS

.form{
	float: left;
	border-radius:10px; 
	width:314px;
	background: rgba(160,188,207,.75);
	padding-top: 500px;
	margin-top: 51px;
	margin-bottom: 19px;
	height: 600px;
}
.feedback form input{
	font-family: Parangon;
	font-weight: normal;
	border:none;
	margin:0 25px 18px;
	border-radius: 5px;
	width: 457px;
	height: 62px;
	text-indent: 18px;
}
.feedback form textarea{
	font-family: Parangon;
	font-weight: normal;
	border-radius: 5px;
	width: 457px;
	min-height:105px;
	margin:0 22px 18px;
	text-indent:18px;
	padding-top:18px;
	resize: none;	
}
.feedback form button{	
	font-family: Parangon;
	font-weight: normal;
	background: #36AEEA;
	margin:17px 25px 18px 25px;
	width:457px;
	height:71px;
	border-radius: 10px;
	border: none;
	color:#fff;
}
.txt1{
	font-family: Parangon;
	font-size: 24px;
	font-weight: bold;
	color:#fff;
	text-align: center;
}
.txt2{
	font-family: Parangon;
	margin-top: -15px;
	display: block;
	font-size: 14px;
	color:rgba(0,0,0,.5);
	text-align: center;
}