"Contact Us Page Design witn Fontawsome Icon"
Bootstrap 3.0.0 Snippet by Divscodebd

Post to Facebook Tweet this

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="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<html>
<head>
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">
</head>
<body>
<section>
<div class="container">
<div class="col-md-4">
<iframe class="my-video" src="https://www.youtube.com/embed/_kvp5phEGLE" frameborder="0" gesture="media" allow="encrypted-media" allowfullscreen></iframe>
</div>
<div class="col-md-4">
<iframe class="my-video" src="https://www.youtube.com/embed/NAbuWCcGPG4" frameborder="0" gesture="media" allow="encrypted-media" allowfullscreen></iframe>
</div>
<div class="col-md-4">
<iframe class="my-video" src="https://www.youtube.com/embed/mc3aTxClUAk" frameborder="0" gesture="media" allow="encrypted-media" allowfullscreen></iframe>
</div>
<div class="col-md-12">
</div>
</div>
</section>
<section class="welcome-website">
<div class="container">
<div class="row mar-top-30">
<div class="col-sm-4">
<div class="box text-center contact-us-box">
<div class="incon-box">
<i class="fa fa-map" aria-hidden="true"></i>
</div>
<h3 class="box-tittle">Our Location </h3>
<p class="box-text">350 Fifth Avenue, 34th floor New York NY 10118-3299 USA</p>
</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
/********************************/
.welcome-website {
padding: 50px 0px;
background: #f5f5f5;
}
.box {
cursor: pointer;
box-shadow: 0px 2px 10px -4px #333745;
padding: 20px 0px;
margin-bottom: 20px;
background: #fff;
}
.incon-box i {
font-size: 35px;
color: #fff;
background: #00137f;
height: 55px;
width: 55px;
line-height: 50px;
border: 3px solid transparent;
transition: all .4s ease-in;
}
.my-video{
width:100%;
}
.box-tittle {
font-size: 20px;
text-transform: uppercase;
color: #333745;
line-height: 60px;
}
.box:hover .incon-box i {
background: #fff;
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Related: See More

Vue Material Kit
Simple & Clean 404 Error Page Design
Bootstrap 4 Navbar with Icon Top
Hamburger Icon Animations

Questions / Comments: