Bootstrap Snippet Service card using HTML CSS

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 ---------->
  <!-- starting the team section -->
  <section class="my-5">
    <div class="container">
      <div class="row">
        <div class="team-hire">
          <p><span class="text-primary">//</span> Team</p>
          <h3>We’re always available <br><span class="text-primary">when you need us most.</span></h3>
        </div>
        <div class="owl-carousel owl-theme">
          <div class="item text-center">
            <div class="card-desc ">
              <a href="https://www.fiverr.com/mohsin_desginer"><img src="https://i0.wp.com/www.eatbgroup.com/web/wp-content/uploads/descarga.jpg?fit=1000%2C667&ssl=1" alt="" width="50"></a>
              <a href="https://www.fiverr.com/mohsin_desginer">
                <h4 class="text-primary">Founder</h4>
                <p>Katherine Bregenzer</p>
              </a>
            </div>
            <div class="card-social-icon bg-primary">
              <a href="https://www.fiverr.com/mohsin_desginer/convert-to-figma-psd-sketch-pdf-to-html-complete-responsive"><i class="fab fa-facebook-f"></i></a>
              <a href="https://www.fiverr.com/mohsin_desginer/convert-to-figma-psd-sketch-pdf-to-html-complete-responsive"><i class="fab fa-twitter"></i></a>
              <a href="https://www.fiverr.com/mohsin_desginer/convert-to-figma-psd-sketch-pdf-to-html-complete-responsive"><i class="fab fa-behance"></i></a>
              <a href="https://www.fiverr.com/mohsin_desginer/convert-to-figma-psd-sketch-pdf-to-html-complete-responsive"><i class="fab fa-linkedin"></i></a>
              <a href="https://www.fiverr.com/mohsin_desginer/convert-to-figma-psd-sketch-pdf-to-html-complete-responsive"><i class="fab fa-youtube"></i></a>
            </div>
          </div>
          <div class="item text-center">
            <div class="card-desc ">
              <a href="https://www.fiverr.com/mohsin_desginer"><img src="https://i0.wp.com/www.eatbgroup.com/web/wp-content/uploads/descarga.jpg?fit=1000%2C667&ssl=1" alt="" width="50"></a>
              <a href="https://www.fiverr.com/mohsin_desginer">
                <h4 class="text-primary">CEO</h4>
                <p>Katherine Bregenzer</p>
              </a>
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
/******team section*******/
.team-hire h3 {
  font-size: 50px;
  letter-spacing: -1px;
  line-height: 60px;
  color: #001d23;
  font-weight: 500;
}
/***** card services ******/
.item {
  margin: 50px 30px 20px 0px;
}
.item .card-desc {
  position: relative;
  padding-bottom: 1px;
}
.item .card-desc a {
  text-decoration: none;
}
.item .card-desc h4 {
  margin: 0;
  margin-top: 10px;
  font-size: 20px;
  font-weight: 700;
}
.item .card-desc p {
  font-size: 16px;
  letter-spacing: -1px;
  color: #001d23;
  font-weight: 500;
}
.item .card-desc img{
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

1
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

"Service card"
Bootstrap 4.1.1 Snippet by Mohsin Mukhtar

Related: See More

Questions / Comments:

"Service card" Bootstrap 4.1.1 Snippet by Mohsin Mukhtar

Related: See More

Questions / Comments:

"Service card"
Bootstrap 4.1.1 Snippet by Mohsin Mukhtar