"Service Section with Youtube Embed Video"
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>
<title>Service Section Design</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
</head>
<body>
<div class="container">
<div class="row mar-top-30">
<div class="col-sm-4">
<div class="box text-center">
<div class="incon-box">
<i class="fa fa-truck" aria-hidden="true"></i>
</div>
<h3 class="box-tittle">Free Shipping</h3>
<p class="box-text">Free Shipping on All Oder $199</p>
</div>
</div>
<div class="col-sm-4">
<div class="box text-center">
<div class="incon-box">
<i class="fa fa-usd" aria-hidden="true"></i>
</div>
<h3 class="box-tittle">Money Back</h3>
<p class="box-text">100% Money Back Guarantee</p>
</div>
</div>
<div class="col-sm-4">
<div class="box text-center">
<div class="incon-box">
<i class="fa fa-yelp" aria-hidden="true"></i>
</div>
<h3 class="box-tittle">Online Support</h3>
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
.box {
cursor: pointer;
box-shadow: 0px 2px 10px -4px #333745;
padding: 20px 0px;
margin-bottom: 20px;
}
.incon-box i {
font-size: 35px;
color: #fff;
background: #f82e56;
height: 55px;
width: 55px;
line-height: 50px;
border: 3px solid transparent;
transition: all .4s ease-in;
}
.box-tittle {
font-size: 20px;
text-transform: uppercase;
color: #333745;
line-height: 60px;
}
.box:hover .incon-box i {
background: #fff;
border: 3px solid #f82e56;
color: #f82e56;
transition: all .4s ease-in;
}
.mar-top-30{
margin-top: 30px;
}
.box iframe{
width: 100%;
height: 180px;
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Related: See More

Vue Material Dashboard PRO
Our Team section using bootstrap 4
Team Design Section with Pure CSS Effect
Services section using bootstrap 4

Questions / Comments: