"Contact Info"
Bootstrap 4.1.1 Snippet by Nemra1

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<!-- CONTACT SECTION -->
<section id="contact" class="parallax-section">
<div class="container">
<div class="row">
<div class="col-md-12 col-sm-12">
<!-- SECTION TITLE -->
<div class="wow fadeInUp section-title" data-wow-delay="0.2s">
<h2>Get in touch</h2>
<p>Lorem ipsum dolor sit amet, consectetur venenatis tincidunt.</p>
</div>
</div>
<div class="col-md-7 col-sm-10">
<!-- CONTACT FORM HERE -->
<div class="wow fadeInUp" data-wow-delay="0.4s">
<form id="contact-form" action="#" method="get">
<div class="col-md-6 col-sm-6">
<input type="text" class="form-control" name="name" placeholder="Name" required="">
</div>
<div class="col-md-6 col-sm-6">
<input type="email" class="form-control" name="email" placeholder="Email" required="">
</div>
<div class="col-md-12 col-sm-12">
<textarea class="form-control" rows="5" name="message" placeholder="Message" required=""></textarea>
</div>
<div class="col-md-offset-8 col-md-4 col-sm-offset-6 col-sm-6">
<button id="submit" type="submit" class="form-control" name="submit">Send Message</button>
</div>
</form>
</div>
</div>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
/*---------------------------------------
Contact section
-----------------------------------------*/
.contact-info .fa {
padding-right: 5px;
}
#contact .form-control {
border: none;
border-bottom: 2px solid #f0f0f0;
border-radius: 0px;
box-shadow: none;
font-size: 18px;
margin-top: 10px;
margin-bottom: 10px;
-webkit-transition: all ease-in-out 0.4s;
transition: all ease-in-out 0.4s;
}
#contact .form-control:focus {
border-bottom-color: #999999;
}
#contact input {
height: 55px;
}
#contact button#submit {
background: #2b2b2b;
border: none;
border-radius: 50px;
color: #ffffff;
height: 50px;
margin-top: 24px;
}
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Related: See More


Questions / Comments: