#Style 01
<div class="row">
<div class="col-md-6 col-xl-4 mb-1-9 mb-xl-0">
<div class="card card-style2 border-0 rounded-0">
<div class="card-icon">
<i class="flaticon-031-plant-1"></i>
</div>
<div class="card-body px-1-9 py-1-9 pt-md-6 pb-md-2-3 z-index-1">
<h3 class="h4 mb-3"><a href="#!">Trust & Warranty</a></h3>
<p class="mb-4">In power departure, land pro curement, liaisoning and working with state.</p>
<div class="card-btn">
<a href="#!"><i class="fas fa-long-arrow-alt-right"></i></a>
</div>
</div>
</div>
</div>
<div class="col-md-6 col-xl-4 mb-1-9 mb-xl-0">
<div class="card card-style2 border-0 rounded-0">
<div class="card-icon">
<i class="flaticon-023-nuclear"></i>
</div>
<div class="card-body px-1-9 py-1-9 pt-md-6 pb-md-2-3 z-index-1">
<h3 class="h4 mb-3"><a href="#!">High Quality Work</a></h3>
<p class="mb-4">In power departure, land pro curement, liaisoning and working with state.</p>
<div class="card-btn">
<a href="#!"><i class="fas fa-long-arrow-alt-right"></i></a>
</div>
</div>
</div>
</div>
<div class="col-md-6 col-xl-4 mb-1-9 mb-md-0">
<div class="card card-style2 border-0 rounded-0">
<div class="card-icon">
<i class="flaticon-005-tower"></i>
</div>
<div class="card-body px-1-9 py-1-9 pt-md-6 pb-md-2-3 z-index-1">
<h3 class="h4 mb-3"><a href="#!">Efficiency & Power</a></h3>
<p class="mb-4">In power departure, land pro curement, liaisoning and working with state.</p>
<div class="card-btn">
<a href="#!"><i class="fas fa-long-arrow-alt-right"></i></a>
</div>
</div>
</div>
</div>
</div>
#Style 02
Energy Efficiency
Solutions
Solar Panel
Commissioning
Battery Backup
Generator
Whole House Surge
Protection
<div class="bg-dark text-center mb-6 border-bottom border-color-light-white pb-5">
<div class="row mt-n4">
<div class="col-6 col-lg-3 mt-4 wow fadeInUp" data-wow-delay="200ms">
<i class="flaticon-046-green-energy text-primary display-6 display-xl-3 mb-3 d-block"></i>
<h3 class="h5 text-white mb-0">
Energy Efficiency<br>
Solutions
</h3>
</div>
<div class="col-6 col-lg-3 mt-4 wow fadeInUp" data-wow-delay="350ms">
<i class="flaticon-042-solar-panel text-primary display-6 display-xl-3 mb-3 d-block"></i>
<h3 class="h5 text-white mb-0">
Solar Panel<br>
Commissioning
</h3>
</div>
<div class="col-6 col-lg-3 mt-4 wow fadeInUp" data-wow-delay="500ms">
<i class="flaticon-045-battery text-primary display-6 display-xl-3 mb-3 d-block"></i>
<h3 class="h5 text-white mb-0">
Battery Backup<br>
Generator
</h3>
</div>
<div class="col-6 col-lg-3 mt-4 wow fadeInUp" data-wow-delay="650ms">
<i class="flaticon-036-greenhouse text-primary display-6 display-xl-3 mb-3 d-block"></i>
<h3 class="h5 text-white mb-0">
Whole House Surge<br>
Protection
</h3>
</div>
</div>
</div>
#Style 03
<div class="row">
<div class="col-sm-6 mb-4 mb-sm-0">
<div class="card card-style6 wow fadeInUp" data-wow-delay="200ms">
<img src="img/service/services-7.jpg" alt="...">
<div class="card-body position-relative z-index-3 px-1-9 pt-3 pb-2-2">
<i class="flaticon-042-solar-panel"></i>
<h3 class="h5 mb-3"><a href="solar-solutions.html">Solar Solutions</a></h3>
<p>We offers plan and assemble managing for you from energy.</p>
<a href="solar-solutions.html" class="text-primary fw-bold">Read More</a>
</div>
</div>
<div class="card card-style6 mt-4 wow fadeInUp" data-wow-delay="500ms">
<img src="img/service/services-8.jpg" alt="...">
<div class="card-body position-relative z-index-3 px-1-9 pt-3 pb-2-2">
<i class="flaticon-044-light"></i>
<h3 class="h5 mb-3"><a href="renewable-energy.html">Renewable Energy</a></h3>
<p>We offers plan and assemble managing for you from energy.</p>
<a href="renewable-energy.html" class="text-primary fw-bold">Read More</a>
</div>
</div>
</div>
<div class="col-sm-6">
<div class="card card-style6 wow fadeInUp" data-wow-delay="350ms">
<img src="img/service/services-9.jpg" alt="...">
<div class="card-body position-relative z-index-3 px-1-9 pt-3 pb-2-2">
<i class="flaticon-047-windmill"></i>
<h3 class="h5 mb-3"><a href="wind-turbine-system.html">Wind Turbine System</a></h3>
<p>We offers plan and assemble managing for you from energy.</p>
<a href="wind-turbine-system.html" class="text-primary fw-bold">Read More</a>
</div>
</div>
<div class="card card-style6 mt-4 wow fadeInUp" data-wow-delay="650ms">
<img src="img/service/services-10.jpg" alt="...">
<div class="card-body position-relative z-index-3 px-1-9 pt-3 pb-2-2">
<i class="flaticon-029-electric-car"></i>
<h3 class="h5 mb-3"><a href="repair-maintenance.html">Repair & Maintenance</a></h3>
<p>We offers plan and assemble managing for you from energy.</p>
<a href="repair-maintenance.html" class="text-primary fw-bold">Read More</a>
</div>
</div>
</div>
</div>
#Style 04
Location
66 Guild Street 512B, Great North Town.
Phone
+ (124) 1523-567-9874
(+44) 123 456 789
<div class="row">
<div class="col-md-6 mb-4 mb-md-0">
<div class="card bg-transparent h-100">
<div class="card-body p-4">
<div class="d-flex">
<div class="flex-shrink-0">
<i class="fas fa-map-marker-alt icon-box mb-0"></i>
</div>
<div class="flex-grow-1 ms-3">
<h3 class="h5">Location</h3>
<p class="mb-0 w-sm-80">66 Guild Street 512B, Great North Town.</p>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="card bg-transparent h-100">
<div class="card-body p-4">
<div class="d-flex">
<div class="flex-shrink-0">
<i class="fas fa-phone-alt icon-box mb-0"></i>
</div>
<div class="flex-grow-1 ms-3">
<h3 class="h5">Phone</h3>
<p class="mb-1">+ (124) 1523-567-9874</p>
<p class="mb-0">(+44) 123 456 789</p>
</div>
</div>
</div>
</div>
</div>
</div>
#Style 05
<ul class="list-unstyled mb-0">
<li class="mb-3"><a href="#!"><i class="far fa-envelope text-primary display-25 me-4"></i>info@yourdomain.com</a></li>
<li class="mb-3"><a href="#!"><i class="fas fa-mobile-alt text-primary display-25 me-4"></i>(+44) 123 456 789</a></li>
<li><a href="#!"><i class="fas fa-map-marker-alt text-primary display-25 me-4"></i>66 Guild Street 512B, Great North Town.</a></li>
</ul>