+) List style:

-style 1:

<ul class=”category-list”>  <li><a href=”#”>iPhone 6 Plus</a></li>  <li><a href=”#”>iPhone 6</a></li>  <li><a class=”read-more” href=”#”>View All</a></li></ul>

-style 2:

<ul class=”l-specs”>  <li><a href=”#”><i class=”fa fa-check”></i>Windows 8.1 64-bit</a></li>  <li><a href=”#”><i class=”fa fa-check”></i>Technical details: Core i7 Processor; 4GB memory; 1TB hard drive</a></li>  <li><a href=”#”><i class=”fa fa-check”></i>Special features: Built-in wireless networking and bluetooth</a></li></ul>

-style 3:

<ul class=”l-specs”>  <li><a href=”#”><i class=”fa fa-caret-right”></i>Desktop CPUs</a></li>  <li><a href=”#”><i class=”fa fa-caret-right”></i>Server CPUs</a></li>  <li><a class=”read-more” href=”#”><i class=”fa fa-caret-right”></i>Show All</a></li></ul>

-style 4:

<ul class=”small-list num-bullet”>  <li><a href=”#”>Xperia C3</a></li>  <li><a href=”#”>Asus MemoPad 8</a></li>  <li><a href=”#”>Toshiba Chromebook 2</a></li></ul>

-style 5:

<ul class=”small-list a-center”>  <li><a href=”#”>10 Point Touch</a></li>  <li><a href=”#”>Capacitive Touch</a></li>  <li><a href=”#”>Dual Point Touch</a></li></ul>

+) effect with img content:

-style 1:

<div class=”container-ov overlay-icon”>  <img src=”http://livedemo.magebay.com/menupro/pub/media/mcpDemo/desktop.jpg”>  <a class=”fa fa-facebook” href=”#”></a>  <a class=”fa fa-twitter” href=”#”></a>  <a class=”fa fa-google-plus” href=”#”></a>  <a class=”fa fa-pinterest” href=”#”></a></div>

-style 2:

<div class=”container-img”>  <img src=”http://livedemo.magebay.com/menupro/pub/media/mcpDemo/notebook.jpg”>  <div class=”flipY-caption a-center item-fle”>    <h3>$1745.00</he>    <ul class=”inline-list”>      <li><a href=”#”><i class=”fa fa-link”></i></a></li>      <li><a href=”#”><i class=”fa fa-comment”></i></a></li>      <li><a href=”#”><i class=”fa fa-star”></i></a></li>      <li><a href=”#”><i class=”fa fa-shopping-cart”></i></a></li>    </ul>  </div></div>

-style 3:

<div class=”container-img”>  <img src=”http://livedemo.magebay.com/menupro/pub/media/mcpDemo/screen.jpg”>  <div class=”slideDown-caption a-center”>    <ul class=”small-list”>      <li><a href=”#”>10 Point Touch</a></li>      <li><a href=”#”>Capacitive Touch</a></li>      <li><a href=”#”>Dual Point Touch</a></li>      <li><a href=”#”>View All</a></li>    </ul>  </div></div>

+) easy buld gird colum in block:

<div class=”lg-row”>  <div class=”grid-column8″>    <div class=”sub-row”>      <div class=”grid-column4″>         your content      </div>      <div class=”grid-column4″>         your content      </div>      <div class=”grid-column4″>         your content      </div>    </div>  </div>  <div class=”grid-column4″>    your content  </div></div>

<div class=”lg-row”>  <div class=”grid-column6″>      <div class=”full-r”>         your content      </div>      <div class=”full-r”>         your content      </div>  </div>  <div class=”grid-column6″>    <div class=”sub-row”>      <div class=”grid-column6″>         your content      </div>      <div class=”grid-column6″>         your content      </div>    </div>  </div></div>