January 29, 2022

Our Services with counter

<div class="bg-gray"> 
    <div class="container">
        <div class="row align-items-md-center mb-5">
<div class="col-md-6 pr-5">
<div class="heading-block mb-4 nobottomborder">
<div class="before-heading">Know More</div>
<h2 class="heading">Work Together, Build Together.</h2>
</div>
<div class="row">
<div class="col-6 col-sm-6 mb-4">
<div class="counter">3+</div>
<h5 class="mt-0">Branches</h5>
</div>
<div class="col-6 col-sm-6 mb-4">
<div class="counter">37+</div>
<h5 class="mt-0">Single Studios</h5>
</div>
<div class="col-6 col-sm-6 mb-4">
<div class="counter">21+</div>
<h5 class="mt-0">Events per Month</h5>
</div>
<div class="col-6 col-sm-6 mb-4">
<div class="counter">4500+</div>
<h5 class="mt-0">Active Members</h5>
</div>
</div>
<p class="text-muted">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Assumenda praesentium eius, similique reprehenderit ab voluptatibus eaque.</p>
</div>
<div class="col-md-3 col-sm-6">
<div class="card shadow-sm border-light">
<img src="https://images.pexels.com/photos/461198/pexels-photo-461198.jpeg?auto=compress&cs=tinysrgb&dpr=1&w=500" alt="Featured image 1" class="card-img-top">
<div class="card-body">
<h5 class="card-title  color">Food name</h5>
<p class="card-text">Some quick example text to build on the card title.</p>
</div>
</div>
<div class="card shadow-sm border-light mt-4">
<img src="https://images.pexels.com/photos/376464/pexels-photo-376464.jpeg?auto=compress&cs=tinysrgb&dpr=1&w=500" alt="Featured image 2" class="card-img-top">
<div class="card-body">
<h5 class="card-title  color">Another food fame</h5>
<p class="card-text">Some quick example text. similique reprehenderit ab voluptatibus eaque.</p>
</div>
</div>
</div>
<div class="col-md-3 col-sm-6 pl-sm-3 mt-3 mt-sm-0">
<div class="card shadow-sm border-light">
<img src="https://images.pexels.com/photos/277253/pexels-photo-277253.jpeg?auto=compress&cs=tinysrgb&dpr=1&w=500" alt="Featured image 3" class="card-img-top">
<div class="card-body">
<p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
</div>
</div>
</div>
</div>
    </div>
     </div>

 

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
    <link href="https://fonts.googleapis.com/css?family=Poppins:300i,400,500,600&display=swap" rel="stylesheet">

<style> 
body { font-family: 'Poppins', sans-serif; }
        .bg-gray { background: #efefef; padding: 50px 0px;}
        .counter { color: #03A9F4; font-size: 3.4em; font-weight: 600; line-height: 1; }
        .heading { font-weight: 600;   font-size: 3em;}
        h5 { font-size: 15px; }
        .before-heading { background: #07aaf4;  display: inline-block; padding: 0px 6px;  color: #fff; }
</style>

 

Leave a Reply

Your email address will not be published. Required fields are marked *