Appearance

Pricing02 ​

Click to preview the Pricing02 demo. View demo

Code:

html
<div class="container">
<div class="dg-title25 Pricing-title pb-20">

PRICING-tables/style16 ​

Code:

html
<h3>PRICING-tables/style16</h3>
<div class="line"></div>
</div>
<div class="dg-price dg-price16 row">
<div class="col-sm-4">
<div class="price-border color-1">
<div class="price-box"><span class="sup">$</span><span class="price">10</span><span class="unit">/mo</span>
<div class="price-p">Recommend for<br />
you</div>
</div>
<div class="price-title">
<h2><span class="arrow-left"></span>BASIC<span class="arrow-right"></span></h2>
</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>
<a target="_blank" class="btn" href="#">buy it now &gt;</a> </div>
</div>
<div class="col-sm-4">
<div class="price-border color-2">
<div class="price-box"><span class="sup">$</span><span class="price">20</span><span class="unit">/mo</span>
<div class="price-p">Recommend for<br />
you</div>
</div>
<div class="price-title">
<h2><span class="arrow-left"></span>Professional<span class="arrow-right"></span></h2>
</div>
<div class="price-holder">
<ul>
    <li>Responsive Web</li>
    <li>Sample Pages</li>
    <li>Unlimited Colors</li>
    <li>100 Databases</li>
    <li>100GB Space</li>
</ul>
</div>
<a target="_blank" class="btn " href="#">buy it now &gt;</a> </div>
</div>
<div class="col-sm-4">
<div class="price-border color-3">
<div class="price-box"><span class="sup">$</span><span class="price">30</span><span class="unit">/mo</span>
<div class="price-p">Recommend for<br />
you</div>
</div>
<div class="price-title">
<h2><span class="arrow-left"></span>busines<span class="arrow-right"></span></h2>
</div>
<div class="price-holder">
<ul>
    <li>Responsive Web</li>
    <li>Sample Pages</li>
    <li>Unlimited Colors</li>
    <li>100 Databases</li>
    <li>200GB Space</li>
</ul>
</div>
<a target="_blank" class="btn " href="#">buy it now &gt;</a> </div>
</div>
</div>
<div class="source_code"> <a title="Source Code" href="javascript:;"> <span class="fa fa-file"></span> SOURCE CODE </a>
<pre class="prettyprint linenums" style="display: none;">&lt;div class="dg-price dg-price16 row"&gt;
  &lt;div class="col-sm-4"&gt;
    &lt;div class="price-border color-1"&gt;
      &lt;div class="price-box"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;10&lt;/span&gt;&lt;span class="unit"&gt;/mo&lt;/span&gt;
        &lt;div class="price-p"&gt;Recommend for&lt;br /&gt;
          you&lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="price-title"&gt;
        &lt;h2&gt;&lt;span class="arrow-left"&gt;&lt;/span&gt;BASIC&lt;span class="arrow-right"&gt;&lt;/span&gt;&lt;/h2&gt;
      &lt;/div&gt;
      &lt;div class="price-holder"&gt;
        &lt;ul&gt;
          &lt;li&gt;Responsive Web&lt;/li&gt;
          &lt;li&gt;Sample Pages&lt;/li&gt;
          &lt;li&gt;Unlimited Colors&lt;/li&gt;
          &lt;li&gt;50 Databases&lt;/li&gt;
          &lt;li&gt;100GB Space&lt;/li&gt;
        &lt;/ul&gt;
      &lt;/div&gt;
      &lt;a target="_blank" class="btn" href="#"&gt;buy it now &gt;&lt;/a&gt; &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="col-sm-4"&gt;
    &lt;div class="price-border color-2"&gt;
      &lt;div class="price-box"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;20&lt;/span&gt;&lt;span class="unit"&gt;/mo&lt;/span&gt;
        &lt;div class="price-p"&gt;Recommend for&lt;br /&gt;
          you&lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="price-title"&gt;
        &lt;h2&gt;&lt;span class="arrow-left"&gt;&lt;/span&gt;Professional&lt;span class="arrow-right"&gt;&lt;/span&gt;&lt;/h2&gt;
      &lt;/div&gt;
      &lt;div class="price-holder"&gt;
        &lt;ul&gt;
          &lt;li&gt;Responsive Web&lt;/li&gt;
          &lt;li&gt;Sample Pages&lt;/li&gt;
          &lt;li&gt;Unlimited Colors&lt;/li&gt;
          &lt;li&gt;100 Databases&lt;/li&gt;
          &lt;li&gt;100GB Space&lt;/li&gt;
        &lt;/ul&gt;
      &lt;/div&gt;
      &lt;a target="_blank" class="btn " href="#"&gt;buy it now &gt;&lt;/a&gt; &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="col-sm-4"&gt;
    &lt;div class="price-border color-3"&gt;
      &lt;div class="price-box"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;30&lt;/span&gt;&lt;span class="unit"&gt;/mo&lt;/span&gt;
        &lt;div class="price-p"&gt;Recommend for&lt;br /&gt;
          you&lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="price-title"&gt;
        &lt;h2&gt;&lt;span class="arrow-left"&gt;&lt;/span&gt;busines&lt;span class="arrow-right"&gt;&lt;/span&gt;&lt;/h2&gt;
      &lt;/div&gt;
      &lt;div class="price-holder"&gt;
        &lt;ul&gt;
          &lt;li&gt;Responsive Web&lt;/li&gt;
          &lt;li&gt;Sample Pages&lt;/li&gt;
          &lt;li&gt;Unlimited Colors&lt;/li&gt;
          &lt;li&gt;100 Databases&lt;/li&gt;
          &lt;li&gt;200GB Space&lt;/li&gt;
        &lt;/ul&gt;
      &lt;/div&gt;
      &lt;a target="_blank" class="btn " href="#"&gt;buy it now &gt;&lt;/a&gt; &lt;/div&gt;
  &lt;/div&gt;
&lt;/div&gt;
</pre>
</div>
</div>

</div>

Code:

html
<div class="container pt-60 pb-60">
<div class="dg-title25 Pricing-title pb-20">

PRICING-tables/style17 ​

Code:

html
<h3>PRICING-tables/style17</h3>
<div class="line"></div>
</div>
<div class="dg-price dg-price17 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">
<h3>INSTRUCTION</h3>
<p>Pellentesque consequat viverra ipsum, sed placerat ligula aliquam eu. Nam sapien eros enatis at dapibus facilisis, lacinia.</p>
</div>
<a target="_blank" class="btn" href="#">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">
<h3>INSTRUCTION</h3>
<p>Pellentesque consequat viverra ipsum, sed placerat ligula aliquam eu. Nam sapien eros enatis at dapibus facilisis, lacinia.</p>
</div>
<a target="_blank" class="btn" href="#">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">
<h3>INSTRUCTION</h3>
<p>Pellentesque consequat viverra ipsum, sed placerat ligula aliquam eu. Nam sapien eros enatis at dapibus facilisis, lacinia.</p>
</div>
<a target="_blank" class="btn" href="#">purchase</a> </div>
</div>
<div class="col-md-3 col-sm-6">
<div class="price-border color-4">
<div class="price-title">
<h2>PROFESSIONAL</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">
<h3>INSTRUCTION</h3>
<p>Pellentesque consequat viverra ipsum, sed placerat ligula aliquam eu. Nam sapien eros enatis at dapibus facilisis, lacinia.</p>
</div>
<a target="_blank" class="btn" href="#">purchase</a> </div>
</div>
</div>
<div class="source_code"> <a title="Source Code" href="javascript:;"> <span class="fa fa-file"></span> SOURCE CODE </a>
<pre class="prettyprint linenums" style="display: none;">&lt;div class="dg-price dg-price17 row pt-60 pb-60"&gt;
  &lt;div class="col-md-3 col-sm-6"&gt;
    &lt;div class="price-border color-1"&gt;
      &lt;div class="price-title"&gt;
        &lt;h2&gt;BASIC&lt;/h2&gt;
      &lt;/div&gt;
      &lt;div class="price-box"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;10&lt;/span&gt;&lt;span class="unit"&gt;/Month&lt;/span&gt;&lt;/div&gt;
      &lt;div class="price-holder"&gt;
        &lt;h3&gt;INSTRUCTION&lt;/h3&gt;
        &lt;p&gt;Pellentesque consequat viverra ipsum, sed placerat ligula aliquam eu. Nam sapien eros enatis at dapibus facilisis, lacinia.&lt;/p&gt;
      &lt;/div&gt;
      &lt;a target="_blank" class="btn" href="#"&gt;purchase&lt;/a&gt; &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="col-md-3 col-sm-6"&gt;
    &lt;div class="price-border color-2 best-value"&gt;
      &lt;div class="price-title"&gt;
        &lt;h2&gt;PROFESSIONAL&lt;/h2&gt;
      &lt;/div&gt;
      &lt;div class="price-box"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;20&lt;/span&gt;&lt;span class="unit"&gt;/Month&lt;/span&gt;&lt;/div&gt;
      &lt;div class="price-holder"&gt;
        &lt;h3&gt;INSTRUCTION&lt;/h3&gt;
        &lt;p&gt;Pellentesque consequat viverra ipsum, sed placerat ligula aliquam eu. Nam sapien eros enatis at dapibus facilisis, lacinia.&lt;/p&gt;
      &lt;/div&gt;
      &lt;a target="_blank" class="btn" href="#"&gt;purchase&lt;/a&gt; &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="clearfix visible-sm"&gt;&lt;/div&gt;
  &lt;div class="col-md-3 col-sm-6"&gt;
    &lt;div class="price-border color-3"&gt;
      &lt;div class="price-title"&gt;
        &lt;h2&gt;BUSINESS&lt;/h2&gt;
      &lt;/div&gt;
      &lt;div class="price-box"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;30&lt;/span&gt;&lt;span class="unit"&gt;/Month&lt;/span&gt;&lt;/div&gt;
      &lt;div class="price-holder"&gt;
        &lt;h3&gt;INSTRUCTION&lt;/h3&gt;
        &lt;p&gt;Pellentesque consequat viverra ipsum, sed placerat ligula aliquam eu. Nam sapien eros enatis at dapibus facilisis, lacinia.&lt;/p&gt;
      &lt;/div&gt;
      &lt;a target="_blank" class="btn" href="#"&gt;purchase&lt;/a&gt; &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="col-md-3 col-sm-6"&gt;
    &lt;div class="price-border color-4"&gt;
      &lt;div class="price-title"&gt;
        &lt;h2&gt;PROFESSIONAL&lt;/h2&gt;
      &lt;/div&gt;
      &lt;div class="price-box"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;40&lt;/span&gt;&lt;span class="unit"&gt;/Month&lt;/span&gt;&lt;/div&gt;
      &lt;div class="price-holder"&gt;
        &lt;h3&gt;INSTRUCTION&lt;/h3&gt;
        &lt;p&gt;Pellentesque consequat viverra ipsum, sed placerat ligula aliquam eu. Nam sapien eros enatis at dapibus facilisis, lacinia.&lt;/p&gt;
      &lt;/div&gt;
      &lt;a target="_blank" class="btn" href="#"&gt;purchase&lt;/a&gt; &lt;/div&gt;
  &lt;/div&gt;
&lt;/div&gt;
</pre>
</div>
</div>

</div>

Code:

html
<div class="dg-price-bg05 pt-60 pb-30">
<div class="container">
<div class="dg-title25 Pricing-title pb-20">

PRICING-tables/style18 ​

Code:

html
<h3 style="color: #ffffff;">PRICING-tables/style18</h3>
<div class="line"></div>
</div>
<div class="dg-price dg-price18 row">
<div class="col-md-3 col-sm-6">
<div class="price-border ">
<div class="price-title">
<h2>BASIC</h2>
</div>
<div class="price-holder">
<ul>
    <li>Amazing Admin Features</li>
    <li>Stunning Graphic Effects</li>
    <li>Responsive Web</li>
</ul>
</div>
<div class="price-box">
<div class="price-pad"><span class="sup">$</span><span class="price">10</span><span class="unit">/Mo</span></div>
</div>
<a target="_blank" class="btn" href="#">Get Started 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-holder">
<ul>
    <li>Amazing Admin Features</li>
    <li>Unlimited Colors</li>
    <li>Stunning Graphic Effects</li>
</ul>
</div>
<div class="price-box">
<div class="price-pad"><span class="sup">$</span><span class="price">20</span><span class="unit">/Mo</span></div>
</div>
<a target="_blank" class="btn" href="#">Get Started 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-holder">
<ul>
    <li>Amazing Admin Features</li>
    <li>Unlimited Colors</li>
    <li>Responsive Web</li>
</ul>
</div>
<div class="price-box">
<div class="price-pad"><span class="sup">$</span><span class="price">30</span><span class="unit">/Mo</span> </div>
</div>
<a target="_blank" class="btn" href="#">Get Started 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-holder">
<ul>
    <li>Responsive Web</li>
    <li>Unlimited Colors</li>
    <li>Boxed &amp; Wide Layout</li>
</ul>
</div>
<div class="price-box">
<div class="price-pad"><span class="sup">$</span><span class="price">40</span><span class="unit">/Mo</span></div>
</div>
<a target="_blank" class="btn" href="#">Get Started Now!</a> </div>
</div>
</div>
</div>
</div>
<div class="source_code"> <a title="Source Code" href="javascript:;"> <span class="fa fa-file"></span> SOURCE CODE </a>
<pre class="prettyprint linenums" style="display: none;">&lt;div class="dg-price-bg05 pt-60 pb-30"&gt;
  &lt;div class="container"&gt;
    &lt;div class="dg-price dg-price18 row"&gt;
      &lt;div class="col-md-3 col-sm-6"&gt;
        &lt;div class="price-border "&gt;
          &lt;div class="price-title"&gt;
            &lt;h2&gt;BASIC&lt;/h2&gt;
          &lt;/div&gt;
          &lt;div class="price-holder"&gt;
            &lt;ul&gt;
              &lt;li&gt;Amazing Admin Features&lt;/li&gt;
              &lt;li&gt;Stunning Graphic Effects&lt;/li&gt;
              &lt;li&gt;Responsive Web&lt;/li&gt;
            &lt;/ul&gt;
          &lt;/div&gt;
          &lt;div class="price-box"&gt;
            &lt;div class="price-pad"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;10&lt;/span&gt;&lt;span class="unit"&gt;/Mo&lt;/span&gt;&lt;/div&gt;
          &lt;/div&gt;
          &lt;a target="_blank" class="btn" href="#"&gt;Get Started Now!&lt;/a&gt; &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="col-md-3 col-sm-6"&gt;
        &lt;div class="price-border "&gt;
          &lt;div class="price-title"&gt;
            &lt;h2&gt;PROFESSIONAL&lt;/h2&gt;
          &lt;/div&gt;
          &lt;div class="price-holder"&gt;
            &lt;ul&gt;
              &lt;li&gt;Amazing Admin Features&lt;/li&gt;
              &lt;li&gt;Unlimited Colors&lt;/li&gt;
              &lt;li&gt;Stunning Graphic Effects&lt;/li&gt;
            &lt;/ul&gt;
          &lt;/div&gt;
          &lt;div class="price-box"&gt;
            &lt;div class="price-pad"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;20&lt;/span&gt;&lt;span class="unit"&gt;/Mo&lt;/span&gt;&lt;/div&gt;
          &lt;/div&gt;
          &lt;a target="_blank" class="btn" href="#"&gt;Get Started Now!&lt;/a&gt; &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="clearfix visible-sm"&gt;&lt;/div&gt;
      &lt;div class="col-md-3 col-sm-6"&gt;
        &lt;div class="price-border "&gt;
          &lt;div class="price-title"&gt;
            &lt;h2&gt;Business&lt;/h2&gt;
          &lt;/div&gt;
          &lt;div class="price-holder"&gt;
            &lt;ul&gt;
              &lt;li&gt;Amazing Admin Features&lt;/li&gt;
              &lt;li&gt;Unlimited Colors&lt;/li&gt;
              &lt;li&gt;Responsive Web&lt;/li&gt;
            &lt;/ul&gt;
          &lt;/div&gt;
          &lt;div class="price-box"&gt;
            &lt;div class="price-pad"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;30&lt;/span&gt;&lt;span class="unit"&gt;/Mo&lt;/span&gt; &lt;/div&gt;
          &lt;/div&gt;
          &lt;a target="_blank" class="btn" href="#"&gt;Get Started Now!&lt;/a&gt; &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="col-md-3 col-sm-6"&gt;
        &lt;div class="price-border "&gt;
          &lt;div class="price-title"&gt;
            &lt;h2&gt;Maximum&lt;/h2&gt;
          &lt;/div&gt;
          &lt;div class="price-holder"&gt;
            &lt;ul&gt;
              &lt;li&gt;Responsive Web&lt;/li&gt;
              &lt;li&gt;Unlimited Colors&lt;/li&gt;
              &lt;li&gt;Boxed &amp; Wide Layout&lt;/li&gt;
            &lt;/ul&gt;
          &lt;/div&gt;
          &lt;div class="price-box"&gt;
            &lt;div class="price-pad"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;40&lt;/span&gt;&lt;span class="unit"&gt;/Mo&lt;/span&gt;&lt;/div&gt;
          &lt;/div&gt;
          &lt;a target="_blank" class="btn" href="#"&gt;Get Started Now!&lt;/a&gt; &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
&lt;/div&gt;
</pre>
</div>

</div>

Code:

html
<div class="container pt-60 pb-60">
<div class="dg-title25 Pricing-title pb-20">

PRICING-tables/style19 ​

Code:

html
<h3>PRICING-tables/style19</h3>
<div class="line"></div>
</div>
<div class="dg-price dg-price19 row">
<div class="col-md-3 col-sm-6">
<div class="price-border color-1">
<div class="price-title">
<h2>BASIC</h2>
<span>-Recommend for you</span> </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>Amazing Admin Features</li>
    <li>Stunning Graphic Effects</li>
    <li>Unlimited Colors</li>
</ul>
</div>
<a target="_blank" class="btn" href="#">Buy It!</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>
<span>-Recommend for you</span> </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>Amazing Admin Features</li>
    <li>Unlimited Colors</li>
    <li>Responsive Web</li>
</ul>
</div>
<a target="_blank" class="btn " href="#">Buy It!</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>
<span>-Recommend for you</span> </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>Responsive Web</li>
    <li>Stunning Graphic Effects</li>
    <li>Unlimited Colors</li>
</ul>
</div>
<a target="_blank" class="btn " href="#">Buy It!</a> </div>
</div>
<div class="col-md-3 col-sm-6">
<div class="price-border color-4">
<div class="price-title">
<h2>MAXIMUM</h2>
<span>-Recommend for you</span> </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>Responsive Web</li>
    <li>Unlimited Colors</li>
    <li>Boxed &amp; Wide Layout</li>
</ul>
</div>
<a target="_blank" class="btn " href="#">Buy It!</a> </div>
</div>
</div>
<div class="source_code"> <a title="Source Code" href="javascript:;"> <span class="fa fa-file"></span> SOURCE CODE </a>
<pre class="prettyprint linenums" style="display: none;">&lt;div class="dg-price dg-price19 row"&gt;
  &lt;div class="col-md-3 col-sm-6"&gt;
    &lt;div class="price-border color-1"&gt;
      &lt;div class="price-title"&gt;
        &lt;h2&gt;BASIC&lt;/h2&gt;
        &lt;span&gt;-Recommend for you&lt;/span&gt; &lt;/div&gt;
      &lt;div class="price-box"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;10&lt;/span&gt;&lt;span class="unit"&gt;Per Month&lt;/span&gt;&lt;/div&gt;
      &lt;div class="price-holder"&gt;
        &lt;ul&gt;
          &lt;li&gt;Amazing Admin Features&lt;/li&gt;
          &lt;li&gt;Stunning Graphic Effects&lt;/li&gt;
          &lt;li&gt;Unlimited Colors&lt;/li&gt;
        &lt;/ul&gt;
      &lt;/div&gt;
      &lt;a target="_blank" class="btn" href="#"&gt;Buy It!&lt;/a&gt; &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="col-md-3 col-sm-6"&gt;
    &lt;div class="price-border color-2 best-value"&gt;
      &lt;div class="price-title"&gt;
        &lt;h2&gt;PROFESSIONAL&lt;/h2&gt;
        &lt;span&gt;-Recommend for you&lt;/span&gt; &lt;/div&gt;
      &lt;div class="price-box"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;20&lt;/span&gt;&lt;span class="unit"&gt;Per Month&lt;/span&gt;&lt;/div&gt;
      &lt;div class="price-holder"&gt;
        &lt;ul&gt;
          &lt;li&gt;Amazing Admin Features&lt;/li&gt;
          &lt;li&gt;Unlimited Colors&lt;/li&gt;
          &lt;li&gt;Responsive Web&lt;/li&gt;
        &lt;/ul&gt;
      &lt;/div&gt;
      &lt;a target="_blank" class="btn " href="#"&gt;Buy It!&lt;/a&gt; &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="clearfix visible-sm"&gt;&lt;/div&gt;
  &lt;div class="col-md-3 col-sm-6"&gt;
    &lt;div class="price-border color-3"&gt;
      &lt;div class="price-title"&gt;
        &lt;h2&gt;BUSINESS&lt;/h2&gt;
        &lt;span&gt;-Recommend for you&lt;/span&gt; &lt;/div&gt;
      &lt;div class="price-box"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;30&lt;/span&gt;&lt;span class="unit"&gt;Per Month&lt;/span&gt;&lt;/div&gt;
      &lt;div class="price-holder"&gt;
        &lt;ul&gt;
          &lt;li&gt;Responsive Web&lt;/li&gt;
          &lt;li&gt;Stunning Graphic Effects&lt;/li&gt;
          &lt;li&gt;Unlimited Colors&lt;/li&gt;
        &lt;/ul&gt;
      &lt;/div&gt;
      &lt;a target="_blank" class="btn " href="#"&gt;Buy It!&lt;/a&gt; &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="col-md-3 col-sm-6"&gt;
    &lt;div class="price-border color-4"&gt;
      &lt;div class="price-title"&gt;
        &lt;h2&gt;MAXIMUM&lt;/h2&gt;
        &lt;span&gt;-Recommend for you&lt;/span&gt; &lt;/div&gt;
      &lt;div class="price-box"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;400&lt;/span&gt;&lt;span class="unit"&gt;Per Month&lt;/span&gt;&lt;/div&gt;
      &lt;div class="price-holder"&gt;
        &lt;ul&gt;
          &lt;li&gt;Responsive Web&lt;/li&gt;
          &lt;li&gt;Unlimited Colors&lt;/li&gt;
          &lt;li&gt;Boxed &amp; Wide Layout&lt;/li&gt;
        &lt;/ul&gt;
      &lt;/div&gt;
      &lt;a target="_blank" class="btn " href="#"&gt;Buy It!&lt;/a&gt; &lt;/div&gt;
  &lt;/div&gt;
&lt;/div&gt;
</pre>
</div>
</div>

</div>

Code:

html
<div class="container pb-40">
<div class="dg-title25 Pricing-title pb-20">

PRICING-tables/style20 ​

Code:

html
<h3>PRICING-tables/style20</h3>
<div class="line"></div>
</div>
<div class="dg-price dg-price20 row">
<div class="col-sm-4">
<div class="price-border ">
<div class="price-title">
<h2>Standard</h2>
<div class="price-box"><span class="sup">$</span><span class="price">16</span><span class="unit">/Month</span></div>
<a target="_blank" class="btn" href="#">buy it now &gt;</a> </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>
</div>
<div class="col-sm-4">
<div class="price-popular">Most Popular</div>
<div class="price-border best-value">
<div class="price-title">
<h2>PERSONAL</h2>
<div class="price-box"><span class="sup">$</span><span class="price">26</span><span class="unit">/Month</span></div>
<a target="_blank" class="btn " href="#">buy it now &gt;</a> </div>
<div class="price-holder">
<ul>
    <li>Responsive Web</li>
    <li>Sample Pages</li>
    <li>Unlimited Colors</li>
    <li>100 Databases</li>
    <li>100GB Space</li>
</ul>
</div>
</div>
</div>
<div class="col-sm-4">
<div class="price-border ">
<div class="price-title">
<h2>MAXIMUM</h2>
<div class="price-box"><span class="sup">$</span><span class="price">36</span><span class="unit">/Month</span></div>
<a target="_blank" class="btn " href="#">buy it now &gt;</a> </div>
<div class="price-holder">
<ul>
    <li>Responsive Web</li>
    <li>Sample Pages</li>
    <li>Unlimited Colors</li>
    <li>50 Databases</li>
    <li>200GB Space</li>
</ul>
</div>
</div>
</div>
</div>
<div class="source_code"> <a title="Source Code" href="javascript:;"> <span class="fa fa-file"></span> SOURCE CODE </a>
<pre class="prettyprint linenums" style="display: none;">&lt;div class="dg-price dg-price20 row"&gt;
  &lt;div class="col-sm-4"&gt;
    &lt;div class="price-border "&gt;
      &lt;div class="price-title"&gt;
        &lt;h2&gt;Standard&lt;/h2&gt;
        &lt;div class="price-box"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;16&lt;/span&gt;&lt;span class="unit"&gt;/Month&lt;/span&gt;&lt;/div&gt;
        &lt;a target="_blank" class="btn" href="#"&gt;buy it now &gt;&lt;/a&gt; &lt;/div&gt;
      &lt;div class="price-holder"&gt;
        &lt;ul&gt;
          &lt;li&gt;Responsive Web&lt;/li&gt;
          &lt;li&gt;Sample Pages&lt;/li&gt;
          &lt;li&gt;Unlimited Colors&lt;/li&gt;
          &lt;li&gt;50 Databases&lt;/li&gt;
          &lt;li&gt;100GB Space&lt;/li&gt;
        &lt;/ul&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="col-sm-4"&gt;
    &lt;div class="price-popular"&gt;Most Popular&lt;/div&gt;
    &lt;div class="price-border best-value"&gt;
      &lt;div class="price-title"&gt;
        &lt;h2&gt;PERSONAL&lt;/h2&gt;
        &lt;div class="price-box"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;26&lt;/span&gt;&lt;span class="unit"&gt;/Month&lt;/span&gt;&lt;/div&gt;
        &lt;a target="_blank" class="btn " href="#"&gt;buy it now &gt;&lt;/a&gt; &lt;/div&gt;
      &lt;div class="price-holder"&gt;
        &lt;ul&gt;
          &lt;li&gt;Responsive Web&lt;/li&gt;
          &lt;li&gt;Sample Pages&lt;/li&gt;
          &lt;li&gt;Unlimited Colors&lt;/li&gt;
          &lt;li&gt;100 Databases&lt;/li&gt;
          &lt;li&gt;100GB Space&lt;/li&gt;
        &lt;/ul&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="col-sm-4"&gt;
    &lt;div class="price-border "&gt;
      &lt;div class="price-title"&gt;
        &lt;h2&gt;MAXIMUM&lt;/h2&gt;
        &lt;div class="price-box"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;36&lt;/span&gt;&lt;span class="unit"&gt;/Month&lt;/span&gt;&lt;/div&gt;
        &lt;a target="_blank" class="btn " href="#"&gt;buy it now &gt;&lt;/a&gt; &lt;/div&gt;
      &lt;div class="price-holder"&gt;
        &lt;ul&gt;
          &lt;li&gt;Responsive Web&lt;/li&gt;
          &lt;li&gt;Sample Pages&lt;/li&gt;
          &lt;li&gt;Unlimited Colors&lt;/li&gt;
          &lt;li&gt;50 Databases&lt;/li&gt;
          &lt;li&gt;200GB Space&lt;/li&gt;
        &lt;/ul&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
&lt;/div&gt;
</pre>
</div>
</div>

</div>

Code:

html
<div class="dg-price-bg06 pt-60 pb-30">
<div class="container">
<div class="dg-title25 Pricing-title pb-20">

PRICING-tables/style21 ​

Code:

html
<h3 style="color: #ffffff;">PRICING-tables/style21</h3>
<div class="line"></div>
</div>
<div class="dg-price dg-price21 row">
<div class="col-sm-4">
<div class="price-border">
<div class="price-box"><em class="fa fa-battery-2"></em></div>
<div class="price-line"></div>
<div class="price-title">
<h2>Basic Plan</h2>
<p>Pellentesque consequat viverra<br />
ipsum, sed placerat ligula aliquam</p>
</div>
<div class="price-holder">
<ul>
    <li><em class="fa fa-star-o"></em>10GB disk space</li>
    <li><em class="fa fa-star-o"></em>100GB disk space</li>
    <li><em class="fa fa-star-o"></em>unlimited colors</li>
    <li><em class="fa fa-star-o"></em>full time support</li>
</ul>
</div>
<a target="_blank" class="btn" href="#">$10 Buy It Now</a> </div>
</div>
<div class="col-sm-4">
<div class="price-border color-1">
<div class="price-box"><em class="fa fa-battery-3"></em></div>
<div class="price-line"></div>
<div class="price-title">
<h2>Premium</h2>
<p>Pellentesque consequat viverra<br />
ipsum, sed placerat ligula aliquam</p>
</div>
<div class="price-holder">
<ul>
    <li><em class="fa fa-star-o"></em>20GB disk space</li>
    <li><em class="fa fa-star-o"></em>100GB disk space</li>
    <li><em class="fa fa-star-o"></em>unlimited colors</li>
    <li><em class="fa fa-star-o"></em>full time support</li>
</ul>
</div>
<a target="_blank" class="btn" href="#">$20 Buy It Now</a> </div>
</div>
<div class="col-sm-4">
<div class="price-border color-1">
<div class="price-box"><em class="fa fa-battery-4"></em> </div>
<div class="price-line"></div>
<div class="price-title">
<h2>Ultimate</h2>
<p>Pellentesque consequat viverra<br />
ipsum, sed placerat ligula aliquam</p>
</div>
<div class="price-holder">
<ul>
    <li><em class="fa fa-star-o"></em>20GB disk space</li>
    <li><em class="fa fa-star-o"></em>200GB disk space</li>
    <li><em class="fa fa-star-o"></em>unlimited colors</li>
    <li><em class="fa fa-star-o"></em>full time support</li>
</ul>
</div>
<a target="_blank" class="btn" href="#">$30 Buy It Now</a> </div>
</div>
</div>
</div>
</div>
<div class="source_code"> <a title="Source Code" href="javascript:;"> <span class="fa fa-file"></span> SOURCE CODE </a>
<pre class="prettyprint linenums" style="display: none;">&lt;div class="dg-price-bg06 pt-60 pb-30"&gt;
  &lt;div class="container"&gt;
    &lt;div class="dg-price dg-price21 row"&gt;
      &lt;div class="col-sm-4"&gt;
        &lt;div class="price-border"&gt;
          &lt;div class="price-box"&gt;&lt;em class="fa fa-battery-2"&gt;&lt;/em&gt;&lt;/div&gt;
          &lt;div class="price-line"&gt;&lt;/div&gt;
          &lt;div class="price-title"&gt;
            &lt;h2&gt;Basic Plan&lt;/h2&gt;
            &lt;p&gt;Pellentesque consequat viverra&lt;br /&gt;
              ipsum, sed placerat ligula aliquam&lt;/p&gt;
          &lt;/div&gt;
          &lt;div class="price-holder"&gt;
            &lt;ul&gt;
              &lt;li&gt;&lt;em class="fa fa-star-o"&gt;&lt;/em&gt;10GB disk space&lt;/li&gt;
              &lt;li&gt;&lt;em class="fa fa-star-o"&gt;&lt;/em&gt;100GB disk space&lt;/li&gt;
              &lt;li&gt;&lt;em class="fa fa-star-o"&gt;&lt;/em&gt;unlimited colors&lt;/li&gt;
              &lt;li&gt;&lt;em class="fa fa-star-o"&gt;&lt;/em&gt;full time support&lt;/li&gt;
            &lt;/ul&gt;
          &lt;/div&gt;
          &lt;a target="_blank" class="btn" href="#"&gt;$10 Buy It Now&lt;/a&gt; &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="col-sm-4"&gt;
        &lt;div class="price-border color-1"&gt;
          &lt;div class="price-box"&gt;&lt;em class="fa fa-battery-3"&gt;&lt;/em&gt;&lt;/div&gt;
          &lt;div class="price-line"&gt;&lt;/div&gt;
          &lt;div class="price-title"&gt;
            &lt;h2&gt;Premium&lt;/h2&gt;
            &lt;p&gt;Pellentesque consequat viverra&lt;br /&gt;
              ipsum, sed placerat ligula aliquam&lt;/p&gt;
          &lt;/div&gt;
          &lt;div class="price-holder"&gt;
            &lt;ul&gt;
              &lt;li&gt;&lt;em class="fa fa-star-o"&gt;&lt;/em&gt;20GB disk space&lt;/li&gt;
              &lt;li&gt;&lt;em class="fa fa-star-o"&gt;&lt;/em&gt;100GB disk space&lt;/li&gt;
              &lt;li&gt;&lt;em class="fa fa-star-o"&gt;&lt;/em&gt;unlimited colors&lt;/li&gt;
              &lt;li&gt;&lt;em class="fa fa-star-o"&gt;&lt;/em&gt;full time support&lt;/li&gt;
            &lt;/ul&gt;
          &lt;/div&gt;
          &lt;a target="_blank" class="btn" href="#"&gt;$20 Buy It Now&lt;/a&gt; &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="col-sm-4"&gt;
        &lt;div class="price-border color-1"&gt;
          &lt;div class="price-box"&gt;&lt;em class="fa fa-battery-4"&gt;&lt;/em&gt; &lt;/div&gt;
          &lt;div class="price-line"&gt;&lt;/div&gt;
          &lt;div class="price-title"&gt;
            &lt;h2&gt;Ultimate&lt;/h2&gt;
            &lt;p&gt;Pellentesque consequat viverra&lt;br /&gt;
              ipsum, sed placerat ligula aliquam&lt;/p&gt;
          &lt;/div&gt;
          &lt;div class="price-holder"&gt;
            &lt;ul&gt;
              &lt;li&gt;&lt;em class="fa fa-star-o"&gt;&lt;/em&gt;20GB disk space&lt;/li&gt;
              &lt;li&gt;&lt;em class="fa fa-star-o"&gt;&lt;/em&gt;200GB disk space&lt;/li&gt;
              &lt;li&gt;&lt;em class="fa fa-star-o"&gt;&lt;/em&gt;unlimited colors&lt;/li&gt;
              &lt;li&gt;&lt;em class="fa fa-star-o"&gt;&lt;/em&gt;full time support&lt;/li&gt;
            &lt;/ul&gt;
          &lt;/div&gt;
          &lt;a target="_blank" class="btn" href="#"&gt;$30 Buy It Now&lt;/a&gt; &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
&lt;/div&gt;
</pre>
</div>

</div>

Code:

html
<div class="container pt-60 pb-30">
<div class="dg-title25 Pricing-title pb-20">

PRICING-tables/style22 ​

Code:

html
<h3>PRICING-tables/style22</h3>
<div class="line"></div>
</div>
<div class="row">
<div class="dg-price dg-price22">
<div class="col-md-3 col-sm-6 color-1">
<div class="price-border">
<div class="price-title"> <span>Free</span>
<h2>BASIC</h2>
</div>
<div class="price-holder">
<ul>
    <li>Amazing Admin Features</li>
    <li>Stunning Graphic Effects</li>
</ul>
</div>
<div class="price-box">
<div class="box"><span class="price">Free</span><span class="unit">Forever</span></div>
</div>
<a class="btn " href="#">Get started now</a> </div>
</div>
<div class="col-md-3 col-sm-6  color-2">
<div class="price-popular">Most Popular</div>
<div class="price-border">
<div class="price-title "> <span>Standard</span>
<h2>Solo</h2>
</div>
<div class="price-holder">
<ul>
    <li>Amazing Admin Features</li>
    <li>Stunning Graphic Effects</li>
    <li>Unlimited Colors</li>
</ul>
</div>
<div class="price-box">
<div class="box"><span class="sup">$</span><span class="price">55</span> <span class="unit">/Month</span></div>
</div>
<a class="btn" href="#">Get started now</a> </div>
</div>
<div class="clearfix visible-sm"></div>
<div class="col-md-3 col-sm-6  color-3">
<div class="price-border">
<div class="price-title"> <span>Business</span>
<h2>Pro</h2>
</div>
<div class="price-holder">
<ul>
    <li>Amazing Admin Features</li>
    <li>Stunning Graphic Effects</li>
    <li>Unlimited Colors</li>
    <li>DNN free skin</li>
</ul>
</div>
<div class="price-box">
<div class="box"><span class="sup">$</span><span class="price">65</span> <span class="unit">/Month</span> </div>
</div>
<a class="btn" href="#">Get started now</a> </div>
</div>
<div class="col-md-3 col-sm-6 color-4">
<div class="price-border">
<div class="price-title"> <span>maximum</span>
<h2>Pro</h2>
</div>
<div class="price-holder">
<ul>
    <li>Amazing Admin Features</li>
    <li>Stunning Graphic Effects</li>
    <li>Unlimited Colors</li>
    <li>Responsive Web</li>
    <li></li>
</ul>
</div>
<div class="price-box">
<div class="box"><span class="sup">$</span><span class="price">75</span> <span class="unit">Forever</span></div>
</div>
<a class="btn " href="#">Get started now</a> </div>
</div>
</div>
</div>
<div class="source_code"> <a title="Source Code" href="javascript:;"> <span class="fa fa-file"></span> SOURCE CODE </a>
<pre class="prettyprint linenums" style="display: none;">&lt;div class="row"&gt;
  &lt;div class="dg-price dg-price22"&gt;
    &lt;div class="col-md-3 col-sm-6 color-1"&gt;
      &lt;div class="price-border"&gt;
        &lt;div class="price-title"&gt; &lt;span&gt;Free&lt;/span&gt;
          &lt;h2&gt;BASIC&lt;/h2&gt;
        &lt;/div&gt;
        &lt;div class="price-holder"&gt;
          &lt;ul&gt;
            &lt;li&gt;Amazing Admin Features&lt;/li&gt;
            &lt;li&gt;Stunning Graphic Effects&lt;/li&gt;
          &lt;/ul&gt;
        &lt;/div&gt;
        &lt;div class="price-box"&gt;
          &lt;div class="box"&gt;&lt;span class="price"&gt;Free&lt;/span&gt;&lt;span class="unit"&gt;Forever&lt;/span&gt;&lt;/div&gt;
        &lt;/div&gt;
        &lt;a class="btn " href="#"&gt;Get started now&lt;/a&gt; &lt;/div&gt;
    &lt;/div&gt;
    &lt;div class="col-md-3 col-sm-6  color-2"&gt;
      &lt;div class="price-popular"&gt;Most Popular&lt;/div&gt;
      &lt;div class="price-border"&gt;
        &lt;div class="price-title "&gt; &lt;span&gt;Standard&lt;/span&gt;
          &lt;h2&gt;Solo&lt;/h2&gt;
        &lt;/div&gt;
        &lt;div class="price-holder"&gt;
          &lt;ul&gt;
            &lt;li&gt;Amazing Admin Features&lt;/li&gt;
            &lt;li&gt;Stunning Graphic Effects&lt;/li&gt;
            &lt;li&gt;Unlimited Colors&lt;/li&gt;
          &lt;/ul&gt;
        &lt;/div&gt;
        &lt;div class="price-box"&gt;
          &lt;div class="box"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;55&lt;/span&gt; &lt;span class="unit"&gt;/Month&lt;/span&gt;&lt;/div&gt;
        &lt;/div&gt;
        &lt;a class="btn" href="#"&gt;Get started now&lt;/a&gt; &lt;/div&gt;
    &lt;/div&gt;
    &lt;div class="clearfix visible-sm"&gt;&lt;/div&gt;
    &lt;div class="col-md-3 col-sm-6  color-3"&gt;
      &lt;div class="price-border"&gt;
        &lt;div class="price-title"&gt; &lt;span&gt;Business&lt;/span&gt;
          &lt;h2&gt;Pro&lt;/h2&gt;
        &lt;/div&gt;
        &lt;div class="price-holder"&gt;
          &lt;ul&gt;
            &lt;li&gt;Amazing Admin Features&lt;/li&gt;
            &lt;li&gt;Stunning Graphic Effects&lt;/li&gt;
            &lt;li&gt;Unlimited Colors&lt;/li&gt;
            &lt;li&gt;DNN free skin&lt;/li&gt;
          &lt;/ul&gt;
        &lt;/div&gt;
        &lt;div class="price-box"&gt;
          &lt;div class="box"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;65&lt;/span&gt; &lt;span class="unit"&gt;/Month&lt;/span&gt; &lt;/div&gt;
        &lt;/div&gt;
        &lt;a class="btn" href="#"&gt;Get started now&lt;/a&gt; &lt;/div&gt;
    &lt;/div&gt;
    &lt;div class="col-md-3 col-sm-6 color-4"&gt;
      &lt;div class="price-border"&gt;
        &lt;div class="price-title"&gt; &lt;span&gt;maximum&lt;/span&gt;
          &lt;h2&gt;Pro&lt;/h2&gt;
        &lt;/div&gt;
        &lt;div class="price-holder"&gt;
          &lt;ul&gt;
            &lt;li&gt;Amazing Admin Features&lt;/li&gt;
            &lt;li&gt;Stunning Graphic Effects&lt;/li&gt;
            &lt;li&gt;Unlimited Colors&lt;/li&gt;
            &lt;li&gt;Responsive Web&lt;/li&gt;
            &lt;li&gt;&lt;/li&gt;
          &lt;/ul&gt;
        &lt;/div&gt;
        &lt;div class="price-box"&gt;
          &lt;div class="box"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;75&lt;/span&gt; &lt;span class="unit"&gt;Forever&lt;/span&gt;&lt;/div&gt;
        &lt;/div&gt;
        &lt;a class="btn " href="#"&gt;Get started now&lt;/a&gt; &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
&lt;/div&gt;
</pre>
</div>
</div>

</div>

Code:

html
<div class="container pt-20 pb-60">
<div class="dg-title25 Pricing-title pb-20">

PRICING-tables/style23 ​

Code:

html
<h3>PRICING-tables/style23</h3>
<div class="line"></div>
</div>
<div class="dg-price dg-price23 row">
<div class="col-md-4">
<div class="price-border ">
<div class="price-title"> <em class="fa fa-calendar-o"></em>
<h2>Basic</h2>
</div>
<div class="price-box"><span class="sup">$</span><span class="price">100/</span><span class="unit">M</span></div>
<div class="price-holder">
<p>Pellentesque consequat viverra ipsum, sed placerat ligula aliquam eu. Nam.</p>
<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 target="_blank" class="btn" href="#">Buy now</a> </div>
</div>
<div class="col-md-4">
<div class="price-border  ">
<div class="price-title"> <em class="fa fa-calendar-plus-o"></em>
<h2> Standard</h2>
</div>
<div class="price-box"><span class="sup">$</span><span class="price">200/</span><span class="unit">M</span></div>
<div class="price-holder">
<p>Pellentesque consequat viverra ipsum, sed placerat ligula aliquam eu. Nam.</p>
<ul>
    <li>20GB disk space</li>
    <li>100GB bandwidth</li>
    <li>Unlimited colors</li>
    <li>DNN free skin</li>
    <li>Full time support</li>
</ul>
</div>
<a target="_blank" class="btn " href="#">Buy now</a> </div>
</div>
<div class="col-md-4">
<div class="price-border  best-value">
<div class="price-title"> <em class="fa fa-calendar-check-o"></em>
<h2> Advanced</h2>
</div>
<div class="price-box"><span class="sup">$</span><span class="price">300/</span><span class="unit">M</span></div>
<div class="price-holder">
<p>Pellentesque consequat viverra ipsum, sed placerat ligula aliquam eu. Nam.</p>
<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 target="_blank" class="btn " href="#">Buy now</a> </div>
</div>
</div>
<div class="source_code"> <a title="Source Code" href="javascript:;"> <span class="fa fa-file"></span> SOURCE CODE </a>
<pre class="prettyprint linenums" style="display: none;">&lt;div class="dg-price dg-price23 row"&gt;
  &lt;div class="col-md-4"&gt;
    &lt;div class="price-border "&gt;
      &lt;div class="price-title"&gt; &lt;em class="fa fa-calendar-o"&gt;&lt;/em&gt;
        &lt;h2&gt;Basic&lt;/h2&gt;
      &lt;/div&gt;
      &lt;div class="price-box"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;100/&lt;/span&gt;&lt;span class="unit"&gt;M&lt;/span&gt;&lt;/div&gt;
      &lt;div class="price-holder"&gt;
        &lt;p&gt;Pellentesque consequat viverra ipsum, sed placerat ligula aliquam eu. Nam.&lt;/p&gt;
        &lt;ul&gt;
          &lt;li&gt;10GB disk space&lt;/li&gt;
          &lt;li&gt;100GB bandwidth&lt;/li&gt;
          &lt;li&gt;Unlimited colors&lt;/li&gt;
          &lt;li&gt;DNN free skin&lt;/li&gt;
          &lt;li&gt;Full time support&lt;/li&gt;
        &lt;/ul&gt;
      &lt;/div&gt;
      &lt;a target="_blank" class="btn" href="#"&gt;Buy now&lt;/a&gt; &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="col-md-4"&gt;
    &lt;div class="price-border  "&gt;
      &lt;div class="price-title"&gt; &lt;em class="fa fa-calendar-plus-o"&gt;&lt;/em&gt;
        &lt;h2&gt; Standard&lt;/h2&gt;
      &lt;/div&gt;
      &lt;div class="price-box"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;200/&lt;/span&gt;&lt;span class="unit"&gt;M&lt;/span&gt;&lt;/div&gt;
      &lt;div class="price-holder"&gt;
        &lt;p&gt;Pellentesque consequat viverra ipsum, sed placerat ligula aliquam eu. Nam.&lt;/p&gt;
        &lt;ul&gt;
          &lt;li&gt;20GB disk space&lt;/li&gt;
          &lt;li&gt;100GB bandwidth&lt;/li&gt;
          &lt;li&gt;Unlimited colors&lt;/li&gt;
          &lt;li&gt;DNN free skin&lt;/li&gt;
          &lt;li&gt;Full time support&lt;/li&gt;
        &lt;/ul&gt;
      &lt;/div&gt;
      &lt;a target="_blank" class="btn " href="#"&gt;Buy now&lt;/a&gt; &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="col-md-4"&gt;
    &lt;div class="price-border  best-value"&gt;
      &lt;div class="price-title"&gt; &lt;em class="fa fa-calendar-check-o"&gt;&lt;/em&gt;
        &lt;h2&gt; Advanced&lt;/h2&gt;
      &lt;/div&gt;
      &lt;div class="price-box"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;300/&lt;/span&gt;&lt;span class="unit"&gt;M&lt;/span&gt;&lt;/div&gt;
      &lt;div class="price-holder"&gt;
        &lt;p&gt;Pellentesque consequat viverra ipsum, sed placerat ligula aliquam eu. Nam.&lt;/p&gt;
        &lt;ul&gt;
          &lt;li&gt;20GB disk space&lt;/li&gt;
          &lt;li&gt;200GB bandwidth&lt;/li&gt;
          &lt;li&gt;Unlimited colors&lt;/li&gt;
          &lt;li&gt;DNN free skin&lt;/li&gt;
          &lt;li&gt;Full time support&lt;/li&gt;
        &lt;/ul&gt;
      &lt;/div&gt;
      &lt;a target="_blank" class="btn " href="#"&gt;Buy now&lt;/a&gt; &lt;/div&gt;
  &lt;/div&gt;
&lt;/div&gt;
</pre>
</div>
</div>

</div>

Code:

html
<div class="dg-price-bg07 pt-60 pb-30">
<div class="container">
<div class="dg-title25 Pricing-title pb-20">

PRICING-tables/style24 ​

Code:

html
<h3 style="color: #ffffff;">PRICING-tables/style24</h3>
<div class="line"></div>
</div>
<div class="dg-price dg-price24 row">
<div class="col-md-3 col-sm-6">
<div class="price-border color-1">
<div class="price-title">
<h2>Standard</h2>
</div>
<div class="price-box">
<div class="price-pad"><span class="sup">$</span><span class="price">10</span><span class="unit">/mo</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>
</ul>
</div>
<div class="price-bnt"> <a target="_blank" class="btn" href="#">Get Started Now</a> </div>
</div>
</div>
<div class="col-md-3 col-sm-6">
<div class="price-border color-2">
<div class="price-title">
<h2>Standard</h2>
</div>
<div class="price-box">
<div class="price-pad"><span class="sup">$</span><span class="price">20</span><span class="unit">/mo</span></div>
</div>
<div class="price-holder">
<ul>
    <li>20GB disk space</li>
    <li>100GB bandwidth</li>
    <li>unlimited colors</li>
    <li>DNN free skin</li>
    <li>full time support</li>
</ul>
</div>
<div class="price-bnt"><a target="_blank" class="btn" href="#">Get Started 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>Standard</h2>
</div>
<div class="price-box">
<div class="price-pad"><span class="sup">$</span><span class="price">30</span><span class="unit">/mo</span></div>
</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>
<div class="price-bnt"><a target="_blank" class="btn" href="#">Get Started Now</a></div>
</div>
</div>
<div class="col-md-3 col-sm-6">
<div class="price-border color-4">
<div class="price-title">
<h2>Standard</h2>
</div>
<div class="price-box">
<div class="price-pad"><span class="sup">$</span><span class="price">40</span><span class="unit">/mo</span></div>
</div>
<div class="price-holder">
<ul>
    <li>30GB disk space</li>
    <li>100GB bandwidth</li>
    <li>unlimited colors</li>
    <li>DNN free skin</li>
    <li>full time support</li>
</ul>
</div>
<div class="price-bnt"><a target="_blank" class="btn" href="#">Get Started Now</a></div>
</div>
</div>
</div>
</div>
</div>
<div class="source_code"> <a title="Source Code" href="javascript:;"> <span class="fa fa-file"></span> SOURCE CODE </a>
<pre class="prettyprint linenums" style="display: none;">&lt;div class="dg-price-bg07 pt-60 pb-30"&gt;
  &lt;div class="container"&gt;
    &lt;div class="dg-price dg-price24 row"&gt;
      &lt;div class="col-md-3 col-sm-6"&gt;
        &lt;div class="price-border color-1"&gt;
          &lt;div class="price-title"&gt;
            &lt;h2&gt;Standard&lt;/h2&gt;
          &lt;/div&gt;
          &lt;div class="price-box"&gt;
            &lt;div class="price-pad"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;10&lt;/span&gt;&lt;span class="unit"&gt;/mo&lt;/span&gt;&lt;/div&gt;
          &lt;/div&gt;
          &lt;div class="price-holder"&gt;
            &lt;ul&gt;
              &lt;li&gt;10GB disk space&lt;/li&gt;
              &lt;li&gt;100GB bandwidth&lt;/li&gt;
              &lt;li&gt;unlimited colors&lt;/li&gt;
              &lt;li&gt;DNN free skin&lt;/li&gt;
              &lt;li&gt;full time support&lt;/li&gt;
            &lt;/ul&gt;
          &lt;/div&gt;
          &lt;div class="price-bnt"&gt; &lt;a target="_blank" class="btn" href="#"&gt;Get Started Now&lt;/a&gt; &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="col-md-3 col-sm-6"&gt;
        &lt;div class="price-border color-2"&gt;
          &lt;div class="price-title"&gt;
            &lt;h2&gt;Standard&lt;/h2&gt;
          &lt;/div&gt;
          &lt;div class="price-box"&gt;
            &lt;div class="price-pad"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;20&lt;/span&gt;&lt;span class="unit"&gt;/mo&lt;/span&gt;&lt;/div&gt;
          &lt;/div&gt;
          &lt;div class="price-holder"&gt;
            &lt;ul&gt;
              &lt;li&gt;20GB disk space&lt;/li&gt;
              &lt;li&gt;100GB bandwidth&lt;/li&gt;
              &lt;li&gt;unlimited colors&lt;/li&gt;
              &lt;li&gt;DNN free skin&lt;/li&gt;
              &lt;li&gt;full time support&lt;/li&gt;
            &lt;/ul&gt;
          &lt;/div&gt;
          &lt;div class="price-bnt"&gt;&lt;a target="_blank" class="btn" href="#"&gt;Get Started Now&lt;/a&gt;&lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="clearfix visible-sm"&gt;&lt;/div&gt;
      &lt;div class="col-md-3 col-sm-6"&gt;
        &lt;div class="price-border color-3"&gt;
          &lt;div class="price-title"&gt;
            &lt;h2&gt;Standard&lt;/h2&gt;
          &lt;/div&gt;
          &lt;div class="price-box"&gt;
            &lt;div class="price-pad"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;30&lt;/span&gt;&lt;span class="unit"&gt;/mo&lt;/span&gt;&lt;/div&gt;
          &lt;/div&gt;
          &lt;div class="price-holder"&gt;
            &lt;ul&gt;
              &lt;li&gt;20GB disk space&lt;/li&gt;
              &lt;li&gt;200GB bandwidth&lt;/li&gt;
              &lt;li&gt;unlimited colors&lt;/li&gt;
              &lt;li&gt;DNN free skin&lt;/li&gt;
              &lt;li&gt;full time support&lt;/li&gt;
            &lt;/ul&gt;
          &lt;/div&gt;
          &lt;div class="price-bnt"&gt;&lt;a target="_blank" class="btn" href="#"&gt;Get Started Now&lt;/a&gt;&lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="col-md-3 col-sm-6"&gt;
        &lt;div class="price-border color-4"&gt;
          &lt;div class="price-title"&gt;
            &lt;h2&gt;Standard&lt;/h2&gt;
          &lt;/div&gt;
          &lt;div class="price-box"&gt;
            &lt;div class="price-pad"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;40&lt;/span&gt;&lt;span class="unit"&gt;/mo&lt;/span&gt;&lt;/div&gt;
          &lt;/div&gt;
          &lt;div class="price-holder"&gt;
            &lt;ul&gt;
              &lt;li&gt;30GB disk space&lt;/li&gt;
              &lt;li&gt;100GB bandwidth&lt;/li&gt;
              &lt;li&gt;unlimited colors&lt;/li&gt;
              &lt;li&gt;DNN free skin&lt;/li&gt;
              &lt;li&gt;full time support&lt;/li&gt;
            &lt;/ul&gt;
          &lt;/div&gt;
          &lt;div class="price-bnt"&gt;&lt;a target="_blank" class="btn" href="#"&gt;Get Started Now&lt;/a&gt;&lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
&lt;/div&gt;
</pre>
</div>

</div>

Code:

html
<div class="container pt-60 pb-60">
<div class="dg-title25 Pricing-title pb-20">

PRICING-tables/style25 ​

Code:

html
<h3>PRICING-tables/style25</h3>
<div class="line"></div>
</div>
<div class="dg-price dg-price25 row">
<div class="col-sm-4">
<div class="price-border color-1">
<div class="price-title">
<h2>Standard</h2>
</div>
<div class="price-box"><span class="sup">$ </span><span class="price">99 </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>DNN free skin</li>
    <li>full time support</li>
    <li>amazing admin features</li>
</ul>
</div>
<a target="_blank" class="btn" href="#">ORDER NOW</a> </div>
</div>
<div class="col-sm-4">
<div class="price-border color-2">
<div class="price-title">
<h2>PROFESSIONAL</h2>
</div>
<div class="price-box"><span class="sup">$ </span><span class="price">86 </span><span class="unit">Per month</span></div>
<div class="price-holder">
<ul>
    <li>20GB 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>
</ul>
</div>
<a target="_blank" class="btn " href="#">ORDER NOW</a> </div>
</div>
<div class="col-sm-4">
<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">76 </span><span class="unit">Per month</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>
    <li>amazing admin features</li>
</ul>
</div>
<a target="_blank" class="btn " href="#">ORDER NOW</a> </div>
</div>
</div>
<div class="source_code"> <a title="Source Code" href="javascript:;"> <span class="fa fa-file"></span> SOURCE CODE </a>
<pre class="prettyprint linenums" style="display: none;">&lt;div class="dg-price dg-price25 row"&gt;
  &lt;div class="col-sm-4"&gt;
    &lt;div class="price-border color-1"&gt;
      &lt;div class="price-title"&gt;
        &lt;h2&gt;Standard&lt;/h2&gt;
      &lt;/div&gt;
      &lt;div class="price-box"&gt;&lt;span class="sup"&gt;$ &lt;/span&gt;&lt;span class="price"&gt;99 &lt;/span&gt;&lt;span class="unit"&gt;Per month&lt;/span&gt;&lt;/div&gt;
      &lt;div class="price-holder"&gt;
        &lt;ul&gt;
          &lt;li&gt;10GB disk space&lt;/li&gt;
          &lt;li&gt;100GB bandwidth&lt;/li&gt;
          &lt;li&gt;unlimited colors&lt;/li&gt;
          &lt;li&gt;DNN free skin&lt;/li&gt;
          &lt;li&gt;full time support&lt;/li&gt;
          &lt;li&gt;amazing admin features&lt;/li&gt;
        &lt;/ul&gt;
      &lt;/div&gt;
      &lt;a target="_blank" class="btn" href="#"&gt;ORDER NOW&lt;/a&gt; &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="col-sm-4"&gt;
    &lt;div class="price-border color-2"&gt;
      &lt;div class="price-title"&gt;
        &lt;h2&gt;PROFESSIONAL&lt;/h2&gt;
      &lt;/div&gt;
      &lt;div class="price-box"&gt;&lt;span class="sup"&gt;$ &lt;/span&gt;&lt;span class="price"&gt;86 &lt;/span&gt;&lt;span class="unit"&gt;Per month&lt;/span&gt;&lt;/div&gt;
      &lt;div class="price-holder"&gt;
        &lt;ul&gt;
          &lt;li&gt;20GB disk space&lt;/li&gt;
          &lt;li&gt;100GB bandwidth&lt;/li&gt;
          &lt;li&gt;unlimited colors&lt;/li&gt;
          &lt;li&gt;DNN free skin&lt;/li&gt;
          &lt;li&gt;full time support&lt;/li&gt;
          &lt;li&gt;amazing admin features&lt;/li&gt;
        &lt;/ul&gt;
      &lt;/div&gt;
      &lt;a target="_blank" class="btn " href="#"&gt;ORDER NOW&lt;/a&gt; &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="col-sm-4"&gt;
    &lt;div class="price-border color-3"&gt;
      &lt;div class="price-title"&gt;
        &lt;h2&gt;MAXIMUM&lt;/h2&gt;
      &lt;/div&gt;
      &lt;div class="price-box"&gt;&lt;span class="sup"&gt;$ &lt;/span&gt;&lt;span class="price"&gt;76 &lt;/span&gt;&lt;span class="unit"&gt;Per month&lt;/span&gt;&lt;/div&gt;
      &lt;div class="price-holder"&gt;
        &lt;ul&gt;
          &lt;li&gt;20GB disk space&lt;/li&gt;
          &lt;li&gt;200GB bandwidth&lt;/li&gt;
          &lt;li&gt;unlimited colors&lt;/li&gt;
          &lt;li&gt;DNN free skin&lt;/li&gt;
          &lt;li&gt;full time support&lt;/li&gt;
          &lt;li&gt;amazing admin features&lt;/li&gt;
        &lt;/ul&gt;
      &lt;/div&gt;
      &lt;a target="_blank" class="btn " href="#"&gt;ORDER NOW&lt;/a&gt; &lt;/div&gt;
  &lt;/div&gt;
&lt;/div&gt;
</pre>
</div>
</div>

</div>

Code:

html
<div class="container  pb-40">
<div class="dg-title25 Pricing-title pb-20">

PRICING-tables/style26 ​

Code:

html
<h3>PRICING-tables/style26</h3>
<div class="line"></div>
</div>
<div class="dg-price dg-price26 row">
<div class="col-sm-4">
<div class="price-border color-1">
<div class="price-title">
<h2>Basic Plan</h2>
<div class="price-box"><span class="sup">$</span><span class="price">10</span><span class="unit">/mo</span></div>
<p>30 day free trial  on all accounts</p>
</div>
<div class="price-holder">
<ul>
    <li>&gt;10gb disk space</li>
    <li>&gt;Amazing Admin Features</li>
    <li>&gt;Stunning Graphic Effects</li>
    <li>&gt;Full Time Support</li>
    <li>&gt;Unlimited Colors</li>
    <li>&gt;100GB Bandwidth</li>
</ul>
</div>
</div>
</div>
<div class="col-sm-4">
<div class="price-border color-2">
<div class="price-popular">Most popular</div>
<div class="price-title">
<h2>BUSINESS</h2>
<div class="price-box"><span class="sup">$</span><span class="price">20</span><span class="unit">/mo</span></div>
<p>30 day free trial  on all accounts</p>
</div>
<div class="price-holder">
<ul>
    <li>&gt;10gb disk space</li>
    <li>&gt;Amazing Admin Features</li>
    <li>&gt;Stunning Graphic Effects</li>
    <li>&gt;Full Time Support</li>
    <li>&gt;Unlimited Colors</li>
    <li>&gt;200GB Bandwidth</li>
</ul>
</div>
</div>
</div>
<div class="col-sm-4">
<div class="price-border color-3">
<div class="price-title">
<h2>MAXIMUM</h2>
<div class="price-box"><span class="sup">$</span><span class="price">10</span><span class="unit">/mo</span></div>
<p>30 day free trial  on all accounts</p>
</div>
<div class="price-holder">
<ul>
    <li>&gt;20gb disk space</li>
    <li>&gt;Amazing Admin Features</li>
    <li>&gt;Stunning Graphic Effects</li>
    <li>&gt;Full Time Support</li>
    <li>&gt;Unlimited Colors</li>
    <li>&gt;200GB Bandwidth</li>
</ul>
</div>
</div>
</div>
</div>
<div class="source_code"> <a title="Source Code" href="javascript:;"> <span class="fa fa-file"></span> SOURCE CODE </a>
<pre class="prettyprint linenums" style="display: none;">&lt;div class="dg-price dg-price26 row"&gt;
  &lt;div class="col-sm-4"&gt;
    &lt;div class="price-border color-1"&gt;
      &lt;div class="price-title"&gt;
        &lt;h2&gt;Basic Plan&lt;/h2&gt;
        &lt;div class="price-box"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;10&lt;/span&gt;&lt;span class="unit"&gt;/mo&lt;/span&gt;&lt;/div&gt;
        &lt;p&gt;30 day free trial  on all accounts&lt;/p&gt;
      &lt;/div&gt;
      &lt;div class="price-holder"&gt;
        &lt;ul&gt;
          &lt;li&gt;&gt;10gb disk space&lt;/li&gt;
          &lt;li&gt;&gt;Amazing Admin Features&lt;/li&gt;
          &lt;li&gt;&gt;Stunning Graphic Effects&lt;/li&gt;
          &lt;li&gt;&gt;Full Time Support&lt;/li&gt;
          &lt;li&gt;&gt;Unlimited Colors&lt;/li&gt;
          &lt;li&gt;&gt;100GB Bandwidth&lt;/li&gt;
        &lt;/ul&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="col-sm-4"&gt;
    &lt;div class="price-border color-2"&gt;
      &lt;div class="price-popular"&gt;Most popular&lt;/div&gt;
      &lt;div class="price-title"&gt;
        &lt;h2&gt;BUSINESS&lt;/h2&gt;
        &lt;div class="price-box"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;20&lt;/span&gt;&lt;span class="unit"&gt;/mo&lt;/span&gt;&lt;/div&gt;
        &lt;p&gt;30 day free trial  on all accounts&lt;/p&gt;
      &lt;/div&gt;
      &lt;div class="price-holder"&gt;
        &lt;ul&gt;
          &lt;li&gt;&gt;10gb disk space&lt;/li&gt;
          &lt;li&gt;&gt;Amazing Admin Features&lt;/li&gt;
          &lt;li&gt;&gt;Stunning Graphic Effects&lt;/li&gt;
          &lt;li&gt;&gt;Full Time Support&lt;/li&gt;
          &lt;li&gt;&gt;Unlimited Colors&lt;/li&gt;
          &lt;li&gt;&gt;200GB Bandwidth&lt;/li&gt;
        &lt;/ul&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="col-sm-4"&gt;
    &lt;div class="price-border color-3"&gt;
      &lt;div class="price-title"&gt;
        &lt;h2&gt;MAXIMUM&lt;/h2&gt;
        &lt;div class="price-box"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;10&lt;/span&gt;&lt;span class="unit"&gt;/mo&lt;/span&gt;&lt;/div&gt;
        &lt;p&gt;30 day free trial  on all accounts&lt;/p&gt;
      &lt;/div&gt;
      &lt;div class="price-holder"&gt;
        &lt;ul&gt;
          &lt;li&gt;&gt;20gb disk space&lt;/li&gt;
          &lt;li&gt;&gt;Amazing Admin Features&lt;/li&gt;
          &lt;li&gt;&gt;Stunning Graphic Effects&lt;/li&gt;
          &lt;li&gt;&gt;Full Time Support&lt;/li&gt;
          &lt;li&gt;&gt;Unlimited Colors&lt;/li&gt;
          &lt;li&gt;&gt;200GB Bandwidth&lt;/li&gt;
        &lt;/ul&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
&lt;/div&gt;
</pre>
</div>
</div>

</div>

Code:

html
<div class="dg-price-bg08 pt-60 pb-30">
<div class="container pt-60 pb-60">
<div class="dg-title25 Pricing-title pb-20">

PRICING-tables/style27 ​

Code:

html
<h3 style="color: #ffffff;">PRICING-tables/style27</h3>
<div class="line"></div>
</div>
<div class="dg-price dg-price27 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">
<ul>
    <li>Responsive Web</li>
    <li>Sample Pages</li>
    <li>Unlimited Colors</li>
    <li>50 Databases</li>
    <li>100GB Space</li>
</ul>
</div>
<a target="_blank" class="btn" href="#">Purchase It</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">
<ul>
    <li>Responsive Web</li>
    <li>Sample Pages</li>
    <li>Unlimited Colors</li>
    <li>100 Databases</li>
    <li>100GB Space</li>
</ul>
</div>
<a target="_blank" class="btn " href="#">Purchase It</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">
<ul>
    <li>Responsive Web</li>
    <li>Sample Pages</li>
    <li>Unlimited Colors</li>
    <li>100 Databases</li>
    <li>200GB Space</li>
</ul>
</div>
<a target="_blank" class="btn " href="#">Purchase It</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"><span class="sup">$</span><span class="price">40</span><span class="unit">/month</span></div>
<div class="price-holder">
<ul>
    <li>Responsive Web</li>
    <li>Sample Pages</li>
    <li>Unlimited Colors</li>
    <li>200 Databases</li>
    <li>200GB Space</li>
</ul>
</div>
<a target="_blank" class="btn " href="#">Purchase It</a> </div>
</div>
</div>
</div>
</div>
<div class="source_code"> <a title="Source Code" href="javascript:;"> <span class="fa fa-file"></span> SOURCE CODE </a>
<pre class="prettyprint linenums" style="display: none;">&lt;div class="dg-price-bg08 pt-60 pb-30"&gt;
  &lt;div class="container pt-60 pb-60"&gt;
    &lt;div class="dg-price dg-price27 row"&gt;
      &lt;div class="col-md-3 col-sm-6"&gt;
        &lt;div class="price-border color-1"&gt;
          &lt;div class="price-title"&gt;
            &lt;h2&gt;BASIC&lt;/h2&gt;
          &lt;/div&gt;
          &lt;div class="price-box"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;10&lt;/span&gt;&lt;span class="unit"&gt;/month&lt;/span&gt;&lt;/div&gt;
          &lt;div class="price-holder"&gt;
            &lt;ul&gt;
              &lt;li&gt;Responsive Web&lt;/li&gt;
              &lt;li&gt;Sample Pages&lt;/li&gt;
              &lt;li&gt;Unlimited Colors&lt;/li&gt;
              &lt;li&gt;50 Databases&lt;/li&gt;
              &lt;li&gt;100GB Space&lt;/li&gt;
            &lt;/ul&gt;
          &lt;/div&gt;
          &lt;a target="_blank" class="btn" href="#"&gt;Purchase It&lt;/a&gt; &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="col-md-3 col-sm-6"&gt;
        &lt;div class="price-border color-2 best-value"&gt;
          &lt;div class="price-title"&gt;
            &lt;h2&gt;PROFESSIONAL&lt;/h2&gt;
          &lt;/div&gt;
          &lt;div class="price-box"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;20&lt;/span&gt;&lt;span class="unit"&gt;/month&lt;/span&gt;&lt;/div&gt;
          &lt;div class="price-holder"&gt;
            &lt;ul&gt;
              &lt;li&gt;Responsive Web&lt;/li&gt;
              &lt;li&gt;Sample Pages&lt;/li&gt;
              &lt;li&gt;Unlimited Colors&lt;/li&gt;
              &lt;li&gt;100 Databases&lt;/li&gt;
              &lt;li&gt;100GB Space&lt;/li&gt;
            &lt;/ul&gt;
          &lt;/div&gt;
          &lt;a target="_blank" class="btn " href="#"&gt;Purchase It&lt;/a&gt; &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="clearfix visible-sm"&gt;&lt;/div&gt;
      &lt;div class="col-md-3 col-sm-6"&gt;
        &lt;div class="price-border color-3"&gt;
          &lt;div class="price-title"&gt;
            &lt;h2&gt;BUSINESS&lt;/h2&gt;
          &lt;/div&gt;
          &lt;div class="price-box"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;30&lt;/span&gt;&lt;span class="unit"&gt;/month&lt;/span&gt;&lt;/div&gt;
          &lt;div class="price-holder"&gt;
            &lt;ul&gt;
              &lt;li&gt;Responsive Web&lt;/li&gt;
              &lt;li&gt;Sample Pages&lt;/li&gt;
              &lt;li&gt;Unlimited Colors&lt;/li&gt;
              &lt;li&gt;100 Databases&lt;/li&gt;
              &lt;li&gt;200GB Space&lt;/li&gt;
            &lt;/ul&gt;
          &lt;/div&gt;
          &lt;a target="_blank" class="btn " href="#"&gt;Purchase It&lt;/a&gt; &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="col-md-3 col-sm-6"&gt;
        &lt;div class="price-border color-4"&gt;
          &lt;div class="price-title"&gt;
            &lt;h2&gt;MAXIMUM&lt;/h2&gt;
          &lt;/div&gt;
          &lt;div class="price-box"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;40&lt;/span&gt;&lt;span class="unit"&gt;/month&lt;/span&gt;&lt;/div&gt;
          &lt;div class="price-holder"&gt;
            &lt;ul&gt;
              &lt;li&gt;Responsive Web&lt;/li&gt;
              &lt;li&gt;Sample Pages&lt;/li&gt;
              &lt;li&gt;Unlimited Colors&lt;/li&gt;
              &lt;li&gt;200 Databases&lt;/li&gt;
              &lt;li&gt;200GB Space&lt;/li&gt;
            &lt;/ul&gt;
          &lt;/div&gt;
          &lt;a target="_blank" class="btn " href="#"&gt;Purchase It&lt;/a&gt; &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
&lt;/div&gt;
</pre>
</div>

</div>

Code:

html
<div class="container pt-60 pb-60">
<div class="dg-title25 Pricing-title pb-20">

PRICING-tables/style28 ​

Code:

html
<h3>PRICING-tables/style28</h3>
<div class="line"></div>
</div>
<div class="dg-price dg-price28 row">
<div class="col-sm-4">
<div class="price-border color-1">
<div class="price-title">
<h2>Standard</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>Pellentesque consequat viverra ipsum, sed placerat ligula aliquam eu. Nam sapien eros enatis at dapibus facilisis, lacinia sagittis purus. </p>
<ul>
    <li><em class="fa fa-anchor"></em>10GB disk space</li>
    <li><em class="fa fa-binoculars"></em>100GB bandwidth</li>
    <li><em class="fa fa-bell"></em>Full time support</li>
</ul>
</div>
<a target="_blank" class="btn" href="#">Get Started Now</a> </div>
</div>
<div class="col-sm-4">
<div class="price-border color-2">
<div class="price-title">
<h2>Standard</h2>
</div>
<div class="price-box"><span class="sup">$</span><span class="price">26</span><span class="unit">/month</span></div>
<div class="price-holder">
<p>Pellentesque consequat viverra ipsum, sed placerat ligula aliquam eu. Nam sapien eros enatis at dapibus facilisis, lacinia sagittis purus. </p>
<ul>
    <li><em class="fa fa-anchor"></em>10GB disk space</li>
    <li><em class="fa fa-binoculars"></em>200GB bandwidth</li>
    <li><em class="fa fa-bell"></em>Full time support</li>
</ul>
</div>
<a target="_blank" class="btn " href="#">Get Started Now</a> </div>
</div>
<div class="col-sm-4">
<div class="price-border color-3">
<div class="price-title">
<h2>Standard</h2>
</div>
<div class="price-box"><span class="sup">$</span><span class="price">36</span><span class="unit">/month</span></div>
<div class="price-holder">
<p>Pellentesque consequat viverra ipsum, sed placerat ligula aliquam eu. Nam sapien eros enatis at dapibus facilisis, lacinia sagittis purus. </p>
<ul>
    <li><em class="fa fa-anchor"></em>20GB disk space</li>
    <li><em class="fa fa-binoculars"></em>300GB bandwidth</li>
    <li><em class="fa fa-bell"></em>Full time support</li>
</ul>
</div>
<a target="_blank" class="btn " href="#">Get Started Now</a> </div>
</div>
</div>
<div class="source_code"> <a title="Source Code" href="javascript:;"> <span class="fa fa-file"></span> SOURCE CODE </a>
<pre class="prettyprint linenums" style="display: none;">&lt;div class="container pt-60 pb-60"&gt;
  &lt;div class="dg-price dg-price28 row"&gt;
    &lt;div class="col-sm-4"&gt;
      &lt;div class="price-border color-1"&gt;
        &lt;div class="price-title"&gt;
          &lt;h2&gt;Standard&lt;/h2&gt;
        &lt;/div&gt;
        &lt;div class="price-box"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;10&lt;/span&gt;&lt;span class="unit"&gt;/month&lt;/span&gt;&lt;/div&gt;
        &lt;div class="price-holder"&gt;
          &lt;p&gt;Pellentesque consequat viverra ipsum, sed placerat ligula aliquam eu. Nam sapien eros enatis at dapibus facilisis, lacinia sagittis purus. &lt;/p&gt;
          &lt;ul&gt;
            &lt;li&gt;&lt;em class="fa fa-anchor"&gt;&lt;/em&gt;10GB disk space&lt;/li&gt;
            &lt;li&gt;&lt;em class="fa fa-binoculars"&gt;&lt;/em&gt;100GB bandwidth&lt;/li&gt;
            &lt;li&gt;&lt;em class="fa fa-bell"&gt;&lt;/em&gt;Full time support&lt;/li&gt;
          &lt;/ul&gt;
        &lt;/div&gt;
        &lt;a target="_blank" class="btn" href="#"&gt;Get Started Now&lt;/a&gt; &lt;/div&gt;
    &lt;/div&gt;
    &lt;div class="col-sm-4"&gt;
      &lt;div class="price-border color-2"&gt;
        &lt;div class="price-title"&gt;
          &lt;h2&gt;Standard&lt;/h2&gt;
        &lt;/div&gt;
        &lt;div class="price-box"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;26&lt;/span&gt;&lt;span class="unit"&gt;/month&lt;/span&gt;&lt;/div&gt;
        &lt;div class="price-holder"&gt;
          &lt;p&gt;Pellentesque consequat viverra ipsum, sed placerat ligula aliquam eu. Nam sapien eros enatis at dapibus facilisis, lacinia sagittis purus. &lt;/p&gt;
          &lt;ul&gt;
            &lt;li&gt;&lt;em class="fa fa-anchor"&gt;&lt;/em&gt;10GB disk space&lt;/li&gt;
            &lt;li&gt;&lt;em class="fa fa-binoculars"&gt;&lt;/em&gt;200GB bandwidth&lt;/li&gt;
            &lt;li&gt;&lt;em class="fa fa-bell"&gt;&lt;/em&gt;Full time support&lt;/li&gt;
          &lt;/ul&gt;
        &lt;/div&gt;
        &lt;a target="_blank" class="btn " href="#"&gt;Get Started Now&lt;/a&gt; &lt;/div&gt;
    &lt;/div&gt;
    &lt;div class="col-sm-4"&gt;
      &lt;div class="price-border color-3"&gt;
        &lt;div class="price-title"&gt;
          &lt;h2&gt;Standard&lt;/h2&gt;
        &lt;/div&gt;
        &lt;div class="price-box"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;36&lt;/span&gt;&lt;span class="unit"&gt;/month&lt;/span&gt;&lt;/div&gt;
        &lt;div class="price-holder"&gt;
          &lt;p&gt;Pellentesque consequat viverra ipsum, sed placerat ligula aliquam eu. Nam sapien eros enatis at dapibus facilisis, lacinia sagittis purus. &lt;/p&gt;
          &lt;ul&gt;
            &lt;li&gt;&lt;em class="fa fa-anchor"&gt;&lt;/em&gt;20GB disk space&lt;/li&gt;
            &lt;li&gt;&lt;em class="fa fa-binoculars"&gt;&lt;/em&gt;300GB bandwidth&lt;/li&gt;
            &lt;li&gt;&lt;em class="fa fa-bell"&gt;&lt;/em&gt;Full time support&lt;/li&gt;
          &lt;/ul&gt;
        &lt;/div&gt;
        &lt;a target="_blank" class="btn " href="#"&gt;Get Started Now&lt;/a&gt; &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
&lt;/div&gt;
</pre>
</div>
</div>

</div>

Code:

html
<div class="container">
<div class="dg-title25 Pricing-title pb-20">

PRICING-tables/style29 ​

Code:

html
<h3>PRICING-tables/style29</h3>
<div class="line"></div>
</div>
<div class="dg-price dg-price29 row">
<div class="col-md-3 col-sm-6">
<div class="price-border">
<div class="price-title"> <em class="fa fa-comments"></em>
<h2>Basic Plan</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">Pellentesque consequat viverra.</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><em class="fa fa-star"></em><em class="fa fa-star"></em><em class="fa fa-star"></em><em class="fa fa-star"></em><em class="fa fa-star-o"></em></li>
</ul>
</div>
<div class="price-btn"><a target="_blank" class="btn" href="#">BUY NOW!</a> </div>
</div>
</div>
<div class="col-md-3 col-sm-6">
<div class="price-border best-value">
<div class="price-title"> <em class="fa fa-key"></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-info">Pellentesque consequat viverra.</div>
<div class="price-holder">
<ul>
    <li>10GB disk space</li>
    <li>200GB bandwidth</li>
    <li>Unlimited colors</li>
    <li>DNN free skin</li>
    <li><em class="fa fa-star"></em><em class="fa fa-star"></em><em class="fa fa-star"></em><em class="fa fa-star"></em><em class="fa fa-star-o"></em></li>
</ul>
</div>
<div class="price-btn"><a target="_blank" class="btn" href="#">BUY NOW!</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"> <em class="fa fa-plane"></em>
<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-info">Pellentesque consequat viverra.</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><em class="fa fa-star"></em><em class="fa fa-star"></em><em class="fa fa-star"></em><em class="fa fa-star"></em><em class="fa fa-star"></em></li>
</ul>
</div>
<div class="price-btn"><a target="_blank" class="btn" href="#">BUY NOW!</a> </div>
</div>
</div>
<div class="col-md-3 col-sm-6">
<div class="price-border">
<div class="price-title"> <em class="fa fa-flash"></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-info">Pellentesque consequat viverra.</div>
<div class="price-holder">
<ul>
    <li>30GB disk space</li>
    <li>300GB bandwidth</li>
    <li>Unlimited colors</li>
    <li>DNN free skin</li>
    <li><em class="fa fa-star"></em><em class="fa fa-star"></em><em class="fa fa-star"></em><em class="fa fa-star"></em><em class="fa fa-star-o"></em></li>
</ul>
</div>
<div class="price-btn"><a target="_blank" class="btn" href="#">BUY NOW!</a> </div>
</div>
</div>
</div>
<div class="source_code"> <a title="Source Code" href="javascript:;"> <span class="fa fa-file"></span> SOURCE CODE </a>
<pre class="prettyprint linenums" style="display: none;">&lt;div class="container"&gt;
  &lt;div class="dg-price dg-price29 row"&gt;
    &lt;div class="col-md-3 col-sm-6"&gt;
      &lt;div class="price-border"&gt;
        &lt;div class="price-title"&gt; &lt;em class="fa fa-comments"&gt;&lt;/em&gt;
          &lt;h2&gt;Basic Plan&lt;/h2&gt;
        &lt;/div&gt;
        &lt;div class="price-box"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;10/&lt;/span&gt;&lt;span class="unit"&gt;MONTH&lt;/span&gt;&lt;/div&gt;
        &lt;div class="price-info"&gt;Pellentesque consequat viverra.&lt;/div&gt;
        &lt;div class="price-holder"&gt;
          &lt;ul&gt;
            &lt;li&gt;10GB disk space&lt;/li&gt;
            &lt;li&gt;100GB bandwidth&lt;/li&gt;
            &lt;li&gt;Unlimited colors&lt;/li&gt;
            &lt;li&gt;DNN free skin&lt;/li&gt;
            &lt;li&gt;&lt;em class="fa fa-star"&gt;&lt;/em&gt;&lt;em class="fa fa-star"&gt;&lt;/em&gt;&lt;em class="fa fa-star"&gt;&lt;/em&gt;&lt;em class="fa fa-star"&gt;&lt;/em&gt;&lt;em class="fa fa-star-o"&gt;&lt;/em&gt;&lt;/li&gt;
          &lt;/ul&gt;
        &lt;/div&gt;
        &lt;div class="price-btn"&gt;&lt;a target="_blank" class="btn" href="#"&gt;BUY NOW!&lt;/a&gt; &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
    &lt;div class="col-md-3 col-sm-6"&gt;
      &lt;div class="price-border best-value"&gt;
        &lt;div class="price-title"&gt; &lt;em class="fa fa-key"&gt;&lt;/em&gt;
          &lt;h2&gt;Professional&lt;/h2&gt;
        &lt;/div&gt;
        &lt;div class="price-box"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;20/&lt;/span&gt;&lt;span class="unit"&gt;MONTH&lt;/span&gt;&lt;/div&gt;
        &lt;div class="price-info"&gt;Pellentesque consequat viverra.&lt;/div&gt;
        &lt;div class="price-holder"&gt;
          &lt;ul&gt;
            &lt;li&gt;10GB disk space&lt;/li&gt;
            &lt;li&gt;200GB bandwidth&lt;/li&gt;
            &lt;li&gt;Unlimited colors&lt;/li&gt;
            &lt;li&gt;DNN free skin&lt;/li&gt;
            &lt;li&gt;&lt;em class="fa fa-star"&gt;&lt;/em&gt;&lt;em class="fa fa-star"&gt;&lt;/em&gt;&lt;em class="fa fa-star"&gt;&lt;/em&gt;&lt;em class="fa fa-star"&gt;&lt;/em&gt;&lt;em class="fa fa-star-o"&gt;&lt;/em&gt;&lt;/li&gt;
          &lt;/ul&gt;
        &lt;/div&gt;
        &lt;div class="price-btn"&gt;&lt;a target="_blank" class="btn" href="#"&gt;BUY NOW!&lt;/a&gt; &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
    &lt;div class="clearfix visible-sm"&gt;&lt;/div&gt;
    &lt;div class="col-md-3 col-sm-6"&gt;
      &lt;div class="price-border"&gt;
        &lt;div class="price-title"&gt; &lt;em class="fa fa-plane"&gt;&lt;/em&gt;
          &lt;h2&gt;Business&lt;/h2&gt;
        &lt;/div&gt;
        &lt;div class="price-box"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;30/&lt;/span&gt;&lt;span class="unit"&gt;MONTH&lt;/span&gt;&lt;/div&gt;
        &lt;div class="price-info"&gt;Pellentesque consequat viverra.&lt;/div&gt;
        &lt;div class="price-holder"&gt;
          &lt;ul&gt;
            &lt;li&gt;20GB disk space&lt;/li&gt;
            &lt;li&gt;200GB bandwidth&lt;/li&gt;
            &lt;li&gt;Unlimited colors&lt;/li&gt;
            &lt;li&gt;DNN free skin&lt;/li&gt;
            &lt;li&gt;&lt;em class="fa fa-star"&gt;&lt;/em&gt;&lt;em class="fa fa-star"&gt;&lt;/em&gt;&lt;em class="fa fa-star"&gt;&lt;/em&gt;&lt;em class="fa fa-star"&gt;&lt;/em&gt;&lt;em class="fa fa-star"&gt;&lt;/em&gt;&lt;/li&gt;
          &lt;/ul&gt;
        &lt;/div&gt;
        &lt;div class="price-btn"&gt;&lt;a target="_blank" class="btn" href="#"&gt;BUY NOW!&lt;/a&gt; &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
    &lt;div class="col-md-3 col-sm-6"&gt;
      &lt;div class="price-border"&gt;
        &lt;div class="price-title"&gt; &lt;em class="fa fa-flash"&gt;&lt;/em&gt;
          &lt;h2&gt;Maximum&lt;/h2&gt;
        &lt;/div&gt;
        &lt;div class="price-box"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;40/&lt;/span&gt;&lt;span class="unit"&gt;MONTH&lt;/span&gt;&lt;/div&gt;
        &lt;div class="price-info"&gt;Pellentesque consequat viverra.&lt;/div&gt;
        &lt;div class="price-holder"&gt;
          &lt;ul&gt;
            &lt;li&gt;30GB disk space&lt;/li&gt;
            &lt;li&gt;300GB bandwidth&lt;/li&gt;
            &lt;li&gt;Unlimited colors&lt;/li&gt;
            &lt;li&gt;DNN free skin&lt;/li&gt;
            &lt;li&gt;&lt;em class="fa fa-star"&gt;&lt;/em&gt;&lt;em class="fa fa-star"&gt;&lt;/em&gt;&lt;em class="fa fa-star"&gt;&lt;/em&gt;&lt;em class="fa fa-star"&gt;&lt;/em&gt;&lt;em class="fa fa-star-o"&gt;&lt;/em&gt;&lt;/li&gt;
          &lt;/ul&gt;
        &lt;/div&gt;
        &lt;div class="price-btn"&gt;&lt;a target="_blank" class="btn" href="#"&gt;BUY NOW!&lt;/a&gt; &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
&lt;/div&gt;
</pre>
</div>
</div>

</div>

Code:

html
<div class="container pt-60 pb-60">
<div class="dg-title25 Pricing-title pb-20">

PRICING-tables/style30 ​

Code:

html
<h3>PRICING-tables/style30</h3>
<div class="line"></div>
</div>
<div class="dg-price dg-price30 row ">
<div class="col-md-3 col-sm-6">
<div class="price-border color-1">
<div class="price-box"><span class="sup">$</span><span class="price">10</span><span class="unit">/mo</span> </div>
<div class="price-title">
<h2><span class="arrow-left"></span>Standard<span class="arrow-right"></span></h2>
</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>
<a target="_blank" class="btn" href="#">GET STARTED</a> </div>
</div>
<div class="col-md-3 col-sm-6">
<div class="price-border color-2">
<div class="price-box"><span class="sup">$</span><span class="price">20</span><span class="unit">/mo</span> </div>
<div class="price-title">
<h2><span class="arrow-left"></span>Professional<span class="arrow-right"></span></h2>
</div>
<div class="price-holder">
<ul>
    <li>Responsive Web</li>
    <li>Sample Pages</li>
    <li>Unlimited Colors</li>
    <li>50 Databases</li>
    <li>200GB Space</li>
</ul>
</div>
<a target="_blank" class="btn" href="#">GET STARTED</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-box"><span class="sup">$</span><span class="price">30</span><span class="unit">/mo</span> </div>
<div class="price-title">
<h2><span class="arrow-left"></span>Business<span class="arrow-right"></span></h2>
</div>
<div class="price-holder">
<ul>
    <li>Responsive Web</li>
    <li>Sample Pages</li>
    <li>Unlimited Colors</li>
    <li>100 Databases</li>
    <li>200GB Space</li>
</ul>
</div>
<a target="_blank" class="btn" href="#">GET STARTED</a> </div>
</div>
<div class="col-md-3 col-sm-6">
<div class="price-border color-4">
<div class="price-box"><span class="sup">$</span><span class="price">40</span><span class="unit">/mo</span> </div>
<div class="price-title">
<h2><span class="arrow-left"></span>Maximum<span class="arrow-right"></span></h2>
</div>
<div class="price-holder">
<ul>
    <li>Responsive Web</li>
    <li>Sample Pages</li>
    <li>Unlimited Colors</li>
    <li>200 Databases</li>
    <li>300GB Space</li>
</ul>
</div>
<a target="_blank" class="btn" href="#">GET STARTED</a> </div>
</div>
</div>
<div class="source_code"> <a title="Source Code" href="javascript:;"> <span class="fa fa-file"></span> SOURCE CODE </a>
<pre class="prettyprint linenums" style="display: none;">&lt;div class="dg-price dg-price30 row "&gt;
  &lt;div class="col-md-3 col-sm-6"&gt;
    &lt;div class="price-border color-1"&gt;
      &lt;div class="price-box"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;10&lt;/span&gt;&lt;span class="unit"&gt;/mo&lt;/span&gt; &lt;/div&gt;
      &lt;div class="price-title"&gt;
        &lt;h2&gt;&lt;span class="arrow-left"&gt;&lt;/span&gt;Standard&lt;span class="arrow-right"&gt;&lt;/span&gt;&lt;/h2&gt;
      &lt;/div&gt;
      &lt;div class="price-holder"&gt;
        &lt;ul&gt;
          &lt;li&gt;Responsive Web&lt;/li&gt;
          &lt;li&gt;Sample Pages&lt;/li&gt;
          &lt;li&gt;Unlimited Colors&lt;/li&gt;
          &lt;li&gt;50 Databases&lt;/li&gt;
          &lt;li&gt;100GB Space&lt;/li&gt;
        &lt;/ul&gt;
      &lt;/div&gt;
      &lt;a target="_blank" class="btn" href="#"&gt;GET STARTED&lt;/a&gt; &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="col-md-3 col-sm-6"&gt;
    &lt;div class="price-border color-2"&gt;
      &lt;div class="price-box"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;20&lt;/span&gt;&lt;span class="unit"&gt;/mo&lt;/span&gt; &lt;/div&gt;
      &lt;div class="price-title"&gt;
        &lt;h2&gt;&lt;span class="arrow-left"&gt;&lt;/span&gt;Professional&lt;span class="arrow-right"&gt;&lt;/span&gt;&lt;/h2&gt;
      &lt;/div&gt;
      &lt;div class="price-holder"&gt;
        &lt;ul&gt;
          &lt;li&gt;Responsive Web&lt;/li&gt;
          &lt;li&gt;Sample Pages&lt;/li&gt;
          &lt;li&gt;Unlimited Colors&lt;/li&gt;
          &lt;li&gt;50 Databases&lt;/li&gt;
          &lt;li&gt;200GB Space&lt;/li&gt;
        &lt;/ul&gt;
      &lt;/div&gt;
      &lt;a target="_blank" class="btn" href="#"&gt;GET STARTED&lt;/a&gt; &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="clearfix visible-sm"&gt;&lt;/div&gt;
  &lt;div class="col-md-3 col-sm-6"&gt;
    &lt;div class="price-border color-3"&gt;
      &lt;div class="price-box"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;30&lt;/span&gt;&lt;span class="unit"&gt;/mo&lt;/span&gt; &lt;/div&gt;
      &lt;div class="price-title"&gt;
        &lt;h2&gt;&lt;span class="arrow-left"&gt;&lt;/span&gt;Business&lt;span class="arrow-right"&gt;&lt;/span&gt;&lt;/h2&gt;
      &lt;/div&gt;
      &lt;div class="price-holder"&gt;
        &lt;ul&gt;
          &lt;li&gt;Responsive Web&lt;/li&gt;
          &lt;li&gt;Sample Pages&lt;/li&gt;
          &lt;li&gt;Unlimited Colors&lt;/li&gt;
          &lt;li&gt;100 Databases&lt;/li&gt;
          &lt;li&gt;200GB Space&lt;/li&gt;
        &lt;/ul&gt;
      &lt;/div&gt;
      &lt;a target="_blank" class="btn" href="#"&gt;GET STARTED&lt;/a&gt; &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="col-md-3 col-sm-6"&gt;
    &lt;div class="price-border color-4"&gt;
      &lt;div class="price-box"&gt;&lt;span class="sup"&gt;$&lt;/span&gt;&lt;span class="price"&gt;40&lt;/span&gt;&lt;span class="unit"&gt;/mo&lt;/span&gt; &lt;/div&gt;
      &lt;div class="price-title"&gt;
        &lt;h2&gt;&lt;span class="arrow-left"&gt;&lt;/span&gt;Maximum&lt;span class="arrow-right"&gt;&lt;/span&gt;&lt;/h2&gt;
      &lt;/div&gt;
      &lt;div class="price-holder"&gt;
        &lt;ul&gt;
          &lt;li&gt;Responsive Web&lt;/li&gt;
          &lt;li&gt;Sample Pages&lt;/li&gt;
          &lt;li&gt;Unlimited Colors&lt;/li&gt;
          &lt;li&gt;200 Databases&lt;/li&gt;
          &lt;li&gt;300GB Space&lt;/li&gt;
        &lt;/ul&gt;
      &lt;/div&gt;
      &lt;a target="_blank" class="btn" href="#"&gt;GET STARTED&lt;/a&gt; &lt;/div&gt;
  &lt;/div&gt;
&lt;/div&gt;
</pre>
</div>
</div>

</div>