<!-- Features Start -->
<div class="container-fluid py-5 wow fadeInUp" data-wow-delay="0.1s">
<div class="container py-5">
<div class="section-title text-center position-relative pb-3 mb-5 mx-auto" style="max-width: 600px;">
<h5 class="fw-bold text-primary text-uppercase">Why Choose Us</h5>
<h1 class="mb-0">We Are Here to Grow Your Business Exponentially</h1>
</div>
<div class="row g-5">
<div class="col-lg-4">
<div class="row g-5">
<div class="col-12 wow zoomIn" data-wow-delay="0.2s">
<div class="bg-primary rounded d-flex align-items-center justify-content-center mb-3" style="width: 60px; height: 60px;">
<i class="fa fa-cubes text-white"></i>
</div>
<h4>Best In Industry</h4>
<p class="mb-0">Magna sea eos sit dolor, ipsum amet lorem diam dolor eos et diam dolor</p>
</div>
<div class="col-12 wow zoomIn" data-wow-delay="0.6s">
<div class="bg-primary rounded d-flex align-items-center justify-content-center mb-3" style="width: 60px; height: 60px;">
<i class="fa fa-award text-white"></i>
</div>
<h4>Award Winning</h4>
<p class="mb-0">Magna sea eos sit dolor, ipsum amet lorem diam dolor eos et diam dolor</p>
</div>
</div>
</div>
<div class="col-lg-4 wow zoomIn" data-wow-delay="0.9s" style="min-height: 350px;">
<div class="position-relative h-100">
<img class="position-absolute w-100 h-100 rounded wow zoomIn" data-wow-delay="0.1s" src="img/feature.jpg" style="object-fit: cover;">
</div>
</div>
<div class="col-lg-4">
<div class="row g-5">
<div class="col-12 wow zoomIn" data-wow-delay="0.4s">
<div class="bg-primary rounded d-flex align-items-center justify-content-center mb-3" style="width: 60px; height: 60px;">
<i class="fa fa-users-cog text-white"></i>
</div>
<h4>Professional Staff</h4>
<p class="mb-0">Magna sea eos sit dolor, ipsum amet lorem diam dolor eos et diam dolor</p>
</div>
<div class="col-12 wow zoomIn" data-wow-delay="0.8s">
<div class="bg-primary rounded d-flex align-items-center justify-content-center mb-3" style="width: 60px; height: 60px;">
<i class="fa fa-phone-alt text-white"></i>
</div>
<h4>24/7 Support</h4>
<p class="mb-0">Magna sea eos sit dolor, ipsum amet lorem diam dolor eos et diam dolor</p>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Features Start -->
<!-- Pricing Plan Start -->
<div class="container-fluid py-5 wow fadeInUp" data-wow-delay="0.1s">
<div class="container py-5">
<div class="section-title text-center position-relative pb-3 mb-5 mx-auto" style="max-width: 600px;">
<h5 class="fw-bold text-primary text-uppercase">Pricing Plans</h5>
<h1 class="mb-0">We are Offering Competitive Prices for Our Clients</h1>
</div>
<div class="row g-0">
<div class="col-lg-4 wow slideInUp" data-wow-delay="0.6s">
<div class="bg-light rounded">
<div class="border-bottom py-4 px-5 mb-4">
<h4 class="text-primary mb-1">Basic Plan</h4>
<small class="text-uppercase">For Small Size Business</small>
</div>
<div class="p-5 pt-0">
<h1 class="display-5 mb-3">
<small class="align-top" style="font-size: 22px; line-height: 45px;">$</small>49.00<small
class="align-bottom" style="font-size: 16px; line-height: 40px;">/ Month</small>
</h1>
<div class="d-flex justify-content-between mb-3"><span>HTML5 & CSS3</span><i class="fa fa-check text-primary pt-1"></i></div>
<div class="d-flex justify-content-between mb-3"><span>Bootstrap v5</span><i class="fa fa-check text-primary pt-1"></i></div>
<div class="d-flex justify-content-between mb-3"><span>Responsive Layout</span><i class="fa fa-times text-danger pt-1"></i></div>
<div class="d-flex justify-content-between mb-2"><span>Cross-browser Support</span><i class="fa fa-times text-danger pt-1"></i></div>
<a href="" class="btn btn-primary py-2 px-4 mt-4">Order Now</a>
</div>
</div>
</div>
<div class="col-lg-4 wow slideInUp" data-wow-delay="0.3s">
<div class="bg-white rounded shadow position-relative" style="z-index: 1;">
<div class="border-bottom py-4 px-5 mb-4">
<h4 class="text-primary mb-1">Standard Plan</h4>
<small class="text-uppercase">For Medium Size Business</small>
</div>
<div class="p-5 pt-0">
<h1 class="display-5 mb-3">
<small class="align-top" style="font-size: 22px; line-height: 45px;">$</small>99.00<small
class="align-bottom" style="font-size: 16px; line-height: 40px;">/ Month</small>
</h1>
<div class="d-flex justify-content-between mb-3"><span>HTML5 & CSS3</span><i class="fa fa-check text-primary pt-1"></i></div>
<div class="d-flex justify-content-between mb-3"><span>Bootstrap v5</span><i class="fa fa-check text-primary pt-1"></i></div>
<div class="d-flex justify-content-between mb-3"><span>Responsive Layout</span><i class="fa fa-check text-primary pt-1"></i></div>
<div class="d-flex justify-content-between mb-2"><span>Cross-browser Support</span><i class="fa fa-times text-danger pt-1"></i></div>
<a href="" class="btn btn-primary py-2 px-4 mt-4">Order Now</a>
</div>
</div>
</div>
<div class="col-lg-4 wow slideInUp" data-wow-delay="0.9s">
<div class="bg-light rounded">
<div class="border-bottom py-4 px-5 mb-4">
<h4 class="text-primary mb-1">Advanced Plan</h4>
<small class="text-uppercase">For Large Size Business</small>
</div>
<div class="p-5 pt-0">
<h1 class="display-5 mb-3">
<small class="align-top" style="font-size: 22px; line-height: 45px;">$</small>149.00<small
class="align-bottom" style="font-size: 16px; line-height: 40px;">/ Month</small>
</h1>
<div class="d-flex justify-content-between mb-3"><span>HTML5 & CSS3</span><i class="fa fa-check text-primary pt-1"></i></div>
<div class="d-flex justify-content-between mb-3"><span>Bootstrap v5</span><i class="fa fa-check text-primary pt-1"></i></div>
<div class="d-flex justify-content-between mb-3"><span>Responsive Layout</span><i class="fa fa-check text-primary pt-1"></i></div>
<div class="d-flex justify-content-between mb-2"><span>Cross-browser Support</span><i class="fa fa-check text-primary pt-1"></i></div>
<a href="" class="btn btn-primary py-2 px-4 mt-4">Order Now</a>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Pricing Plan End -->
I am trying to develop a Custom WordPress theme.
How to dynamic this part? Here three col-lg-4 but I want to keep one Col-lg-4. I am trying to develop this part using acf pro and writing in the code editor while loop but it is nothig to show. besides, the Pricing section is also my problem, I can't dynamic this section using ACF PRO. Please help me to solve this problem. Thanks.
