Pricing01
Click to preview the Pricing01 demo. View demo
Pricing Table Style 01
Code:
html
<div class="dg-price dg-price01 row">
<div class="col-sm-6 col-md-3">
<div class="price-border color-1">
<div class="price-title">
<h2>BASIC PLAN</h2>
</div>
<div class="price-box"><span class="sup">$</span><span class="price">16</span><span class="unit">/MO</span></div>
<div class="price-holder">
<ul>
<li>10GB disk space</li>
<li>100GB disk space</li>
<li> Amazing admin features</li>
<li>Stunning graphic effects</li>
<li> Full Time Support</li>
</ul>
</div>
<div class="price01-btn-box"> <a class="dg-btn-2 radius-3px size-lg btn-accent" href="#" target="_blank">ORDER NOW</a></div>
</div>
</div>
<div class="col-sm-6 col-md-3">
<div class="price-border color-2">
<div class="price-title">
<h2>PERSONAL</h2>
</div>
<div class="price-box"><span class="sup">$</span><span class="price">26</span><span class="unit">/MO</span></div>
<div class="price-holder">
<ul>
<li>10GB disk space</li>
<li>200GB disk space</li>
<li> Amazing admin features</li>
<li>Stunning graphic effects</li>
<li> Full Time Support</li>
</ul>
</div>
<div class="price01-btn-box"> <a class="dg-btn-2 radius-3px size-lg btn-pink" href="#" target="_blank">ORDER NOW</a></div>
</div>
</div>
<div class="col-sm-6 col-md-3">
<div class="price-border color-3">
<div class="price-title">
<h2>BUSINESS</h2>
</div>
<div class="price-box"><span class="sup">$</span><span class="price">36</span><span class="unit">/MO</span></div>
<div class="price-holder">
<ul>
<li>20GB disk space</li>
<li>200GB disk space</li>
<li> Amazing admin features</li>
<li>Stunning graphic effects</li>
<li> Full Time Support</li>
</ul>
</div>
<div class="price01-btn-box"> <a class="dg-btn-2 radius-3px size-lg btn-warning" href="#" target="_blank">ORDER NOW</a></div>
</div>
</div>
<div class="col-sm-6 col-md-3">
<div class="price-border color-4">
<div class="price-title">
<h2>MAXIMUM</h2>
</div>
<div class="price-box"><span class="sup">$</span><span class="price">46</span><span class="unit">/MO</span></div>
<div class="price-holder">
<ul>
<li>20GB disk space</li>
<li>300GB disk space</li>
<li> Amazing admin features</li>
<li>Stunning graphic effects</li>
<li> Full Time Support</li>
</ul>
</div>
<div class="price01-btn-box"> <a class="dg-btn-2 radius-3px size-lg btn-seagreen" href="#" target="_blank">ORDER NOW</a></div>
</div>
</div>
</div>Pricing Table Style 02
Code:
html
<div class="dg-price dg-price02 row">
<div class="col-md-3 col-sm-6">
<div class="price-border">
<div class="price-title">
<h2>Basic Plan</h2>
</div>
<div class="price-box"><span class="sup">$</span><span class="price">10</span><span class="unit">Per Month</span></div>
<div class="price-holder">
<ul>
<li>Full Time Support</li>
<li>15 Projects</li>
<li>30 GB Storage</li>
<li>Unlimited Data Transfer</li>
<li>50 GB Bandwith</li>
</ul>
</div>
<div class="price02-btn-box"> <a class="dg-btn-1 btn-primary-g radius-semi-circle size-xl" href="#" target="_blank">PURCHASE</a></div>
</div>
</div>
<div class="col-md-3 col-sm-6">
<div class="price-border">
<div class="price-title">
<h2>Professional</h2>
</div>
<div class="price-box"><span class="sup">$</span><span class="price">20</span><span class="unit">Per Month</span></div>
<div class="price-holder">
<ul>
<li>Full Time Support</li>
<li>25 Projects</li>
<li>45 GB Storage</li>
<li>Unlimited Data Transfer</li>
<li>60 GB Bandwith</li>
</ul>
</div>
<div class="price02-btn-box"> <a class="dg-btn-1 btn-primary-g radius-semi-circle size-xl" href="#" target="_blank">PURCHASE</a></div>
</div>
</div>
<div class="clearfix visible-sm"> </div>
<div class="col-md-3 col-sm-6">
<div class="price-border">
<div class="price-title">
<h2>Maximum</h2>
</div>
<div class="price-box"><span class="sup">$</span><span class="price">30</span><span class="unit">Per Month</span></div>
<div class="price-holder">
<ul>
<li>Full Time Support</li>
<li>35 Projects</li>
<li>30 GB Storage</li>
<li>Unlimited Data Transfer</li>
<li>60 GB Bandwith</li>
</ul>
</div>
<div class="price02-btn-box"> <a class="dg-btn-1 btn-primary-g radius-semi-circle size-xl" href="#" target="_blank">PURCHASE</a></div>
</div>
</div>
<div class="col-md-3 col-sm-6">
<div class="price-border">
<div class="price-title">
<h2>Extreme</h2>
</div>
<div class="price-box"><span class="sup">$</span><span class="price">40</span><span class="unit">Per Month</span></div>
<div class="price-holder">
<ul>
<li>Full Time Support</li>
<li>35 Projects</li>
<li>50 GB Storage</li>
<li>Unlimited Data Transfer</li>
<li>70 GB Bandwith</li>
</ul>
</div>
<div class="price02-btn-box"> <a class="dg-btn-1 btn-primary-g radius-semi-circle size-xl" href="#" target="_blank">PURCHASE</a></div>
</div>
</div>
</div>Pricing Table Style 03
Code:
html
<div class="dg-price-bg01 pt-60 pb-30">
<div class="container">
<div class="dg-price dg-price03 row">
<div class="col-md-3 col-sm-6">
<div class="price-border">
<div class="price-title">
<h2>Basic</h2>
</div>
<div class="price-box"><span class="sup">$</span><span class="price">10</span><span class="unit">/Month</span></div>
<div class="price-info">Donec sit amet nunc id libero sagittis mattis.
Morbi at mauris eu mauris sollicitudin.</div>
<div class="price-holder">
<ul>
<li><span class="fa fa-check"></span>Responsive</li>
<li><span class="fa fa-check"></span>Unlimited Colors</li>
<li><span class="fa fa-check"></span>Multilingual Ready</li>
<li> </li>
</ul>
</div>
<div class="price03-btn-box"> <a class="dg-btn-1 btn-white size-lg hover-accent" href="#" target="_blank">PURCHASE</a></div>
</div>
</div>
<div class="col-md-3 col-sm-6">
<div class="price-border best-value">
<div class="price-title">
<h6>MOST POPUlAR</h6>
<h2>Professional</h2>
</div>
<div class="price-box"><span class="sup">$</span><span class="price">30</span><span class="unit">/Month</span></div>
<div class="price-info">Donec sit amet nunc id libero sagittis mattis.
Morbi at mauris eu mauris sollicitudin.</div>
<div class="price-holder">
<ul>
<li><span class="fa fa-check"></span>Responsive</li>
<li><span class="fa fa-check"></span>Unlimited Colors</li>
<li><span class="fa fa-check"></span>Blog & Our latest release</li>
<li><span class="fa fa-check"></span>HTML5 & CSS3</li>
</ul>
</div>
<div class="price03-btn-box"> <a class="dg-btn-1 btn-white size-lg hover-accent" href="#" target="_blank">PURCHASE</a></div>
</div>
</div>
<div class="clearfix visible-sm"> </div>
<div class="col-md-3 col-sm-6">
<div class="price-border">
<div class="price-title">
<h2>Maximum</h2>
</div>
<div class="price-box"><span class="sup">$</span><span class="price">20</span><span class="unit">/Month</span></div>
<div class="price-info">Donec sit amet nunc id libero sagittis mattis.
Morbi at mauris eu mauris sollicitudin.</div>
<div class="price-holder">
<ul>
<li><span class="fa fa-check"></span>Responsive</li>
<li><span class="fa fa-check"></span>Unlimited Colors</li>
<li><span class="fa fa-check"></span>HTML5 & CSS3</li>
<li> </li>
</ul>
</div>
<div class="price03-btn-box"> <a class="dg-btn-1 btn-white size-lg hover-accent" href="#" target="_blank">PURCHASE</a></div>
</div>
</div>
<div class="col-md-3 col-sm-6">
<div class="price-border">
<div class="price-title">
<h2>Extreme</h2>
</div>
<div class="price-box"><span class="sup">$</span><span class="price">15</span><span class="unit">/Month</span></div>
<div class="price-info">Donec sit amet nunc id libero sagittis mattis.
Morbi at mauris eu mauris sollicitudin.</div>
<div class="price-holder">
<ul>
<li><span class="fa fa-check"></span>Exclusive style switcher</li>
<li><span class="fa fa-check"></span>Unlimited Colors</li>
<li><span class="fa fa-check"></span>Blog </li>
<li> </li>
</ul>
</div>
<div class="price03-btn-box"> <a class="dg-btn-1 btn-white size-lg hover-accent" href="#" target="_blank">PURCHASE</a></div>
</div>
</div>
</div>
</div>
</div>Pricing Table Style 04
Code:
html
<div class="dg-price dg-price04 row">
<div class="col-md-3 col-sm-6">
<div class="price-border color-1">
<div class="price-title">
<h2>Basic Plan</h2>
</div>
<div class="price-box"><span class="sup">$</span><span class="price">100</span><span class="unit">Per Month</span></div>
<div class="price-holder">
<ul>
<li>10GB disk space</li>
<li>100GB bandwidth</li>
<li>Unlimited colors</li>
<li><span class="fa fa-star"></span><span class="fa fa-star"></span><span class="fa fa-star"></span><span class="fa fa-star"></span><span class="fa fa-star-o"></span><span class="fa fa-star-o"></span></li>
</ul>
</div>
<div class="price04-btn-box"> <a class="dg-btn-3 radius-3px btn-pink size-lg" href="#" target="_blank">Buy It Now</a></div>
</div>
</div>
<div class="col-md-3 col-sm-6">
<div class="price-border color-5">
<div class="price-title">
<h2>Professional</h2>
</div>
<div class="price-box"><span class="sup">$</span><span class="price">150</span><span class="unit">Per Month</span></div>
<div class="price-holder">
<ul>
<li>10GB disk space</li>
<li>150GB bandwidth</li>
<li>Unlimited colors</li>
<li><span class="fa fa-star"></span><span class="fa fa-star"></span><span class="fa fa-star"></span><span class="fa fa-star"></span><span class="fa fa-star-o"></span><span class="fa fa-star-o"></span></li>
</ul>
</div>
<div class="price04-btn-box"> <a class="dg-btn-3 radius-3px btn-seagreen size-lg" href="#" target="_blank">Buy It Now</a></div>
</div>
</div>
<div class="clearfix visible-sm"> </div>
<div class="col-md-3 col-sm-6">
<div class="price-border color-2 best-value">
<div class="price-marker">HOT</div>
<div class="price-title">
<h2>Most Popular</h2>
</div>
<div class="price-box"><span class="sup">$</span><span class="price">200</span><span class="unit">Per Month</span></div>
<div class="price-holder">
<ul>
<li>20GB disk space</li>
<li>250GB bandwidth</li>
<li>Unlimited colors</li>
<li><span class="fa fa-star"></span><span class="fa fa-star"></span><span class="fa fa-star"></span><span class="fa fa-star"></span><span class="fa fa-star"></span><span class="fa fa-star"></span></li>
</ul>
</div>
<div class="price04-btn-box"> <a class="dg-btn-3 radius-3px btn-accent size-lg" href="#" target="_blank">Buy It Now</a></div>
</div>
</div>
<div class="col-md-3 col-sm-6">
<div class="price-border color-3">
<div class="price-title">
<h2>Business</h2>
</div>
<div class="price-box"><span class="sup">$</span><span class="price">300</span><span class="unit">Per Month</span></div>
<div class="price-holder">
<ul>
<li>40GB disk space</li>
<li>400GB bandwidth</li>
<li>Unlimited colors</li>
<li><span class="fa fa-star"></span><span class="fa fa-star"></span><span class="fa fa-star"></span><span class="fa fa-star-o"></span><span class="fa fa-star-o"></span><span class="fa fa-star-o"></span></li>
</ul>
</div>
<div class="price04-btn-box"> <a class="dg-btn-3 radius-3px btn-accent size-lg" href="#" target="_blank">Buy It Now</a></div>
</div>
</div>
<div class="clearfix visible-sm"> </div>
<div class="col-md-3 col-sm-6">
<div class="price-border color-4">
<div class="price-title">
<h2>Maximum</h2>
</div>
<div class="price-box"><span class="sup">$</span><span class="price">400</span><span class="unit">Per Month</span></div>
<div class="price-holder">
<ul>
<li>50GB disk space</li>
<li>600GB bandwidth</li>
<li>Unlimited colors</li>
<li><span class="fa fa-star"></span><span class="fa fa-star"></span><span class="fa fa-star"></span><span class="fa fa-star-half-o"></span><span class="fa fa-star-o"></span><span class="fa fa-star-o"></span></li>
</ul>
</div>
<div class="price04-btn-box"> <a class="dg-btn-3 radius-3px btn-orange size-lg" href="#" target="_blank">Buy It Now</a></div>
</div>
</div>
</div>Pricing Table Style 05
Code:
html
<div class="dg-price dg-price05 row">
<div class="col-md-3 col-sm-6">
<div class="price-border color-1">
<div class="price-title">
<h2>Standard</h2>
<span class="fa fa-unlock-alt"></span></div>
<div class="price-holder">
<ul>
<li>Responsive Web</li>
<li>Sample Pages</li>
<li>Unlimited Colors</li>
<li>50 Databases</li>
<li>100GB Space</li>
</ul>
</div>
<div class="price-box">From<span class="sup">$</span><span class="price">199</span><span class="unit">/month</span></div>
<div class="price05-btn-box"> <a class="dg-btn-1 btn-comet" href="#" target="_blank">GET START NOW</a></div>
</div>
</div>
<div class="col-md-3 col-sm-6">
<div class="price-border color-2 best-value">
<div class="price-title">
<h2>Business</h2>
<span class="fa fa-users"></span></div>
<div class="price-holder">
<ul>
<li>Responsive Web</li>
<li>Sample Pages</li>
<li>Unlimited Colors</li>
<li>100 Databases</li>
<li>250GB Space</li>
</ul>
</div>
<div class="price-box">From<span class="sup">$</span><span class="price">299</span><span class="unit">/month</span></div>
<div class="price05-btn-box"> <a class="dg-btn-1 btn-accent" href="#" target="_blank">GET START NOW</a></div>
</div>
</div>
<div class="clearfix visible-sm"> </div>
<div class="col-md-3 col-sm-6">
<div class="price-border color-3">
<div class="price-title">
<h2>Premium</h2>
<span class="fa fa-trophy"></span></div>
<div class="price-holder">
<ul>
<li>Responsive Web</li>
<li>Sample Pages</li>
<li>Unlimited Colors</li>
<li>200 Databases</li>
<li>400GB Space</li>
</ul>
</div>
<div class="price-box">From<span class="sup">$</span><span class="price">399</span><span class="unit">/month</span></div>
<div class="price05-btn-box"> <a class="dg-btn-1 btn-warning" href="#" target="_blank">GET START NOW</a></div>
</div>
</div>
<div class="col-md-3 col-sm-6">
<div class="price-border color-4">
<div class="price-title">
<h2>Extreme</h2>
<span class="fa fa-gift"></span></div>
<div class="price-holder">
<ul>
<li>Responsive Web</li>
<li>Sample Pages</li>
<li>Unlimited Colors</li>
<li>300 Databases</li>
<li>600GB Space</li>
</ul>
</div>
<div class="price-box">From<span class="sup">$</span><span class="price">499</span><span class="unit">/month</span></div>
<div class="price05-btn-box"> <a class="dg-btn-1 btn-seagreen" href="#" target="_blank">GET START NOW</a></div>
</div>
</div>
<div class="clearfix visible-sm"> </div>
<div class="col-md-3 col-sm-6">
<div class="price-border color-5">
<div class="price-title">
<h2>Ultimate</h2>
<span class="fa fa-gift"></span></div>
<div class="price-holder">
<ul>
<li>Responsive Web</li>
<li>Sample Pages</li>
<li>Unlimited Colors</li>
<li>350 Databases</li>
<li>650GB Space</li>
</ul>
</div>
<div class="price-box">From<span class="sup">$</span><span class="price">599</span><span class="unit">/month</span></div>
<div class="price05-btn-box"> <a class="dg-btn-1 btn-pink" href="#" target="_blank">GET START NOW</a></div>
</div>
</div>
</div>Pricing Table Style 06
Code:
html
<div class="dg-price dg-price06 row">
<div class="col-md-3">
<div class="price-border color-1">
<div class="price-title">
<h2>Basic Plan</h2>
</div>
<div class="price-box"><span class="sup">$</span><span class="price">10</span><span class="unit">/h</span></div>
<div class="price-holder">
<ul>
<li>10GB Database</li>
<li>10 Portfolio Items</li>
<li>Unlimited-Color</li>
</ul>
</div>
<a class="dg-btn-1 radius-3px btn-pink" href="#" target="_blank">Get It Now</a></div>
</div>
<div class="col-md-3">
<div class="price-border best-value color-2">
<div class="price-title">
<h2>Professional</h2>
</div>
<div class="price-box"><span class="sup">$</span><span class="price">20</span><span class="unit">/h</span></div>
<div class="price-holder">
<ul>
<li>20GB Database</li>
<li>20 Portfolio Items</li>
<li>Unlimited-Color</li>
</ul>
</div>
<a class="dg-btn-1 radius-3px btn-accent" href="#" target="_blank">Get It Now</a></div>
</div>
<div class="clearfix visible-sm"> </div>
<div class="col-md-3">
<div class="price-border color-3">
<div class="price-title">
<h2>Maximum</h2>
</div>
<div class="price-box"><span class="sup">$</span><span class="price">30</span><span class="unit">/h</span></div>
<div class="price-holder">
<ul>
<li>30GB Database</li>
<li>40 Portfolio Items</li>
<li>Unlimited-Color</li>
</ul>
</div>
<a class="dg-btn-1 radius-3px btn-lipstick" href="#" target="_blank">Get It Now</a></div>
</div>
<div class="col-md-3">
<div class="price-border color-4">
<div class="price-title">
<h2>Extreme</h2>
</div>
<div class="price-box"><span class="sup">$</span><span class="price">40</span><span class="unit">/h</span></div>
<div class="price-holder">
<ul>
<li>40GB Database</li>
<li>60 Portfolio Items</li>
<li>Unlimited-Color</li>
</ul>
</div>
<a class="dg-btn-1 radius-3px btn-seagreen" href="#" target="_blank">Get It Now</a></div>
</div>
<div class="clearfix visible-sm"> </div>
<div class="col-md-3">
<div class="price-border color-5">
<div class="price-title">
<h2>Ultimate</h2>
</div>
<div class="price-box"><span class="sup">$</span><span class="price">50</span><span class="unit">/h</span></div>
<div class="price-holder">
<ul>
<li>40GB Database</li>
<li>80 Portfolio Items</li>
<li>Unlimited-Color</li>
</ul>
</div>
<a class="dg-btn-1 radius-3px btn-warning" href="#" target="_blank">Get It Now</a></div>
</div>
</div>Pricing Table Style 07
Code:
html
<div class="dg-price dg-price07 row">
<div class="col-md-3 col-sm-6">
<div class="price-border">
<div class="price-box">
<div class="price-pad"><span class="sup">$</span><span class="price">10</span><span class="line"></span><span class="unit">/Month</span></div>
</div>
<div class="price-title">
<h2>Basic</h2>
</div>
<div class="price-holder">
<ul>
<li>Full time support</li>
<li>15 Projects</li>
<li>30 GB Storage</li>
<li>Unlimited Data Transfer</li>
<li>50 GB Bandwith</li>
</ul>
</div>
<a class="dg-btn-3 radius-3px btn-accent size-lg" href="#" target="_blank">Purchase </a></div>
</div>
<div class="col-md-3 col-sm-6">
<div class="price-border">
<div class="price-box">
<div class="price-pad"><span class="sup">$</span><span class="price">20</span><span class="line"></span><span class="unit">/Month</span></div>
</div>
<div class="price-title">
<h2>Professional</h2>
</div>
<div class="price-holder">
<ul>
<li>Full time support</li>
<li>20 Projects</li>
<li>40 GB Storage</li>
<li>Unlimited Data Transfer</li>
<li>50 GB Bandwith</li>
</ul>
</div>
<a class="dg-btn-3 radius-3px btn-accent size-lg" href="#" target="_blank">Purchase</a></div>
</div>
<div class="clearfix visible-sm"> </div>
<div class="col-md-3 col-sm-6">
<div class="price-border">
<div class="price-box">
<div class="price-pad"><span class="sup">$</span><span class="price">30</span><span class="line"></span><span class="unit">/Month</span></div>
</div>
<div class="price-title">
<h2>Business</h2>
</div>
<div class="price-holder">
<ul>
<li>Full time support</li>
<li>30 Projects</li>
<li>50 GB Storage</li>
<li>Unlimited Data Transfer</li>
<li>60 GB Bandwith</li>
</ul>
</div>
<a class="dg-btn-3 radius-3px btn-accent size-lg" href="#" target="_blank">Purchase</a></div>
</div>
<div class="col-md-3 col-sm-6">
<div class="price-border">
<div class="price-box">
<div class="price-pad"><span class="sup">$</span><span class="price">40</span><span class="line"></span><span class="unit">/Month</span></div>
</div>
<div class="price-title">
<h2>Maximum</h2>
</div>
<div class="price-holder">
<ul>
<li>Full time support</li>
<li>50 Projects</li>
<li>60 GB Storage</li>
<li>Unlimited Data Transfer</li>
<li>70 GB Bandwith</li>
</ul>
</div>
<a class="dg-btn-3 radius-3px btn-accent size-lg" href="#" target="_blank">Purchase</a></div>
</div>
</div>Pricing Table Style 08
Code:
html
<div class="dg-price dg-price08 ">
<div class="left-title">
<div class="price-border">
<div class="price-title">
<h2>PLAN NAME</h2>
</div>
<div class="price-box"><span class="sup">€</span><span class="unit">The pricing</span></div>
<div class="price-holder">
<ul>
<li>Disk space</li>
<li>Bandwidth</li>
<li>Unlimited colors</li>
<li>DNN free skin</li>
<li>Full time support</li>
</ul>
</div>
<div class="price-btninfo">ORDER HERE <span class="fa fa-arrow-circle-o-right"></span></div>
</div>
</div>
<div class="row">
<div class="col-sm-3">
<div class="price-border">
<div class="price-title">
<h2>BASIC</h2>
</div>
<div class="price-box"><span class="sup">$</span><span class="price">100</span><span class="unit">Per Month</span></div>
<div class="price-holder">
<ul>
<li>10 GB</li>
<li>100 GB</li>
<li><span class="fa fa-check"></span></li>
<li><span class="fa fa-close"></span></li>
<li><span class="fa fa-close"></span></li>
</ul>
</div>
<a class="dg-btn-1 btn-primary-g radius-semi-circle size-lg" href="#" target="_blank">Buy Now</a></div>
</div>
<div class="col-sm-3">
<div class="price-border">
<div class="price-title">
<h2>PROFESSIONAL</h2>
</div>
<div class="price-box"><span class="sup">$</span><span class="price">150</span><span class="unit">Per Month</span></div>
<div class="price-holder">
<ul>
<li>20 GB</li>
<li>200 GB</li>
<li><span class="fa fa-check"></span></li>
<li><span class="fa fa-check"></span></li>
<li><span class="fa fa-close"></span></li>
</ul>
</div>
<a class="dg-btn-1 btn-primary-g radius-semi-circle size-lg" href="#" target="_blank">Buy Now</a></div>
</div>
<div class="col-sm-3">
<div class="price-border">
<div class="price-title">
<h2>BUSINESS</h2>
</div>
<div class="price-box"><span class="sup">$</span><span class="price">200</span><span class="unit">Per Month</span></div>
<div class="price-holder">
<ul>
<li>30 GB</li>
<li>350 GB</li>
<li><span class="fa fa-check"></span></li>
<li><span class="fa fa-close"></span></li>
<li><span class="fa fa-check"></span></li>
</ul>
</div>
<a class="dg-btn-1 btn-primary-g radius-semi-circle size-lg" href="#" target="_blank">Buy Now</a></div>
</div>
<div class="col-sm-3">
<div class="price-border">
<div class="price-title">
<h2>MAXIMUM</h2>
</div>
<div class="price-box"><span class="sup">$</span><span class="price">250</span><span class="unit">Per Month</span></div>
<div class="price-holder">
<ul>
<li>50 GB</li>
<li>500 GB</li>
<li><span class="fa fa-check"></span></li>
<li><span class="fa fa-check"></span></li>
<li><span class="fa fa-check"></span></li>
</ul>
</div>
<a class="dg-btn-1 btn-primary-g radius-semi-circle size-lg" href="#" target="_blank">Buy Now</a></div>
</div>
</div>
</div>Pricing Table Style 09
Code:
html
<div class="container">
<div class="dg-price dg-price09 row">
<div class="col-md-3 col-sm-6">
<div class="price-border color-1">
<div class="price-title"><span class="fa fa-volume-off"></span>
<h2>BASIC</h2>
</div>
<div class="price-box"><span class="sup">$</span><span class="price">10</span><span class="unit">/m</span></div>
<div class="price-holder">
<ul>
<li>10GB disk space</li>
<li>100GB bandwidth</li>
<li>Unlimited colors</li>
<li>DNN free skin</li>
<li>Full time support</li>
</ul>
</div>
<a class="dg-btn-2 btn-gray size-lg" href="#" target="_blank">Buy it now</a></div>
</div>
<div class="col-md-3 col-sm-6">
<div class="price-border color-2 best-value">
<div class="price-title"><span class="fa fa-volume-down"></span>
<h2>PROFESSIONAL</h2>
</div>
<div class="price-box"><span class="sup">$</span><span class="price">20</span><span class="unit">/m</span></div>
<div class="price-holder">
<ul>
<li>20GB disk space</li>
<li>200GB bandwidth</li>
<li>Unlimited colors</li>
<li>DNN free skin</li>
<li>Full time support</li>
</ul>
</div>
<a class="dg-btn-2 btn-gray size-lg" href="#" target="_blank">Buy it now</a></div>
</div>
<div class="clearfix visible-sm"> </div>
<div class="col-md-3 col-sm-6">
<div class="price-border color-3">
<div class="price-title"><span class="fa fa-volume-up"></span>
<h2>BUSINESS</h2>
</div>
<div class="price-box"><span class="sup">$</span><span class="price">30</span><span class="unit">/m</span></div>
<div class="price-holder">
<ul>
<li>30GB disk space</li>
<li>400GB bandwidth</li>
<li>Unlimited colors</li>
<li>DNN free skin</li>
<li>Full time support</li>
</ul>
</div>
<a class="dg-btn-2 btn-gray size-lg" href="#" target="_blank">Buy it now</a></div>
</div>
<div class="col-md-3 col-sm-6">
<div class="price-border color-4">
<div class="price-title"><span class="fa fa-bell"></span>
<h2>MAXIMUM</h2>
</div>
<div class="price-box"><span class="sup">$</span><span class="price">40</span><span class="unit">/m</span></div>
<div class="price-holder">
<ul>
<li>50GB disk space</li>
<li>400GB bandwidth</li>
<li>Unlimited colors</li>
<li>DNN free skin</li>
<li>Full time support</li>
</ul>
</div>
<a class="dg-btn-2 btn-gray size-lg" href="#" target="_blank">Buy it now</a></div>
</div>
</div>
</div>Pricing Table Style 10
Code:
html
<div class="dg-price-bg03 pt-60 pb-30">
<div class="container">
<div class="dg-price dg-price10 row">
<div class="col-md-3 col-sm-6">
<div class="price-border">
<div class="price-title">
<h2>Basic</h2>
</div>
<div class="price-box">
<div class="price-pad"><span class="sup">$</span><span class="price">10</span><span class="line"></span><span class="unit">Per Month</span></div>
</div>
<div class="price-holder">
<ul>
<li>10GB disk space</li>
<li>100GB bandwidth</li>
<li>Our latest release</li>
<li>Get to see the updated</li>
</ul>
</div>
<a class="dg-btn-1 btn-accent size-xl" href="#" target="_blank">Buy now</a></div>
</div>
<div class="col-md-3 col-sm-6">
<div class="price-border">
<div class="price-title">
<h2>PROFESSIONAL</h2>
</div>
<div class="price-box">
<div class="price-pad"><span class="sup">$</span><span class="price">40</span><span class="line"></span><span class="unit">Per Month</span></div>
</div>
<div class="price-holder">
<ul>
<li>20GB disk space</li>
<li>150GB bandwidth</li>
<li>Our latest release</li>
<li>Get to see the updated</li>
</ul>
</div>
<a class="dg-btn-1 btn-accent size-xl" href="#" target="_blank">Buy now</a></div>
</div>
<div class="clearfix visible-sm"> </div>
<div class="col-md-3 col-sm-6">
<div class="price-border">
<div class="price-title">
<h2>Business</h2>
</div>
<div class="price-box">
<div class="price-pad"><span class="sup">$</span><span class="price">30</span><span class="line"></span><span class="unit">Per Month</span></div>
</div>
<div class="price-holder">
<ul>
<li>30GB disk space</li>
<li>200GB bandwidth</li>
<li>Our latest release</li>
<li>Get to see the updated</li>
</ul>
</div>
<a class="dg-btn-1 btn-accent size-xl" href="#" target="_blank">Buy now</a></div>
</div>
<div class="col-md-3 col-sm-6">
<div class="price-border">
<div class="price-title">
<h2>Maximum</h2>
</div>
<div class="price-box">
<div class="price-pad"><span class="sup">$</span><span class="price">40</span><span class="line"></span><span class="unit">Per Month</span></div>
</div>
<div class="price-holder">
<ul>
<li>40GB disk space</li>
<li>250GB bandwidth</li>
<li>Our latest release</li>
<li>Get to see the updated</li>
</ul>
</div>
<a class="dg-btn-1 btn-accent size-xl" href="#" target="_blank">Buy now</a></div>
</div>
</div>
</div>
</div>Pricing Table Style 11
Code:
html
<div class="dg-price dg-price11 row">
<div class="col-md-4">
<div class="price-border">
<div class="price-title">
<h2>Standard</h2>
</div>
<div class="price-box">
<div class="price-pad"><span class="sup">$</span><span class="price">149</span><span class="unit">/Month</span></div>
</div>
<div class="price-holder">
<ul>
<li>10gb disk space</li>
<li>100gb bandwidth</li>
<li>unlimited colors</li>
<li>dnn free skin</li>
<li>full time support</li>
<li>amazing admin features</li>
<li>stunning graphic eeffects</li>
</ul>
</div>
<div class="price-bottom"><a class="dg-btn-1 btn-accent radius-semi-circle size-xl" href="#" target="_blank">SELECT ONE</a></div>
</div>
</div>
<div class="col-md-4">
<div class="price-border best-value">
<div class="price-title">
<h2>PROFESSIONAL</h2>
</div>
<div class="price-box">
<div class="price-pad"><span class="sup">$</span><span class="price">249</span><span class="unit">/Month</span></div>
</div>
<div class="price-holder">
<ul>
<li>10gb disk space</li>
<li>100gb bandwidth</li>
<li>unlimited colors</li>
<li>dnn free skin</li>
<li>full time support</li>
<li>amazing admin features</li>
<li>stunning graphic eeffects</li>
</ul>
</div>
<div class="price-bottom"><a class="dg-btn-1 btn-accent radius-semi-circle size-xl" href="#" target="_blank">SELECT ONE</a></div>
</div>
</div>
<div class="col-md-4">
<div class="price-border">
<div class="price-title">
<h2>BUSINESS</h2>
</div>
<div class="price-box">
<div class="price-pad"><span class="sup">$</span><span class="price">349</span><span class="unit">/Month</span></div>
</div>
<div class="price-holder">
<ul>
<li>10gb disk space</li>
<li>100gb bandwidth</li>
<li>unlimited colors</li>
<li>dnn free skin</li>
<li>full time support</li>
<li>amazing admin features</li>
<li>stunning graphic eeffects</li>
</ul>
</div>
<div class="price-bottom"><a class="dg-btn-1 btn-accent radius-semi-circle size-xl " href="#" target="_blank">SELECT ONE</a></div>
</div>
</div>
</div>Pricing Table Style 12
Code:
html
<div class="dg-price dg-price12 row">
<div class="col-md-3 col-sm-6">
<div class="price-border color-1">
<div class="price-title">
<h2>Business</h2>
</div>
<div class="price-box">
<div class="price-pad"><span class="sup">$</span><span class="price">10</span><span class="line"></span><span class="unit">/month</span></div>
</div>
<div class="price-holder">
<ul>
<li><em class="fa fa-cog"></em>10GB disk space</li>
<li><em class="fa fa-forward"></em>100GB disk space</li>
<li><em class="fa fa-bomb"></em>All-in-one theme</li>
<li><em class="fa fa-bug"></em>Different Home versions</li>
<li><em class="fa fa-book"></em>Uncluttered layout</li>
</ul>
</div>
<a class="dg-btn-1 btn-warning size-lg" href="#" target="_blank">Get It Now!</a></div>
</div>
<div class="col-md-3 col-sm-6">
<div class="price-border color-2">
<div class="price-title">
<h2>Premium</h2>
</div>
<div class="price-box">
<div class="price-pad"><span class="sup">$</span><span class="price">20</span><span class="line"></span><span class="unit">/month</span></div>
</div>
<div class="price-holder">
<ul>
<li><em class="fa fa-cog"></em>20GB disk space</li>
<li><em class="fa fa-forward"></em>100GB disk space</li>
<li><em class="fa fa-bomb"></em>All-in-one theme</li>
<li><em class="fa fa-bug"></em>Different Home versions</li>
<li><em class="fa fa-book"></em>Uncluttered layout</li>
</ul>
</div>
<a class="dg-btn-1 btn-pink size-lg" href="#" target="_blank">Get It Now!</a></div>
</div>
<div class="clearfix visible-sm"> </div>
<div class="col-md-3 col-sm-6">
<div class="price-border color-3">
<div class="price-title">
<h2>Business</h2>
</div>
<div class="price-box">
<div class="price-pad"><span class="sup">$</span><span class="price">30</span><span class="line"></span><span class="unit">/month</span></div>
</div>
<div class="price-holder">
<ul>
<li><em class="fa fa-cog"></em>10GB disk space</li>
<li><em class="fa fa-forward"></em>200GB disk space</li>
<li><em class="fa fa-bomb"></em>All-in-one theme</li>
<li><em class="fa fa-bug"></em>Different Home versions</li>
<li><em class="fa fa-book"></em>Uncluttered layout</li>
</ul>
</div>
<a class="dg-btn-1 btn-accent size-lg" href="#" target="_blank">Get It Now!</a></div>
</div>
<div class="col-md-3 col-sm-6">
<div class="price-border color-4">
<div class="price-title">
<h2>Maximum</h2>
</div>
<div class="price-box">
<div class="price-pad"><span class="sup">$</span><span class="price">40</span><span class="line"></span><span class="unit">/month</span></div>
</div>
<div class="price-holder color-1">
<ul>
<li><em class="fa fa-cog"></em>30GB disk space</li>
<li><em class="fa fa-forward"></em>100GB disk space</li>
<li><em class="fa fa-bomb"></em>All-in-one theme</li>
<li><em class="fa fa-bug"></em>Different Home versions</li>
<li><em class="fa fa-book"></em>Uncluttered layout</li>
</ul>
</div>
<a class="dg-btn-1 btn-seagreen size-lg" href="#" target="_blank">Get It Now!</a></div>
</div>
</div>Pricing Table Style 13
Code:
html
<div class="dg-price-bg04 pt-60 pb-30">
<div class="container">
<div class="dg-price dg-price13 row">
<div class="col-md-3 col-sm-6">
<div class="price-border color-1">
<div class="price-title">
<h2>Basic Plan</h2>
</div>
<div class="price-box">
<div class="price-pad"><span class="sup">$</span><span class="price">10</span></div>
</div>
<div class="price-holder">
<ul>
<li>Endless icons</li>
<li>Blog</li>
<li>Get to see the updated</li>
<li>DNN free skin</li>
</ul>
</div>
<a class="dg-btn-2 btn-white radius-semi-circle size-lg" href="#" target="_blank">Buy It Now</a></div>
</div>
<div class="col-md-3 col-sm-6">
<div class="price-border color-2">
<div class="price-title">
<h2>PROFESSIONAL</h2>
</div>
<div class="price-box">
<div class="price-pad"><span class="sup">$</span><span class="price">20</span></div>
</div>
<div class="price-holder">
<ul>
<li>Endless icons</li>
<li>Blog</li>
<li>DNN free skin</li>
<li>Extensive functions</li>
</ul>
</div>
<a class="dg-btn-2 btn-white radius-semi-circle size-lg" href="#" target="_blank">Buy It Now</a></div>
</div>
<div class="clearfix visible-sm"> </div>
<div class="col-md-3 col-sm-6">
<div class="price-border color-3">
<div class="price-title">
<h2>Business</h2>
</div>
<div class="price-box">
<div class="price-pad"><span class="sup">$</span><span class="price">30</span></div>
</div>
<div class="price-holder">
<ul>
<li>Multilingual ready</li>
<li>Blog</li>
<li>DNN free skin</li>
<li>Extensive functions</li>
</ul>
</div>
<a class="dg-btn-2 btn-white radius-semi-circle size-lg" href="#" target="_blank">Buy It Now</a></div>
</div>
<div class="col-md-3 col-sm-6">
<div class="price-border color-4">
<div class="price-title">
<h2>Maximum</h2>
</div>
<div class="price-box">
<div class="price-pad"><span class="sup">$</span><span class="price">40</span></div>
</div>
<div class="price-holder">
<ul>
<li>Multilingual ready</li>
<li>Blog</li>
<li>Organized extension</li>
<li>Lightbox</li>
</ul>
</div>
<a class="dg-btn-2 btn-white radius-semi-circle size-lg" href="#" target="_blank">Buy It Now</a></div>
</div>
</div>
</div>
</div>Pricing Table Style 14
Code:
html
<div class="dg-price dg-price14 row">
<div class="col-md-3 col-sm-6">
<div class="price-border color-1">
<div class="price-title">
<h2>BASIC</h2>
</div>
<div class="price-box"><span class="sup">$</span><span class="price">10</span><span class="unit">/Month</span></div>
<div class="price-holder">
<p>Morbi at mauris eu mauris facilisis tudin. Phasellus consectetur laoreet fringilla. Nulla molestie pulvinar .</p>
</div>
<a class="dg-btn-1 radius-3px btn-seagreen size-xl" href="#" target="_blank">PURCHASE</a></div>
</div>
<div class="col-md-3 col-sm-6">
<div class="price-border color-2 best-value">
<div class="price-title">
<h2>PROFESSIONAL</h2>
</div>
<div class="price-box"><span class="sup">$</span><span class="price">20</span><span class="unit">/Month</span></div>
<div class="price-holder">
<p>Morbi at mauris eu mauris facilisis tudin. Phasellus consectetur laoreet fringilla. Nulla molestie pulvinar .</p>
</div>
<a class="dg-btn-1 radius-3px btn-info size-xl" href="#" target="_blank">PURCHASE</a></div>
</div>
<div class="clearfix visible-sm"> </div>
<div class="col-md-3 col-sm-6">
<div class="price-border color-3">
<div class="price-title">
<h2>BUSINESS</h2>
</div>
<div class="price-box"><span class="sup">$</span><span class="price">30</span><span class="unit">/Month</span></div>
<div class="price-holder">
<p>Morbi at mauris eu mauris facilisis tudin. Phasellus consectetur laoreet fringilla. Nulla molestie pulvinar .</p>
</div>
<a class="dg-btn-1 radius-3px btn-accent size-xl " href="#" target="_blank">PURCHASE</a></div>
</div>
<div class="col-md-3 col-sm-6">
<div class="price-border color-4">
<div class="price-title">
<h2>Extreme</h2>
</div>
<div class="price-box"><span class="sup">$</span><span class="price">40</span><span class="unit">/Month</span></div>
<div class="price-holder">
<p>Morbi at mauris eu mauris facilisis tudin. Phasellus consectetur laoreet fringilla. Nulla molestie pulvinar .</p>
</div>
<a class="dg-btn-1 radius-3px btn-denim size-xl " href="#" target="_blank">PURCHASE</a></div>
</div>
</div>Pricing Table Style 15
Code:
html
<div class="dg-price dg-price15 row">
<div class="col-md-3 col-sm-6">
<div class="price-border ">
<div class="price-title"><em class="fa fa-map-pin"></em>
<h2>Basic</h2>
</div>
<div class="price-box"><span class="sup">$</span><span class="price">10</span><span class="unit">/month</span></div>
<div class="price-holder">
<ul>
<li>15 Projects</li>
<li>30 GB Storage</li>
<li>Unlimited Data Transfer</li>
<li>50 GB Bandwith</li>
</ul>
</div>
<a class="dg-btn-3 radius-3px btn-accent size-xl" href="#" target="_blank">Purchase Now</a></div>
</div>
<div class="col-md-3 col-sm-6">
<div class="price-border ">
<div class="price-title"><em class="fa fa-location-arrow"></em>
<h2>Professional</h2>
</div>
<div class="price-box"><span class="sup">$</span><span class="price">20</span><span class="unit">/month</span></div>
<div class="price-holder">
<ul>
<li>20 Projects</li>
<li>50 GB Storage</li>
<li>Unlimited Data Transfer</li>
<li>50 GB Bandwith</li>
</ul>
</div>
<a class="dg-btn-3 radius-3px btn-accent size-xl" href="#" target="_blank">Purchase Now</a></div>
</div>
<div class="clearfix visible-sm"> </div>
<div class="col-md-3 col-sm-6">
<div class="price-border best-value">
<div class="price-title"><em class="fa fa-magic"></em>
<h2>Business</h2>
</div>
<div class="price-box"><span class="sup">$</span><span class="price">20</span><span class="unit">/month</span></div>
<div class="price-holder">
<ul>
<li>30 Projects</li>
<li>80 GB Storage</li>
<li>Unlimited Data Transfer</li>
<li>100 GB Bandwith</li>
</ul>
</div>
<a class="dg-btn-3 radius-3px btn-accent size-xl" href="#" target="_blank">Purchase Now</a></div>
</div>
<div class="col-md-3 col-sm-6">
<div class="price-border color-4">
<div class="price-title"><em class="fa fa-tint"></em>
<h2>Maximum</h2>
</div>
<div class="price-box"><span class="sup">$</span><span class="price">40</span><span class="unit">/month</span></div>
<div class="price-holder">
<ul>
<li>15 Projects</li>
<li>30 GB Storage</li>
<li>Unlimited Data Transfer</li>
<li>250 GB Bandwith</li>
</ul>
</div>
<a class="dg-btn-3 radius-3px btn-accent size-xl " href="#" target="_blank">Purchase Now</a></div>
</div>
</div>