Elements
Counter
Style #01
Counter
78+
Branches3K
Employees16+
Countries
<section class="p-0 wow fadeIn" data-wow-delay="100ms">
<div class="container">
<div class="right-container">
<div class="row position-relative z-index-9 align-items-center py-1-9 py-lg-0">
<div class="col-6 col-lg-3 d-none d-lg-block">
<img src="img/content/about-02.jpg" alt="">
</div>
<div class="col-md-4 col-lg-3 offset-md-1 offset-lg-0 offset-xl-1 mb-1-9 mb-md-0 wow fadeInRight" data-wow-delay="100ms">
<div class="d-flex ps-4 ps-md-0">
<div class="flex-shrink-0">
<i class="icon-map-pin display-14 text-white opacity3 mt-1"></i>
</div>
<div class="flex-grow-1 ms-3">
<h3 class="h1 text-secondary"><span class="countup">78</span>+</h3>
<span class="text-white text-uppercase letter-spacing-2">Branches</span>
</div>
</div>
</div>
<div class="col-md-4 col-lg-3 mb-1-9 mb-md-0 wow fadeInRight" data-wow-delay="200ms">
<div class="d-flex ps-4 ps-md-0">
<div class="flex-shrink-0">
<i class="icon-hotairballoon display-14 text-white opacity3 mt-1"></i>
</div>
<div class="flex-grow-1 ms-3">
<h3 class="h1 text-secondary"><span class="countup">3</span>K</h3>
<span class="text-white text-uppercase letter-spacing-2">Employees</span>
</div>
</div>
</div>
<div class="col-md-3 col-lg-3 col-xl-2 wow fadeInRight" data-wow-delay="300ms">
<div class="d-flex ps-4 ps-md-0">
<div class="flex-shrink-0">
<i class="icon-globe display-14 text-white opacity3 mt-1"></i>
</div>
<div class="flex-grow-1 ms-3">
<h3 class="h1 text-secondary"><span class="countup">16</span>+</h3>
<span class="text-white text-uppercase letter-spacing-2">Countries</span>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
Style #02
Counter
02k
Branches
03+
Projects
12+
Countries
12k
Employees
<section class="md">
<div class="container">
<div class="row mt-n1-9">
<div class="col-6 col-lg-3 text-center mt-1-9">
<h3 class="display-15 display-sm-12 display-md-9 display-lg-6 text-secondary"><span class="countup">02</span>k</h3>
<p class="mb-0 lead">Branches</p>
</div>
<div class="col-6 col-lg-3 text-center mt-1-9">
<h3 class="display-15 display-sm-12 display-md-9 display-lg-6 text-secondary"><span class="countup">03</span>+</h3>
<p class="mb-0 lead">Projects</p>
</div>
<div class="col-6 col-lg-3 text-center mt-1-9">
<h3 class="display-15 display-sm-12 display-md-9 display-lg-6 text-secondary"><span class="countup">12</span>+</h3>
<p class="mb-0 lead">Countries</p>
</div>
<div class="col-6 col-lg-3 text-center mt-1-9">
<h3 class="display-15 display-sm-12 display-md-9 display-lg-6 text-secondary"><span class="countup">12</span>k</h3>
<p class="mb-0 lead">Employees</p>
</div>
</div>
</div>
</section>
Style #03
Counter
15k
Customers78+
Branches3k
Employees8+
Countries
<section class="py-0">
<div class="container">
<div class="bg-img pb-5" data-overlay-light="9" data-background="img/bg/bg-07.png">
<div class="row text-center position-relative z-index-1">
<div class="col-6 col-lg-3 mb-1-6 mb-lg-0 wow fadeInUp" data-wow-delay="100ms">
<div>
<h3 class="font-weight-600 display-14 display-sm-12 display-lg-10 text-primary"><span class="countup">15</span>k</h3>
<span class="fw-bold text-uppercase">Customers</span>
</div>
</div>
<div class="col-6 col-lg-3 mb-1-6 mb-lg-0 wow fadeInUp" data-wow-delay="200ms">
<div>
<h3 class="font-weight-600 display-14 display-sm-12 display-lg-10 text-primary"><span class="countup">78</span>+</h3>
<span class="fw-bold text-uppercase">Branches</span>
</div>
</div>
<div class="col-6 col-lg-3 wow fadeInUp" data-wow-delay="300ms">
<div>
<h3 class="font-weight-600 display-14 display-sm-12 display-lg-10 text-primary"><span class="countup">3</span>k</h3>
<span class="fw-bold text-uppercase">Employees</span>
</div>
</div>
<div class="col-6 col-lg-3 wow fadeInUp" data-wow-delay="400ms">
<div>
<h3 class="font-weight-600 display-14 display-sm-12 display-lg-10 text-primary"><span class="countup">8</span>+</h3>
<span class="fw-bold text-uppercase">Countries</span>
</div>
</div>
</div>
</div>
</div>
</section>
Style #04
Counter
15k
Happy
Customers
78+
World
Branches
3k
Team
Members
8+
Years
Experince
<section class="p-1-9 p-md-5 bg-secondary border-radius-xl-10 mx-xl-12 mx-xxl-18 wow fadeIn" data-wow-delay="200ms">
<div class="container">
<div class="row text-center position-relative z-index-1">
<div class="col-sm-6 col-lg-3 mb-1-6 mb-sm-1-9 mb-lg-0">
<div class="d-flex justify-content-center align-items-center">
<div class="flex-shrink-0 display-14 display-sm-12 display-lg-10 text-white fw-bold w-75px w-lg-auto">
<span class="countup">15</span>k
</div>
<div class="flex-grow-1 ms-4 text-start">
<h4 class="h6 font-weight-500 text-white mb-0 text-uppercase lh-base">Happy <br>Customers</h4>
</div>
</div>
</div>
<div class="col-sm-6 col-lg-3 mb-1-6 mb-sm-1-9 mb-lg-0">
<div class="d-flex justify-content-center align-items-center">
<div class="flex-shrink-0 display-14 display-sm-12 display-lg-10 text-white fw-bold w-75px w-lg-auto">
<span class="countup">78</span>+
</div>
<div class="flex-grow-1 ms-4 text-start">
<h4 class="h6 font-weight-500 text-white mb-0 text-uppercase lh-base">World <br>Branches</h4>
</div>
</div>
</div>
<div class="col-sm-6 col-lg-3 mb-1-6 mb-sm-0">
<div class="d-flex justify-content-center align-items-center">
<div class="flex-shrink-0 display-14 display-sm-12 display-lg-10 text-white fw-bold w-75px w-lg-auto">
<span class="countup">3</span>k
</div>
<div class="flex-grow-1 ms-4 text-start">
<h4 class="h6 font-weight-500 text-white mb-0 text-uppercase lh-base">Team <br>Members</h4>
</div>
</div>
</div>
<div class="col-sm-6 col-lg-3">
<div class="d-flex justify-content-center align-items-center">
<div class="flex-shrink-0 display-14 display-sm-12 display-lg-10 text-white fw-bold w-75px w-lg-auto">
<span class="countup">8</span>+
</div>
<div class="flex-grow-1 ms-4 text-start">
<h4 class="h6 font-weight-500 text-white mb-0 text-uppercase lh-base">Years <br>Experince</h4>
</div>
</div>
</div>
</div>
</div>
</section>
Style #05
Counter
78+
Branches3K
Employees16+
Countries2K
Clients
<section class="p-1-9 p-md-5 mx-auto w-lg-95 w-xxl-85 bg-dark md" data-wow-delay="100ms">
<div class="container">
<div class="row text-center position-relative z-index-1 mt-n1-9">
<div class="col-sm-6 col-lg-3 mt-1-9 wow fadeIn" data-wow-delay="200ms">
<div class="d-flex">
<div class="flex-shrink-0 w-70px">
<i class="icon-map-pin display-14 text-white opacity3 mt-1 me-1-6"></i>
</div>
<div class="flex-grow-1 ms-1 text-start">
<h3 class="h1 text-secondary"><span class="countup text-stroke-secondary text-dark">78</span><span class="text-stroke-secondary text-dark">+</span></h3>
<span class="text-white text-uppercase letter-spacing-2">Branches</span>
</div>
</div>
</div>
<div class="col-sm-6 col-lg-3 mt-1-9 wow fadeIn" data-wow-delay="300ms">
<div class="d-flex">
<div class="flex-shrink-0 w-70px">
<i class="icon-profile-male display-14 text-white opacity3 mt-1 me-1-6"></i>
</div>
<div class="flex-grow-1 ms-1 text-start">
<h3 class="h1 text-secondary"><span class="countup text-stroke-secondary text-dark">3</span><span class="text-stroke-secondary text-dark">K</span></h3>
<span class="text-white text-uppercase letter-spacing-2">Employees</span>
</div>
</div>
</div>
<div class="col-sm-6 col-lg-3 mt-1-9 wow fadeIn" data-wow-delay="400ms">
<div class="d-flex">
<div class="flex-shrink-0 w-70px">
<i class="icon-globe display-14 text-white opacity3 mt-1 me-1-6"></i>
</div>
<div class="flex-grow-1 ms-1 text-start">
<h3 class="h1 text-secondary"><span class="countup text-stroke-secondary text-dark">16</span><span class="text-stroke-secondary text-dark">+</span></h3>
<span class="text-white text-uppercase letter-spacing-2">Countries</span>
</div>
</div>
</div>
<div class="col-sm-6 col-lg-3 mt-1-9 wow fadeIn" data-wow-delay="500ms">
<div class="d-flex">
<div class="flex-shrink-0 w-70px">
<i class="icon-shield display-14 text-white opacity3 mt-1 me-1-6"></i>
</div>
<div class="flex-grow-1 ms-1 text-start">
<h3 class="h1 text-secondary"><span class="countup text-stroke-secondary text-dark">2</span><span class="text-stroke-secondary text-dark">K</span></h3>
<span class="text-white text-uppercase letter-spacing-2">Clients</span>
</div>
</div>
</div>
</div>
</div>
</section>
Style #06
Counter
our achievement
Some Little Facts About Our Company
45k
Completed Project
78m
Happy Clients
20
Years Of Experience
422
Running Projects
<section class="py-0">
<div class="container">
<div class="bg-img pb-5" data-overlay-light="9" data-background="img/bg/bg-07.png">
<div class="row text-center position-relative z-index-1">
<div class="col-6 col-lg-3 mb-1-6 mb-lg-0 wow fadeInUp" data-wow-delay="100ms">
<div>
<h3 class="font-weight-600 display-14 display-sm-12 display-lg-10 text-primary"><span class="countup">15</span>k</h3>
<span class="fw-bold text-uppercase">Customers</span>
</div>
</div>
<div class="col-6 col-lg-3 mb-1-6 mb-lg-0 wow fadeInUp" data-wow-delay="200ms">
<div>
<h3 class="font-weight-600 display-14 display-sm-12 display-lg-10 text-primary"><span class="countup">78</span>+</h3>
<span class="fw-bold text-uppercase">Branches</span>
</div>
</div>
<div class="col-6 col-lg-3 wow fadeInUp" data-wow-delay="300ms">
<div>
<h3 class="font-weight-600 display-14 display-sm-12 display-lg-10 text-primary"><span class="countup">3</span>k</h3>
<span class="fw-bold text-uppercase">Employees</span>
</div>
</div>
<div class="col-6 col-lg-3 wow fadeInUp" data-wow-delay="400ms">
<div>
<h3 class="font-weight-600 display-14 display-sm-12 display-lg-10 text-primary"><span class="countup">8</span>+</h3>
<span class="fw-bold text-uppercase">Countries</span>
</div>
</div>
</div>
</div>
</div>
</section>