Steady

Video Popup

<section class="section overlay-bg bg-cover bg-no-repeat bg-center-center bg-fixed" style="background-image: url(http://odoo-snippets.atharvasystem.com/source/img/headphone-overlay.png);">
                        <div class="overlay-inner theme-g-bg opacity9"></div>
                        <div class="container">
                          <div class="row row-b4 justify-content-center">
                            <div class="col-12 col-md-10 text-center">
                              <span class="font-15 font-w-600 color-white">Hear Your Colours</span>
                              <h4 class="font-alt color-white font-w-600 m-0px m-10px-t m-55px-b md-font-30">Check this video presentation to know more about us and our Product</h4>
                              <a class="m-btn-icon m-btn-icon-xl popup-youtube play position-relative-m" href="http://www.youtube.com/watch?v=0O2aH4XLbto"> <i class="fa fa-play"></i></a>

</div>
                          </div>
                        </div>
                      </section>

Video popup with image

<section class="section dark-bg">
                        <div class="container">
                          <div class="row row-b4 align-items-center">
                            <div class="col-md-7 text-center">
                              <div class="border-radius-10px overflow-hidden box-shadow-extra-large">
                              <a class="popup-youtube" href="http://www.youtube.com/watch?v=0O2aH4XLbto">
                              <img src="http://odoo-snippets.atharvasystem.com/source/img/video-bg.jpg" title="" alt="" />
                              </a>
                              </div>
                            </div> 
                            <div class="col-md-5">
                              <div class="p-50px-l sm-p-0px-l sm-p-30px-t">
                                <h5 class="m-0px color-white font-w-700 font-alt">Great Team Work.</h5>
                                <p class="color-medium-gray letter-spacing-2 m-15px-b">Designed by Steady</p>
                                <p class="color-white opacity8 m-25px-b">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
                                tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis  aute irure dolor in reprehenderit in voluptate velit esse
                                cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
                                <a href="#" class="text-underline color-white letter-spacing-2 font-w-700 text-uppercase">Read More</a>
                              </div>
                            </div>
                          </div> 
                        </div>
                      </section>

Parallax Box

<section class="bg-fixed bg-cover bg-no-repeat" style="background-image: url(http://odoo-snippets.atharvasystem.com/source/img/portfolio-item1.jpg);">
                        <div class="container">
                          <div class="row row-b4 justify-content-center align-items-center full-screen">
                            <section class="col-md-10 text-center bg-black-75">
                              <div class="p-5">
                                <p class="font-20 color-white letter-spacing-2 text-uppercase font-w-300 m-20px-b">What we do</p>
                                <h1 class="color-white font-w-300 text-uppercase">Steady - Multi-purpose Odoo Theme</h1>
                                <p class="w-60 display-inline-block font-18 color-white m-20px-t letter-spacing-1 font-w-300">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.</p>
                                <div class="m-20px-t">
                                  <a class="m-btn m-btn-white" href="#">Shop Now</a>
                                </div>
                              </div>
                            </section>
                          </div>
                        </div>
                      </section>

Testimonial with two column

<section id="steady-testimonai_01" class="carousel s_banners_theme_testimonail slide steady-testimonail-2" data-ride="carousel">
                        
                        <ol class="carousel-indicators">
                          <li data-target="#steady-testimonai_01" data-slide-to="0" class="active"></li>
                          <li data-target="#steady-testimonai_01" data-slide-to="1"></li>
                        </ol>
                        
                        <div class="carousel-inner sm-m-40px-b" role="listbox">
                          <div class="item active slider section" style="background-image: url(http://odoo-snippets.atharvasystem.com/source/img/melbourne_slide_1.jpg);">
                            <div class="container">
                              <div class="row row-b4 justify-content-center">
                                <div class="col-md-4">
                                  <blockquote class="blockquote white-bg box-shadow-large m-10px border-l-none">
                                    <p class="font-15 color-medium-gray"> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
                                                  tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,</p>
                                    <p class="font-15 color-medium-gray"> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
                                                  tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,</p>
                                    <div class="w-80px m-15px-tb">
                                      <div class="w-100 h-1px theme-bg"></div>
                                    </div>
                                    <p class="m-0px font-alt font-16 font-italic font-w-700 color-extra-dark-gray">- Maria</p>
                                  </blockquote>
                                </div>

<div class="col-md-4">
                                  <blockquote class="blockquote white-bg box-shadow-large m-10px border-l-none">
                                    <p class="font-15 color-medium-gray"> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
                                                  tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,</p>
                                    <p class="font-15 color-medium-gray"> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
                                                  tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,</p>
                                    <div class="w-80px m-15px-tb">
                                      <div class="w-100 h-1px theme-bg"></div>
                                    </div>
                                    <p class="m-0px font-alt font-16 font-italic font-w-700 color-extra-dark-gray">- Maria</p>
                                  </blockquote>
                                </div>

</div> 
                            </div> 
                          </div>

<div class="item slider section" style="background-image: url(http://odoo-snippets.atharvasystem.com/source/img/melbourne_slide_1.jpg);">
                            <div class="container">
                              <div class="row row-b4 justify-content-center">
                                <div class="col-md-4">
                                  <blockquote class="blockquote white-bg box-shadow-large m-10px border-l-none">
                                    <p class="font-15 color-medium-gray"> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
                                                  tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,</p>
                                    <p class="font-15 color-medium-gray"> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
                                                  tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,</p>
                                    <div class="w-80px m-15px-tb">
                                      <div class="w-100 h-1px theme-bg"></div>
                                    </div>
                                    <p class="m-0px font-alt font-16 font-italic font-w-700 color-extra-dark-gray">- Maria</p>
                                  </blockquote>
                                </div>

<div class="col-md-4">
                                  <blockquote class="blockquote white-bg box-shadow-large m-10px border-l-none">
                                    <p class="font-15 color-medium-gray"> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
                                                  tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,</p>
                                    <p class="font-15 color-medium-gray"> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
                                                  tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,</p>
                                    <div class="w-80px m-15px-tb">
                                      <div class="w-100 h-1px theme-bg"></div>
                                    </div>
                                    <p class="m-0px font-alt font-16 font-italic font-w-700 color-extra-dark-gray">- Maria</p>
                                  </blockquote>
                                </div>
                              </div> 
                            </div> 
                          </div>

</div> 
                      </section>

Testimonial with single column

<section id="steady-testimonai2" class="carousel white-carousel s_banners_theme_testimonail slide steady-testimonail-2" data-ride="carousel">
                            
                            <ol class="carousel-indicators">
                              <li data-target="#steady-testimonai2" data-slide-to="0" class="active"></li>
                              <li data-target="#steady-testimonai2" data-slide-to="1"></li>
                            </ol>
                            
                            <div class="carousel-inner sm-m-40px-b" role="listbox">
                              <div class="item active slider section">
                                <div class="container">
                                  <div class="row row-b4 justify-content-center">
                                    <div class="col-md-6">
                                      <div class="p-30px-lr text-center">
                                        <div class="w-100px h-100px border-radius-50 overflow-hidden display-inline-block m-25px-b">
                                          <img src="http://odoo-snippets.atharvasystem.com/source/img/round1.jpg" title="" alt="" />
                                        </div>
                                        <p class="m-0px m-10px-b">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
                                        <span class="font-alt font-16 font-w-700 color-theme">Morgan Luthar</span>
                                        <span class="font-italic display-inline-block m-5px-l">CEO</span>
                                      </div>
                                    </div> 
                                  </div> 
                                </div> 
                              </div>

<div class="item slider section">
                                <div class="container">
                                  <div class="row row-b4 justify-content-center">
                                    <div class="col-md-6">
                                      <div class="p-30px-lr text-center">
                                        <div class="w-100px h-100px border-radius-50 overflow-hidden display-inline-block m-25px-b">
                                          <img src="http://odoo-snippets.atharvasystem.com/source/img/round1.jpg" title="" alt="" />
                                        </div>
                                        <p class="m-0px m-10px-b">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
                                        <span class="font-alt font-16 font-w-700 color-theme">Morgan Luthar</span>
                                        <span class="font-italic display-inline-block m-5px-l">CEO</span>
                                      </div>
                                    </div> 
                                  </div> 
                                </div> 
                              </div>

</div> 
                          </section>

Testimonial with background image

<section id="steady-testimonai02" class="carousel s_banners_theme_testimonail slide steady-testimonail-2" data-ride="carousel">
                          
                          <ol class="carousel-indicators">
                            <li data-target="#steady-testimonai02" data-slide-to="0" class="active"></li>
                            <li data-target="#steady-testimonai02" data-slide-to="1"></li>
                          </ol>
                          
                          <div class="carousel-inner sm-m-40px-b" role="listbox">
                            <div class="item active slider section bg-cover bg-no-repeat bg-top-center bg-fixed" style="background-image: url(http://odoo-snippets.atharvasystem.com/source/img/testimonial-bg.png);">
                              <div class="container">
                                <div class="row row-b4 justify-content-center">
                                  <div class="col-md-8">
                                    <div class="p-30px-lr text-center">
                                      <p class="m-0px m-20px-b color-white letter-spacing-1 font-w-300 font-16">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
                                        <span class="font-alt font-16 font-w-500 letter-spacing-1 color-white">Morgan Luthar</span>
                                        <span class="font-italic display-inline-block letter-spacing-1 color-white m-5px-l">CEO</span>
                                    </div>
                                  </div> 
                                </div> 
                              </div> 
                            </div>

<div class="item slider section bg-cover bg-no-repeat bg-top-center bg-fixed" style="background-image: url(http://odoo-snippets.atharvasystem.com/source/img/testimonial-bg.png);">
                              <div class="container">
                                <div class="row row-b4 justify-content-center">
                                  <div class="col-md-8">
                                    <div class="p-30px-lr text-center">
                                      <p class="m-0px m-20px-b color-white letter-spacing-1 font-w-300 font-16">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
                                        <span class="font-alt font-16 font-w-500 letter-spacing-1 color-white">Morgan Luthar</span>
                                        <span class="font-italic display-inline-block letter-spacing-1 color-white m-5px-l">CEO</span>
                                    </div>
                                  </div> 
                                </div> 
                              </div> 
                            </div>

</div> 
                        </section>

Testimonial with background image

<section class="steady-testimonail-4 p-100px-tb sm-p-40px-tb bg-cover bg-no-repeat bg-top-center bg-fixed" data-ride="carousel" style="background-image: url(http://odoo-snippets.atharvasystem.com/source/img/gym-testimonial.jpg);">
                        <div id="steady-testimonai4" class="p-100px-tb sm-p-50px-t carousel s_banners_theme_testimonail slide">        
                          
                          <ol class="carousel-indicators">
                            <li data-target="#steady-testimonai4" data-slide-to="0" class="active"></li>
                            <li data-target="#steady-testimonai4" data-slide-to="1"></li>
                          </ol>
                          
                          <div class="carousel-inner" role="listbox">
                            <div class="item active slider">
                              <div class="container">
                                <div class="row row-b4 justify-content-center">
                                  <div class="col-md-10">
                                    <div class="p-30px-lr text-center">
                                      <p class="m-0px m-20px-b color-white letter-spacing-2 text-uppercase line-height-30 font-w-100 font-18">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
                                      <span class="font-alt font-16 font-w-500 letter-spacing-2 text-uppercase color-white">Morgan Luthar</span>
                                    </div>
                                  </div> 
                                </div> 
                              </div> 
                            </div>

<div class="item slider">
                              <div class="container">
                                <div class="row row-b4 justify-content-center">
                                  <div class="col-md-10">
                                    <div class="p-30px-lr text-center">
                                      <p class="m-0px m-20px-b color-white letter-spacing-2 text-uppercase line-height-30 font-w-100 font-18">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
                                      <span class="font-alt font-16 font-w-500 letter-spacing-2 text-uppercase color-white">Morgan Luthar</span>
                                    </div>
                                  </div> 
                                </div> 
                              </div> 
                            </div> 
                          </div> 
                        </div>
                      </section>

Testimonial with left image

<div class="row justify-content-center m-35px-b sm-m-0px-b">
                                  <div class="col-md-12 text-center">
                                    <div class="font-alt font-14 text-uppercase font-w-600 color-medium-gray">What We Do</div>
                                    <h5 class="font-alt font-w-800 text-uppercase m-20px-b color-extra-dark-gray">What Customer Said </h5>
                                    <span class="h-1px w-50px theme-bg display-inline-block m-auto v-aling-top"> </span>
                                  </div>
                                </div>

<div id="steady-testimonai5" class="p-100px-b display-inline-block carousel white-carousel s_banners_theme_testimonail slide steady-testimonail-5" data-ride="carousel">
                                  
                                  <ol class="carousel-indicators">
                                    <li data-target="#steady-testimonai5" data-slide-to="0" class="active"></li>
                                    <li data-target="#steady-testimonai5" data-slide-to="1"></li>
                                  </ol>
                                  
                                  <div class="carousel-inner text-left" role="listbox">
                                    <div class="item active slider">
                                        <div class="row row-b4 justify-content-center">
                                          <div class="col-md-6">
                                            <blockquote class="blockquote white-bg box-shadow-large m-10px border-l-none">
                                              <p class="font-15 color-medium-gray"> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
                                              tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,</p>
                                              <p class="font-15 color-medium-gray"> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
                                              tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,</p>
                                              <div class="w-80px m-15px-tb">
                                                <div class="w-100 h-1px theme-bg"></div>
                                              </div>
                                              <p class="m-0px font-alt font-16 font-italic font-w-700 color-extra-dark-gray">- Maria</p>
                                            </blockquote>
                                          </div> 
                                        </div> 
                                    </div>

<div class="item slider">
                                      <div class="row row-b4 justify-content-center">
                                          <div class="col-md-6">
                                            <blockquote class="blockquote white-bg box-shadow-large m-10px border-l-none">
                                              <p class="font-15 color-medium-gray"> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
                                              tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,</p>
                                              <p class="font-15 color-medium-gray"> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
                                              tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,</p>
                                              <div class="w-80px m-15px-tb">
                                                <div class="w-100 h-1px theme-bg"></div>
                                              </div>
                                              <p class="m-0px font-alt font-16 font-italic font-w-700 color-extra-dark-gray">- Maria</p>
                                            </blockquote>
                                          </div> 
                                        </div> 
                                    </div>

</div> 
                                </div>
                                
                              </section>
                            </div>
                          </div>
                        </section>

3 Column testimonial

<section class="section">
                            <div class="container">
                              <div class="row-b4 row justify-content-center m-60px-b md-m-40px">
                                  <div class="col-md-8 text-center">
                                    <h4 class="font-alt font-w-600 color-extra-dark-gray">What People Say?</h4>
                                    <p class="m-0px font-16">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris</p>
                                  </div>
                              </div>

<div class="row row-b4">
                                <div class="col-md-4">
                                  <div class="border-all white-bg p-10 m-10px">
                                    <div class="display-inline-block w-80px h-80px overflow-hidden border-radius-50">
                                      <img src="http://odoo-snippets.atharvasystem.com/source/img/round1.jpg"/>
                                    </div>
                                    <p class="m-15px-t font-15">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.</p>
                                    <span class="theme-bg w-20px h-2px display-inline-block"></span>
                                    <p class="font-w-600 font-alt">Jennifer Dsouza</p>
                                  </div>
                                </div>

<div class="col-md-4">
                                  <div class="border-all white-bg p-10 m-10px">
                                    <div class="display-inline-block w-80px h-80px overflow-hidden border-radius-50">
                                      <img src="http://odoo-snippets.atharvasystem.com/source/img/round1.jpg"/>
                                    </div>
                                    <p class="m-15px-t font-15">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.</p>
                                    <span class="theme-bg w-20px h-2px display-inline-block"></span>
                                    <p class="font-w-600 font-alt">Jennifer Dsouza</p>
                                  </div>
                                </div>

<div class="col-md-4">
                                  <div class="border-all white-bg p-10 m-10px">
                                    <div class="display-inline-block w-80px h-80px overflow-hidden border-radius-50">
                                      <img src="http://odoo-snippets.atharvasystem.com/source/img/round1.jpg"/>
                                    </div>
                                    <p class="m-15px-t font-15">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.</p>
                                    <span class="theme-bg w-20px h-2px display-inline-block"></span>
                                    <p class="font-w-600 font-alt">Jennifer Dsouza</p>
                                  </div>
                                </div>
                              </div>
                            </div>
                          </section>

Our team with 4 column

<section class="section light-gray-bg">
                        <div class="container">
                            <div class="row row-b4 m-60px-b md-m-30px-b sm-m-20px-b">
                                <div class="col-md-12 text-center"> <span class="font-16 font-w-600 color-theme font-alt display-inline-block">Our Key</span>
                                    <h4 class="font-alt color-extra-dark-gray font-w-800 m-0px">Our Best Team</h4>
                                </div>
                            </div>
                            <div class="row row-b4">
                                <div class="col-md-6 col-lg-3 m-15px-tb">
                                    <div class="our-team-01 border-b border-w-5 border-theme">
                                        <div class="team-img"> <img src="http://odoo-snippets.atharvasystem.com/source/img/team1.jpg" title="Steady" alt="Steady" /> </div>
                                        <div class="p-15px text-center white-bg">
                                            <div class="color-extra-dark-gray font-w-700 text-uppercase">Morgan Jhan</div><span class="font-14">Co. Founder</span>
                                            <ul class="social-icons-01 social-icons-small m-10px-t">
                                                <li><a class="facebook" href="#"><span class="fa fa-facebook"></span></a></li>
                                                <li><a class="twitter" href="#"><span class="fa fa-twitter"></span></a></li>
                                                <li><a class="google" href="#"><span class="fa fa-google-plus"></span></a></li>
                                                <li><a class="linkedin" href="#"><span class="fa fa-linkedin"></span></a></li>
                                            </ul>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-6 col-lg-3 m-15px-tb">
                                    <div class="our-team-01 border-b border-w-5 border-theme">
                                        <div class="team-img"> <img src="http://odoo-snippets.atharvasystem.com/source/img/team1.jpg" title="Steady" alt="Steady" /> </div>
                                        <div class="p-15px text-center white-bg">
                                            <div class="color-extra-dark-gray font-w-700 text-uppercase">Morgan Jhan</div><span class="font-14">Co. Founder</span>
                                            <ul class="social-icons-01 social-icons-small m-10px-t">
                                                <li><a class="facebook" href="#"><span class="fa fa-facebook"></span></a></li>
                                                <li><a class="twitter" href="#"><span class="fa fa-twitter"></span></a></li>
                                                <li><a class="google" href="#"><span class="fa fa-google-plus"></span></a></li>
                                                <li><a class="linkedin" href="#"><span class="fa fa-linkedin"></span></a></li>
                                            </ul>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-6 col-lg-3 m-15px-tb">
                                    <div class="our-team-01 border-b border-w-5 border-theme">
                                        <div class="team-img"> <img src="http://odoo-snippets.atharvasystem.com/source/img/team1.jpg" title="Steady" alt="Steady" /> </div>
                                        <div class="p-15px text-center white-bg">
                                            <div class="color-extra-dark-gray font-w-700 text-uppercase">Morgan Jhan</div><span class="font-14">Co. Founder</span>
                                            <ul class="social-icons-01 social-icons-small m-10px-t">
                                                <li><a class="facebook" href="#"><span class="fa fa-facebook"></span></a></li>
                                                <li><a class="twitter" href="#"><span class="fa fa-twitter"></span></a></li>
                                                <li><a class="google" href="#"><span class="fa fa-google-plus"></span></a></li>
                                                <li><a class="linkedin" href="#"><span class="fa fa-linkedin"></span></a></li>
                                            </ul>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-6 col-lg-3 m-15px-tb">
                                    <div class="our-team-01 border-b border-w-5 border-theme">
                                        <div class="team-img"> <img src="http://odoo-snippets.atharvasystem.com/source/img/team1.jpg" title="Steady" alt="Steady" /> </div>
                                        <div class="p-15px text-center white-bg">
                                            <div class="color-extra-dark-gray font-w-700 text-uppercase">Morgan Jhan</div><span class="font-14">Co. Founder</span>
                                            <ul class="social-icons-01 social-icons-small m-10px-t">
                                                <li><a class="facebook" href="#"><span class="fa fa-facebook"></span></a></li>
                                                <li><a class="twitter" href="#"><span class="fa fa-twitter"></span></a></li>
                                                <li><a class="google" href="#"><span class="fa fa-google-plus"></span></a></li>
                                                <li><a class="linkedin" href="#"><span class="fa fa-linkedin"></span></a></li>
                                            </ul>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                      </section>

Our team with 3 column

<div class="row row-b4 justify-content-center m-65px-b md-m-40px-b sm-m-30px-b">
                                <div class="col-12 col-md-10 col-lg-8 text-center">
                                  <h4 class="color-extra-dark-gray font-w-700 m-0px m-15px-b font-alt">Our <span class="color-theme">Team</span></h4>
                                  
                                  <p class="font-17 sm-font-14 m-0px m-20px-t color-extra-dark-gray">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
                                </div> 
                              </div>

<div class="row row-b4">
                                <div class="col-12 col-md-4 m-15px-tb">
                                  <div class="our-team border-all">
                                    <div class="team-img">
                                      <img src="http://odoo-snippets.atharvasystem.com/source/img/team1.jpg" title="" alt=""/>
                                    </div>
                                    <div class="p-20px-tb text-center">
                                      <div class="color-black font-18 font-w-400 letter-spacing-2 text-uppercase m-5px-b">Alex Patterson</div>
                                      <span class="font-14 font-w-300 letter-spacing-2">DEVELOPER</span>
                                      <div class="social-icons-light m-15px-t">
                                        <a href="#"><i class="fa fa-facebook"></i></a>
                                        <a href="#"><i class="fa fa-twitter"></i></a>
                                        <a href="#"><i class="fa fa-google-plus"></i></a>
                                        <a href="#"><i class="fa fa-linkedin"></i></a>
                                      </div>
                                    </div>
                                  </div> 
                                </div>

<div class="col-12 col-md-4 m-15px-tb">
                                  <div class="our-team border-all">
                                    <div class="team-img">
                                      <img src="http://odoo-snippets.atharvasystem.com/source/img/team2.jpg" title="" alt=""/>
                                    </div>
                                    <div class="p-20px-tb text-center">
                                      <div class="color-black font-18 font-w-400 letter-spacing-2 text-uppercase m-5px-b">Alex Patterson</div>
                                      <span class="font-14 font-w-300 letter-spacing-2">DEVELOPER</span>
                                      <div class="social-icons-light m-15px-t">
                                        <a href="#"><i class="fa fa-facebook"></i></a>
                                        <a href="#"><i class="fa fa-twitter"></i></a>
                                        <a href="#"><i class="fa fa-google-plus"></i></a>
                                        <a href="#"><i class="fa fa-linkedin"></i></a>
                                      </div>
                                    </div>
                                  </div> 
                                </div>

<div class="col-12 col-md-4 m-15px-tb">
                                  <div class="our-team border-all">
                                    <div class="team-img">
                                      <img src="http://odoo-snippets.atharvasystem.com/source/img/team3.jpg" title="" alt=""/>
                                    </div>
                                    <div class="p-20px-tb text-center">
                                      <div class="color-black font-18 font-w-400 letter-spacing-2 text-uppercase m-5px-b">Alex Patterson</div>
                                      <span class="font-14 font-w-300 letter-spacing-2">DEVELOPER</span>
                                      <div class="social-icons-light m-15px-t">
                                        <a href="#"><i class="fa fa-facebook"></i></a>
                                        <a href="#"><i class="fa fa-twitter"></i></a>
                                        <a href="#"><i class="fa fa-google-plus"></i></a>
                                        <a href="#"><i class="fa fa-linkedin"></i></a>
                                      </div>
                                    </div>
                                  </div> 
                                </div>

</div> 
                            </div> 
                          </section>

Our team with 4 column

<section class="section light-gray-bg">
                            <div class="container">
                              <div class="row row-b4 justify-content-center m-60px-b  md-m-40px-b sm-m-20px-b">
                                <div class="col-12 col-md-10 col-lg-8 text-center">
                                  <h4 class="color-extra-dark-gray font-w-700 m-0px m-15px-b font-alt text-uppercase">Our Trainers</h4>
                                  <p class="font-17 m-0px m-20px-t sm-font-14">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
                                </div>
                              </div>

<div class="row row-b4">
                                <div class="col-md-6 col-lg-3 m-15px-tb">
                                  <div class="our-team-02 box-shadow-extra-large">
                                    <div class="team-img">
                                      <img src="http://odoo-snippets.atharvasystem.com/source/img/gym-t-1.jpg" alt="" title="" />
                                    </div>
                                    <div class="white-bg p-15px text-center">
                                      <p class="font-18 font-alt font-w-700 m-5px-b color-extra-dark-gray">David Smith</p>
                                      <span>Fitness Trainer</span>
                                    </div>
                                  </div>
                                </div>

<div class="col-md-6 col-lg-3 m-15px-tb">
                                  <div class="our-team-02 box-shadow-extra-large">
                                    <div class="team-img">
                                      <img src="http://odoo-snippets.atharvasystem.com/source/img/gym-t-2.jpg" alt="" title="" />
                                    </div>
                                    <div class="white-bg p-15px text-center">
                                      <p class="font-18 font-alt font-w-700 m-5px-b color-extra-dark-gray">Selina Stuart</p>
                                      <span>Fitness Trainer</span>
                                    </div>
                                  </div>
                                </div>

<div class="col-md-6 col-lg-3 m-15px-tb">
                                  <div class="our-team-02 box-shadow-extra-large">
                                    <div class="team-img">
                                      <img src="http://odoo-snippets.atharvasystem.com/source/img/gym-t-3.jpg" alt="" title="" />
                                    </div>
                                    <div class="white-bg p-15px text-center">
                                      <p class="font-18 font-alt font-w-700 m-5px-b color-extra-dark-gray">John Doe</p>
                                      <span>Fitness Trainer</span>
                                    </div>
                                  </div>
                                </div>

<div class="col-md-6 col-lg-3 m-15px-tb">
                                  <div class="our-team-02 box-shadow-extra-large">
                                    <div class="team-img">
                                      <img src="http://odoo-snippets.atharvasystem.com/source/img/gym-t-4.jpg" alt="" title="" />
                                    </div>
                                    <div class="white-bg p-15px text-center">
                                      <p class="font-18 font-alt font-w-700 m-5px-b color-extra-dark-gray">Jenifer Alex</p>
                                      <span>Fitness Trainer</span>
                                    </div>
                                  </div>
                                </div>

</div>
                            </div>
                          </section>

Our services with center content

<section class="section bg-gray-lighter steady-services-1">
                        <div class="container">
                            <div class="row row-b4 m-60px-b md-m-40px-b sm-m-30px-b">
                                <div class="col-md-12 text-center"> <span class="font-16 font-w-600 color-theme font-alt display-inline-block">What We Do</span>
                                    <h4 class="font-alt color-extra-dark-gray font-w-800 m-0px m-15px-b">Our Best Services</h4>
                                </div>
                            </div>
                            <div class="row row-b4">
                                <div class="col-md-4 hover-shadow hover-white-bg">
                                    <div class="feature-box text-center p-30px"> <span class="fa fa-car color-theme icon-xxl"></span>
                                        <div class="feature-content">
                                            <div class="font-alt font-16 font-w-700 m-5px-b m-15px-t color-extra-dark-gray">Perfect Design</div>
                                            <div class="w-50px theme-bg h-1px display-block m-auto-all m-15px-tb"></div>
                                            <p>Lorem Ipsum is simply text the printing and typesetting standard industry. Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-4 hover-shadow hover-white-bg">
                                    <div class="feature-box text-center p-30px"> <span class="fa fa-camera-retro color-theme icon-xxl"></span>
                                        <div class="feature-content">
                                            <div class="font-alt font-16 font-w-700 m-5px-b m-15px-t color-extra-dark-gray">Perfect Design</div>
                                            <div class="w-50px theme-bg h-1px display-block m-auto-all m-15px-tb"></div>
                                            <p>Lorem Ipsum is simply text the printing and typesetting standard industry. Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-4 hover-shadow hover-white-bg">
                                    <div class="feature-box text-center p-30px"> <span class="fa fa-bookmark color-theme icon-xxl"></span>
                                        <div class="feature-content">
                                            <div class="font-alt font-16 font-w-700 m-5px-b m-15px-t color-extra-dark-gray">Perfect Design</div>
                                            <div class="w-50px theme-bg h-1px display-block m-auto-all m-15px-tb"></div>
                                            <p>Lorem Ipsum is simply text the printing and typesetting standard industry. Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-4 hover-shadow hover-white-bg">
                                    <div class="feature-box text-center p-30px"> <span class="fa fa-bath color-theme icon-xxl"></span>
                                        <div class="feature-content">
                                            <div class="font-alt font-16 font-w-700 m-5px-b m-15px-t color-extra-dark-gray">Perfect Design</div>
                                            <div class="w-50px theme-bg h-1px display-block m-auto-all m-15px-tb"></div>
                                            <p>Lorem Ipsum is simply text the printing and typesetting standard industry. Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-4 hover-shadow hover-white-bg">
                                    <div class="feature-box text-center p-30px"> <span class="fa fa-adjust color-theme icon-xxl"></span>
                                        <div class="feature-content">
                                            <div class="font-alt font-16 font-w-700 m-5px-b m-15px-t color-extra-dark-gray">Perfect Design</div>
                                            <div class="w-50px theme-bg h-1px display-block m-auto-all m-15px-tb"></div>
                                            <p>Lorem Ipsum is simply text the printing and typesetting standard industry. Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-4 hover-shadow hover-white-bg">
                                    <div class="feature-box text-center p-30px"> <span class="fa fa-archive color-theme icon-xxl"></span>
                                        <div class="feature-content">
                                            <div class="font-alt font-16 font-w-700 m-5px-b m-15px-t color-extra-dark-gray">Perfect Design</div>
                                            <div class="w-50px theme-bg h-1px display-block m-auto-all m-15px-tb"></div>
                                            <p>Lorem Ipsum is simply text the printing and typesetting standard industry. Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                      </section>

Our services with left content

<section class="section light-gray-bg steady-services-2">
                        <div class="container">
                            <div class="row justify-content-center">
                                <div class="col-md-12 text-center">
                                    <div class="font-alt font-14 text-uppercase font-w-600 color-medium-gray">What We Do</div>
                                    <h5 class="font-alt font-w-800 text-uppercase m-20px-b color-extra-dark-gray">Our Services</h5> 
                                    <span class="h-1px w-50px theme-bg display-inline-block m-auto v-aling-top"> </span>
                                  </div>
                            </div>
                            <div class="row">
                                <div class="col-md-4">
                                    <div class="feature-box p-30px white-bg m-15px-tb"> <i class="fa fa-picture-o color-theme icon-xxl"></i>
                                        <div class="feature-content">
                                            <div class="font-alt font-16 font-w-700 m-5px-b m-15px-t color-extra-dark-gray">Perfect Design</div>
                                            <p>Lorem Ipsum is simply text the printing and typesetting standard industry. Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-4">
                                    <div class="feature-box p-30px white-bg m-15px-tb"> <i class="fa fa-pencil color-theme icon-xxl"></i>
                                        <div class="feature-content">
                                            <div class="font-alt font-16 font-w-700 m-5px-b m-15px-t color-extra-dark-gray">Perfect Design</div>
                                            <p>Lorem Ipsum is simply text the printing and typesetting standard industry. Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-4">
                                    <div class="feature-box p-30px white-bg m-15px-tb"> <i class="fa fa-puzzle-piece color-theme icon-xxl"></i>
                                        <div class="feature-content">
                                            <div class="font-alt font-16 font-w-700 m-5px-b m-15px-t color-extra-dark-gray">Perfect Design</div>
                                            <p>Lorem Ipsum is simply text the printing and typesetting standard industry. Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-4">
                                    <div class="feature-box p-30px white-bg m-15px-tb"> <i class="fa fa-th-large color-theme icon-xxl"></i>
                                        <div class="feature-content">
                                            <div class="font-alt font-16 font-w-700 m-5px-b m-15px-t color-extra-dark-gray">Perfect Design</div>
                                            <p>Lorem Ipsum is simply text the printing and typesetting standard industry. Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-4">
                                    <div class="feature-box p-30px white-bg m-15px-tb"> <i class="fa fa-file-text-o color-theme icon-xxl"></i>
                                        <div class="feature-content">
                                            <div class="font-alt font-16 font-w-700 m-5px-b m-15px-t color-extra-dark-gray">Perfect Design</div>
                                            <p>Lorem Ipsum is simply text the printing and typesetting standard industry. Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-4">
                                    <div class="feature-box p-30px white-bg m-15px-tb"> <i class="fa fa-plus color-theme icon-xxl"></i>
                                        <div class="feature-content">
                                            <div class="font-alt font-16 font-w-700 m-5px-b m-15px-t color-extra-dark-gray">Perfect Design</div>
                                            <p>Lorem Ipsum is simply text the printing and typesetting standard industry. Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </section>

Our services with content and image

<section class="section">
                        <div class="container">
                          <div class="row row-b4 align-items-center">
                            <div class="col-md-4">
                              <h4 class="font-alt color-extra-dark-gray m-0px m-25px-b font-w-700">Our Best Services</h4>
                              <p>Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
                              <p class="m-25px-b">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
                              tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
                              quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
                              consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
                              cillum dolore eu fugiat nulla pariatur.</p>
                              <a href="#" class="m-btn m-btn-t-black">Read More</a>
                            </div>

<div class="col-md-4">
                              <div class="feature-box-01 m-40px-b"> 
                                <i class="fa fa-picture-o color-theme icon-xl"></i>
                                  <div class="feature-content">
                                      <div class="font-alt font-w-700 m-5px-b color-extra-dark-gray font-15">Perfect Design</div>
                                      <p>Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                  </div>
                              </div>

<div class="feature-box-01 m-40px-b"> 
                                <i class="fa fa-pencil color-theme icon-xl"></i>
                                <div class="feature-content">
                                    <div class="font-alt font-w-700 m-5px-b color-extra-dark-gray font-15">Full Documentation</div>
                                    <p>Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                </div>
                              </div>

<div class="feature-box-01"> 
                                <i class="fa fa-puzzle-piece color-theme icon-xl"></i>
                                  <div class="feature-content">
                                      <div class="font-alt font-w-700 m-5px-b color-extra-dark-gray font-15">Fully Responsive</div>
                                      <p>Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                  </div>
                              </div>

</div>

</div> 
                        </div> 
                      </section>

Our services with image

<section class="section">
                        <div class="container">
                          <div class="row row-b4 justify-content-center m-65px-b md-m-40px-b sm-m-20px-b">
                            <div class="col-12 col-md-10 col-lg-8 text-center">
                              <h4 class="color-extra-dark-gray font-w-700 m-0px m-15px-b font-alt">Our <span class="color-theme">Services</span></h4>
                              
                              <p class="font-17 m-0px m-20px-t sm-font-14 color-extra-dark-gray">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
                            </div> 
                          </div>

<div class="row row-b4">
                            <div class="col-12 col-md-4 m-15px-tb">
                              <div class="box-shadow-large white-bg">
                                <img src="http://odoo-snippets.atharvasystem.com/source/img/blog-img1.jpg" alt="" title="" />
                                <div class="p-20px">
                                  <div class="font-alt font-w-600 font-18 color-extra-dark-gray p-10px-b">Business Advising</div>
                                  <p class="m-0px">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the 's standard dummy text.</p>
                                </div>
                              </div>
                            </div>

<div class="col-12 col-md-4 m-15px-tb">
                              <div class="box-shadow-large white-bg">
                                <img src="http://odoo-snippets.atharvasystem.com/source/img/blog-img2.jpg" alt="" title="" />
                                <div class="p-20px">
                                  <div class="font-alt font-w-600 font-18 color-extra-dark-gray p-10px-b">Documentation</div>
                                  <p class="m-0px">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the 's standard dummy text.</p>
                                </div>
                              </div>
                            </div>

<div class="col-12 col-md-4 m-15px-tb">
                              <div class="box-shadow-large white-bg">
                                <img src="http://odoo-snippets.atharvasystem.com/source/img/blog-img3.jpg" alt="" title="" />
                                <div class="p-20px">
                                  <div class="font-alt font-w-600 font-18 color-extra-dark-gray p-10px-b">Documentation</div>
                                  <p class="m-0px">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the 's standard dummy text.</p>
                                </div>
                              </div>
                            </div>

<div class="col-12 col-md-4 m-15px-tb">
                              <div class="box-shadow-large white-bg">
                                <img src="http://odoo-snippets.atharvasystem.com/source/img/blog-img4.jpg" alt="" title="" />
                                <div class="p-20px">
                                  <div class="font-alt font-w-600 font-18 color-extra-dark-gray p-10px-b">Reponsive</div>
                                  <p class="m-0px">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the 's standard dummy text.</p>
                                </div>
                              </div>
                            </div>

<div class="col-12 col-md-4 m-15px-tb">
                              <div class="box-shadow-large white-bg">
                                <img src="http://odoo-snippets.atharvasystem.com/source/img/blog-img5.jpg" alt="" title="" />
                                <div class="p-20px">
                                  <div class="font-alt font-w-600 font-18 color-extra-dark-gray p-10px-b">Clean Design</div>
                                  <p class="m-0px">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the 's standard dummy text.</p>
                                </div>
                              </div>
                            </div>

<div class="col-12 col-md-4 m-15px-tb">
                              <div class="box-shadow-large white-bg">
                                <img src="http://odoo-snippets.atharvasystem.com/source/img/blog-img6.jpg" alt="" title="" />
                                <div class="p-20px">
                                  <div class="font-alt font-w-600 font-18 color-extra-dark-gray p-10px-b">Best Support</div>
                                  <p class="m-0px">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the 's standard dummy text.</p>
                                </div>
                              </div>
                            </div>

</div> 
                        </div> 
                      </section>

Our services with image

<section class="section light-gray-bg">
                        <div class="container">
                          <div class="row row-b4 justify-content-center m-60px-b  md-m-40px-b sm-m-20px-b">
                            <div class="col-12 col-md-10 col-lg-8 text-center">
                              <h4 class="color-extra-dark-gray font-w-700 m-0px m-15px-b font-alt text-uppercase">OUR FEATURED CLASSES</h4>
                              <p class="font-17 m-0px m-20px-t sm-font-14">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
                            </div>
                          </div>

<div class="row row-b4">
                            <div class="col-12 col-md-4 m-15px-tb">
                              <div class="box-shadow-large white-bg">
                                <img src="http://odoo-snippets.atharvasystem.com/source/img/gym-s1.jpg" alt="" title="" />
                                <div class="p-20px text-center">
                                  <div class="font-alt font-w-600 font-20 p-10px-b"><a href="#" class="color-extra-dark-gray">Featured Class</a></div>
                                  <p class="m-0px">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the 's standard dummy text.</p>
                                </div>
                              </div>
                            </div>

<div class="col-12 col-md-4 m-15px-tb">
                              <div class="box-shadow-large white-bg">
                                <img src="http://odoo-snippets.atharvasystem.com/source/img/gym-s2.jpg" alt="" title="" />
                                <div class="p-20px text-center">
                                  <div class="font-alt font-w-600 font-20 p-10px-b"><a href="#" class="color-extra-dark-gray">Featured Class</a></div>
                                  <p class="m-0px">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the 's standard dummy text.</p>
                                </div>
                              </div>
                            </div>

<div class="col-12 col-md-4 m-15px-tb">
                              <div class="box-shadow-large white-bg">
                                <img src="http://odoo-snippets.atharvasystem.com/source/img/gym-s3.jpg" alt="" title="" />
                                <div class="p-20px text-center">
                                  <div class="font-alt font-w-600 font-20 p-10px-b"><a href="#" class="color-extra-dark-gray">Featured Class</a></div>
                                  <p class="m-0px">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the 's standard dummy text.</p>
                                </div>
                              </div>
                            </div>

<div class="col-12 col-md-4 m-15px-tb">
                              <div class="box-shadow-large white-bg">
                                <img src="http://odoo-snippets.atharvasystem.com/source/img/gym-s4.jpg" alt="" title="" />
                                <div class="p-20px text-center">
                                  <div class="font-alt font-w-600 font-20 p-10px-b"><a href="#" class="color-extra-dark-gray">Featured Class</a></div>
                                  <p class="m-0px">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the 's standard dummy text.</p>
                                </div>
                              </div>
                            </div>

<div class="col-12 col-md-4 m-15px-tb">
                              <div class="box-shadow-large white-bg">
                                <img src="http://odoo-snippets.atharvasystem.com/source/img/gym-s5.jpg" alt="" title="" />
                                <div class="p-20px text-center">
                                  <div class="font-alt font-w-600 font-20 p-10px-b"><a href="#" class="color-extra-dark-gray">Featured Class</a></div>
                                  <p class="m-0px">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the 's standard dummy text.</p>
                                </div>
                              </div>
                            </div>

<div class="col-12 col-md-4 m-15px-tb">
                              <div class="box-shadow-large white-bg">
                                <img src="http://odoo-snippets.atharvasystem.com/source/img/gym-s6.jpg" alt="" title="" />
                                <div class="p-20px text-center">
                                  <div class="font-alt font-w-600 font-20 p-10px-b"><a href="#" class="color-extra-dark-gray">Featured Class</a></div>
                                  <p class="m-0px">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the 's standard dummy text.</p>
                                </div>
                              </div>
                            </div>

</div> 
                        </div> 
                      </section>

Our services with image icon

<section class="section light-gray-bg">
                        <div class="container">
                          <div class="row-b4 row justify-content-center m-60px-b md-m-40px sm-m-b">
                            <div class="col-md-8 text-center">
                              <h4 class="font-alt font-w-600 color-extra-dark-gray">What We Do?</h4>
                              <p class="m-0px font-16">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris</p>
                            </div>
                          </div>

<div class="row row-b4 justify-content-center">
                            <div class="col-md-4 m-15px-tb">
                              <div class="p-20px-lr p-50px-tb text-center white-bg border-all">
                                <div class="m-40px-b">
                                  <img src="http://odoo-snippets.atharvasystem.com/source/img/graphic-design.png"/>
                                </div>
                                <p class="font-18 font-alt font-w-600 color-extra-dark-gray m-15px-b">Web Design</p>
                                <p class="font-16">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim.</p>
                              </div>
                            </div>

<div class="col-md-4 m-15px-tb">
                              <div class="p-20px-lr p-50px-tb text-center white-bg border-all">
                                <div class="m-40px-b">
                                  <img src="http://odoo-snippets.atharvasystem.com/source/img/employee.png"/>
                                </div>
                                <p class="font-18 font-alt font-w-600 color-extra-dark-gray m-15px-b">Development</p>
                                <p class="font-16">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim.</p>
                              </div>
                            </div>

<div class="col-md-4 m-15px-tb">
                              <div class="p-20px-lr p-50px-tb text-center white-bg border-all">
                                <div class="m-40px-b">
                                  <img src="http://odoo-snippets.atharvasystem.com/source/img/planning.png"/>
                                </div>
                                <p class="font-18 font-alt font-w-600 color-extra-dark-gray m-15px-b">Marketing</p>
                                <p class="font-16">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim.</p>
                              </div>
                            </div>

<div class="col-md-4 m-15px-tb">
                              <div class="p-20px-lr p-50px-tb text-center white-bg border-all">
                                <div class="m-40px-b">
                                  <img src="http://odoo-snippets.atharvasystem.com/source/img/presentation.png"/>
                                </div>
                                <p class="font-18 font-alt font-w-600 color-extra-dark-gray m-15px-b">Live Chart</p>
                                <p class="font-16">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim.</p>
                              </div>
                            </div>

<div class="col-md-4 m-15px-tb">
                              <div class="p-20px-lr p-50px-tb text-center white-bg border-all">
                                <div class="m-40px-b">
                                  <img src="http://odoo-snippets.atharvasystem.com/source/img/contract.png"/>
                                </div>
                                <p class="font-18 font-alt font-w-600 color-extra-dark-gray m-15px-b">Brand Design</p>
                                <p class="font-16">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim.</p>
                              </div>
                            </div>

<div class="col-md-4 m-15px-tb">
                              <div class="p-20px-lr p-50px-tb text-center white-bg border-all">
                                <div class="m-40px-b">
                                  <img src="http://odoo-snippets.atharvasystem.com/source/img/customer-support.png"/>
                                </div>
                                <p class="font-18 font-alt font-w-600 color-extra-dark-gray m-15px-b">24/7 Support</p>
                                <p class="font-16">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim.</p>
                              </div>
                            </div>

</div>
                        </div>
                      </section>

Promotion banner with 3 block

<section class="promo-banner p-10px-b">
                        <div class="container-fluid">
                          <div class="row row-b4">
                            <div class="col-12 col-md-6">
                              <a href="#" class="display-block m-15px-t">
                                <img class="w-100" src="http://odoo-snippets.atharvasystem.com/source/img/sale-banner-01.png" />
                                <div class="position-center-box text-center">
                                  <span class="white-opacity-bg display-inline-block p-10px-tb p-25px-lr font-w-700 color-extra-dark-gray font-20 font-alt">WOMEN</span>
                                </div>
                              </a>
                            </div>
                            <div class="col-12 col-md-6">
                              <a href="#" class="display-block m-15px-t position-relative-m">
                                <img class="w-100" src="http://odoo-snippets.atharvasystem.com/source/img/sale-banner-02.png" />
                                <div class="position-center-box text-center">
                                  <span class="white-opacity-bg display-inline-block p-10px-tb p-25px-lr font-w-700 color-extra-dark-gray font-20 font-alt">MEN</span>
                                </div>
                              </a>
                              <a href="#" class="display-block m-15px-t position-relative-m">
                                <img class="w-100" src="http://odoo-snippets.atharvasystem.com/source/img/sale-banner-03.png" />
                                <div class="position-center-box text-center">
                                  <span class="white-opacity-bg display-inline-block p-10px-tb p-25px-lr font-w-700 color-extra-dark-gray font-20 font-alt">SHOES</span>
                                </div>
                              </a>
                            </div>
                          </div> 
                        </div> 
                      </section>

Promotion banner with 4 block

Promotion banner with 2 block

Promotion banner with 4 block

</div>
                        </div>
                      </section>

Price table with 3 column

<section class="section steady-price-1">
                          <div class="container">
                              <div class="row justify-content-center m-60px-b sm-m-30px-b">
                                  <div class="col-md-12 text-center"> <span class="font-16 font-w-600 color-theme font-alt display-inline-block">Our Deal</span>
                                      <h4 class="font-alt color-extra-dark-gray font-w-800 m-0px m-15px-b">Our Pricing Plan</h4>
                                  </div>
                              </div>
                              <div class="row">
                                  <div class="col-md-4 m-15px-tb">
                                      <div class="price-table-04 border-all white-bg">
                                          <div class="p-30px text-center">
                                              <h6 class="m-0px font-w-700 font-alt color-extra-dark-gray font-20">Small Business</h6>
                                              <p class="m-0px">Lorem ipsum dolor sit amet</p>
                                          </div>
                                          <div class="extra-dark-gray-bg p-15px text-center">
                                              <h5 class="display-inline-block color-white font-45 font-w-700 m-0px">$90 /</h5><span>Year</span> </div>
                                          <ul class="list-style-7 p-30px text-center">
                                              <li>1 GB Photos</li>
                                              <li>Secure Online Transfer</li>
                                              <li>Unlimited Styles</li>
                                              <li>Customer Service</li>
                                              <li>Manual Backup</li>
                                          </ul>
                                          <div class="p-30px p-0px-t text-center"> <a href="#" class="m-btn m-btn-black">Signup Now</a> </div>
                                      </div>
                                  </div>
                                  <div class="col-md-4 m-15px-tb">
                                      <div class="price-table-04 border-all white-bg">
                                          <div class="p-30px text-center">
                                              <h6 class="m-0px font-w-700 font-alt color-extra-dark-gray font-20">Professional</h6>
                                              <p class="m-0px">Lorem ipsum dolor sit amet</p>
                                          </div>
                                          <div class="theme-bg p-15px text-center">
                                              <h5 class="display-inline-block color-white font-45 font-w-700 m-0px">$199 /</h5><span class="color-white">Year</span> </div>
                                          <ul class="list-style-7 p-30px text-center">
                                              <li>1 GB Photos</li>
                                              <li>Secure Online Transfer</li>
                                              <li>Unlimited Styles</li>
                                              <li>Customer Service</li>
                                              <li>Manual Backup</li>
                                          </ul>
                                          <div class="p-30px p-0px-t text-center"> <a href="#" class="m-btn">Signup Now</a> </div>
                                      </div>
                                  </div>
                                  <div class="col-md-4 m-15px-tb">
                                      <div class="price-table-04 border-all white-bg">
                                          <div class="p-30px text-center">
                                              <h6 class="m-0px font-w-700 font-alt color-extra-dark-gray font-20">Power User</h6>
                                              <p class="m-0px">Lorem ipsum dolor sit amet</p>
                                          </div>
                                          <div class="extra-dark-gray-bg p-15px text-center">
                                              <h5 class="display-inline-block color-white font-45 font-w-700 m-0px">$399 /</h5><span>Year</span> </div>
                                          <ul class="list-style-7 p-30px text-center">
                                              <li>1 GB Photos</li>
                                              <li>Secure Online Transfer</li>
                                              <li>Unlimited Styles</li>
                                              <li>Customer Service</li>
                                              <li>Manual Backup</li>
                                          </ul>
                                          <div class="p-30px p-0px-t text-center"> <a href="#" class="m-btn m-btn-black">Signup Now</a> </div>
                                      </div>
                                  </div>
                              </div>
                          </div>
                      </section>

Price table with 3 column

<div class="container">
                            <div class="row row-b4 text-center justify-content-center m-60px-b md-m-40px-b  sm-m-30px-b">
                              <div class="col-12 col-md-6">
                                <h4 class="font-alt color-extra-dark-gray font-w-700 m-0px m-10px-b">Our Price</h4>
                                <p class="font-16 m-0px">Eau is creative, elegant, modern, clean and responsive HTML5 template perfectly designed for App landing page based on Bootstrap 4.</p>
                                <div class="theme-bg h-4px w-50px display-inline-block m-15px-t border-radius-5px"></div>
                              </div>
                            </div>

<div class="row row-b4 align-items-center">
                              <div class="col-12 col-md-4 m-15px-tb">
                                <div class="price-table-02 text-center white-bg border-radius-5px box-shadow-large p-40px-lr md-p-20px-lr p-60px-tb md-m-15px-tb md-p-30px-tb border-t border-w-5 border-dark">
                                  <div class="color-extra-dark-gray font-w-600 font-22 font-alt letter-spacing-1 m-15px-b">STARTING</div>
                                  <p class="m-0px display-inline-block w-80 sm-w-100">Recommended for hosting up to a handful of small websites</p>

<div class="m-30px-tb font-50 md-font-40 color-extra-dark-gray font-w-800">$70.00</div>
                                  
                                  <ul class="list-style-11 font-16 m-40px-b">
                                    <li>500GB Bandwidth</li>
                                    <li>Business & Financ Analysing</li>
                                    <li>24 hour support</li>
                                    <li>Customer Managemet</li>
                                  </ul>

<div class="col-12 col-md-4 m-15px-tb">
                                <div class="price-table-02 text-center white-bg border-radius-5px box-shadow-large p-40px-lr p-80px-tb md-p-20px-lr md-p-40px-tb md-m-15px-tb border-t border-w-5 border-theme">
                                  <div class="color-extra-dark-gray font-w-600 font-22 font-alt letter-spacing-1 m-15px-b">PLUS</div>
                                  <p class="m-0px display-inline-block w-80 sm-w-100">Recommended for hosting up to a handful of small websites</p>

<div class="m-30px-tb font-50 md-font-40 color-extra-dark-gray font-w-800">$70.00</div>
                                  
                                  <ul class="list-style-11 font-16 m-40px-b">
                                    <li>500GB Bandwidth</li>
                                    <li>Business & Financ Analysing</li>
                                    <li>24 hour support</li>
                                    <li>Customer Managemet</li>
                                  </ul>

<div class="col-12 col-md-4 m-15px-tb">
                                <div class="price-table-02 text-center white-bg border-radius-5px box-shadow-large p-40px-lr md-p-20px-lr p-60px-tb md-m-15px-tb md-p-30px-tb border-t border-w-5 border-dark">
                                  <div class="color-extra-dark-gray font-w-600 font-22 font-alt letter-spacing-1 m-15px-b">BASIC</div>
                                  <p class="m-0px display-inline-block w-80 sm-w-100">Recommended for hosting up to a handful of small websites</p>

<div class="m-30px-tb font-50 md-font-40 color-extra-dark-gray font-w-800">$70.00</div>
                                  
                                  <ul class="list-style-11 font-16 m-40px-b">
                                    <li>500GB Bandwidth</li>
                                    <li>Business & Financ Analysing</li>
                                    <li>24 hour support</li>
                                    <li>Customer Managemet</li>
                                  </ul>

Price table with 3 column

<div class="row row-b4 justify-content-center m-60px-b  md-m-40px-b sm-m-20px-b">
                            <div class="col-12 col-md-10 col-lg-8 text-center">
                              <h4 class="color-extra-dark-gray font-w-700 m-0px m-15px-b font-alt text-uppercase">Choose your plan</h4>
                              <p class="font-17 m-0px m-20px-t sm-font-14">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
                            </div>
                          </div>

<div class="row row-b4 align-items-center">
                            <div class="col-12 col-md-4 m-15px-tb">
                              <div class="price-table-02 white-bg box-shadow p-40px-lr md-p-20px-lr p-60px-tb md-m-15px-tb md-p-30px-tb border-t border-w-5 border-dark">
                                <div class="color-extra-dark-gray font-w-600 font-22 font-alt letter-spacing-1 m-15px-b">3 Months</div>
                                <p class="m-0px display-inline-block w-80 md-w-100">Recommended for hosting up to a handful of small websites</p>

<div class="m-30px-tb font-50 md-font-40 color-extra-dark-gray font-w-800">$70.00</div>
                                
                                <ul class="list-style-2 font-18 m-40px-b">
                                  <li>500GB Bandwidth</li>
                                  <li>Business & Financ Analysing</li>
                                  <li>24 hour support</li>
                                  <li>Customer Managemet</li>
                                </ul>

<div class="col-12 col-md-4 m-15px-tb">
                              <div class="price-table-02 white-bg box-shadow-extra-large p-40px-lr p-60px-tb md-p-20px-lr md-p-40px-tb md-m-15px-tb border-t border-w-5 border-theme">
                                <div class="color-extra-dark-gray font-w-600 font-22 font-alt letter-spacing-1 m-15px-b">6 Months</div>
                                <p class="m-0px display-inline-block w-80 md-w-100">Recommended for hosting up to a handful of small websites</p>

<div class="m-30px-tb font-50 md-font-40 color-theme font-w-800">$70.00</div>
                                
                                <ul class="list-style-2 font-18 m-40px-b">
                                  <li>500GB Bandwidth</li>
                                  <li>Business & Financ Analysing</li>
                                  <li>24 hour support</li>
                                  <li>Customer Managemet</li>
                                </ul>

<div class="col-12 col-md-4 m-15px-tb">
                              <div class="price-table-02 white-bg box-shadow p-40px-lr md-p-20px-lr p-60px-tb md-m-15px-tb md-p-30px-tb border-t border-w-5 border-dark">
                                <div class="color-extra-dark-gray font-w-600 font-22 font-alt letter-spacing-1 m-15px-b">1 Year</div>
                                <p class="m-0px display-inline-block w-80 md-w-100">Recommended for hosting up to a handful of small websites</p>
                                <div class="m-30px-tb font-50 md-font-40 color-extra-dark-gray font-w-800">$70.00</div>
                                
                                <ul class="list-style-2 font-18 m-40px-b">
                                  <li>500GB Bandwidth</li>
                                  <li>Business & Financ Analysing</li>
                                  <li>24 hour support</li>
                                  <li>Customer Managemet</li>
                                </ul>

</div> 
                      </section>

Price table with 4 column

<div class="row row-b4 m-60px-b sm-m-0px-b">
                            <div class="col-md-12 text-center">
                              <div class="font-alt font-14 text-uppercase font-w-600 color-medium-gray">OUR Price</div>
                              <h5 class="font-alt font-w-800 text-uppercase m-20px-b color-extra-dark-gray">Our Price</h5>
                              <span class="h-1px w-50px theme-bg display-inline-block m-auto v-aling-top"></span>
                            </div>
                          </div>

<div class="row row-b4">
                            <div class="col-12 col-sm-6 col-md-3 m-15px-tb">
                              <div class="price-table-02 box-shadow-extra-large white-bg">
                                <div class="p-30px border-b border-w-1 border-grey">
                                  <h4 class="color-black font-w-300 font-alt text-uppercase">Free</h4>
                                  <span class="font-12 color-medium-gray">STARTER</span>
                                </div>
                                <div class="p-30px-lr p-40px-tb text-uppercase color-medium-gray">
                                  <p class="m-5px-tb">500GB Bandwidth</p>
                                  <p class="m-5px-tb">Financ Analysing  </p>
                                  <p class="m-5px-tb">24hr support</p>
                                  <p class="m-5px-tb">Customer Managemet</p>
                                  <div class="m-40px-t">
                                  <a href="#" class="m-btn m-btn-t-grey border-grey m-btn-round m-btn-xs">Byu Now</a>
                                  </div>
                                </div>
                              </div>
                            </div>

<div class="col-12 col-sm-6 col-md-3 m-15px-tb">
                              <div class="price-table-02 box-shadow-extra-large black-bg">
                                <div class="p-30px border-b border-w-1 border-dark">
                                  <h4 class="color-white font-w-300 font-alt text-uppercase">$80</h4>
                                  <span class="font-12 color-medium-gray">STARTER</span>
                                </div>
                                <div class="p-30px-lr p-40px-tb text-uppercase color-medium-gray">
                                  <p class="m-5px-tb">500GB Bandwidth</p>
                                  <p class="m-5px-tb">Financ Analysing  </p>
                                  <p class="m-5px-tb">24hr support</p>
                                  <p class="m-5px-tb">Customer Managemet</p>
                                  <div class="m-40px-t">
                                  <a href="#" class="m-btn m-btn-t-grey border-grey m-btn-round m-btn-xs">Byu Now</a>
                                  </div>
                                </div>
                              </div>
                            </div>

<div class="col-12 col-sm-6 col-md-3 m-15px-tb">
                              <div class="price-table-02 box-shadow-extra-large white-bg">
                                <div class="p-30px border-b border-w-1 border-grey">
                                  <h4 class="color-black font-w-300 font-alt text-uppercase">$90</h4>
                                  <span class="font-12 color-medium-gray">STARTER</span>
                                </div>
                                <div class="p-30px-lr p-40px-tb text-uppercase color-medium-gray">
                                  <p class="m-5px-tb">500GB Bandwidth</p>
                                  <p class="m-5px-tb">Financ Analysing  </p>
                                  <p class="m-5px-tb">24hr support</p>
                                  <p class="m-5px-tb">Customer Managemet</p>
                                  <div class="m-40px-t">
                                  <a href="#" class="m-btn m-btn-t-grey border-grey m-btn-round m-btn-xs">Byu Now</a>
                                  </div>
                                </div>
                              </div>
                            </div>

<div class="col-12 col-sm-6 col-md-3 m-15px-tb">
                              <div class="price-table-02 box-shadow-extra-large white-bg">
                                <div class="p-30px border-b border-w-1 border-grey">
                                  <h4 class="color-black font-w-300 font-alt text-uppercase">$95</h4>
                                  <span class="font-12 color-medium-gray">STARTER</span>
                                </div>
                                <div class="p-30px-lr p-40px-tb text-uppercase color-medium-gray">
                                  <p class="m-5px-tb">500GB Bandwidth</p>
                                  <p class="m-5px-tb">Financ Analysing  </p>
                                  <p class="m-5px-tb">24hr support</p>
                                  <p class="m-5px-tb">Customer Managemet</p>
                                  <div class="m-40px-t">
                                  <a href="#" class="m-btn m-btn-t-grey border-grey m-btn-round m-btn-xs">Byu Now</a>
                                  </div>
                                </div>
                              </div>
                            </div>

</div>

</div> 
                      </section>

Price table with 3 column

<section class="section light-gray-bg">
                        <div class="container">
                          <div class="row-b4 row justify-content-center m-60px-b md-m-40px">
                              <div class="col-md-8 text-center">
                                <h4 class="font-alt font-w-600 color-extra-dark-gray">Our Pricing</h4>
                                <p class="m-0px font-16">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris</p>
                              </div>
                          </div>

<div class="row row-b4">
                              <div class="col-12 col-md-4 m-15px-tb">
                                <div class="price-table-02 white-bg p-20px-lr p-40px-tb md-p-20px-lr text-center border-all">
                                  <div class="m-30px-b"><img src="http://odoo-snippets.atharvasystem.com/source/img/price-table-1.png"/></div>
                                  <div class="color-extra-dark-gray font-w-600 font-22 font-alt letter-spacing-1 m-25px-b">Basic</div>
                                  <div class="m-20px-b font-40 md-font-30 color-theme font-w-600">$45.00</div>
                                  
                                  <ul class="list-style-8 font-18 m-20px-b">
                                    <li><strong>1</strong> User</li>
                                    <li><strong>Limited</strong> Project</li>
                                    <li><strong>2GB</strong> Storage</li>
                                  </ul>

<div class="col-12 col-md-4 m-15px-tb">
                                <div class="price-table-02 white-bg p-20px-lr p-40px-tb md-p-20px-lr text-center border-all">
                                  <div class="m-30px-b"><img src="http://odoo-snippets.atharvasystem.com/source/img/price-table-2.png"/></div>
                                  <div class="color-extra-dark-gray font-w-600 font-22 font-alt letter-spacing-1 m-25px-b">Standard</div>
                                  <div class="m-20px-b font-40 md-font-30 color-theme font-w-600">$85.00</div>
                                  
                                  <ul class="list-style-8 font-18 m-20px-b">
                                    <li><strong>1</strong> User</li>
                                    <li><strong>Limited</strong> Project</li>
                                    <li><strong>2GB</strong> Storage</li>
                                  </ul>

<div class="col-12 col-md-4 m-15px-tb">
                                <div class="price-table-02 white-bg p-20px-lr p-40px-tb md-p-20px-lr text-center border-all">
                                  <div class="m-30px-b"><img src="http://odoo-snippets.atharvasystem.com/source/img/price-table-3.png"/></div>
                                  <div class="color-extra-dark-gray font-w-600 font-22 font-alt letter-spacing-1 m-25px-b">Premium</div>
                                  <div class="m-20px-b font-40 md-font-30 color-theme font-w-600">$105.00</div>
                                  
                                  <ul class="list-style-8 font-18 m-20px-b">
                                    <li><strong>1</strong> User</li>
                                    <li><strong>Limited</strong> Project</li>
                                    <li><strong>2GB</strong> Storage</li>
                                  </ul>

</div>
                        </div>
                      </section>

4 column portfoio with full screen

<section class="section p-0px-b steady-portfolio-1">
                          <div class="container-fluid">
                              <div class="row m-40px-b">
                                  <div class="col-md-12 text-center"> <span class="font-16 font-w-600 color-theme font-alt display-inline-block">what we serve</span>
                                      <h4 class="font-alt color-extra-dark-gray font-w-800 m-0px m-15px-b">Our Portfolio</h4>
                                  </div>
                              </div>
                              <div class="portfolio-content">
                                  <ul class="portfolio-cols portfolio-cols-4">
                                      <li class="portfolio-item">
                                          <div class="portfolio-col portfolio-hover-01"> <a href="#"> <img src="http://odoo-snippets.atharvasystem.com/source/img/portfolio-1.jpg" title="" alt=""/> </a>
                                              <div class="hover text-center theme-bg p-10px">
                                                  <p class="font-alt color-white m-0px font-w-700">Illustration Work</p><label class="font-13 text-uppercase color-white">illustration</label> </div>
                                          </div>
                                      </li>
                                      <li class="portfolio-item">
                                          <div class="portfolio-col portfolio-hover-01"> <a href="#"> <img src="http://odoo-snippets.atharvasystem.com/source/img/portfolio-1.jpg" title="" alt=""/> </a>
                                              <div class="hover text-center theme-bg p-10px">
                                                  <p class="font-alt color-white m-0px font-w-700">Illustration Work</p><label class="font-13 text-uppercase color-white">illustration</label> </div>
                                          </div>
                                      </li>
                                      <li class="portfolio-item">
                                          <div class="portfolio-col portfolio-hover-01"> <a href="#"> <img src="http://odoo-snippets.atharvasystem.com/source/img/portfolio-1.jpg" title="" alt=""/> </a>
                                              <div class="hover text-center theme-bg p-10px">
                                                  <p class="font-alt color-white m-0px font-w-700">Illustration Work</p><label class="font-13 text-uppercase color-white">illustration</label> </div>
                                          </div>
                                      </li>
                                      <li class="portfolio-item">
                                          <div class="portfolio-col portfolio-hover-01"> <a href="#"> <img src="http://odoo-snippets.atharvasystem.com/source/img/portfolio-1.jpg" title="" alt=""/> </a>
                                              <div class="hover text-center theme-bg p-10px">
                                                  <p class="font-alt color-white m-0px font-w-700">Illustration Work</p><label class="font-13 text-uppercase color-white">illustration</label> </div>
                                          </div>
                                      </li>
                                      <li class="portfolio-item">
                                          <div class="portfolio-col portfolio-hover-01"> <a href="#"> <img src="http://odoo-snippets.atharvasystem.com/source/img/portfolio-1.jpg" title="" alt=""/> </a>
                                              <div class="hover text-center theme-bg p-10px">
                                                  <p class="font-alt color-white m-0px font-w-700">Illustration Work</p><label class="font-13 text-uppercase color-white">illustration</label> </div>
                                          </div>
                                      </li>
                                      <li class="portfolio-item">
                                          <div class="portfolio-col portfolio-hover-01"> <a href="#"> <img src="http://odoo-snippets.atharvasystem.com/source/img/portfolio-1.jpg" title="" alt=""/> </a>
                                              <div class="hover text-center theme-bg p-10px">
                                                  <p class="font-alt color-white m-0px font-w-700">Illustration Work</p><label class="font-13 text-uppercase color-white">illustration</label> </div>
                                          </div>
                                      </li>
                                      <li class="portfolio-item">
                                          <div class="portfolio-col portfolio-hover-01"> <a href="#"> <img src="http://odoo-snippets.atharvasystem.com/source/img/portfolio-1.jpg" title="" alt=""/> </a>
                                              <div class="hover text-center theme-bg p-10px">
                                                  <p class="font-alt color-white m-0px font-w-700">Illustration Work</p><label class="font-13 text-uppercase color-white">illustration</label> </div>
                                          </div>
                                      </li>
                                      <li class="portfolio-item">
                                          <div class="portfolio-col portfolio-hover-01"> <a href="#"> <img src="http://odoo-snippets.atharvasystem.com/source/img/portfolio-1.jpg" title="" alt=""/> </a>
                                              <div class="hover text-center theme-bg p-10px">
                                                  <p class="font-alt color-white m-0px font-w-700">Illustration Work</p><label class="font-13 text-uppercase color-white">illustration</label> </div>
                                          </div>
                                      </li>
                                  </ul>
                              </div>
                          </div>
                        </section>

3 column portfoio with full screen

<section class="section p-0px-b light-gray-bg">
                        <div class="container-fluid">
                            <div class="row">
                                <div class="col-md-12 text-center">
                                    <div class="font-alt font-14 text-uppercase font-w-600 color-medium-gray">What We Serve</div>
                                    <h5 class="font-alt font-w-800 text-uppercase m-20px-b color-extra-dark-gray">Our Projects</h5> 
                                    <span class="h-1px w-50px theme-bg display-inline-block m-auto v-aling-top"></span> 
                                  </div>
                            </div>
                        </div>
                        <div class="portfolio-content">
                            <ul class="portfolio-cols portfolio-cols-3">
                                <li class="portfolio-item">
                                    <div class="portfolio-col portfolio-hover-02"> <a href="#"> <img src="http://odoo-snippets.atharvasystem.com/source/img/mrig-portfolio-4.jpg" title="" alt=""/> <div class="overlay black-bg"></div><div class="hover text-center p-10px"> <p class="font-alt font-18 color-white m-0px font-w-700">Illustration Work</p><label class="font-14 color-white">illustration</label> </div></a> </div>
                                </li> 
                                <li class="portfolio-item">
                                    <div class="portfolio-col portfolio-hover-02"> <a href="#"> <img src="http://odoo-snippets.atharvasystem.com/source/img/mrig-portfolio-3.jpg" title="" alt=""/> <div class="overlay black-bg"></div><div class="hover text-center p-10px"> <p class="font-alt font-18 color-white m-0px font-w-700">Illustration Work</p><label class="font-14 color-white">illustration</label> </div></a> </div>
                                </li>
                                <li class="portfolio-item portfolio-col-2x">
                                    <div class="portfolio-col portfolio-hover-02"> <a href="#"> <img src="http://odoo-snippets.atharvasystem.com/source/img/mrig-portfolio-7.jpg" title="" alt=""/> <div class="overlay black-bg"></div><div class="hover text-center p-10px"> <p class="font-alt font-18 color-white m-0px font-w-700">Illustration Work</p><label class="font-14 color-white">illustration</label> </div></a> </div>
                                </li>
                                <li class="portfolio-item portfolio-col-2x">
                                    <div class="portfolio-col portfolio-hover-02"> <a href="#"> <img src="http://odoo-snippets.atharvasystem.com/source/img/mrig-portfolio-4.jpg" title="" alt=""/> <div class="overlay black-bg"></div><div class="hover text-center p-10px"> <p class="font-alt font-18 color-white m-0px font-w-700">Illustration Work</p><label class="font-14 color-white">illustration</label> </div></a> </div>
                                </li>
                                <li class="portfolio-item portfolio-col-2x">
                                    <div class="portfolio-col portfolio-hover-02"> <a href="#"> <img src="http://odoo-snippets.atharvasystem.com/source/img/mrig-portfolio-7.jpg" title="" alt=""/> <div class="overlay black-bg"></div><div class="hover text-center p-10px"> <p class="font-alt font-18 color-white m-0px font-w-700">Illustration Work</p><label class="font-14 color-white">illustration</label> </div></a> </div>
                                </li>
                                <li class="portfolio-item portfolio-col-2x">
                                    <div class="portfolio-col portfolio-hover-02"> <a href="#"> <img src="http://odoo-snippets.atharvasystem.com/source/img/mrig-portfolio-3.jpg" title="" alt=""/> <div class="overlay black-bg"></div><div class="hover text-center p-10px"> <p class="font-alt font-18 color-white m-0px font-w-700">Illustration Work</p><label class="font-14 color-white">illustration</label> </div></a> </div>
                                </li>
                            </ul>
                        </div>
                      </section>

3 column portfoio with full box layout

<section class="section p-0px-b light-gray-bg">
                        <div class="container">
                          <div class="row row-b4 justify-content-center m-65px-b md-m-40px-b sm-m-20px-b">
                              <div class="col-12 col-md-10 col-lg-8 text-center">
                                <h4 class="color-extra-dark-gray font-w-700 m-0px m-15px-b font-alt">Our <span class="color-theme">Projects</span></h4>
                                <p class="font-17 m-0px m-20px-t sm-font-14 color-extra-dark-gray">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
                              </div>
                          </div>
                        
                          <div class="portfolio-content">
                              <ul class="portfolio-cols portfolio-cols-3">
                                  <li class="portfolio-item">
                                      <div class="portfolio-col portfolio-hover-02"> <a href="#"> <img src="http://odoo-snippets.atharvasystem.com/source/img/mrig-portfolio-4.jpg" title="" alt=""/> <div class="overlay black-bg"></div><div class="hover text-center p-10px"> <p class="font-alt font-18 color-white m-0px font-w-700">Illustration Work</p><label class="font-14 color-white">illustration</label> </div></a> </div>
                                  </li> 
                                  <li class="portfolio-item">
                                      <div class="portfolio-col portfolio-hover-02"> <a href="#"> <img src="http://odoo-snippets.atharvasystem.com/source/img/mrig-portfolio-3.jpg" title="" alt=""/> <div class="overlay black-bg"></div><div class="hover text-center p-10px"> <p class="font-alt font-18 color-white m-0px font-w-700">Illustration Work</p><label class="font-14 color-white">illustration</label> </div></a> </div>
                                  </li>
                                  <li class="portfolio-item portfolio-col-2x">
                                      <div class="portfolio-col portfolio-hover-02"> <a href="#"> <img src="http://odoo-snippets.atharvasystem.com/source/img/mrig-portfolio-7.jpg" title="" alt=""/> <div class="overlay black-bg"></div><div class="hover text-center p-10px"> <p class="font-alt font-18 color-white m-0px font-w-700">Illustration Work</p><label class="font-14 color-white">illustration</label> </div></a> </div>
                                  </li>
                                  <li class="portfolio-item portfolio-col-2x">
                                      <div class="portfolio-col portfolio-hover-02"> <a href="#"> <img src="http://odoo-snippets.atharvasystem.com/source/img/mrig-portfolio-4.jpg" title="" alt=""/> <div class="overlay black-bg"></div><div class="hover text-center p-10px"> <p class="font-alt font-18 color-white m-0px font-w-700">Illustration Work</p><label class="font-14 color-white">illustration</label> </div></a> </div>
                                  </li>
                                  <li class="portfolio-item portfolio-col-2x">
                                      <div class="portfolio-col portfolio-hover-02"> <a href="#"> <img src="http://odoo-snippets.atharvasystem.com/source/img/mrig-portfolio-7.jpg" title="" alt=""/> <div class="overlay black-bg"></div><div class="hover text-center p-10px"> <p class="font-alt font-18 color-white m-0px font-w-700">Illustration Work</p><label class="font-14 color-white">illustration</label> </div></a> </div>
                                  </li>
                                  <li class="portfolio-item portfolio-col-2x">
                                      <div class="portfolio-col portfolio-hover-02"> <a href="#"> <img src="http://odoo-snippets.atharvasystem.com/source/img/mrig-portfolio-3.jpg" title="" alt=""/> <div class="overlay black-bg"></div><div class="hover text-center p-10px"> <p class="font-alt font-18 color-white m-0px font-w-700">Illustration Work</p><label class="font-14 color-white">illustration</label> </div></a> </div>
                                  </li>
                              </ul>
                          </div>
                        </div>
                      </section>

Slider with content and background image

<section id="steady-main-slider" class="section p-0px carousel s_banners_theme_slider slide steady-main-slider-1 main-half-slider" data-ride="carousel">
                          
                          <ol class="carousel-indicators">
                            <li data-target="#steady-main-slider" data-slide-to="0" class="active"></li>
                            <li data-target="#steady-main-slider" data-slide-to="1"></li>
                          </ol>
                          
                          <div class="carousel-inner" role="listbox">
                            <div class="item item1 active slider bg-cover bg-no-repeat bg-center-center" style="background-image: url(http://odoo-snippets.atharvasystem.com/source/img/main-banner1.jpg);">
                              <div class="container position-center-box">
                                <h2 class="font-w-700 letter-spacing-2 font-alt color-extra-dark-gray w-60 sm-w-100">Design is the secret great business</h2>
                                <p class="color-extra-dark-gray font-17 w-50 sm-w-100 display-inline-block m-35px-b">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
                                tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
                                quis nostrud exercitation ullamco laboris.</p>
                                <div clss="btn-bar">
                                  <a href="#" class="m-btn m-btn-t-black">purchase Now </a>
                                  <a href="#" class="m-btn">Discover More</a>
                                </div>
                              </div> 
                            </div> 
                              
                            <div class="item slider bg-cover bg-no-repeat bg-center-center" style="background-image: url(http://odoo-snippets.atharvasystem.com/source/img/main-banner2.jpg);">
                              <div class="container position-center-box">
                                <h2 class="font-w-700 letter-spacing-2 font-alt color-extra-dark-gray w-60 sm-w-100">Design is the secret great business</h2>
                                <p class="color-extra-dark-gray font-17 w-50 sm-w-100 display-inline-block m-35px-b">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
                                tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
                                quis nostrud exercitation ullamco laboris.</p>
                                <div clss="btn-bar">
                                  <a href="#" class="m-btn m-btn-t-black">purchase Now </a>
                                  <a href="#" class="m-btn">Discover More</a>
                                </div>
                              </div> 
                            </div>
                          
                            <a class="left carousel-control" data-target="#steady-main-slider" role="button" data-slide="prev">
                                <span class="fa fa-angle-left" aria-hidden="true"></span>
                                <span class="sr-only">Previous</span>
                            </a>
                            <a class="right carousel-control" data-target="#steady-main-slider" role="button" data-slide="next">
                                <span class="fa fa-angle-right" aria-hidden="true"></span>
                                <span class="sr-only">Next</span>
                            </a>
                          </div>
                        </section>

Slider with content and background image

<section id="steady-main-slider-01" class="section p-0px carousel s_banners_theme_slider slide steady-main-slider-2 main-half-slider" data-ride="carousel">
                          <ol class="carousel-indicators">
                              <li data-target="#steady-main-slider-01" data-slide-to="0" class="active"></li>
                              <li data-target="#steady-main-slider-01" data-slide-to="1"></li>
                          </ol>
                          <div class="carousel-inner" role="listbox">
                              <div class="item active slider bg-cover bg-no-repeat bg-center-center" style="background-image: url(http://odoo-snippets.atharvasystem.com/source/img/half-slider2.jpg);">
                                  <div class="container position-center-box text-left">
                                      <h2 class="font-w-700 letter-spacing-2 font-alt color-extra-dark-gray">Design is the secret to<br/> great business</h2>
                                      <p class="color-extra-dark-gray font-18 font-w-400 letter-spacing-1 w-60 sm-w-100 display-inline-block m-25px-b">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris.</p>
                                      <div clss="btn-bar"> <a href="#" class="m-btn m-btn-l">Discover More</a> <a href="#" class="m-btn m-btn-dark m-btn-l">purchase Now </a> </div>
                                  </div>
                              </div>
                              <div class="item slider bg-cover bg-no-repeat bg-center-center" style="background-image: url(http://odoo-snippets.atharvasystem.com/source/img/half-slider2.jpg);">
                                  <div class="container position-center-box text-left">
                                      <h2 class="font-w-700 letter-spacing-2 font-alt color-extra-dark-gray">Design is the secret to<br/> great business</h2>
                                      <p class="color-extra-dark-gray font-18 font-w-400 letter-spacing-1 w-60 sm-w-100 display-inline-block m-25px-b">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris.</p>
                                      <div clss="btn-bar"> <a href="#" class="m-btn m-btn-l">Discover More</a> <a href="#" class="m-btn m-btn-dark m-btn-l">purchase Now </a> </div>
                                  </div>
                              </div>
                              <a class="left carousel-control" data-target="#steady-main-slider-01" role="button" data-slide="prev"> <span class="fa fa-angle-left" aria-hidden="true"></span> <span class="sr-only">Previous</span> </a> 
                              <a class="right carousel-control" data-target="#steady-main-slider-01" role="button" data-slide="next"> <span class="fa fa-angle-right" aria-hidden="true"></span> <span class="sr-only">Next</span> </a> 
                            </div>
                        </section>

Fullscreen slider with content and background image

<section id="steady-main-slider-02" class="carousel s_banners_theme_slider slide steady-main-slider-3" data-ride="carousel">
                          <ol class="carousel-indicators">
                              <li data-target="#steady-main-slider-02" data-slide-to="0" class="active"></li>
                              <li data-target="#steady-main-slider-02" data-slide-to="1"></li>
                          </ol>
                          <div class="carousel-inner" role="listbox">
                              <div class="item active slider bg-cover bg-no-repeat bg-center-center full-screen" style="background-image: url(http://odoo-snippets.atharvasystem.com/source/img/overlay-5.jpg);">
                                  <div class="container position-center-box text-center">
                                      <h2 class="font-w-800 letter-spacing-2 font-alt color-white">Design is the secret to<br/> great business</h2>
                                      <p class="color-white font-18 font-w-400 letter-spacing-1 w-60 sm-w-100 display-inline-block m-25px-b">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
                                      <div clss="btn-bar">
                                        <a href="#" class="m-btn m-btn-l">Discover More</a>
                                      </div>
                                  </div>
                              </div>
                              <div class="item slider bg-cover bg-no-repeat bg-center-center full-screen" style="background-image: url(http://odoo-snippets.atharvasystem.com/source/img/overlay-6.jpg);">
                                  <div class="container position-center-box text-center">
                                      <h2 class="font-w-800 letter-spacing-2 font-alt color-white">Design is the secret to<br/> great business</h2>
                                      <p class="color-white font-18 font-w-400 letter-spacing-1 w-60 sm-w-100 display-inline-block m-25px-b">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
                                      <div clss="btn-bar">
                                        <a href="#" class="m-btn m-btn-l">Discover More</a>
                                      </div>
                                  </div>
                              </div>
                              <a class="left carousel-control" data-target="#steady-main-slider-02" role="button" data-slide="prev"> <span class="fa fa-angle-left" aria-hidden="true"></span> <span class="sr-only">Previous</span> </a> 
                              <a class="right carousel-control" data-target="#steady-main-slider-02" role="button" data-slide="next"> <span class="fa fa-angle-right" aria-hidden="true"></span> <span class="sr-only">Next</span> </a> 
                            </div>
                      </section>

Slider with content and image

<section id="steady-main-slider-04" class="carousel s_banners_theme_slider slide steady-main-slider-4 main-half-slider" data-ride="carousel">
                          <ol class="carousel-indicators">
                              <li data-target="#steady-main-slider-04" data-slide-to="0" class="active"></li>
                              <li data-target="#steady-main-slider-04" data-slide-to="1"></li>
                          </ol>
                          <div class="carousel-inner" role="listbox">
                              <div class="item active">
                                  <div class="container">
                                    <div class="row row-b4 align-items-center p-80px-t">
                                      <div class="col-md-6 text-center">
                                        <img src="http://odoo-snippets.atharvasystem.com/source/img/man.jpg" title="" alt="" />
                                      </div> 
                                      <div class="col-md-6">
                                        <h4 class="font-w-700 letter-spacing-2 font-alt color-extra-dark-gray">Design is the secret to<br/> great business</h4>
                                        <p class="color-extra-dark-gray font-16 font-w-400 letter-spacing-1 display-inline-block m-25px-b">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris.</p>
                                        <div clss="btn-bar"> 
                                          <a href="#" class="m-btn">Discover More</a> 
                                        </div>
                                      </div> 
                                    </div> 
                                  </div> 
                              </div>
                              <div class="item">
                                  <div class="container">
                                    <div class="row row-b4 align-items-center p-80px-t">
                                      <div class="col-md-6 text-center">
                                        <img src="http://odoo-snippets.atharvasystem.com/source/img/man.jpg" title="" alt="" />
                                      </div> 
                                      <div class="col-md-6">
                                        <h4 class="font-w-700 letter-spacing-2 font-alt color-extra-dark-gray">Design is the secret to<br/> great business</h4>
                                        <p class="color-extra-dark-gray font-16 font-w-400 letter-spacing-1 display-inline-block m-25px-b">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris.</p>
                                        <div clss="btn-bar"> 
                                          <a href="#" class="m-btn">Discover More</a> 
                                        </div>
                                      </div> 
                                    </div> 
                                  </div> 
                              </div>
                              <a class="left carousel-control" data-target="#steady-main-slider-04" role="button" data-slide="prev"> <span class="fa fa-angle-left" aria-hidden="true"></span> <span class="sr-only">Previous</span> </a> 
                              <a class="right carousel-control" data-target="#steady-main-slider-04" role="button" data-slide="next"> <span class="fa fa-angle-right" aria-hidden="true"></span> <span class="sr-only">Next</span> </a> 
                            </div>
                      </section>

Slider with center content and background image

<section id="steady-main-slider-05" class="carousel s_banners_theme_slider slide steady-main-slider-5 main-half-slider" data-ride="carousel">
                        <ol class="carousel-indicators">
                            <li data-target="#steady-main-slider-05" data-slide-to="0" class="active"></li>
                            <li data-target="#steady-main-slider-05" data-slide-to="1"></li>
                        </ol>
                        <div class="carousel-inner" role="listbox">
                            <div class="item active slider bg-cover bg-no-repeat bg-center-center" style="background-image: url(http://odoo-snippets.atharvasystem.com/source/img/fashion-banner02.jpg);">
                                <div class="container position-center-box text-center">
                                    <h2 class="font-w-700 letter-spacing-2 font-alt color-white">FALL-WINTER</h2>
                                    <p class="color-white font-18 font-w-400 letter-spacing-1 w-60 sm-w-100 display-inline-block m-25px-b">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris.</p>
                                    <div clss="btn-bar"><a href="#" class="m-btn m-btn-l">Shop Now <span class="fa fa-shopping-cart"></span> </a></div>
                                </div>
                            </div>
                            <div class="item slider bg-cover bg-no-repeat bg-center-center" style="background-image: url(http://odoo-snippets.atharvasystem.com/source/img/fashion-banner01.jpg);">
                                <div class="container position-center-box text-center">
                                    <h2 class="font-w-700 letter-spacing-2 font-alt color-white">FALL-WINTER</h2>
                                    <p class="color-white font-18 font-w-400 letter-spacing-1 w-60 sm-w-100 display-inline-block m-25px-b">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris.</p>
                                    <div clss="btn-bar"><a href="#" class="m-btn m-btn-l">Shop Now <span class="fa fa-shopping-cart"></span> </a></div>
                                </div>
                            </div>
                            <a class="left carousel-control" data-target="#steady-main-slider-05" role="button" data-slide="prev"> <span class="fa fa-angle-left" aria-hidden="true"></span> <span class="sr-only">Previous</span> </a> 
                            <a class="right carousel-control" data-target="#steady-main-slider-05" role="button" data-slide="next"> <span class="fa fa-angle-right" aria-hidden="true"></span> <span class="sr-only">Next</span> </a> 
                          </div>
                      </section>

Sliader with image

<section id="steady-main-slider-06" class="carousel s_banners_theme_slider slide steady-main-slider-6" data-ride="carousel">
                        <ol class="carousel-indicators">
                            <li data-target="#steady-main-slider-06" data-slide-to="0" class="active"></li>
                            <li data-target="#steady-main-slider-06" data-slide-to="1"></li>
                        </ol>
                        <div class="carousel-inner" role="listbox">
                            <div class="item active">
                                <img src="http://odoo-snippets.atharvasystem.com/source/img/shop-banner-1.png" title="" alt="" />
                            </div>
                            <div class="item">
                                <img src="http://odoo-snippets.atharvasystem.com/source/img/shop-banner-2.png" title="" alt="" />
                            </div>
                            <a class="left carousel-control" data-target="#steady-main-slider-06" role="button" data-slide="prev"> <span class="fa fa-angle-left" aria-hidden="true"></span> <span class="sr-only">Previous</span> </a> 
                            <a class="right carousel-control" data-target="#steady-main-slider-06" role="button" data-slide="next"> <span class="fa fa-angle-right" aria-hidden="true"></span> <span class="sr-only">Next</span> </a> 
                          </div>
                      </section>

Slider with content and image

<div class="item active dark-bg">
                                <div class="container">
                                  <div class="row row-b4 slider align-items-center">
                                    <div class="col-12 col-lg-6 m-25px-tb">
                                      <h1 class="font-alt color-white font-w-700 text-uppercase m-0px m-15px-b">Just you and your music</h1>
                                      <p class="font-16 color-white m-25px-b">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
                                      <a class="m-btn m-btn-round m-btn-t-white" href="#">PURCHASE NOW </a>
                                    </div>

<div class="col-12 col-lg-6 m-25px-tb">
                                      <h1 class="font-alt color-white font-w-700 text-uppercase m-0px m-15px-b">Just you and your music</h1>
                                      <p class="font-16 color-white m-25px-b">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
                                      <a class="m-btn m-btn-round m-btn-t-white" href="#">PURCHASE NOW </a>
                                    </div>

</div>
                                </div>
                            </div>

<a class="left carousel-control" data-target="#steady-main-slider-07" role="button" data-slide="prev"> <span class="fa fa-angle-left" aria-hidden="true"></span> <span class="sr-only">Previous</span> </a> 
                            <a class="right carousel-control" data-target="#steady-main-slider-07" role="button" data-slide="next"> <span class="fa fa-angle-right" aria-hidden="true"></span> <span class="sr-only">Next</span> </a> 
                          </div>
                      </section>

Slider with center content and background image

<div class="item active slider bg-cover bg-no-repeat bg-center-center" style="background-image: url(http://odoo-snippets.atharvasystem.com/source/img/gym-1.jpg);">
                                <div class="container">
                                  <div class="row row-b4 slider align-items-center justify-content-center text-center">
                                    <div class="col-md-10 col-lg-7">
                                      <h2 class="color-white m-0px m-40px-b font-alt font-w-700">Get the body you Want</h2>
                                      <p class="color-white font-16 m-35px-b">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua</p>
                                      <a class="m-btn m-btn-t-white" href="#">Tell me more</a>
                                      <a class="m-btn m-btn-t-white" href="#">Sign me up</a>
                                    </div>
                                  </div>
                                </div>
                            </div>

<div class="item slider bg-cover bg-no-repeat bg-center-center" style="background-image: url(http://odoo-snippets.atharvasystem.com/source/img/gym-2.jpg);">
                                <div class="container">
                                  <div class="row row-b4 slider align-items-center justify-content-center text-center">
                                    <div class="col-md-10 col-lg-7">
                                      <h2 class="color-white m-0px m-40px-b font-alt font-w-700">Get the body you Want</h2>
                                      <p class="color-white font-16 m-35px-b">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua</p>
                                      <a class="m-btn m-btn-t-white" href="#">Tell me more</a>
                                      <a class="m-btn m-btn-t-white" href="#">Sign me up</a>
                                    </div>
                                  </div>
                                </div>
                            </div>

<a class="left carousel-control" data-target="#steady-main-slider-08" role="button" data-slide="prev"> <span class="fa fa-angle-left" aria-hidden="true"></span> <span class="sr-only">Previous</span> </a> 
                            <a class="right carousel-control" data-target="#steady-main-slider-08" role="button" data-slide="next"> <span class="fa fa-angle-right" aria-hidden="true"></span> <span class="sr-only">Next</span> </a> 
                          </div>
                      </section>

Full width banner with center content

Full width banner with left content

Banner with content and image

<section class="bg-cover bg-no-repeat" style="background-image: url(http://odoo-snippets.atharvasystem.com/source/img/home-banner.png);">
                          <div class="container">
                            <div class="row-b4 row align-items-center section">
                              <div class="col-md-6">
                                <h3 class="color-white font-w-600 m-0px m-30px-b">Steady - Multi-purpose Responsive Odoo Theme </h3>
                                <p class="color-white font-18 m-30px-b">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
                                <a href="#" class="m-btn m-btn-white">Read More</a>
                              </div>
                              <div class="col-md-6">
                                <img src="http://odoo-snippets.atharvasystem.com/source/img/home-banner-img.png"/>
                              </div>
                            </div>
                          </div>
                        </section>

Full screen banner with content and image

<section class="section p-0px bg-cover bg-no-repeat" style="background-image: url(http://odoo-snippets.atharvasystem.com/source/img/home-banner-1-bg.png);">
                          <div class="container">
                            <div class="row row-b4 align-items-center full-screen">
                              <div class="col-md-6">
                                <h4 class="color-extra-dark-gray font-w-500 m-0px m-30px-b">Multi-purpose Responsive Theme </h4>
                                <p class="font-18 m-40px-b">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
                                <a href="#" class="m-btn m-btn-t-black">Read More</a>
                              </div>
                              <div class="col-md-6">
                                <img src="http://odoo-snippets.atharvasystem.com/source/img/home-banner-1.png"/>
                              </div>
                            </div>
                          </div>
                        </section>

4 Column feature box

<section class="section steady-feature-1">
                        <div class="container">
                            <div class="row">
                                <div class="col-md-3">
                                    <div class="feature-box text-center p-20px"> 
                                      <i class="fa fa-picture-o icon-round-small theme-bg color-white"></i>
                                        <div class="feature-content">
                                            <div class="font-alt font-15 font-w-700 m-10px-b color-extra-dark-gray m-15px-t">Perfect Design</div>
                                            <p>Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-3">
                                    <div class="feature-box text-center p-20px"> 
                                      <i class="fa fa-pencil icon-round-small theme-bg color-white"></i>
                                        <div class="feature-content">
                                            <div class="font-alt font-15 font-w-700 m-10px-b color-extra-dark-gray m-15px-t">Full Documentation</div>
                                            <p>Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-3">
                                    <div class="feature-box text-center p-20px"> 
                                      <i class="fa fa-puzzle-piece icon-round-small theme-bg color-white"></i>
                                        <div class="feature-content">
                                            <div class="font-alt font-15 font-w-700 m-10px-b color-extra-dark-gray m-15px-t">Fully Responsive</div>
                                            <p>Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-3">
                                    <div class="feature-box text-center p-20px"> 
                                      <i class="fa fa-file-text-o icon-round-small theme-bg color-white"></i>
                                        <div class="feature-content">
                                            <div class="font-alt font-15 font-w-700 m-10px-b color-extra-dark-gray m-15px-t">Advanced Options</div>
                                            <p>Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                      </section>

4 Column feature box with background color

<section class="section steady-feature-2">
                          <div class="container">
                              <div class="row">
                                  <div class="col-sm-6 col-md-3">
                                      <div class="feature-box text-center theme-bg p-30px m-15px-tb"> 
                                        <i class="fa fa-picture-o icon-round-small white-bg color-theme m-25px-t"></i>
                                          <div class="feature-content">
                                              <div class="font-alt font-15 font-w-700 m-10px-b color-white m-25px-t">Perfect Design</div>
                                              <p class="color-white opacity9">Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                          </div>
                                      </div>
                                  </div>
                                  <div class="col-sm-6 col-md-3">
                                      <div class="feature-box text-center theme-bg p-30px m-15px-tb"> <i class="fa fa-pencil icon-round-small white-bg color-theme m-25px-t"></i>
                                          <div class="feature-content">
                                              <div class="font-alt font-15 font-w-700 m-10px-b color-white m-25px-t">Full Documentation</div>
                                              <p class="color-white opacity9">Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                          </div>
                                      </div>
                                  </div>
                                  <div class="col-sm-6 col-md-3">
                                      <div class="feature-box text-center theme-bg p-30px m-15px-tb"> <i class="fa fa-puzzle-piece icon-round-small white-bg color-theme m-25px-t"></i>
                                          <div class="feature-content">
                                              <div class="font-alt font-15 font-w-700 m-10px-b color-white m-25px-t">Fully Responsive</div>
                                              <p class="color-white opacity9">Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                          </div>
                                      </div>
                                  </div>
                                  <div class="col-sm-6 col-md-3">
                                      <div class="feature-box text-center theme-bg p-30px m-15px-tb"> <i class="fa fa-file-text-o icon-round-small white-bg color-theme m-25px-t"></i>
                                          <div class="feature-content">
                                              <div class="font-alt font-15 font-w-700 m-10px-b color-white m-25px-t">Advanced Options</div>
                                              <p class="color-white opacity9">Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                          </div>
                                      </div>
                                  </div>
                              </div>
                          </div>
                      </section>

3 Column feature box with left icon

<section class="section steady-feature-3">
                        <div class="container">
                            <div class="row">
                                <div class="col-sm-6 col-md-4">
                                    <div class="feature-box-01 m-15px-tb"> <i class="fa fa-picture-o color-medium-gray icon-xl"></i>
                                        <div class="feature-content">
                                            <div class="font-alt font-w-700 m-5px-b color-extra-dark-gray font-15">Perfect Design</div>
                                            <p>Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-sm-6 col-md-4">
                                    <div class="feature-box-01 m-15px-tb"> <i class="fa fa-pencil color-medium-gray icon-xl"></i>
                                        <div class="feature-content">
                                            <div class="font-alt font-w-700 m-5px-b color-extra-dark-gray font-15">Full Documentation</div>
                                            <p>Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-sm-6 col-md-4">
                                    <div class="feature-box-01 m-15px-tb"> <i class="fa fa-puzzle-piece color-medium-gray icon-xl"></i>
                                        <div class="feature-content">
                                            <div class="font-alt font-w-700 m-5px-b color-extra-dark-gray font-15">Fully Responsive</div>
                                            <p>Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                      </section>

3 Column feature box with right icon

<section class="section steady-feature-4">
                        <div class="container">
                            <div class="row">
                                <div class="col-sm-6 col-md-3">
                                    <div class="feature-box-02 m-15px-tb"> <i class="fa fa-picture-o icon-xl"></i>
                                        <div class="feature-content">
                                            <div class="font-alt font-w-700 m-5px-b color-theme">Perfect Design</div>
                                            <p>Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-sm-6 col-md-3">
                                    <div class="feature-box-02 m-15px-tb"> <i class="fa fa-pencil icon-xl"></i>
                                        <div class="feature-content">
                                            <div class="font-alt font-w-700 m-5px-b color-theme">Full Documentation</div>
                                            <p>Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-sm-6 col-md-3">
                                    <div class="feature-box-02 m-15px-tb"> <i class="fa fa-puzzle-piece icon-xl"></i>
                                        <div class="feature-content">
                                            <div class="font-alt font-w-700 m-5px-b color-theme">Fully Responsive</div>
                                            <p>Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-sm-6 col-md-3">
                                    <div class="feature-box-02 m-15px-tb"> <i class="fa fa-file-text-o icon-xl"></i>
                                        <div class="feature-content">
                                            <div class="font-alt font-w-700 m-5px-b color-theme">Advanced Options</div>
                                            <p>Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </section>

3 Column feature box with border

<section class="section steady-feature-5">
                          <div class="container">
                              <div class="row">
                                  <div class="col-md-4">
                                      <div class="feature-box text-center border-all border-w-9 border-double border-theme p-30px m-15px-tb"> <i class="fa fa-picture-o icon-round-small theme-bg color-white m-25px-t"></i>
                                          <div class="feature-content">
                                              <div class="font-alt font-w-700 m-5px-b m-20px-t color-extra-dark-gray font-15">Perfect Design</div>
                                              <p>Lorem Ipsum is simply text the printing and typesetting standard industry. Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                          </div>
                                      </div>
                                  </div>
                                  <div class="col-md-4">
                                      <div class="feature-box text-center border-all border-w-9 border-double border-theme p-30px m-15px-tb"> <i class="fa fa-pencil icon-round-small theme-bg color-white m-25px-t"></i>
                                          <div class="feature-content">
                                              <div class="font-alt font-w-700 m-5px-b m-20px-t color-extra-dark-gray font-15">Full Documentation</div>
                                              <p>Lorem Ipsum is simply text the printing and typesetting standard industry. Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                          </div>
                                      </div>
                                  </div>
                                  <div class="col-md-4">
                                      <div class="feature-box text-center border-all border-w-9 border-double border-theme p-30px m-15px-tb"> <i class="fa fa-puzzle-piece icon-round-small theme-bg color-white m-25px-t"></i>
                                          <div class="feature-content">
                                              <div class="font-alt font-w-700 m-5px-b m-20px-t color-extra-dark-gray font-15">Advanced Options</div>
                                              <p>Lorem Ipsum is simply text the printing and typesetting standard industry. Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                          </div>
                                      </div>
                                  </div>
                              </div>
                          </div>
                      </section>

4 Column feature box with top icon

<section class="section steady-feature-6">
                        <div class="container">
                            <div class="row">
                                <div class="col-sm-6 col-md-3">
                                    <div class="feature-box m-15px-tb"> <i class="fa fa-picture-o color-extra-dark-gray icon-xl"></i>
                                        <div class="feature-content">
                                            <div class="font-alt font-15 font-w-700 m-5px-b m-15px-t color-extra-dark-gray">Perfect Design</div>
                                            <p>Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-sm-6 col-md-3">
                                    <div class="feature-box m-15px-tb"> <i class="fa fa-pencil color-extra-dark-gray icon-xl"></i>
                                        <div class="feature-content">
                                            <div class="font-alt font-15 font-w-700 m-5px-b m-15px-t color-extra-dark-gray">Full Documentation</div>
                                            <p>Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-sm-6 col-md-3">
                                    <div class="feature-box m-15px-tb"> <i class="fa fa-puzzle-piece color-extra-dark-gray icon-xl"></i>
                                        <div class="feature-content">
                                            <div class="font-alt font-15 font-w-700 m-5px-b m-15px-t color-extra-dark-gray">Fully Responsive</div>
                                            <p>Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-sm-6 col-md-3">
                                    <div class="feature-box m-15px-tb"> <i class="fa fa-file-text-o color-extra-dark-gray icon-xl"></i>
                                        <div class="feature-content">
                                            <div class="font-alt font-15 font-w-700 m-5px-b m-15px-t color-extra-dark-gray">Advanced Options</div>
                                            <p>Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                      </section>

4 Column feature box with sub title

<section class="section steady-feature-7">
                        <div class="container">
                            <div class="row">
                                <div class="col-sm-6 col-md-3">
                                    <div class="feature-box-03 m-15px-tb">
                                        <div class="feature-head"> <i class="fa fa-picture-o color-theme icon-l"></i> <span class="color-medium-gray">Small Title</span>
                                            <div class="font-alt font-w-700 color-extra-dark-gray line-height-20">Perfect Design</div>
                                        </div>
                                        <div class="feature-content m-10px-t">
                                            <p class="line-height-20">Lorem Ipsum is simply text of the printing and typesetting industry. Lorem Ipsum has been standard dummy.</p>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-sm-6 col-md-3">
                                    <div class="feature-box-03 m-15px-tb">
                                        <div class="feature-head"> <i class="fa fa-pencil color-theme icon-l"></i> <span class="color-medium-gray font-12 line-height-14">Small Title</span>
                                            <div class="font-alt font-15 line-height-18 font-w-700 color-extra-dark-gray">Full Documentation</div>
                                        </div>
                                        <div class="feature-content m-10px-t">
                                            <p class="line-height-20">Lorem Ipsum is simply text of the printing and typesetting industry. Lorem Ipsum has been standard dummy.</p>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-sm-6 col-md-3">
                                    <div class="feature-box-03 m-15px-tb">
                                        <div class="feature-head"> <i class="fa fa-puzzle-piece color-theme icon-l"></i> <span class="color-medium-gray">Small Title</span>
                                            <div class="font-alt font-w-700 color-extra-dark-gray line-height-20">Fully Responsive</div>
                                        </div>
                                        <div class="feature-content m-10px-t">
                                            <p class="line-height-20">Lorem Ipsum is simply text of the printing and typesetting industry. Lorem Ipsum has been standard dummy.</p>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-sm-6 col-md-3">
                                    <div class="feature-box-03 m-15px-tb">
                                        <div class="feature-head"> <i class="fa fa-file-text-o color-theme icon-l"></i> <span class="color-medium-gray">Small Title</span>
                                            <div class="font-alt font-w-700 color-extra-dark-gray line-height-20">Advanced Options</div>
                                        </div>
                                        <div class="feature-content m-10px-t">
                                            <p class="line-height-20">Lorem Ipsum is simply text of the printing and typesetting industry. Lorem Ipsum has been standard dummy.</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                      </section>

3 Column dark feature box with step

<section class="section dark-bg steady-feature-8">
                        <div class="container">
                            <div class="row">
                                <div class="col-md-4 m-15px-tb">
                                    <div class="feature-box">   
                                      <div class="font-alt font-22 letter-spacing-2 text-uppercase color-white font-w-300 m-20px-b m-0px-t">
                                        <span class="color-white font-45 font-alt font-w-500">01.</span> We're Master
                                      </div>
                                        <div class="feature-content">
                                            <p class="color-white font-15 line-height-24 letter-spacing-1 w-90 sm-w-100">Lorem Ipsum is simply text the printing and typesetting standard industry. Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                        </div>
                                    </div>
                                </div>

<div class="col-md-4 m-15px-tb">
                                    <div class="feature-box">   
                                      <div class="font-alt font-22 letter-spacing-2 text-uppercase color-white font-w-300 m-20px-b m-0px-t">
                                        <span class="color-white font-45 font-alt font-w-500">02.</span> We're Master
                                      </div>
                                        <div class="feature-content">
                                            <p class="color-white font-15 line-height-24 letter-spacing-1 w-90 sm-w-100">Lorem Ipsum is simply text the printing and typesetting standard industry. Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                        </div>
                                    </div>
                                </div>

<div class="col-md-4 m-15px-tb">
                                    <div class="feature-box">   
                                      <div class="font-alt font-22 letter-spacing-2 text-uppercase color-white font-w-300 m-20px-b m-0px-t">
                                        <span class="color-white font-45 font-alt font-w-500">02.</span> We're Master
                                      </div>
                                        <div class="feature-content">
                                            <p class="color-white font-15 line-height-24 letter-spacing-1 w-90 sm-w-100">Lorem Ipsum is simply text the printing and typesetting standard industry. Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                        </div>
                                    </div>
                                </div>
                                
                            </div>
                        </div>
                      </section>

3 Column light feature box with step

<section class="section light-gray-bg steady-feature-9">
                        <div class="container">
                            <div class="row">
                                <div class="col-md-4 m-15px-tb">
                                    <div class="feature-box">   
                                      <div class="font-alt font-22 letter-spacing-2 text-uppercase color-extra-dark-gray font-w-300 m-20px-b m-0px-t">
                                        <span class="color-extra-dark-gray font-45 font-alt font-w-500">01.</span> We're Master
                                      </div>
                                        <div class="feature-content">
                                            <p class="font-15 line-height-24 letter-spacing-1 w-90 sm-w-100">Lorem Ipsum is simply text the printing and typesetting standard industry. Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                        </div>
                                    </div>
                                </div>

<div class="col-md-4 m-15px-tb">
                                    <div class="feature-box">   
                                      <div class="font-alt font-22 letter-spacing-2 text-uppercase color-extra-dark-gray font-w-300 m-20px-b m-0px-t">
                                        <span class="color-extra-dark-gray font-45 font-alt font-w-500">02.</span> We're Master
                                      </div>
                                        <div class="feature-content">
                                            <p class="font-15 line-height-24 letter-spacing-1 w-90 sm-w-100">Lorem Ipsum is simply text the printing and typesetting standard industry. Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                        </div>
                                    </div>
                                </div>

<div class="col-md-4 m-15px-tb">
                                    <div class="feature-box">   
                                      <div class="font-alt font-22 letter-spacing-2 text-uppercase color-extra-dark-gray font-w-300 m-20px-b m-0px-t">
                                        <span class="color-extra-dark-gray font-45 font-alt font-w-500">03.</span> We're Master
                                      </div>
                                        <div class="feature-content">
                                            <p class="font-15 line-height-24 letter-spacing-1 w-90 sm-w-100">Lorem Ipsum is simply text the printing and typesetting standard industry. Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                        </div>
                                    </div>
                                </div>
                                
                            </div>
                        </div>
                      </section>

4 Column feature box with image icon

<section class="section">
                          <div class="container">
                            <div class="row row-b4 justify-content-center m-60px-b  md-m-40px-b sm-m-20px-b">
                              <div class="col-12 col-md-10 col-lg-8 text-center">
                                <h4 class="color-extra-dark-gray font-w-700 m-0px m-15px-b font-alt text-uppercase">It's not simple, But don't give up.</h4>
                                <p class="font-17 m-0px m-20px-t sm-font-14">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
                              </div>
                            </div>

<div class="row row-b4">
                                
                                <div class="col-lg-3 col-md-6 text-center m-15px-tb">
                                  <div class="m-20px-b w-60px h-60px border-radius-50 theme-bg p-10px display-inline-block">
                                    <img src="http://odoo-snippets.atharvasystem.com/source/img/dumbbell.png" title="" alt="" />
                                  </div>
                                  <div class="font-18 font-w-600 color-extra-dark-gray font-alt m-0px m-10px-b">Heavy Weight</div>
                                  <p class="color-extra-dark-gray m-0px p-30px-lr">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor.</p>
                                </div>

<div class="col-lg-3 col-md-6 text-center m-15px-tb">
                                  <div class="m-20px-b w-60px h-60px border-radius-50 theme-bg p-10px display-inline-block">
                                    <img src="http://odoo-snippets.atharvasystem.com/source/img/icon.png" title="" alt="" />
                                  </div>
                                  <div class="font-18 font-w-600 color-extra-dark-gray font-alt m-0px m-10px-b">Heavy Weight</div>
                                  <p class="color-extra-dark-gray m-0px p-30px-lr">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor.</p>
                                </div>

<div class="col-lg-3 col-md-6 text-center m-15px-tb">
                                  <div class="m-20px-b w-60px h-60px border-radius-50 theme-bg p-10px display-inline-block">
                                    <img src="http://odoo-snippets.atharvasystem.com/source/img/woman.png" title="" alt="" />
                                  </div>
                                  <div class="font-18 font-w-600 color-extra-dark-gray font-alt m-0px m-10px-b">Heavy Weight</div>
                                  <p class="color-extra-dark-gray m-0px p-30px-lr">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor.</p>
                                </div>

</div>

</div>
                        </section>

4 column contact info box

<div class="row row-b4 justify-content-center text-center m-65px-b md-m-40px-b sm-m-25px-b">
                              <div class="col-12 col-md-10 col-lg-8 text-center">
                                  <h4 class="color-extra-dark-gray font-w-700 m-0px m-15px-b font-alt">Get In <span class="color-theme">Touch</span></h4>
                                  
                                  <p class="font-17 m-0px m-20px-t sm-font-14 color-extra-dark-gray">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
                                </div>
                            </div>

<div class="row row-b4 text-center">
                              <div class="col-12 col-sm-6 col-md-3 m-15px-tb">
                                <div class="feature-box p-60px-tb p-10px-lr white-bg border-all min-h-100">
                                  <i class="fa fa-map-o color-theme icon-l"></i>
                                  <div class="feature-content">
                                    <div class="font-alt font-18 font-w-700 m-5px-b m-15px-t color-extra-dark-gray">Address</div>
                                    <p class="font-16 m-0px">Level 13, 2 Elizabeth St,<br/>Melbourne, Victoria 3000, USA </p>
                                  </div>
                                </div>
                              </div>

<div class="col-12 col-sm-6 col-md-3 m-15px-tb">
                                <div class="feature-box p-60px-tb p-10px-lr white-bg border-all min-h-100">
                                  <i class="fa fa-envelope-o color-theme icon-l"></i>
                                  <div class="feature-content">
                                    <div class="font-alt font-18 font-w-700 m-5px-b m-15px-t color-extra-dark-gray">E-mail</div>
                                    <p class="font-16 m-0px">info@yourdomain.com<br/>support@yourdomain.com </p>
                                  </div>
                                </div>
                              </div>

<div class="col-12 col-sm-6 col-md-3 m-15px-tb">
                                <div class="feature-box p-60px-tb p-10px-lr white-bg border-all min-h-100">
                                  <i class="fa fa-clock-o color-theme icon-l"></i>
                                  <div class="feature-content">
                                    <div class="font-alt font-18 font-w-700 m-5px-b m-15px-t color-extra-dark-gray">Our office</div>
                                    <p class="font-16 m-0px">Monday - Friday: 8:00 - 16:00<br/>Saturday: 8:00 - 15:00</p>
                                  </div>
                                </div>
                              </div>

</div> 
                          </div> 
                        </section>

3 column contact info box

<section class="section">
                        <div class="container">
                          <div class="row">
                              <div class="col-md-4 m-15px-tb">
                                <div class="feature-box p-60px-tb p-10px-lr white-bg border-all text-center h-100">
                                  <i class="fa fa-map-o color-extra-dark-gray icon-xl"></i>
                                  <div class="feature-content">
                                    <div class="font-alt font-25 font-w-300 text-uppercase m-5px-b m-15px-t color-black letter-spacing-2 m-15px-b">Address</div>
                                    <p class="font-16 font-w-400 m-0px">Level 13, 2 Elizabeth St,<br/>Melbourne, Victoria 3000, USA </p>
                                  </div>
                                </div>
                              </div>

<div class="col-md-4 m-15px-tb">
                                <div class="feature-box p-60px-tb p-10px-lr white-bg border-all text-center h-100">
                                  <i class="fa fa-envelope-o color-extra-dark-gray icon-xl"></i>
                                  <div class="feature-content">
                                    <div class="font-alt font-25 font-w-300 text-uppercase m-5px-b m-15px-t color-black letter-spacing-2 m-15px-b">E-mail</div>
                                    <p class="font-16 font-w-400 m-0px">info@yourdomain.com<br/>support@yourdomain.com</p>
                                  </div>
                                </div>
                              </div>

Our client with 10 logo

Our client with 8 logo

Our client with 6 logo

Our client with 4 logo

Our client with heading

<section class="section light-gray-bg">
                        <div class="container">
                          <div class="row row-b4 justify-content-center m-60px-b">
                            <div class="text-center col-md-7">
                              <h5 class="color-extra-dark-gray font-w-600">We Are Serving Over 10000 Happy Users.</h5>
                              <div class="theme-bg h-4px w-50px display-inline-block m-15px-t border-radius-5px m-30px-b"></div>
                              <p class="font-18 m-0px">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo.</p>
                            </div>
                          </div>
                          <div class="clients-list clients-border clients-col-4">
                              <ul>
                                  <li> <img src="http://odoo-snippets.atharvasystem.com/source/img/logo-1.png" alt="" title="" /> </li>
                                  <li> <img src="http://odoo-snippets.atharvasystem.com/source/img/logo-2.png" alt="" title="" /> </li>
                                  <li> <img src="http://odoo-snippets.atharvasystem.com/source/img/logo-2.png" alt="" title="" /> </li>
                                  <li> <img src="http://odoo-snippets.atharvasystem.com/source/img/logo-4.png" alt="" title="" /> </li>
                                  <li> <img src="http://odoo-snippets.atharvasystem.com/source/img/logo-5.png" alt="" title="" /> </li>
                                  <li> <img src="http://odoo-snippets.atharvasystem.com/source/img/logo-6.png" alt="" title="" /> </li>
                                  <li> <img src="http://odoo-snippets.atharvasystem.com/source/img/logo-7.png" alt="" title="" /> </li>
                                  <li> <img src="http://odoo-snippets.atharvasystem.com/source/img/logo-8.png" alt="" title="" /> </li>
                              </ul>
                          </div>
                        </div>
                      </section>

Our client with 6 column

Call to action with center button

Call to action with right button

Call to action with background color

Call to action with border box

Call to action with large height

Blockquote with left border

Blockquote with right border

Blockquote with quote icon

Blockquote with quote icon and right align

About us box with banner and icon box

<section class="section steady-aboutus-1">
                          <div class="container">
                              <div class="row row-b4">
                                  <div class="col-md-6">
                                    <span class="font-16 font-w-600 color-theme font-alt display-inline-block">About Us</span>
                                    <h5 class="font-alt color-extra-dark-gray font-w-800">Get The Good Services<br/> From Our Experts</h5>
                                    <p class="w-90 sm-w-100 m-35px-b">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the 's standard dummy text. Lorem Ipsum has been the industry's standard dummy text ever since. Lorem Ipsum is simply dummy text.</p><a href="#" class="m-btn">Learn More </a></div>
                                    <div class="col-md-6 md-m-30px-t">
                                      <img src="http://odoo-snippets.atharvasystem.com/source/img/mac-2.png" />
                                    </div>
                              </div>
                              <div class="row m-80px-t">
                                  <div class="col-sm-6 col-md-4">
                                      <div class="feature-box-01 m-15px-tb">
                                        <span class="fa fa-drivers-license-o color-medium-gray icon-xl"></span>
                                          <div class="feature-content">
                                              <div class="font-alt font-w-700 m-5px-b color-extra-dark-gray font-15">Perfect Design</div>
                                              <p>Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                          </div>
                                      </div>
                                  </div>
                                  <div class="col-sm-6 col-md-4">
                                      <div class="feature-box-01 m-15px-tb"> 
                                          <span class="fa fa-superpowers color-medium-gray icon-xl"></span>
                                          <div class="feature-content">
                                              <div class="font-alt font-w-700 m-5px-b color-extra-dark-gray font-15">Full Documentation</div>
                                              <p>Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                          </div>
                                      </div>
                                  </div>
                                  <div class="col-sm-6 col-md-4">
                                      <div class="feature-box-01 m-15px-tb">
                                          <span class="fa fa-bicycle color-medium-gray icon-xl"></span>
                                          <div class="feature-content">
                                              <div class="font-alt font-w-700 m-5px-b color-extra-dark-gray font-15">Fully Responsive</div>
                                              <p>Lorem Ipsum is simply text the printing and typesetting standard industry.</p>
                                          </div>
                                      </div>
                                  </div>
                              </div>
                          </div>
                        </section>

Our work flow with banner

<section class="section steady-aboutus-2">
                        <div class="container">
                            <div class="row row-b4">
                                <div class="col-md-3">
                                    <div class="theme-bg p-25px md-min-h-100">
                                        <h6 class="font-alt color-white font-w-700 m-0px m-10px-b">Fantastic service, i'm excited!</h6>
                                        <p class="m-15px-b color-white">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the 's standard dummy text.</p>
                                        <div class="font-16 font-w-600 color-white">Morgan John</div><span class="font-16 color-white">CreativeGigs CEO</span> </div>
                                </div>
                                <div class="col-md-3 sm-m-30px-t"> <img src="http://odoo-snippets.atharvasystem.com/source/img/blog-img1.jpg" alt="Steady" title="Steady" />
                                    <div class="font-alt font-w-700 font-18 color-extra-dark-gray p-15px-t p-10px-b">Business Advising</div>
                                    <p class="m-0px">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the 's standard dummy text.</p>
                                </div>
                                <div class="col-md-3 md-m-30px-t"> <img src="http://odoo-snippets.atharvasystem.com/source/img/blog-img2.jpg" alt="Steady" title="Steady" />
                                    <div class="font-alt font-w-700 font-18 color-extra-dark-gray p-15px-t p-10px-b">Business Advising</div>
                                    <p class="m-0px">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the 's standard dummy text.</p>
                                </div>
                                <div class="col-md-3 md-m-30px-t"> <img src="http://odoo-snippets.atharvasystem.com/source/img/blog-img3.jpg" alt="Steady" title="Steady" />
                                    <div class="font-alt font-w-700 font-18 color-extra-dark-gray p-15px-t p-10px-b">Business Advising</div>
                                    <p class="m-0px">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the 's standard dummy text.</p>
                                </div>
                            </div>
                        </div>
                      </section>

Content with 2 column

<section class="section">
                        <div class="container">
                          <div class="row row-b4 justify-content-center">
                            <div class="col-12 col-md-6 text-center m-60px-b">
                              <span class="text-uppercase color-medium-gray">About us</span>
                              <h4 class="color-extra-dark-gray font-w-400 m-0px font-alt">Get The Good Services From Our Experts</h4>
                            </div>
                          </div>

<div class="row row-b4">
                            <div class="col-12 col-md-6">
                              <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
                            </div>

<div class="col-12 col-md-6">
                              <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
                            </div> 
                            <div class="col-12 col-md-12 text-center m-30px-t">
                              <a href="#" class="text-underline color-theme font-w-700 text-uppercase">Read More</a>
                            </div>
                          </div>

</div> 
                      </section>

Fullscreen about us with banner

<section>
                          <div class="container-fluid">
                            <div class="row row-b4">
                              <section class="col-md-12 col-lg-6 md-h-300px bg-cover bg-no-repeat bg-center-center" style="background-image: url(http://odoo-snippets.atharvasystem.com/source/img/about-us1.jpg);">
                                
                              </section>
                              <div class="col-md-12 col-lg-6">
                                <div class="p-10 md-p-3 sm-p-0px-lr">
                                  <div class="font-alt font-40 md-font-30 sm-font-20 font-w-600 color-extra-dark-gray m-0px m-65px-b md-m-45px-b sm-m-30px-b">We are delivering beautiful digital products for you</div>
                                  <div class="row row-b4">
                                    <div class="col-12 col-md-6">
                                      <div class="feature-box-01 m-50px-b"> <span class="fa fa-picture-o color-medium-gray icon-xl"></span>
                                          <div class="feature-content">
                                              <div class="font-alt font-w-600 m-10px-b color-extra-dark-gray font-17 letter-spacing-1">Perfect Design</div>
                                              <p class="font-15">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since.</p>
                                          </div>
                                      </div>
                                    </div>

<div class="col-12 col-md-6">
                                      <div class="feature-box-01 m-50px-b"> <span class="fa fa-pencil color-medium-gray icon-xl"></span>
                                          <div class="feature-content">
                                              <div class="font-alt font-w-600 m-10px-b color-extra-dark-gray font-17 letter-spacing-1">Full Documentation</div>
                                              <p class="font-15">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since.</p>
                                          </div>
                                      </div>
                                    </div>

<div class="col-12 col-md-6">
                                      <div class="feature-box-01"> <span class="fa fa-puzzle-piece color-medium-gray icon-xl"></span>
                                          <div class="feature-content">
                                              <div class="font-alt font-w-600 m-10px-b color-extra-dark-gray font-17 letter-spacing-1">Fully Responsive</div>
                                              <p class="font-15">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since.</p>
                                          </div>
                                      </div>
                                    </div>

</div> 
                                </div>
                              </div> 
                            </div> 
                          </div> 
                      </section>

About me with image

<section class="section p-0px-b">
                        <div class="container">
                          <div class="row row-b4 align-items-center">
                            <div class="col-md-6 text-center">
                              <img src="http://odoo-snippets.atharvasystem.com/source/img/man.jpg" title="" alt="" />
                            </div> 
                            <div class="col-md-6 sm-m-30px-t">
                              <h5 class="m-0px color-extra-dark-gray font-w-700 font-alt">Great Team Work.</h5>
                              <p class="color-medium-gray letter-spacing-2 m-15px-b">Designed by Steady</p>
                              <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
                              tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
                              quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
                              consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
                              cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
                              proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
                              <a href="#" class="text-underline color-theme font-w-700 text-uppercase">Read More</a>
                            </div>
                          </div> 
                        </div>
                      </section>

About us with left banner

<section class="section">
                          <div class="container">
                            <div class="row row-b4 align-items-center">
                              <div class="col-md-7 text-center">
                                <img src="http://odoo-snippets.atharvasystem.com/source/img/2.jpg" title="" alt="" />
                              </div> 
                              <div class="col-md-5 sm-m-30px-t">
                                <h5 class="m-0px color-extra-dark-gray font-w-700 font-alt">Great Team Work.</h5>
                                <p class="color-medium-gray letter-spacing-2 m-15px-b">Designed by Steady</p>
                                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
                                tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
                                quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
                                consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
                                cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
                                proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
                                <a href="#" class="text-underline color-theme font-w-700 text-uppercase">Read More</a>
                              </div>
                            </div> 
                          </div>
                        </section>

About us with icon box

<section class="section light-gray-bg">
                          <div class="container">
                            <div class="row row-b4 justify-content-center m-80px-b  md-m-40px-b sm-m-20px-b">
                              <div class="col-12 col-md-10 col-lg-8 text-center">
                                <h4 class="color-extra-dark-gray font-w-700 m-0px m-15px-b font-alt">About <span class="color-theme">Steady</span></h4>
                                
                                <p class="font-17 m-0px m-20px-t sm-font-14 color-extra-dark-gray">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
                              </div> 
                            </div>

<div class="feature-content">
                                    <div class="font-alt font-18 font-w-600 m-10px-b m-30px-t color-extra-dark-gray">Perfect Design</div>               
                                    <p class="m-0px font-16">Lorem Ipsum is simply text the printing and typesetting standard industry. Lorem Ipsum is simply text the printing and typesetting.</p>
                                  </div>
                                </div>
                              </div>

<div class="feature-content">
                                    <div class="font-alt font-18 font-w-600 m-10px-b m-30px-t color-extra-dark-gray">Documentation</div>               
                                    <p class="m-0px font-16">Lorem Ipsum is simply text the printing and typesetting standard industry. Lorem Ipsum is simply text the printing and typesetting.</p>
                                  </div>
                                </div>
                              </div>

<div class="feature-content">
                                    <div class="font-alt font-18 font-w-600 m-10px-b m-30px-t color-extra-dark-gray">Advanced Options</div>               
                                    <p class="m-0px font-16">Lorem Ipsum is simply text the printing and typesetting standard industry. Lorem Ipsum is simply text the printing and typesetting.</p>
                                  </div>
                                </div>
                              </div>

</div> 
                          </div> 
                      </section>

Image with description option 1

<div class="col-12 col-md-6 sm-m-30px-t">
                              <span class="font-15 font-w-600 m-5px-b color-theme">Hear Your Colours</span>
                              <h4 class="font-w-700 font-alt color-extra-dark-gray m-0px m-20px-b">Fits your style</h4>
                              <p class="font-w-600 w-90 sm-w-100">The single-colour, single-shape design blends signature style with form-fitting comfort. So you and your headphones are always in tune.</p>
                              <p class="w-90 sm-w-100 m-30px-b">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
                              <a class="m-btn m-btn-round" href="#">PURCHASE NOW</a>
                            </div> 
                          </div>
                        </div> 
                      </section>

Image with description option 2

<section class="section">
                        <div class="container">
                          <div class="row row-b4 align-items-center">
                            <div class="col-12 col-md-6">
                              <span class="font-15 font-w-600 m-5px-b color-theme">Hear Your Colours</span>
                              <h4 class="font-w-700 font-alt color-extra-dark-gray m-0px m-20px-b">Fits your style</h4>
                              <p class="font-w-600 w-90 sm-w-100">The single-colour, single-shape design blends signature style with form-fitting comfort. So you and your headphones are always in tune.</p>
                              <p class="w-90 sm-w-100 m-30px-b">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
                              <a class="m-btn m-btn-round" href="#">PURCHASE NOW</a>
                            </div> 
                            <div class="col-12 col-md-6 text-center sm-m-30px-t">
                              <img src="http://odoo-snippets.atharvasystem.com/source/img/headphone02.png" title="" alt="" />  
                            </div>  
                            
                          </div>
                        </div> 
                      </section>

Image with description option 3

<section class="section p-0px">
                        <div class="container">
                          <div class="row row-b4 align-items-center">
                            <div class="col-md-6">
                              <img src="http://odoo-snippets.atharvasystem.com/source/img/headphone06.png" title="" alt="">
                            </div> 
                          
                            <div class="col-md-6 sm-m-40px-tb">
                              <span class="font-15 font-w-600 color-theme">IF Gold Award 2018</span>
                              <h4 class="font-w-700 font-alt color-extra-dark-gray m-0px m-5px-t m-15px-b">Award winning design</h4>
                              <p class="w-90 sm-w-100 m-25px-b">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
                              <a class="m-btn m-btn-round" href="#">PURCHASE NOW</a>
                            </div>
                          </div> 
                        </div> 
                      </section>

Fullscreen two column with banner

<section class="section p-0px">
                        <div class="container-fluid">
                          <div class="row row-b4">
                            <section class="col-md-4 sm-h-300px bg-cover bg-center-top bg-no-repeat" style="background-image: url(http://odoo-snippets.atharvasystem.com/source/img/gym-a1.jpg);">
                            </section>
                            <section class="col-md-4 dark-bg">
                              <div class="p-20 md-p-10 sm-p-0px-lr">
                                <p class="font-alt font-24  letter-spacing-1 font-w-700 color-white m-0px m-20px-b"> Built to bring best results </p>
                                <p class="m-30px-b font-16">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
                                consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
                                cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
                                proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
                                <a class="m-btn m-btn-t-white" href="#">Join Now</a>
                              </div>
                            </section>

<section class="col-md-4 extra-dark-bg">
                              <div class="p-20 md-p-10 sm-p-0px-lr">
                                <p class="font-alt font-24 font-w-700 color-white m-0px m-15px-b"> Built to bring best results </p>
                                <p class="m-30px-b font-16">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
                                consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
                                cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
                                proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
                                <a class="m-btn m-btn-t-white" href="#">Join Now</a>
                              </div>
                            </section>
                          </div>
                        </div>
                      </section>

About us with list

<section class="section">
                        <div class="container">
                          <div class="row row-b4">
                            <div class="col-12 col-md-6 align-self-center">
                              <div class="font-alt font-w-700 font-25 color-extra-dark-gray m-20px-b w-70 md-w-100">Create a pixel perfect website today with Steady!</div>
                              <p class="w-85 sm-w-100">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
                              <ul class="list-style-4 list-style-theme m-25px-t w-90 md-w-100">
                                <li>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do.</li>
                                <li>eiusmod tempor incididunt ut labore et dolore magna aliqua</li>
                                <li>Ut enim ad minim veniam, quis nostrud exercitation ullamco.</li>
                                <li>Duis aute irure dolor in reprehenderit in voluptate velit</li>
                                <li>cupidatat non proident, sunt in culpa qui officia</li>
                              </ul>
                            </div> 
                            <div class="col-12 col-md-6 align-self-center sm-m-30px-t">
                              <img src="http://odoo-snippets.atharvasystem.com/source/img/mac-2.png" />
                            </div>
                          </div> 
                        </div> 
                      </section>

About us with image icon

<section class="section">
                        <div class="container">
                          <div class="row row-b4 justify-content-center m-60px-b">
                            <div class="col-md-7 text-center">
                              <h5 class="color-extra-dark-gray font-w-600">Steady is one of the most powerful and flexible theme on Odoo</h5>
                              <div class="theme-bg h-4px w-50px display-inline-block m-15px-t border-radius-5px m-30px-b"></div>
                              <p class="font-18 m-0px">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
                              quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo.</p>
                            </div>
                          </div>

<div class="row row-b4">
                            <div class="col-md-4">
                              <div class="p-15px text-center box-shadow-extra-large">
                                <div class="text-center display-inline-block m-20px-b">
                                    <img src="http://odoo-snippets.atharvasystem.com/source/img/shopping-bag.png">  
                                </div>
                                <div class="font-alt font-w-700 m-5px-b color-extra-dark-gray font-20 m-20px-b">Steady Order</div>
                                <p class="m-0px font-18">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
                              </div>
                            </div>

<div class="col-md-4">
                              <div class="p-15px text-center box-shadow-extra-large">
                                <div class="text-center display-inline-block m-20px-b">
                                    <img src="http://odoo-snippets.atharvasystem.com/source/img/packing.png">  
                                </div>
                                <div class="font-alt font-w-700 m-5px-b color-extra-dark-gray font-20 m-20px-b">Steady Packing</div>
                                <p class="m-0px font-18">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
                              </div>
                            </div>

<div class="col-md-4">
                              <div class="p-15px text-center box-shadow-extra-large">
                                <div class="text-center display-inline-block m-20px-b">
                                    <img src="http://odoo-snippets.atharvasystem.com/source/img/delivery-truck.png">  
                                </div>
                                <div class="font-alt font-w-700 m-5px-b color-extra-dark-gray font-20 m-20px-b">Steady Drop Off</div>
                                <p class="m-0px font-18">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
                              </div>
                            </div>

</div>
                        </div>
                      </section>

About us with right image

<section class="section light-gray-bg">
                        <div class="container">
                          <div class="row-b4 row align-items-center">
                            <div class="col-md-6">
                              <h5 class="color-extra-dark-gray font-w-600">Steady - Multi-purpose Theme</h5>
                              <div class="theme-bg h-4px w-50px display-inline-block m-15px-t border-radius-5px m-30px-b"></div>
                              <p class="font-18 m-30px-b">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
                              quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
                              cillum dolore eu fugiat nulla pariatur.</p>
                              <a href="#" class="m-btn m-btn-dark">Read More</a>
                            </div>
                            <div class="col-md-6">
                              <img src="http://odoo-snippets.atharvasystem.com/source/img/mockup-produit.png">
                            </div>
                          </div>
                        </div>
                      </section>

About us with left image

<section class="section">
                        <div class="container">
                          <div class="row-b4 row align-items-center">
                            <div class="col-md-6">
                              <img src="http://odoo-snippets.atharvasystem.com/source/img/mockup-produit.png">
                            </div>
                            <div class="col-md-6">
                              <h5 class="color-extra-dark-gray font-w-600">Steady - Multi-purpose Theme</h5>
                              <div class="theme-bg h-4px w-50px display-inline-block m-15px-t border-radius-5px m-30px-b"></div>
                              <p class="font-18 m-30px-b">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
                              quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
                              cillum dolore eu fugiat nulla pariatur.</p>
                              <a href="#" class="m-btn m-btn-dark">Read More</a>
                            </div>
                          </div>
                        </div>
                      </section>

About us with left image

<section class="section">
                          <div class="container">
                            <div class="row-b4 row justify-content-center m-60px-b md-m-40px">
                                <div class="col-md-8 text-center">
                                  <h4 class="font-alt font-w-600 color-extra-dark-gray">Why We Are?</h4>
                                  <p class="m-0px font-16">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris</p>
                                </div>
                            </div>

<div class="row row-b4 align-items-center">
                              <div class="col-md-6">
                                <div class="font-alt font-20 font-w-500 color-extra-dark-gray m-20px-b">Make beauty Things With Passion.</div>
                                <p class="w-80 sm-w-100">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.</p>
                                <ul class="list-style-4 list-style-theme m-25px-t w-90 md-w-100">
                                  <li>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do.</li>
                                  <li>eiusmod tempor incididunt ut labore et dolore magna aliqua</li>
                                  <li>Ut enim ad minim veniam, quis nostrud exercitation ullamco.</li>
                                  <li>Duis aute irure dolor in reprehenderit in voluptate velit</li>
                                  <li>cupidatat non proident, sunt in culpa qui officia</li>
                                </ul>
                              </div>
                              <div class="col-md-6">
                                <img src="http://odoo-snippets.atharvasystem.com/source/img/why-we-are.png" />
                              </div>
                            </div>
                          </div>
                        </section>