Pricing Style 1
Basic
$29/month
At vero eos et accusamus et iusto odio
Dignissimos ducimus qui blanditii
At vero eos et accusamus et iusto odio
Vero eos et accusamus et iusto odio
Popular
$59/month
At vero eos et accusamus et iusto odio
Dignissimos ducimus qui blanditii
At vero eos et accusamus et iusto odio
Vero eos et accusamus et iusto odio
Premium
$79/month
At vero eos et accusamus et iusto odio
Dignissimos ducimus qui blanditii
At vero eos et accusamus et iusto odio
Vero eos et accusamus et iusto odio
<section class="pricing elements-page">
<div class="container">
<div class="pricing-block">
<div class="pricing-wrapper">
<div class="row">
<div class="col-lg-4 col-md-6">
<div class="pricing-area">
<p class="categories">Basic</p>
<div class="price-tag">
<p><span class="dollar">$</span><span class="amount">29</span><span class="period">/month</span></p>
</div>
<ul class="list-unstyled">
<li><p>At vero eos et accusamus et iusto odio</p></li>
<li><p>Dignissimos ducimus qui blanditii</p></li>
<li><p>At vero eos et accusamus et iusto odio</p></li>
<li><p>Vero eos et accusamus et iusto odio</p></li>
</ul>
<a href="#" class="btn btn-primary br-0" title="Title">Button</a>
</div>
</div>
<div class="col-lg-4 col-md-6">
<div class="pricing-area diff-pricing-area">
<p class="categories">Popular</p>
<div class="price-tag">
<p><span class="dollar">$</span><span class="amount">59</span><span class="period">/month</span></p>
</div>
<ul class="list-unstyled">
<li><p>At vero eos et accusamus et iusto odio</p></li>
<li><p>Dignissimos ducimus qui blanditii</p></li>
<li><p>At vero eos et accusamus et iusto odio</p></li>
<li><p>Vero eos et accusamus et iusto odio</p></li>
</ul>
<a href="#" class="btn btn-primary br-0" title="Title">Button</a>
</div>
</div>
<div class="col-lg-4 col-md-6">
<div class="pricing-area">
<p class="categories">Premium</p>
<div class="price-tag">
<p><span class="dollar">$</span><span class="amount">79</span><span class="period">/month</span></p>
</div>
<ul class="list-unstyled">
<li><p>At vero eos et accusamus et iusto odio</p></li>
<li><p>Dignissimos ducimus qui blanditii</p></li>
<li><p>At vero eos et accusamus et iusto odio</p></li>
<li><p>Vero eos et accusamus et iusto odio</p></li>
</ul>
<a href="#" class="btn btn-primary br-0" title="Title">Button</a>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
Pricing Style 2
Plane for Basic User
$29/month
At vero eos et accusamus et iusto odio
Dignissimos ducimus qui blanditii
At vero eos et accusamus et iusto odio
Vero eos et accusamus et iusto odio
Plane for Popular User
$59/month
At vero eos et accusamus et iusto odio
Dignissimos ducimus qui blanditii
At vero eos et accusamus et iusto odio
Vero eos et accusamus et iusto odio
Plane for Premium User
$79/month
At vero eos et accusamus et iusto odio
Dignissimos ducimus qui blanditii
At vero eos et accusamus et iusto odio
Vero eos et accusamus et iusto odio
<section class="pricing elements-page">
<div class="container">
<div class="pricing-block">
<div class="pricing2">
<div class="row">
<div class="col-lg-4 col-md-6">
<div class="price-content">
<div class="user-categories">
<span>Basic</span>
<p>Plane for Basic User</p>
</div>
<div class="price-tag">
<p>$29<span>/month</span></p>
</div>
<ul class="list-unstyled">
<li><p>At vero eos et accusamus et iusto odio</p></li>
<li><p>Dignissimos ducimus qui blanditii</p></li>
<li><p>At vero eos et accusamus et iusto odio</p></li>
<li><p>Vero eos et accusamus et iusto odio</p></li>
</ul>
<a class="btn btn-primary btn-small" href="#" title="Title">Buy Now</a>
</div>
</div>
<div class="col-lg-4 col-md-6">
<div class="price-content diff-price-content">
<div class="user-categories">
<span>Popular</span>
<p>Plane for Popular User</p>
</div>
<div class="price-tag">
<p>$59<span>/month</span></p>
</div>
<ul class="list-unstyled">
<li><p>At vero eos et accusamus et iusto odio</p></li>
<li><p>Dignissimos ducimus qui blanditii</p></li>
<li><p>At vero eos et accusamus et iusto odio</p></li>
<li><p>Vero eos et accusamus et iusto odio</p></li>
</ul>
<a class="btn btn-primary btn-small" href="#" title="Title">Buy Now</a>
</div>
</div>
<div class="col-lg-4 col-md-6">
<div class="price-content">
<div class="user-categories">
<span>Premium</span>
<p>Plane for Premium User</p>
</div>
<div class="price-tag">
<p>$79<span>/month</span></p>
</div>
<ul class="list-unstyled">
<li><p>At vero eos et accusamus et iusto odio</p></li>
<li><p>Dignissimos ducimus qui blanditii</p></li>
<li><p>At vero eos et accusamus et iusto odio</p></li>
<li><p>Vero eos et accusamus et iusto odio</p></li>
</ul>
<a class="btn btn-primary btn-small" href="#" title="Title">Buy Now</a>
</div>
</div>
</div>
</div>
</div>
</div>
</section>