<section class="form-section form-inner">
<div class="container">
<div class="sec-title light">
<span class="title">Your Question</span>
<h2>Request To Call Back</h2>
</div>
<div class="request-form">
<!--Comment Form-->
<form method="post" action="blog.html">
<div class="row">
<div class="col-lg-4 col-md-6 col-sm-12 form-group">
<input type="text" name="username" placeholder="Name" required="">
</div>
<div class="col-lg-4 col-md-6 col-sm-12 form-group">
<input type="email" name="email" placeholder="Email" required="">
</div>
<div class="col-lg-4 col-md-12 col-sm-12 form-group">
<input type="text" name="phone" placeholder="Phone" required="">
</div>
<div class="col-lg-4 col-md-12 col-sm-12 form-group">
<input type="text" name="subject" placeholder="Subject" required="">
</div>
<div class="col-lg-4 col-md-6 col-sm-12 form-group">
<textarea name="message" placeholder="Massage"></textarea>
</div>
<div class="col-lg-4 col-md-6 col-sm-12 form-group">
<button class="btn btn-dark" type="submit" name="submit-form">Submit Now</button>
</div>
</div>
</form>
</div>
</div>
</section>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<link href="https://fonts.googleapis.com/css?family=Poppins:300,400,500&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<link href="https://fonts.googleapis.com/css?family=Poppins:300,400,500&display=swap" rel="stylesheet">
<style>
body { font-size: 18px; font-family: 'Poppins', sans-serif;}
.form-section{
position: relative;
background-repeat: no-repeat;
background-position: center;
background-size: cover;
padding:95px 0 0px;
}
.form-section:before{
position:absolute;
right: 50%;
top: 0;
height: 100%;
width: 50%;
background-image: url(../images/icons/pattern.png);
content: '';
background-repeat: repeat;
background-position: center top;
margin-right: 360px;
}
.form-section .form-column{
position: relative;
}
.form-section .sec-title{
margin-bottom: 50px;
}
.form-section .form-group{
position:relative;
margin-bottom:30px;
}
.request-form .form-group input[type="text"],
.request-form .form-group input[type="email"],
.request-form .form-group input[type="url"],
.request-form .form-group textarea,
.request-form .form-group select{
position: relative;
display: block;
width: 100%;
font-size: 14px;
color: #bbbbbb;
line-height: 20px;
padding: 15px 28px;
border: 1px solid #bbbbbb;
background-color: #ffffff;
font-weight: 400;
border-radius: 25px;
-webkit-transition: all 300ms ease;
-moz-transition: all 300ms ease;
-ms-transition: all 300ms ease;
-o-transition: all 300ms ease;
transition: all 300ms ease;
}
.request-form .form-group input:focus,
.request-form .form-group select:focus,
.request-form .form-group textarea:focus{
border-color:#ff7e00;
}
.request-form .form-group textarea{
height: 200px;
resize: none;
padding-top: 25px;
}
.request-form .form-group button{
text-transform: capitalize;
font-size: 14px;
padding: 15px 50px;
line-height: 20px;
}
.form-section .image-column{
position: relative;
text-align: center;
}
.form-section .image-column .inner-column{
position: relative;
}
.form-section .image-column .image{
position: relative;
margin-bottom: 0;
}
.form-section .image-column .image img{
max-width: 100%;
height: auto;
display: inline-block;
}
.form-section.form-inner{
position: relative;
background-color: #ff7e00;
padding: 100px 0 60px;
}
.form-section.form-inner:before{
display: none;
}
.form-section.form-inner .sec-title{
margin-bottom: 75px;
}
.form-section.form-inner .sec-title .title{
color: #ffffff;
}
.form-section.form-inner .sec-title h2{
color: #222222;
}
.form-section.form-inner .sec-title h2:before{
background-color: #ffffff;
}
.form-section.form-inner .sec-title h2:after{
background-color: #222222;
}
.form-section.form-inner .request-form .form-group{
margin-bottom: 40px;
}
.form-section.form-inner .request-form .form-group input[type="text"],
.form-section.form-inner .request-form .form-group input[type="email"],
.form-section.form-inner .request-form .form-group input[type="url"],
.form-section.form-inner .request-form .form-group textarea,
.form-section.form-inner .request-form .form-group select{
background-color: rgba(255,255,255,.10);
border: 1px dashed #ffffff;
color: #ffffff;
padding: 20px 38px;
height: 60px;
}
.form-section.form-inner .request-form .form-group button{
padding: 20px 50px;
font-weight: 400;
}
</style>