newsupernova/app/code/Smartwave/Porto/etc/import/pages.xml

<root>
   <pages>
      <cms_item>
         <title>Porto - Homepage 1</title>
         <identifier>porto_home_1</identifier>
         <content><![CDATA[<style type="text/css">
html {
    overflow-y:scroll;
}
body.boxed {
    padding: 0;
}
.page-main {
    display: none;
}
body.boxed .page-wrapper {
    width: 100%;
}
.full-screen-slider {
    width: 100%;
}
header.page-header.type14 {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    background-color: transparent;
}
#banner-slider-demo-3 div.content-area h2 {
    font-size: 70px;
    margin: 0 0 3vh;
}
#banner-slider-demo-3 div.content-area a.btn-default {
    font-size: 14px;
    letter-spacing: 1px;
    padding: 18px 40px;
    width: auto;
    height: auto;
    line-height: 1;
}
.owl-middle-narrow .owl-theme .owl-controls .owl-nav [class*=owl-], .owl-middle-narrow.owl-theme .owl-controls .owl-nav [class*=owl-] {
    font-size: 26px;
}
@media (max-width: 1679px) {
    #banner-slider-demo-3 div.content-area h2 {
        font-size: 70px;
        margin: 4px 0 35px;
        letter-spacing: 4px;
    }
}
@media (max-width: 1199px) {
    #banner-slider-demo-3 div.content-area h2 {
        font-size: 50px;
        margin: 4px 0 35px;
        letter-spacing: 4px;
    }
}
@media (max-width: 991px) {
    #banner-slider-demo-3 div.content-area h2 {
        font-size: 40px;
        margin: 4px 0 30px;
        letter-spacing: 3px;
    }
    #banner-slider-demo-3 div.content-area a.btn-default {
        font-size: 11px;
        padding: 15px 25px;
    }
}
@media (max-width: 767px) {
    #banner-slider-demo-3 div.content-area h2 {
        font-size: 30px;
        margin: 4px 0 20px;
        letter-spacing: 2px;
    }
    #banner-slider-demo-3 div.content-area a.btn-default {
        font-size: 10px;
        padding: 10px 20px;
    }
}
</style>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[<referenceContainer name="page.top">
    <block class="Magento\Cms\Block\Block" name="home_slider">
        <arguments>
            <argument name="block_id" xsi:type="string">porto_homeslider_1</argument>
        </arguments>
    </block>
</referenceContainer>]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 1 Old Skin</title>
         <identifier>porto_home_1_old</identifier>
         <content><![CDATA[<style type="text/css">
html, body {
    overflow: hidden;
}
body.boxed {
    padding: 0;
}
body.boxed .page-wrapper {
    width: 100%;
}
.full-screen-slider {
    width: 100%;
}
header.page-header.type14 {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    background-color: rgba(0,0,0,0.8);
}
.cms-index-index .page-header.type3 {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 2;
    background-color: rgba(0,0,0,.5);
    width: 100%;
    max-height: 100%;
}
.page-main, .page-footer {
    display: none;
}
#banner-slider-demo-3 div.content-area h2 {
    font-size: 70px;
    margin: 5px 0 45px;
    letter-spacing: 5px;
}
#banner-slider-demo-3 div.content-area a.btn-default {
    font-size: 14px;
    letter-spacing: 1px;
    padding: 18px 40px;
    width: auto;
    height: auto;
    line-height: 1;
}
.full-screen-slider > div.copyright-text {
    font-family: 'Oswald';
    font-weight: 400;
    font-size: 12px;
    color: #000;
    line-height: 92px;
    position: absolute;
    left: 100px;
    bottom: 0;
    z-index: 2;
}
@media (max-width: 1899px) {
    .full-screen-slider > div.copyright-text {
        left: 70px;
    }
}
@media (max-width: 1679px) {
    #banner-slider-demo-3 div.content-area h2 {
        font-size: 70px;
        margin: 4px 0 35px;
        letter-spacing: 4px;
    }
    .full-screen-slider > div.copyright-text {
        line-height: 60px;
    }
}
@media (max-width: 1439px) {
    .full-screen-slider > div.copyright-text {
        left: 30px;
    }
}
@media (max-width: 1199px) {
    #banner-slider-demo-3 div.content-area h2 {
        font-size: 50px;
        margin: 4px 0 35px;
        letter-spacing: 4px;
    }
}
@media (max-width: 991px) {
    #banner-slider-demo-3 div.content-area h2 {
        font-size: 40px;
        margin: 4px 0 30px;
        letter-spacing: 3px;
    }
    #banner-slider-demo-3 div.content-area a.btn-default {
        font-size: 11px;
        padding: 15px 25px;
    }
}
@media (max-width: 767px) {
    #banner-slider-demo-3 div.content-area h2 {
        font-size: 30px;
        margin: 4px 0 20px;
        letter-spacing: 2px;
    }
    #banner-slider-demo-3 div.content-area a.btn-default {
        font-size: 10px;
        padding: 10px 20px;
    }
    .full-screen-slider > div.copyright-text {
        font-size: 10px;
        line-height: 40px;
        left: 20px;
    }
}
</style>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[<referenceContainer name="page.top">
    <block class="Magento\Cms\Block\Block" name="home_slider">
        <arguments>
            <argument name="block_id" xsi:type="string">porto_homeslider_1_old</argument>
        </arguments>
    </block>
</referenceContainer>]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 2</title>
         <identifier>porto_home_2</identifier>
         <content><![CDATA[<style type="text/css">
.page-header.type27 {
    background: transparent;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
}
.page-main {
    padding: 0;
    max-width: 100%;
}
.columns .column.main,
.column.main {
    min-height: auto;
    padding: 0;
}
#banner-slider-demo-2 .item .content {
    font-size: 10px;
    color: #222529;
}
#banner-slider-demo-2 a.btn:hover {
    color: #222529;
}
.coupon-sale-text {
    position: relative;
    padding-left: .265em;
}
@media (max-width: 991px) {
    #banner-slider-demo-2 .item .content {
        font-size: 9px;
    }
}
@media (max-width: 767px) {
    #banner-slider-demo-2 .item .content {
        font-size: 7px;
    }
}
@media (max-width: 575px) {
    #banner-slider-demo-2 .item .content {
        font-size: 6px;
    }
}
.coupon-sale-text i {
    font-style: normal;
    font-size: .265em;
    font-weight: 500;
    transform: translateY(-50%) rotate(-90deg);
    position: absolute;
    top: 50%;
    left: -1em;
}
.btn-modern.btn-xl {
    font-size: 1.4em;
    padding: 1.2em 2.8em;
    letter-spacing: -0.025em;
    text-transform: uppercase;
    font-weight: 700;
}
.btn-light {
    color: #222529;
    background-color: #ffffff;
    border-color: #ffffff #ffffff #e6e6e6;
}
.btn > i {
    margin-left: 5px;
}
.full-screen-slider, .full-screen-slider .item {
    max-height: 804px;
}
@media (min-width: 768px) {
    .full-screen-slider {
        margin-top: 60px;
    }
    .home-ads > .row > div {
        border-right: 1px solid #dedede;
    }
    .home-ads > .row > div:first-child {
        border-left: 1px solid #dedede;
    }
}
@media (max-width: 767px) {
    .home-ads > .row > div {
        border-right: 1px solid #dedede;
        border-left: 1px solid #dedede;
        border-top: 1px solid #dedede;
    }
    .home-ads > .row > div:first-child {
        border-top: 0;
    }
}
.porto-ultimate-content-box:hover:before {
    display: none;
}
.home-ads .btn.btn-flat {
    padding: 0;
    border: 0;
    border-bottom: 1px solid transparent;
    font-weight: 700;
    background: none;
    font-size: 14px;
    letter-spacing: -0.01em;
}
.home-ads .btn.btn-flat:hover {
    border-bottom: 1px solid !important;
}
.homepage-bar {
    border-color: #dedede;
    background: none;
    border-top: 0;
}
.homepage-bar .col-lg-4 {
    border: 0;
    border-right: 1px solid #dedede;
    display: flex;
    justify-content: center;
    padding-top: 22px;
    padding-bottom: 17px;
}
.homepage-bar .col-lg-4:first-child {
    border-left: 1px solid #dedede;
}
.homepage-bar .text-area {
    margin-left: 10px;
}
.homepage-bar p {
    font-size: 13px;
}
.homepage-bar h3 {
    font-size: 14px;
}
@media (max-width: 991px) {
    .homepage-bar .col-lg-4 {
        border-left: 1px solid #dedede;
        border-bottom: 1px solid #dedede;
    }
    .homepage-bar {
        border-bottom: 0;
    }
}
#category_slider a {
    display: block;
    position: relative;
    z-index: 1;
    margin-bottom: 20px;
}
#category_slider p {
    padding: 1.2em 1.5em;
    position: absolute;
    bottom: 0;
    text-align: center;
    width: 100%;
    margin: 0;
    z-index: 2;
}
#category_slider p > span {
    position: relative;
    padding-top: 16px;
    padding-bottom: 16px;
    margin-left: 8px;
    margin-right: 8px;
    font-size: 12px;
    font-weight: 600;
    text-transform: none;
    display: block;
    line-height: 1.35;
    letter-spacing: -0.005em;
    color: #222529;
}
#category_slider p > span:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: #fff;
    transform: skew(-20deg);
    z-index: 0;
}
#category_slider p > span > span {
    position: relative;
    z-index: 1;
}
#category_slider p > span:after {
    content: '\f30b';
    font-family: 'Font Awesome 5 Free';
    margin-left: 4px;
    font-weight: 900;
    position: relative;
}
#category_slider a:before {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(27,27,23,0.15);
    z-index: 1;
    transition: all .3s;
    opacity: 0;
}
#category_slider a:hover:before {
    opacity: 1;
}
.btn-modern.btn-lg:hover {
    color: #222529;
    background-color: #fff;
}
.btn-modern.btn-lg {
    font-size: 15px;
    padding: 1em 2.5em;
    height: auto;
    font-weight: 700;
    letter-spacing: 0.01em;
    text-transform: uppercase;
    color: #222529;
    line-height: 1.3333;
    border: 0;
}
#latest_news .item {
    position:relative;
}
#latest_news .post-image {float:left;}
#latest_news .post-content {
    position: relative;
    top: 30px;
    left: -5px;
    background-color: #fff;
    text-align: left;
    padding: 40px;
    margin-left: 200px;
    min-height: 212px;
}
#latest_news .post-image{
    float: left;
    border: none;
    padding: 0;
    margin: 0;
}
.recent-posts .item .post-image img {
    border-radius: 0;
}
#latest_news .postTitle{
    min-height: auto;
    margin-bottom: 9px;
}
#latest_news .postTitle h2{ 
    text-transform: uppercase;
    font-size:18px;
    font-weight: 600;
    letter-spacing: -0.001em;
    line-height: 1;
    margin-bottom: 12px;
}
#latest_news .post-date {
    display: inline-block;
    background-color: #222529;
    color: #fff;
    font-size: 11px;
    line-height: 24px;
    letter-spacing: 0.1em;
    float: none;
    text-align: left;
    padding: 2px 8px;
    font-weight: 700;
    margin-bottom: 10px;
}
#latest_news .postContent {
    line-height: 22px;
    font-size: 13px;
    letter-spacing: 0.03em;
    padding: 0;
    margin-bottom: 15px;
}
#latest_news .read-more {
    text-transform: uppercase;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.03em;
    color: #333333;
}
@media (max-width: 480px) {
    #latest_news .post-image {
        float: none;
        margin: 0;
    }
    #latest_news .post-content {
        padding: 30px;
        margin: 0;
        left: 0;
        top: 0;
        float: left;
    }
}
.brands-slider .owl-controls {
    display: none;
}
</style>
<div class="full-screen-slider" style="width: 100%;">
    <div id="banner-slider-demo-2" class="owl-carousel owl-middle-narrow owl-banner-carousel">
        <div class="item" style="background:url({{media url="wysiwyg/smartwave/porto/homepage/14/slider/slide1.jpg"}}) 20% top no-repeat; background-size:cover; position: relative;">
            <div class="slide-1 content" data-animation="animated fadeIn" style="position: absolute; top: 35%; width:100%;">
                <div class="container" style="">
                    <div class="row">
                        <div class="pl-lg-4 col-sm-9 offset-sm-3 col-md-9 offset-lg-5 col-lg-7 offset-md-3 col-12">
                            <div class="column-inner">
                                <h2 style="font-size: 4.8em;line-height: 1;font-weight: 700;margin: 0;" class="mb-2 custom-font align-left">New Season Dresses</h2>
                                <h3 style="font-size: 11.3em;line-height: 1;margin: 0;" class="coupon-sale-text mb-4 align-left"><i>UP TO</i>50% OFF</h3>
                                <div class="porto-separator mb-0">
                                    <hr class="separator-line align_left solid" style="background-color:#222529;height:5px;width:10%;border: 0;margin: 0;">
                                </div>
                                <h4 style="font-size: 2em;line-height: 1;letter-spacing: -0.02em;" class="d-inline-block mr-4 my-3 align-left">STARTING AT $<strong style="font-size: 2em;vertical-align: text-top;">39</strong>99</h4>
                                <p style="margin: 0;display: inline-block;font-size: 1.4em;">
                                    <a class="btn btn-modern btn-xl btn-light" href="{{store url='shop.html'}}" title="Shop">Shop Now <i class="fas fa-long-arrow-alt-right"></i></a>
                                </p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="item" style="background:url({{media url="wysiwyg/smartwave/porto/homepage/14/slider/slide2.jpg"}}) 80% top no-repeat; background-size:cover; position: relative;">
            <div class="slide-2 content" data-animation="animated fadeIn" style="position: absolute; top: 35%; width:100%;">
                <div class="container" style="">
                    <div class="row">
                        <div class="col-md-9 col-xl-7 offset-lg-1 col-lg-8 col-12">
                            <div class="column-inner">
                                <h2 style="font-size: 4.8em;line-height: 1;font-weight: 700;margin: 0;" class="mb-2 custom-font align-left">New Season Dresses</h2>
                                <h3 style="font-size: 11.3em;line-height: 1;margin: 0;" class="coupon-sale-text mb-4 align-left"><i>UP TO</i>20% OFF</h3>
                                <div class="porto-separator mb-0">
                                    <hr class="separator-line align_left solid" style="background-color:#222529;height:5px;width:10%;border: 0;margin: 0;">
                                </div>
                                <h4 style="font-size: 2em;line-height: 1;letter-spacing: -0.02em;" class="d-inline-block mr-4 my-3 align-left">STARTING AT $<strong style="font-size: 2em;vertical-align: text-top;">19</strong>99</h4>
                                <p style="margin: 0;display: inline-block;font-size: 1.4em;">
                                    <a class="btn btn-modern btn-xl btn-light" href="{{store url='shop.html'}}" title="Shop">Shop Now <i class="fas fa-long-arrow-alt-right"></i></a>
                                </p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script type="text/javascript">
        require([
            'jquery',
            'owl.carousel/owl.carousel.min'
        ], function ($) {
            var owl_3 = $("#banner-slider-demo-2").owlCarousel({
                items: 1,
                autoplay: true,
                autoplayTimeout: 5000,
                autoplayHoverPause: true,
                dots: false,
                navRewind: true,
                animateIn: 'fadeIn',
                animateOut: 'fadeOut',
                loop: true,
                nav: true,
                dots: false,
                navText: ["<em class='porto-icon-left-open-big'></em>","<em class='porto-icon-right-open-big'></em>"]
            });
        });
    </script>
</div>
<div style="background-color:#efefef;">
    <div class="container home-ads">
        <div class="row" style="margin: 0;">
            <div class="col-md-4" style="padding:0;">
                <div class="porto-ultimate-content-box has-content-pos justify-content-center" style="background-size: cover; background-repeat: no-repeat; background-position: center center; box-shadow: none; min-height: 210px; background-image: url({{media url="wysiwyg/smartwave/porto/homepage/14/slider/image_link_1.jpg"}});padding: 20px 0 20px 24px;color: #222529;">
                    <h3 style="font-size: 22px;line-height: 1;margin: 0;letter-spacing: -0.02em;" class="mb-1 align-left text-uppercase">Sunglasses</h3>
                    <p style="font-size: 13px;line-height: 1;margin: 0;margin-bottom: 20px;color: #777;" class="align-left text-uppercase">16 products</p>
                    <div class="porto-separator"><hr class="separator-line align_left solid" style="background-color:#222529;height:4px;width:10%;"></div>
                    <p style="margin: 0;"><a href="#" class="btn btn-flat" style="color: #222529;line-height: 1.3333;">SHOP NOW <i class="fas fa-long-arrow-alt-right"></i></a></p>
                </div>
            </div>
            <div class="col-md-4" style="padding:0;">
                <div class="porto-ultimate-content-box has-content-pos justify-content-center" style="background-size: cover; background-repeat: no-repeat; background-position: center center; box-shadow: none; min-height: 210px; background-image: url({{media url="wysiwyg/smartwave/porto/homepage/14/slider/image_link_2.jpg"}});padding: 20px 0 20px 24px;color: #222529;">
                    <h3 style="font-size: 22px;line-height: 1;margin: 0;letter-spacing: -0.02em;" class="mb-1 align-left text-uppercase">Woman Shoes</h3>
                    <p style="font-size: 13px;line-height: 1;margin: 0;margin-bottom: 20px;color: #777;" class="align-left text-uppercase">12 products</p>
                    <div class="porto-separator"><hr class="separator-line align_left solid" style="background-color:#222529;height:4px;width:10%;"></div>
                    <p style="margin: 0;"><a href="#" class="btn btn-flat" style="color: #222529;line-height: 1.3333;">SHOP NOW <i class="fas fa-long-arrow-alt-right"></i></a></p>
                </div>
            </div>
            <div class="col-md-4" style="padding:0;">
                <div class="porto-ultimate-content-box has-content-pos justify-content-center" style="background-size: cover; background-repeat: no-repeat; background-position: center center; box-shadow: none; min-height: 210px; background-image: url({{media url="wysiwyg/smartwave/porto/homepage/14/slider/image_link_3.jpg"}});padding: 20px 0 20px 24px;color: #222529;">
                    <h3 style="font-size: 22px;line-height: 1;margin: 0;letter-spacing: -0.02em;" class="mb-1 align-left text-uppercase">Woman Bags</h3>
                    <p style="font-size: 13px;line-height: 1;margin: 0;margin-bottom: 20px;color: #777;" class="align-left text-uppercase">38 products</p>
                    <div class="porto-separator"><hr class="separator-line align_left solid" style="background-color:#222529;height:4px;width:10%;"></div>
                    <p style="margin: 0;"><a href="#" class="btn btn-flat" style="color: #222529;line-height: 1.3333;">SHOP NOW <i class="fas fa-long-arrow-alt-right"></i></a></p>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="container">
    <div class="homepage-bar" style="margin: 0">
        <div class="row" style="margin: 0;">
            <div class="col-lg-4">
                <i class="porto-icon-shipping"></i>
                <div class="text-area"><h3>FREE SHIPPING &amp; RETURN</h3><p>Free shipping on all orders over $99.</p></div>
            </div>
            <div class="col-lg-4">
                <i class="porto-icon-money"></i>
                <div class="text-area"><h3>MONEY BACK GUARANTEE</h3><p>100% money back guarantee</p></div>
            </div>
            <div class="col-lg-4">
                <i class="porto-icon-support"></i>
                <div class="text-area"><h3>ONLINE SUPPORT 24/7</h3><p>Lorem ipsum dolor sit amet.</p></div>
            </div>
        </div>
    </div>
</div>
<div class="container" style="padding-top: 55px;padding-bottom: 30px;">
    <h2 class="filterproduct-title"><span class="content"><strong>FEATURED PRODUCTS</strong></span></h2>
    <p>Amazing products added recently in our catalog</p>
    <div id="featured_product">
        {{block class="Smartwave\Filterproducts\Block\Home\FeaturedList" name="featured_product" product_count="4" column_count="4" aspect_ratio="1" image_width="300" image_height="300" product_type="3" template="grid.phtml"}}
    </div>
    <p style="margin: 20px 0 55px;text-align: center;"><a href="#" class="btn btn-default" style="display: inline-block;width: auto;background: #222529;border: none;padding: 1.1em 2.6em;color: #fff;font-size: 14px;font-weight: 700;line-height: 1.3333;"><span>LOAD MORE...</span></a></p>
    <div class="porto-separator tall mb-5"><hr class="separator-line align_center solid"></div>
    <h2 class="filterproduct-title"><span class="content"><strong>BROWSE CATEGORIES</strong></span></h2>
    <p>Amazing categorieswith only top fashion products</p>
    <div id="category_slider">
        <div class="owl-carousel">
            <div class="item">
                <a href="#">
                    <img src="{{media url="wysiwyg/smartwave/porto/homepage/14/slider/shop2_cat4.jpg"}}" alt="" />
                    <p><span><span>Accessories</span></span></p>
                </a>
            </div>
            <div class="item">
                <a href="#">
                    <img src="{{media url="wysiwyg/smartwave/porto/homepage/14/slider/shop2_cat2.jpg"}}" alt="" />
                    <p><span><span>Caps</span></span></p>
                </a>
            </div>
            <div class="item">
                <a href="#">
                    <img src="{{media url="wysiwyg/smartwave/porto/homepage/14/slider/shop2_cat3.jpg"}}" alt="" />
                    <p><span><span>Dress</span></span></p>
                </a>
            </div>
            <div class="item">
                <a href="#">
                    <img src="{{media url="wysiwyg/smartwave/porto/homepage/14/slider/shop2_cat1.jpg"}}" alt="" />
                    <p><span><span>Electronics</span></span></p>
                </a>
            </div>
            <div class="item">
                <a href="#">
                    <img src="{{media url="wysiwyg/smartwave/porto/homepage/14/slider/shop2_cat5.jpg"}}" alt="" />
                    <p><span><span>Fashion</span></span></p>
                </a>
            </div>
        </div>
    </div>
    <script type="text/javascript">
      require([
        'jquery',
        'owl.carousel/owl.carousel.min'
      ], function ($) {
        $("#category_slider .owl-carousel").owlCarousel({
          autoplay: true,
          autoplayTimeout: 5000,
          autoplayHoverPause: true,
          loop: true,
          navRewind: true,
          margin: 20,
          nav: false,
          navText: ["<em class='porto-icon-left-open-big'></em>","<em class='porto-icon-right-open-big'></em>"],
          dots: false,
          responsive: {
            0: {
              items:2
            },
            768: {
              items:3
            },
            992: {
              items:4
            },
            1200: {
              items:5
            }
          }
        });
      });
    </script>
</div>
<div id="parallax_01" style="background:url({{media url="wysiwyg/smartwave/porto/homepage/14/slider/parallax_img.jpg"}}) 80% 0 no-repeat fixed; color: #fff; padding: 105px 0px 145px; position: relative;color: #fff;">
    <div class="overlay overlay-color" style="background-color: #000000; opacity: 0.2; filter: alpha(opacity=2);top:0;"></div>
    <div class="container" style="position: relative;">
        <h2 style="font-size: 40px;line-height: 1;text-align: center;margin: 0;font-weight: 700;" class="custom-font">New Season Sale</h2>
        <h3 style="font-size: 88px;line-height: 1.1;text-align: center;margin: 0;" class="mb-2">40% OFF</h3>
        <div class="porto-separator short  pb-1"><div class="divider divider-small  align_center solid divider-small-center"><hr style="background-color:white;height:4px;"></div></div>
        <p style="margin: 0;text-align: center;"><button class="btn btn-modern btn-lg">Shop Now <i class="fas fa-long-arrow-alt-right"></i></button></p>
    </div>
</div>
<div class="container" style="padding-top: 55px;padding-bottom: 20px;">
    <h2 class="filterproduct-title"><span class="content"><strong>TOP RATED PRODUCTS</strong></span></h2>
    <p>Only the top rated products added recently in our catalog</p>
    <div id="featured_product" class="mb-3">
        {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="top_rated_product" product_count="3" column_count="3" aspect_ratio="1" image_width="360" image_height="360" product_type="3" template="grid.phtml"}}
    </div>
    <div class="porto-separator tall mb-5"><hr class="separator-line align_center solid"></div>
    <div class="row">
        <div class="col-md-4">
            <h2 class="filterproduct-title" style="font-size: 12px;text-align: left;margin-bottom: 20px;line-height: 1.4;"><span class="content"><strong style="font-weight: 600;">RECENTLY ADDED PRODUCTS</strong></span></h2>
            {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="latest_small_list" product_count="3" aspect_ratio="1" image_width="212" image_height="212" template="small_list.phtml"}}
        </div>
        <div class="col-md-4">
            <h2 class="filterproduct-title" style="font-size: 12px;text-align: left;margin-bottom: 20px;line-height: 1.4;"><span class="content"><strong style="font-weight: 600;">BEST SELLING PRODUCTS</strong></span></h2>
            {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="latest_small_list" product_count="3" aspect_ratio="1" image_width="212" image_height="212" template="small_list.phtml"}}
        </div>
        <div class="col-md-4">
            <h2 class="filterproduct-title" style="font-size: 12px;text-align: left;margin-bottom: 20px;line-height: 1.4;"><span class="content"><strong style="font-weight: 600;">FEATURED PRODUCTS</strong></span></h2>
            {{block class="Smartwave\Filterproducts\Block\Home\FeaturedList" name="latest_small_list" product_count="3" aspect_ratio="1" image_width="212" image_height="212" template="small_list.phtml"}}
        </div>
    </div>
</div>
<div style="background-color: #f4f4f2; padding: 60px 0;">
    <div class="container">
        <h2 class="filterproduct-title"><span class="content"><strong>FROM THE BLOG</strong></span></h2>
        <p>Only the latest news from us, stay tuned.</p>
        <div style="margin-bottom: 55px;">
            <div class="recent-posts">
                <div id="latest_news" class="owl-carousel owl-theme">
                    <div class="item">
                        <div class="post-image">
                            <img src="{{media url="wysiwyg/smartwave/porto/blog/01n.jpg"}}" width="225" height="280" alt="">
                        </div>
                        <div class="post-content">
                            <div class="postTitle">
                                <h2><a href="#">Fashion News</a></h2>
                            </div>
                            <div class="post-date">
                                27-FEB-2019
                            </div>
                            <div class="postContent"><p>Quisque elementum nibh at dolor pellentesque, a eleifend libero...</p></div> 
                            <a class="read-more" href="#">Read More <i class="fas fa-long-arrow-alt-right"></i></a>
                        </div>
                    </div>
                    <div class="item">
                        <div class="post-image">
                            <img src="{{media url="wysiwyg/smartwave/porto/blog/02n.jpg"}}" width="225" height="280" alt="">
                        </div>
                        <div class="post-content">
                            <div class="postTitle">
                                <h2><a href="#">Trends of Spring</a></h2>
                            </div>
                            <div class="post-date">
                                08-DEC-2019
                            </div>
                            <div class="postContent"><p>Quisque elementum nibh at dolor pellentesque, a eleifend libero...</p></div> 
                            <a class="read-more" href="#">Read More <i class="fas fa-long-arrow-alt-right"></i></a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <p style="margin: 0;text-align: center;"><a href="{{store url='blog'}}" class="btn btn-modern btn-lg" style="background-color: #222529;color: #fff;">OUR BLOG</a></p>
        <script type="text/javascript">
            require([
                'jquery',
                'owl.carousel/owl.carousel.min'
            ], function ($) {
                var owl_5 = $("#latest_news").owlCarousel({
                    items: 2,
                    autoplay: true,
                    autoplayTimeout: 5000,
                    autoplayHoverPause: true, 
                    margin: 20,
                    navRewind: true,
                    animateIn: 'fadeIn',
                    animateOut: 'fadeOut',
                    loop: false,
                    nav: false,
                    dots: false,
                    navText: ["<em class='porto-icon-chevron-left'></em>","<em class='porto-icon-chevron-right'></em>"],
                    responsive: {
                        0: {
                            items:1
                        },
                        768: {
                            items:2
                        },
                        992: {
                            items:2
                        },
                        1200: {
                            items:2
                        }
                    }
                });
            });
        </script>
    </div>
</div>
<div class="container" style="padding-top: 32px;padding-bottom: 32px;">
    <div class="brands-slider-section">
        <div id="brands-slider" class="brands-slider" style="text-align: center;">
            <div class="owl-carousel">
                <div class="item"><img class="owl-lazy" data-src="{{media url="wysiwyg/smartwave/porto/homepage/14/slider/brand1.png"}}" alt="" style="display: inline-block;" /></div>
                <div class="item"><img class="owl-lazy" data-src="{{media url="wysiwyg/smartwave/porto/homepage/14/slider/brand2.png"}}" alt="" style="display: inline-block;" /></div>
                <div class="item"><img class="owl-lazy" data-src="{{media url="wysiwyg/smartwave/porto/homepage/14/slider/brand3.png"}}" alt="" style="display: inline-block;" /></div>
                <div class="item"><img class="owl-lazy" data-src="{{media url="wysiwyg/smartwave/porto/homepage/14/slider/brand4.png"}}" alt="" style="display: inline-block;" /></div>
                <div class="item"><img class="owl-lazy" data-src="{{media url="wysiwyg/smartwave/porto/homepage/14/slider/brand5.png"}}" alt="" style="display: inline-block;" /></div>
                <div class="item"><img class="owl-lazy" data-src="{{media url="wysiwyg/smartwave/porto/homepage/14/slider/brand6.png"}}" alt="" style="display: inline-block;" /></div>
            </div>
            <script type="text/javascript">
                require([
                'jquery',
                'owl.carousel/owl.carousel.min'
                ], function ($) {
                    $("#brands-slider .owl-carousel").owlCarousel({
                        autoplay: false,
                        autoplayTimeout: 5000,
                        autoplayHoverPause: true,
                        margin: 0,
                        nav: false,
                        navText: ["<em class='porto-icon-left-open-huge'></em>","<em class='porto-icon-right-open-huge'></em>"],
                        dots: false,
                        loop: false,
                        lazyLoad: true,
                        responsive: {
                            0: {
                                items:2
                            },
                            640: {
                                items:3
                            },
                            768: {
                                items:4
                            },
                            992: {
                                items:5
                            },
                            1200: {
                                items:6
                            }
                        }
                    });
                });
            </script>
        </div>
    </div>
</div>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 2 Old Skin</title>
         <identifier>porto_home_2_old</identifier>
         <content><![CDATA[<style type="text/css">
body.boxed {
    padding: 0;
}
body.boxed .page-wrapper {
    width: 100%;
}
.cms-index-index .page-header.type9 {
    background-color: transparent;
    position: absolute;
    width: 100%;
    left: 0;
    top: 0;
    border-bottom: 1px solid rgba(255,255,255,.25);
}
</style>

<div class="row">
    <div class="col-md-12">
        <h2 style="margin-top:30px;font-size:19px;font-weight:600;margin-bottom:20px;text-align:center;" class="theme-color">NEW ARRIVALS</h2>
        <div id="latest_product" class="hide-addtocart hide-addtolinks">
            {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="latest_product" product_count="10" aspect_ratio="0" image_width="212" image_height="263" template="owl_list.phtml"}}
        </div>
        <script type="text/javascript">
            require([
                'jquery',
                'owl.carousel/owl.carousel.min'
            ], function ($) {
                $("#latest_product .owl-carousel").owlCarousel({
                    autoplay: true,
                    autoplayTimeout: 5000,
                    autoplayHoverPause: true,
                    loop: true,
                    navRewind: true,
                    margin: 10,
                    nav: false,
                    navText: ["<em class='porto-icon-left-open-huge'></em>","<em class='porto-icon-right-open-huge'></em>"],
                    dots: false,
                    responsive: {
                        0: {
                            items:2
                        },
                        768: {
                            items:3
                        },
                        992: {
                            items:4
                        },
                        1200: {
                            items:5
                        }
                    }
                });
            });
        </script>
    </div>
</div>
<div class="row">
    <div class="col-md-12">
        <h2 style="margin-top:30px;font-size:19px;font-weight:600;margin-bottom:20px;text-align:center;" class="theme-color">FROM THE BLOG</h2>
        <div id="latest_news" class="owl-top-narrow">
            <!--{-{block class="Magefan\Blog\Block\Sidebar\Recent" name="blog.home.recent" template="recent_home.phtml"}-}-->
            <div class="recent-posts">
                <div class="owl-carousel">
                    <div class="item">
                        <div class="row">
                            <div class="col-md-5">
                                <div class="post-image">
                                    <img src="{{media url="wysiwyg/smartwave/porto/blog/03.jpg"}}" alt="" />
                                </div>
                            </div>
                            <div class="col-md-7">
                                <div class="post-date">
                                    <span class="day">08</span>
                                    <span class="month">Dec</span>
                                </div>
                                <div class="postTitle">
                                    <h2><a href="#">Post Format – Video</a></h2>
                                </div>
                                <div class="postContent"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras non placerat mi…</p></div>
                                <a class="readmore" href="#">Read more &gt;</a>
                            </div>
                        </div>
                    </div>
                    <div class="item">
                        <div class="row">
                            <div class="col-md-5">
                                <div class="post-image">
                                    <img src="{{media url="wysiwyg/smartwave/porto/blog/04.jpg"}}" alt="" />
                                </div>
                            </div>
                            <div class="col-md-7">
                                <div class="post-date">
                                    <span class="day">08</span>
                                    <span class="month">Dec</span>
                                </div>
                                <div class="postTitle">
                                    <h2><a href="#">Post Format – Image Gallery</a></h2>
                                </div>
                                <div class="postContent"><p>Euismod atras vulputate iltricies etri elit. Class aptent taciti sociosqu ad litora torquent…</p></div>
                                <a class="readmore" href="#">Read more &gt;</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <script type="text/javascript">
                require([
                    'jquery',
                    'owl.carousel/owl.carousel.min'
                ], function ($) {
                    $("#latest_news .owl-carousel").owlCarousel({
                        loop: false,
                        margin: 10,
                        nav: false,
                        navText: ["<em class='porto-icon-left-open-huge'></em>","<em class='porto-icon-right-open-huge'></em>"],
                        dots: false,
                        responsive: {
                            0: {
                                items:1
                            },
                            640: {
                                items:2
                            },
                            768: {
                                items:2
                            },
                            992: {
                                items:2
                            },
                            1200: {
                                items:2
                            }
                        }
                    });
                });
            </script>
        </div>
    </div>
</div>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[<referenceContainer name="page.top">
    <block class="Magento\Cms\Block\Block" name="home_slider">
        <arguments>
            <argument name="block_id" xsi:type="string">porto_homeslider_2_old</argument>
        </arguments>
    </block>
</referenceContainer>]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 3</title>
         <identifier>porto_home_3</identifier>
         <content><![CDATA[<div style="position:relative;">
  <div class="insta-item">
    <div class="row" style="margin-left:-10px;margin-right:-10px;">
    <div class="col-xl-2 col-lg-3 col-sm4 col-6" style="padding-left: 10px;padding-right: 10px;">
      <a class="image-link" href="#" style="margin:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/15/content/inta_img1.jpg"}}" width="178" height="168" alt="" style="width:100%;" /></a>
    </div>
    <div class="col-xl-2 col-lg-3 col-sm4 col-6" style="padding-left: 10px;padding-right: 10px;">
      <a class="image-link" href="#" style="margin:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/15/content/inta_img2.jpg"}}" width="178" height="168" alt="" style="width:100%;" /></a>
    </div>
    <div class="col-xl-2 col-lg-3 col-sm4 col-6" style="padding-left: 10px;padding-right: 10px;">
      <a class="image-link" href="#" style="margin:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/15/content/inta_img3.jpg"}}" width="178" height="168" alt="" style="width:100%;" /></a>
    </div>
    <div class="col-xl-2 col-lg-3 col-sm4 col-6" style="padding-left: 10px;padding-right: 10px;">
      <a class="image-link" href="#" style="margin:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/15/content/inta_img4.jpg"}}" width="178" height="168" alt="" style="width:100%;" /></a>
    </div>
    <div class="col-xl-2 col-lg-3 col-sm4 col-6" style="padding-left: 10px;padding-right: 10px;">
      <a class="image-link" href="#" style="margin:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/15/content/inta_img5.jpg"}}" width="178" height="168" alt="" style="width:100%;" /></a>
    </div>
    <div class="col-xl-2 col-lg-3 col-sm4 col-6" style="padding-left: 10px;padding-right: 10px;">
      <a class="image-link" href="#" style="margin:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/15/content/inta_img6.jpg"}}" width="178" height="168" alt="" style="width:100%;" /></a>
    </div>
    <div class="col-xl-2 col-lg-3 col-sm4 col-6" style="padding-left: 10px;padding-right: 10px;">
      <a class="image-link" href="#" style="margin:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/15/content/inta_img7.jpg"}}" width="178" height="168" alt="" style="width:100%;" /></a>
    </div>
    <div class="col-xl-2 col-lg-3 col-sm4 col-6" style="padding-left: 10px;padding-right: 10px;">
      <a class="image-link" href="#" style="margin:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/15/content/inta_img8.jpg"}}" width="178" height="168" alt="" style="width:100%;" /></a>
    </div>
    <div class="col-xl-2 col-lg-3 col-sm4 col-6" style="padding-left: 10px;padding-right: 10px;">
      <a class="image-link" href="#" style="margin:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/15/content/inta_img9.jpg"}}" width="178" height="168" alt="" style="width:100%;" /></a>
    </div>
    <div class="col-xl-2 col-lg-3 col-sm4 col-6" style="padding-left: 10px;padding-right: 10px;">
      <a class="image-link" href="#" style="margin:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/15/content/inta_img10.jpg"}}" width="178" height="168" alt="" style="width:100%;" /></a>
    </div>
    <div class="col-xl-2 col-lg-3 col-sm4 col-6" style="padding-left: 10px;padding-right: 10px;">
      <a class="image-link" href="#" style="margin:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/15/content/inta_img11.jpg"}}" width="178" height="168" alt="" style="width:100%;" /></a>
    </div>
    <div class="col-xl-2 col-lg-3 col-sm4 col-6" style="padding-left: 10px;padding-right: 10px;">
      <a class="image-link" href="#" style="margin:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/15/content/inta_img12.jpg"}}" width="178" height="168" alt="" style="width:100%;" /></a>
    </div>
    </div>
  </div>
  <div class="insta-follow">
    <i class="fa icon-instagram"></i>
    <h3>Instagram</h3>
    <span>@PORTOECOMMERCE</span>
    <a class="btn btn-default" href="#">Follow</a>
  </div>
</div>
<style type="text/css">
.page-main {
    padding-top: 50px;
    padding-bottom: 10px;
}
.insta-follow {
    position: absolute;
    top: calc(50% - 123px);
    left: calc(50% - 140px);
    background-color:#0e0e0e;
    padding: 30px 40px;
    text-align:center;
    color:#fff;
  }
  .insta-follow i {
      font-size: 24px;
  }
  .insta-follow h3 {
    font-size:48px;
    font-weight:300;
    text-transform: uppercase;
    font-family: 'Oswald';
    color:#fff;
    line-height: 1;
    padding-top:15px;
  }
  .insta-follow span {
      font-size: 15px;
    letter-spacing: 0.05em;
    display: block;
    margin-bottom: 28px;
  }
  .insta-follow .btn-default {
    font-family: 'Oswald';
    border: solid 2px #2c2c2c;
    background-color:#0e0e0e;
    padding: 9px 28px;
    font-size: 14px;
    text-transform:uppercase;
    letter-spacing:0.05em;
    border-radius:2px;
    box-shadow: none;
    font-weight: 400;
    margin-bottom: 5px;
    color: #fff;
  }
</style>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[<referenceContainer name="page.top">
    <block class="Magento\Cms\Block\Block" name="home_slider">
        <arguments>
            <argument name="block_id" xsi:type="string">porto_homeslider_3</argument>
        </arguments>
    </block>
</referenceContainer>]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 3 Old Skin</title>
         <identifier>porto_home_3_old</identifier>
         <content><![CDATA[<style type="text/css">
.columns .column.main {
    padding-bottom: 0;
}
.page-main {
    padding-top: 8px;
    padding-bottom: 8px;
}
</style>
<div class="row" style="margin-left:-8px;margin-right:-8px;">
    <div class="col-md-4" style="margin:8px 0;padding-left: 8px;padding-right: 8px;">
        <div style="background-color:#2b262f;position:relative;">
            <img src="{{media url="wysiwyg/smartwave/porto/homepage/15/content/blank.png"}}" alt="" style="width:100%;max-height:480px;">
            <div class="img-desc-home15" style="position:absolute;top:50%;width:100%;font-family:Georgia;">
                <h3 style="color:#f2f4f3;font-weight:400;line-height:1;">The Wedding Day</h3>
                <hr style="margin:15px 0;border-color:#ada4b5;">
                <p style="color:#ada4b5;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean a arcu lacinia, ornare lorem maximus, consequat mauris. Nam vitae risus at leo convallis sagittis.</p>
                <a href="#" style="color:#fff;">SHOP NOW</a>
            </div>
        </div>
    </div>
    <div class="col-md-8" style="margin:8px 0;padding-left: 8px;padding-right: 8px;">
        <a href="#" class="image-link">
            <img src="{{media url="wysiwyg/smartwave/porto/homepage/15/content/image_link_new_1.jpg"}}" alt="" style="width:100%;">
        </a>
    </div>
</div>
<div class="row" style="margin-left:-8px;margin-right:-8px;">
    <div class="col-md-8" style="margin:8px 0;padding-left: 8px;padding-right: 8px;">
        <a href="#" class="image-link">
            <img src="{{media url="wysiwyg/smartwave/porto/homepage/15/content/image_link_new_2.jpg"}}" alt="" style="width:100%;">
        </a>
    </div>
    <div class="col-md-4" style="margin:8px 0;padding-left: 8px;padding-right: 8px;">
        <div style="background-color:#b7a788;position:relative;">
            <img src="{{media url="wysiwyg/smartwave/porto/homepage/15/content/blank.png"}}" alt="" style="width:100%;max-height:480px;">
            <div class="img-desc-home15" style="position:absolute;top:50%;width:100%;font-family:Georgia;">
                <h3 style="color:#2b262e;font-weight:400;line-height:1;">Valentine’s Day</h3>
                <hr style="margin:15px 0;border-color:#564a34;">
                <p style="color:#564a34;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean a arcu lacinia, ornare lorem maximus, consequat mauris. Nam vitae risus at leo convallis sagittis.</p>
                <a href="#" style="color:#2b262f;">SHOP NOW</a>
            </div>
        </div>
    </div>
</div>
<div class="row" style="margin-left:-8px;margin-right:-8px;">
    <div class="col-lg-3 col-md-6 col-6" style="padding-left: 8px;padding-right: 8px;">
        <a class="image-link" href="#" style="margin:8px 0;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/15/content/image_link_new_3.jpg"}}" alt="" style="width:100%;"></a>
    </div>
    <div class="col-lg-3 col-md-6 col-6 lg-order-12" style="padding-left: 8px;padding-right: 8px;">
        <a class="image-link" href="#" style="margin:8px 0;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/15/content/image_link_new_5.jpg"}}" alt="" style="width:100%;"></a>
    </div>
    <div class="col-lg-6 col-md-12 col-12" style="padding-left: 8px;padding-right: 8px;">
        <a class="image-link" href="#" style="margin:8px 0;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/15/content/image_link_new_4.jpg"}}" alt="" style="width:100%;"></a>
    </div>
</div>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[<referenceContainer name="page.top">
    <block class="Magento\Cms\Block\Block" name="home_slider">
        <arguments>
            <argument name="block_id" xsi:type="string">porto_homeslider_3_old</argument>
        </arguments>
    </block>
</referenceContainer>]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 4</title>
         <identifier>porto_home_4</identifier>
         <content><![CDATA[<h2 class="filterproduct-title" style="margin-top:30px;"><span class="content"><strong>Featured Products</strong></span></h2>
<div id="new_product" class="owl-top-narrow">
    {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="latest_product" product_count="10" aspect_ratio="0" image_width="300" image_height="300" product_type="3" template="owl_list.phtml"}}
</div>
<script type="text/javascript">
    require([
        'jquery',
        'owl.carousel/owl.carousel.min'
    ], function ($) {
        $("#new_product .owl-carousel").owlCarousel({
            autoplay: true,
            autoplayTimeout: 5000,
            autoplayHoverPause: true,
            margin: 0,
            nav: false,
            navText: ["<em class='porto-icon-left-open-huge'></em>","<em class='porto-icon-right-open-huge'></em>"],
            dots: true,
            navRewind: true,
            animateIn: 'fadeIn',
            animateOut: 'fadeOut',
            loop: true,
            responsive: {
                0: {
                    items:2
                },
                768: {
                    items:3
                },
                992: {
                    items:4
                },
                1200: {
                    items:5
                }
            }
        });
    });
</script>


<style>
  .page-main { 
    background-color: #f4f4f4;
    margin-top: 48px;
    padding-bottom:20px;
    max-width: 100%;
  }
  .columns {
    display: block;
    max-width: 1140px;
    margin: 0 auto;
    padding: 0 15px;
  }
</style>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[<referenceContainer name="page.top">
    <block class="Magento\Cms\Block\Block" name="home_slider">
        <arguments>
            <argument name="block_id" xsi:type="string">porto_homeslider_4</argument>
        </arguments>
    </block>
</referenceContainer>]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 4 Old Skin</title>
         <identifier>porto_home_4_old</identifier>
         <content><![CDATA[<h2 class="filterproduct-title" style="margin-top:30px;"><span class="content"><strong>Galaxy phones Just Arrived</strong></span></h2>
<div id="new_product" class="owl-top-narrow">
    {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="latest_product" product_count="10" aspect_ratio="0" image_width="250" image_height="250" template="owl_list.phtml"}}
</div>
<script type="text/javascript">
    require([
        'jquery',
        'owl.carousel/owl.carousel.min'
    ], function ($) {
        $("#new_product .owl-carousel").owlCarousel({
            autoplay: true,
            autoplayTimeout: 5000,
            autoplayHoverPause: true,
            margin: 10,
            nav: true,
            navText: ["<em class='porto-icon-left-open-huge'></em>","<em class='porto-icon-right-open-huge'></em>"],
            dots: false,
            navRewind: true,
            animateIn: 'fadeIn',
            animateOut: 'fadeOut',
            loop: true,
            responsive: {
                0: {
                    items:2
                },
                768: {
                    items:3
                },
                992: {
                    items:4
                },
                1200: {
                    items:5
                }
            }
        });
    });
</script>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[<referenceContainer name="page.top">
    <block class="Magento\Cms\Block\Block" name="home_slider">
        <arguments>
            <argument name="block_id" xsi:type="string">porto_homeslider_4_old</argument>
        </arguments>
    </block>
</referenceContainer>]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 5</title>
         <identifier>porto_home_5</identifier>
         <content><![CDATA[<style type="text/css">
.page-main {
padding: 0;
}
.columns .column.main {
    padding: 0;
    min-height: auto;
}
</style>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[<referenceContainer name="page.top">
    <block class="Magento\Cms\Block\Block" name="home_slider">
        <arguments>
            <argument name="block_id" xsi:type="string">porto_homeslider_5</argument>
        </arguments>
    </block>
</referenceContainer>]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 5 Old Skin</title>
         <identifier>porto_home_5_old</identifier>
         <content><![CDATA[<h2 class="filterproduct-title" style="margin:0 0 10px;"><span class="content"><strong>Featured Brands</strong></span></h2>
<div id="brands-slider-demo-1" class="brands-slider">
    <div class="owl-carousel">
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand1.png"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand2.png"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand3.png"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand4.png"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand5.png"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand1.png"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand2.png"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand3.png"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand4.png"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand5.png"}}" alt="" /></div>
    </div>
    <script type="text/javascript">
        require([
            'jquery',
            'owl.carousel/owl.carousel.min'
        ], function ($) {
            $("#brands-slider-demo-1 .owl-carousel").owlCarousel({
                autoplay: true,
                autoplayTimeout: 5000,
                autoplayHoverPause: true,
                margin: 30,
                nav: false,
                dots: true,
                loop: true,
                responsive: {
                    0: {
                        items:2
                    },
                    640: {
                        items:3
                    },
                    768: {
                        items:4
                    },
                    992: {
                        items:5
                    },
                    1200: {
                        items:6
                    }
                }
            });
        });
    </script>
</div>
<h2 class="filterproduct-title" style="margin-top:40px;margin-bottom: 5px;"><span class="content"><strong>FROM THE BLOG</strong></span></h2>
<div id="latest_news" class="owl-top-narrow">
    <div class="recent-posts">
        <div class="owl-carousel">
            <div class="item">
                <div class="row">
                    <div class="col-md-5">
                        <div class="post-image">
                            <img src="{{media url="wysiwyg/smartwave/porto/blog/03.jpg"}}" alt="" />
                        </div>
                    </div>
                    <div class="col-md-7">
                        <div class="post-date">
                            <span class="day">08</span>
                            <span class="month">Dec</span>
                        </div>
                        <div class="postTitle">
                            <h2><a href="#">Post Format – Video</a></h2>
                        </div>
                        <div class="postContent"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras non placerat mi…</p></div>
                        <a class="readmore" href="#">Read more &gt;</a>
                    </div>
                </div>
            </div>
            <div class="item">
                <div class="row">
                    <div class="col-md-5">
                        <div class="post-image">
                            <img src="{{media url="wysiwyg/smartwave/porto/blog/04.jpg"}}" alt="" />
                        </div>
                    </div>
                    <div class="col-md-7">
                        <div class="post-date">
                            <span class="day">08</span>
                            <span class="month">Dec</span>
                        </div>
                        <div class="postTitle">
                            <h2><a href="#">Post Format – Image Gallery</a></h2>
                        </div>
                        <div class="postContent"><p>Euismod atras vulputate iltricies etri elit. Class aptent taciti sociosqu ad litora torquent…</p></div>
                        <a class="readmore" href="#">Read more &gt;</a>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script type="text/javascript">
        require([
            'jquery',
            'owl.carousel/owl.carousel.min'
        ], function ($) {
            $("#latest_news .owl-carousel").owlCarousel({
                loop: false,
                margin: 10,
                nav: true,
                navText: ["<em class='porto-icon-left-open-huge'></em>","<em class='porto-icon-right-open-huge'></em>"],
                dots: false,
                responsive: {
                    0: {
                        items:1
                    },
                    640: {
                        items:2
                    },
                    768: {
                        items:2
                    },
                    992: {
                        items:2
                    },
                    1200: {
                        items:2
                    }
                }
            });
        });
    </script>
</div>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[<referenceContainer name="page.top">
    <block class="Magento\Cms\Block\Block" name="home_slider">
        <arguments>
            <argument name="block_id" xsi:type="string">porto_homeslider_5_old</argument>
        </arguments>
    </block>
</referenceContainer>]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 6</title>
         <identifier>porto_home_6</identifier>
         <content><![CDATA[<div class="row" style="margin: 0 -10px;">
  <div class="col-lg-3" style="padding: 0 10px;">
    <div class="home-side-menu">
      <h2 class="side-menu-title">CATEGORIES</h2>
      {{block class="Smartwave\Megamenu\Block\Topmenu" name="sw.sidenav" template="Smartwave_Megamenu::sidemenu.phtml" ttl="3600"}}
    </div>
  </div>
  <div class="col-lg-9" style="padding: 0 10px;">
    <div id="banner-slider-demo-9" class="owl-carousel owl-banner-carousel owl-bottom-narrow" style="margin-bottom:20px;">
      <div class="item" style="background:url({{media url="wysiwyg/smartwave/porto/homepage/09/content/01_bg.jpg"}}) center center no-repeat;background-size:cover;border-radius:2px;">
        <div style="position:relative">
          <img src="{{media url="wysiwyg/smartwave/porto/homepage/09/content/02.png"}}" alt="" />
          <div class="content content-slide-1" style="position:absolute;z-index:1;top:23%;left:8%;text-align:left;">
            <span style="color: #fff;font-size:18px;">Up to <b style="font-size:26px;font-family:'Oswald';">60%</b> off</span>
            <h2 style="color: #fff;">Sunglasses</h2>
            <p style="font-size:14px;color:#fff;font-weight:300;">Limited items available at this price.</p>
            <a href="{{config path="web/unsecure/base_url"}}fashion.html" class="btn btn-default" style="background-color:#010204;color:#fff;font-family:'Oswald';font-size:14px;letter-spacing:0.025em;font-weight:400;">shop now</a>
          </div>
        </div>
      </div>
      <div class="item" style="background:url({{media url="wysiwyg/smartwave/porto/homepage/09/content/02_bg.jpg"}}) center center no-repeat;background-size:cover;border-radius:2px;">
        <div style="position:relative">
          <img src="{{media url="wysiwyg/smartwave/porto/homepage/09/content/02.png"}}" alt="" />
          <div class="content content-slide-2" style="position:absolute;z-index:1;top:23%;left:8%;text-align:left;">
            <span style="color: #2c373c;font-size:18px;">OVER <b style="font-size:26px;font-family:'Oswald';">200+</b></span>
            <h2 style="color: #2c373c;">GREAT DEALS</h2>
            <p style="font-size:14px;color:#585b5f;font-weight:300;">While they last!</p>
            <a href="{{config path="web/unsecure/base_url"}}electronics.html" class="btn btn-default" style="background-color:#010204;color:#fff;font-family:'Oswald';font-size:14px;letter-spacing:0.025em;font-weight:400;">shop now</a>
          </div>
        </div>
      </div>
      <div class="item" style="background:url({{media url="wysiwyg/smartwave/porto/homepage/09/content/03_bg.jpg"}}) center center no-repeat;background-size:cover;border-radius:2px;">
        <div style="position:relative">
          <img src="{{media url="wysiwyg/smartwave/porto/homepage/09/content/02.png"}}" alt="" />
          <div class="content content-slide-3" style="position:absolute;z-index:1;top:23%;left:8%;text-align:left;">
            <span style="color: #2c373c;font-size:18px;">up to <b style="font-size:26px;font-family:'Oswald';">40%</b> off</span>
            <h2 style="color: #2c373c;">NEW ARRIVALS</h2>
            <p style="font-size:14px;color:#585b5f;font-weight:300;">Starting at $9</p>
            <a href="{{config path="web/unsecure/base_url"}}motors.html" class="btn btn-default" style="background-color:#010204;color:#fff;font-family:'Oswald';font-size:14px;letter-spacing:0.025em;font-weight:400;">shop now</a>
          </div>
        </div>
      </div>
    </div>
    <script type="text/javascript">
      require([
        'jquery',
        'owl.carousel/owl.carousel.min'
      ], function ($) {
        $("#banner-slider-demo-9").owlCarousel({
          items: 1,
          autoplay: true,
          autoplayTimeout: 5000,
          autoplayHoverPause: true,
          dots: true,
          nav: false,
          navRewind: true,
          animateIn: 'fadeIn',
          animateOut: 'fadeOut',
          loop: true
        });
      });
    </script>
  </div>
</div>
<div class="row" style="margin: 0 -10px;">
  <div class="col-lg-3" style="padding: 0 10px;">
    <div id="ads-slider-demo-9" class="owl-carousel">
      <div class="item" style="text-align:center;">
        <img src="{{media url="wysiwyg/smartwave/porto/homepage/09/content/ad1n.jpg"}}" alt="" style="display:inline-block;"/>
      </div>
      <div class="item" style="text-align:center;">
        <img src="{{media url="wysiwyg/smartwave/porto/homepage/09/content/ad1n.jpg"}}" alt="" style="display:inline-block;" />
      </div>
      <div class="item" style="text-align:center;">
        <img src="{{media url="wysiwyg/smartwave/porto/homepage/09/content/ad1n.jpg"}}" alt="" style="display:inline-block;" />
      </div>
    </div>
    <script type="text/javascript">
      require([
        'jquery',
        'owl.carousel/owl.carousel.min'
      ], function ($) {
        $("#ads-slider-demo-9").owlCarousel({
          items: 1,
          autoplay: true,
          autoplayTimeout: 5000,
          autoplayHoverPause: true,
          dots: true,
          nav: false,
          navRewind: true,
          animateIn: 'fadeIn',
          animateOut: 'fadeOut',
          loop: true
        });
      });
    </script>
    <div class="block block-subscribe home-sidebar-block" style="margin-top:20px;margin-bottom:20px;">
      <div class="block-title">
        <strong><span>NEWSLETTER</span></strong>
      </div>
      <div class="block-content">
        <p>Get all the latest information on Events, Sales and Offers.</p>
        {{block class="Magento\Newsletter\Block\Subscribe" name="home.newsletter" template="subscribe_form.phtml"}}
      </div>
    </div> 
    <div id="testimonials-slider-demo-9" class="owl-carousel">
      <div class="item">
        <div class="testimonial-author">
          <div class="img-thumbnail img-thumbnail-small"><img width="60" height="60" src="{{media url="wysiwyg/smartwave/porto/testimonials/client-1-11.jpg"}}" alt=""/></div>
          <p><strong>John Smith</strong><span>CEO &amp; Founder - Okler</span></p>
        </div>
        <blockquote class="testimonial">
          <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec hendrerit vehicula est.</p>
        </blockquote> 
      </div>
      <div class="item">
        <div class="testimonial-author">
          <div class="img-thumbnail img-thumbnail-small"><img width="60" height="60" src="{{media url="wysiwyg/smartwave/porto/testimonials/client-1-11.jpg"}}" alt=""/></div>
          <p><strong>John Smith</strong><span>CEO &amp; Founder - Okler</span></p>
        </div>
        <blockquote class="testimonial">
          <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec hendrerit vehicula est.</p>
        </blockquote> 
      </div>
    </div>
    <script type="text/javascript">
      require([
        'jquery',
        'owl.carousel/owl.carousel.min'
      ], function ($) {
        $("#testimonials-slider-demo-9").owlCarousel({
          items: 1,
          autoplay: true,
          autoplayTimeout: 5000,
          autoplayHoverPause: true,
          dots: true,
          nav: false,
          navRewind: true,
          animateIn: 'fadeIn',
          animateOut: 'fadeOut',
          loop: true
        });
      });
    </script> 
    <div id="latest_news" class="custom-block">
      <div class="recent-posts">
        <div class="owl-carousel">
          <div class="item">
            <div class="row"> 
              <div class="col-md-12">
                <div class="post-date">
                  <span class="long-date">08-Dec-2014</span>
                </div> 
                <div class="postTitle">
                  <h2><a href="#">Post Format – Video</a></h2>
                </div>
                <div class="postContent"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras non placerat mi…</p></div>
                <a class="readmore" href="#">Read more &gt;</a>
              </div>
            </div>
          </div>
          <div class="item">
            <div class="row"> 
              <div class="col-md-12">
                <div class="post-date">
                  <span class="long-date">08-Dec-2014</span>
                </div> 
                <div class="postTitle">
                  <h2><a href="#">Post Format – Image Gallery</a></h2>
                </div>
                <div class="postContent"><p>Euismod atras vulputate iltricies etri elit. Class aptent taciti sociosqu ad litora torquent…</p></div>
                <a class="readmore" href="#">Read more &gt;</a>
              </div>
            </div>
          </div>
        </div>
      </div>
      <script type="text/javascript">
        require([
          'jquery',
          'owl.carousel/owl.carousel.min'
        ], function ($) {
          $("#latest_news .owl-carousel").owlCarousel({
            items: 1,
            loop: true,
            nav: false,
            dots: true
          });
        });
      </script>
      <style type="text/css">.recent-posts .item .col-md-5, .recent-posts .item .col-md-7{width:100%;}</style>
    </div>
  </div>
  <div class="col-lg-9" style="padding: 0 10px;">
    <div class="single-images">
      <div class="row" style="margin-left:-10px;margin-right:-10px;">
        <div class="col-md-4" style="padding-left:10px;padding-right:10px;padding-bottom:15px;">
          <a class="image-link" href="#">
            <img src="{{media url="wysiwyg/smartwave/porto/homepage/09/content/img1.jpg"}}" alt="" />
          </a>
        </div>
        <div class="col-md-4" style="padding-left:10px;padding-right:10px;padding-bottom:15px;">
          <a class="image-link" href="#">
            <img src="{{media url="wysiwyg/smartwave/porto/homepage/09/content/img2.jpg"}}" alt="" />
          </a>
        </div>
        <div class="col-md-4" style="padding-left:10px;padding-right:10px;padding-bottom:15px;">
          <a class="image-link" href="#">
            <img src="{{media url="wysiwyg/smartwave/porto/homepage/09/content/img3.jpg"}}" alt="" />
          </a>
        </div>
      </div>
    </div>
    <h2 class="filterproduct-title"><span class="content"><strong>FEATURED ITEMS</strong></span></h2>
    <div id="featured_product" class="owl-top-narrow">
      {{block class="Smartwave\Filterproducts\Block\Home\FeaturedList" name="featured_product" product_count="10" aspect_ratio="1" image_width="200" product_type="1" template="owl_list.phtml"}}
    </div>
    <script type="text/javascript">
      require([
        'jquery',
        'owl.carousel/owl.carousel.min'
      ], function ($) {
        $("#featured_product .owl-carousel").owlCarousel({
          autoplay: true,
          autoplayTimeout: 5000,
          autoplayHoverPause: true,
          loop: true,
          navRewind: true,
          margin: 0,
          nav: false,
          navText: ["<em class='porto-icon-left-open-huge'></em>","<em class='porto-icon-right-open-huge'></em>"],
          dots: true,
          responsive: {
            0: {
              items:2
            },
            768: {
              items:3
            },
            992: {
              items:3
            },
            1200: {
              items:4
            }
          }
        });
      });
    </script>
    <div class="row">
      <div class="col-md-4">
        <h2 class="filterproduct-title" style="background-image:none;margin-top:20px;margin-bottom:5px;"><span class="content"><strong>New</strong></span></h2>
        {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="latest_small_list" product_count="3" aspect_ratio="0" image_width="212" image_height="212" template="small_list.phtml"}}
      </div>
      <div class="col-md-4">
        <h2 class="filterproduct-title" style="background-image:none;margin-top:20px;margin-bottom:5px;"><span class="content"><strong>Hot</strong></span></h2>
        {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="latest_small_list" product_count="3" aspect_ratio="0" image_width="212" image_height="212" template="small_list.phtml"}}
      </div>
      <div class="col-md-4">
        <h2 class="filterproduct-title" style="background-image:none;margin-top:20px;margin-bottom:5px;"><span class="content"><strong>Sale</strong></span></h2>
        {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="latest_small_list" product_count="3" aspect_ratio="0" image_width="212" image_height="212" template="small_list.phtml"}}
      </div>
    </div>
    <div class="shop-features" style="background-color:#fff; margin-top:13px;"> 
      <div class="row">
        <div class="col-md-4" style="margin-bottom: 10px;">
          <em class="porto-icon-star"></em>
          <h3>DEDICATED SERVICE</h3>
          <p>Consult our specialists for help with an order, customization, or design advice.</p>
          <a href="#">Get in Touch</a>
        </div>
        <div class="col-md-4" style="margin-bottom: 10px;">
          <em class="porto-icon-reply"></em>
          <h3>FREE RETURNS</h3>
          <p>We stand behind our goods and services and want you to be satisfied with them.</p>
          <a href="#">Returns Policy</a>
        </div>
        <div class="col-md-4" style="margin-bottom: 10px;">
          <em class="porto-icon-paper-plane"></em>
          <h3>INTERNATIONAL SHIPPING</h3>
          <p>Currently over 50 countries qualify for express international shipping.</p>
          <a href="#">Learn More</a>
        </div>
      </div>
    </div>
  </div>
</div>
<style type="text/css">
  #banner-slider-demo-9 img {width:100%;}
  #banner-slider-demo-9 .content h2 {
    font-size: 44px;
    font-weight: 900;
    letter-spacing: -0.025em;
    text-transform: uppercase;
    line-height: 38px;
    margin-bottom: 10px;
    margin-top:0;
  }
  #banner-slider-demo-9 .content span {
    font-size:18px;
    line-height:38px;
    font-weight: 700;
    text-transform:uppercase;
  }
  #banner-slider-demo-9 .content p {
    font-size:14px;
    font-weight:300;
    margin-bottom:10;
  }
  #banner-slider-demo-9 .content .btn-default {
    font-size: 14px;
    line-height: 25px;
    letter-spacing: 0.025em;
    padding: 10px 34px;
    border-radius:3px;
    background-color: #010204;
    color: #fff;
    font-family: 'Oswald';
    text-transform: uppercase; 
    margin-top: 28px;
  } 
  #testimonials-slider-demo-9 {
    border: solid 2px #0188cc;
    border-radius: 2px;
  }
  @media (min-width: 768px) {
    .page-header .nav-sections {
      display: none;
    }
    h2.side-menu-title {
      padding: 16px 25px;
    }
.sw-megamenu.navigation.side-megamenu li.level0 > a {
    margin: 0 20px;
    line-height: 42px;
    font-weight: 600;
}
  }
  @media (max-width: 767px) {
    #banner-slider-demo-9 img {width:100%;height:100%;}
    #banner-slider-demo-9 .owl-controls {
      display:none !important;
    }
    #banner-slider-demo-9 .content {
      top:15% !important;
    }
    #banner-slider-demo-9 .content h2 {
      font-size: 24px; 
      line-height: 1;
      margin-bottom: 5px;
    }
    #banner-slider-demo-9 .content span {
      font-size: 11px !important;
      line-height: 23px; 
    }
    #banner-slider-demo-9 .content span b {
      font-size: 15px !important;
    }
    #banner-slider-demo-9 .content p {
      font-size: 11px !important; 
      margin-bottom: 10px;
    }
    #banner-slider-demo-9 .content .btn-default {
      font-size: 10px !important;
      line-height: 20px; 
      padding: 3px 13px;
      border-radius: 3px; 
      margin-top: 0px;
    } 
  }
</style>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[<referenceContainer name="page.top">
    <block class="Magento\Cms\Block\Block" name="home_slider">
        <arguments>
            <argument name="block_id" xsi:type="string">porto_homeslider_6</argument>
        </arguments>
    </block>
</referenceContainer>]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 6 Old Skin</title>
         <identifier>porto_home_6_old</identifier>
         <content><![CDATA[<div class="homepage-bar" style="border:1px solid #e1e1e1;border-radius:5px;margin:0 0 20px 0;">
    <div class="row">
        <div class="col-lg-4" style="text-align:center;height:70px;padding-top:10px;padding-bottom:10px;">
            <em class="porto-icon-truck" style="font-size:36px;"></em><div class="text-area"><h3>FREE SHIPPING & RETURN</h3><p>Free shipping on all orders over $99.</p></div>
        </div>
        <div class="col-lg-4" style="text-align:center;height:70px;padding-top:10px;padding-bottom:10px;">
            <em class="porto-icon-dollar"></em><div class="text-area"><h3>MONEY BACK GUARANTEE</h3><p>100% money back guarantee.</p></div>
        </div>
        <div class="col-lg-4" style="text-align:center;height:70px;padding-top:10px;padding-bottom:10px;">
            <em class="porto-icon-lifebuoy" style="font-size:32px;"></em><div class="text-area"><h3>ONLINE SUPPORT 24/7</h3><p>Lorem ipsum dolor sit amet.</p></div>
        </div>
    </div>
</div>
<div class="row" style="margin: 0 -10px;">
    <div class="col-lg-3" style="padding: 0 10px;">
        <div class="home-side-menu">
            <h2 class="side-menu-title">CATEGORIES</h2>
            {{block class="Smartwave\Megamenu\Block\Topmenu" name="sw.sidenav" template="Smartwave_Megamenu::sidemenu.phtml" ttl="3600"}}
        </div>
    </div>
    <div class="col-lg-9" style="padding: 0 10px;">
        <div id="banner-slider-demo-9" class="owl-carousel owl-banner-carousel owl-bottom-narrow" style="margin-bottom:20px;">
            <div class="item" style="background:url({{media url="wysiwyg/smartwave/porto/homepage/09/content/01_bg.png"}}) repeat;border-radius:5px;">
                <div style="position:relative">
                    <img src="{{media url="wysiwyg/smartwave/porto/homepage/09/content/01.png"}}" alt="" />
                    <div class="content type1" style="position:absolute;top:30%;left:10%;text-align:right">
                        <h2 style="font-weight:600;line-height:1;color:#08c">HUGE <b style="font-weight:800">SALE</b></h2>
                        <p style="color:#777;font-weight:300;line-height:1;margin-bottom:15px">Now starting at <span style="color:#535353;font-weight:400">$99</span></p>
                        <a href="#" style="font-weight:300;">Shop now &gt;</a>
                    </div>
                </div>
            </div>
            <div class="item" style="background:url({{media url="wysiwyg/smartwave/porto/homepage/09/content/02_bg.png"}}) center center no-repeat;background-size:cover;border-radius:5px;">
                <div style="position:relative">
                    <img src="{{media url="wysiwyg/smartwave/porto/homepage/09/content/02.png"}}" alt="" />
                </div>
            </div>
            <div class="item" style="background:url({{media url="wysiwyg/smartwave/porto/homepage/09/content/03_bg.png"}}) center center no-repeat;background-size:cover;border-radius:5px;">
                <div style="position:relative">
                    <img src="{{media url="wysiwyg/smartwave/porto/homepage/09/content/03.png"}}" alt="" />
                </div>
            </div>
        </div>
        <script type="text/javascript">
            require([
                'jquery',
                'owl.carousel/owl.carousel.min'
            ], function ($) {
                $("#banner-slider-demo-9").owlCarousel({
                    items: 1,
                    autoplay: true,
                    autoplayTimeout: 5000,
                    autoplayHoverPause: true,
                    dots: true,
                    nav: false,
                    navRewind: true,
                    animateIn: 'fadeIn',
                    animateOut: 'fadeOut',
                    loop: true
                });
            });
        </script>
    </div>
</div>
<div class="row" style="margin: 0 -10px;">
    <div class="col-lg-3" style="padding: 0 10px;">
        <div id="ads-slider-demo-9" class="owl-carousel">
            <div class="item" style="text-align:center;">
                <img src="{{media url="wysiwyg/smartwave/porto/homepage/09/content/ad2.png"}}" alt="" style="display:inline-block;"/>
            </div>
            <div class="item" style="text-align:center;">
                <img src="{{media url="wysiwyg/smartwave/porto/homepage/09/content/ad1.png"}}" alt="" style="display:inline-block;" />
            </div>
            <div class="item" style="text-align:center;">
                <img src="{{media url="wysiwyg/smartwave/porto/homepage/09/content/ad2.png"}}" alt="" style="display:inline-block;" />
            </div>
        </div>
        <script type="text/javascript">
            require([
                'jquery',
                'owl.carousel/owl.carousel.min'
            ], function ($) {
                $("#ads-slider-demo-9").owlCarousel({
                    items: 1,
                    autoplay: true,
                    autoplayTimeout: 5000,
                    autoplayHoverPause: true,
                    dots: true,
                    nav: false,
                    navRewind: true,
                    animateIn: 'fadeIn',
                    animateOut: 'fadeOut',
                    loop: true
                });
            });
        </script>
        <div class="block block-subscribe home-sidebar-block" style="margin-top:40px;margin-bottom:30px;">
            <div class="block-title">
                <strong><span>Be the First to Know</span></strong>
            </div>
            <div class="block-content">
                <p>Keep up on our always evolving product features and technology.<br>Enter your e-mail and subscribe to our newsletter.</p>
                {{block class="Magento\Newsletter\Block\Subscribe" name="home.newsletter" template="subscribe_form.phtml"}}
            </div>
        </div>
        <h2 class="filterproduct-title" style="margin-top:40px;margin-bottom: 5px;"><span class="content"><strong>TESTIMONIALS</strong></span></h2>
        <div id="testimonials-slider-demo-9" class="owl-carousel">
            <div class="item">
                <blockquote class="testimonial">
                    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec hendrerit vehicula est.</p>
                </blockquote>
                <div class="testimonial-arrow-down"></div>
                <div class="testimonial-author">
                    <div class="img-thumbnail img-thumbnail-small"><img width="60" height="60" src="{{media url="wysiwyg/smartwave/porto/testimonials/client-1-11.jpg"}}" alt=""></div>
                    <p><strong>John Smith</strong><span>CEO &amp; Founder - Okler</span></p>
                </div>
            </div>
            <div class="item">
                <blockquote class="testimonial">
                    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec hendrerit vehicula est.</p>
                </blockquote>
                <div class="testimonial-arrow-down"></div>
                <div class="testimonial-author">
                    <div class="img-thumbnail img-thumbnail-small"><img width="60" height="60" src="{{media url="wysiwyg/smartwave/porto/testimonials/client-1-11.jpg"}}" alt=""></div>
                    <p><strong>John Smith</strong><span>CEO &amp; Founder - Okler</span></p>
                </div>
            </div>
        </div>
        <script type="text/javascript">
            require([
                'jquery',
                'owl.carousel/owl.carousel.min'
            ], function ($) {
                $("#testimonials-slider-demo-9").owlCarousel({
                    items: 1,
                    autoplay: true,
                    autoplayTimeout: 5000,
                    autoplayHoverPause: true,
                    dots: true,
                    nav: false,
                    navRewind: true,
                    animateIn: 'fadeIn',
                    animateOut: 'fadeOut',
                    loop: true
                });
            });
        </script>
        <h2 class="filterproduct-title" style="margin-top:40px;margin-bottom: 5px;"><span class="content"><strong>FROM THE BLOG</strong></span></h2>
        <div id="latest_news" class="custom-block">
            <div class="recent-posts">
                <div class="owl-carousel">
                    <div class="item">
                        <div class="row">
                            <div class="col-md-5">
                                <div class="post-image">
                                    <img src="{{media url="wysiwyg/smartwave/porto/blog/03.jpg"}}" alt="" />
                                </div>
                            </div>
                            <div class="col-md-7">
                                <div class="post-date">
                                    <span class="day">08</span>
                                    <span class="month">Dec</span>
                                </div>
                                <div class="postTitle">
                                    <h2><a href="#">Post Format – Video</a></h2>
                                </div>
                                <div class="postContent"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras non placerat mi…</p></div>
                                <a class="readmore" href="#">Read more &gt;</a>
                            </div>
                        </div>
                    </div>
                    <div class="item">
                        <div class="row">
                            <div class="col-md-5">
                                <div class="post-image">
                                    <img src="{{media url="wysiwyg/smartwave/porto/blog/04.jpg"}}" alt="" />
                                </div>
                            </div>
                            <div class="col-md-7">
                                <div class="post-date">
                                    <span class="day">08</span>
                                    <span class="month">Dec</span>
                                </div>
                                <div class="postTitle">
                                    <h2><a href="#">Post Format – Image Gallery</a></h2>
                                </div>
                                <div class="postContent"><p>Euismod atras vulputate iltricies etri elit. Class aptent taciti sociosqu ad litora torquent…</p></div>
                                <a class="readmore" href="#">Read more &gt;</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <script type="text/javascript">
                require([
                    'jquery',
                    'owl.carousel/owl.carousel.min'
                ], function ($) {
                    $("#latest_news .owl-carousel").owlCarousel({
                        items: 1,
                        loop: true,
                        nav: false,
                        dots: true
                    });
                });
            </script>
            <style type="text/css">.recent-posts .item .col-md-5, .recent-posts .item .col-md-7{width:100%;}</style>
        </div>
    </div>
    <div class="col-lg-9" style="padding: 0 10px;">
        <div class="single-images" style="padding-top: 15px;">
            <div class="row" style="margin-left:-10px;margin-right:-10px;">
                <div class="col-md-4" style="padding-left:10px;padding-right:10px;padding-bottom:15px;">
                    <a class="image-link" href="#">
                        <img src="{{media url="wysiwyg/smartwave/porto/homepage/09/content/img1_old.jpg"}}" alt="" />
                    </a>
                </div>
                <div class="col-md-4" style="padding-left:10px;padding-right:10px;padding-bottom:15px;">
                    <a class="image-link" href="#">
                        <img src="{{media url="wysiwyg/smartwave/porto/homepage/09/content/img2_old.jpg"}}" alt="" />
                    </a>
                </div>
                <div class="col-md-4" style="padding-left:10px;padding-right:10px;padding-bottom:15px;">
                    <a class="image-link" href="#">
                        <img src="{{media url="wysiwyg/smartwave/porto/homepage/09/content/img3_old.jpg"}}" alt="" />
                    </a>
                </div>
             </div>
        </div>
        <h2 class="filterproduct-title"><span class="content"><strong>FEATURED FASHION DRESS</strong></span></h2>
        <div id="featured_product" class="owl-top-narrow">
            {{block class="Smartwave\Filterproducts\Block\Home\FeaturedList" name="featured_product" product_count="10" aspect_ratio="0" image_width="212" image_height="263" template="owl_list.phtml"}}
        </div>
        <script type="text/javascript">
            require([
                'jquery',
                'owl.carousel/owl.carousel.min'
            ], function ($) {
                $("#featured_product .owl-carousel").owlCarousel({
                    autoplay: true,
                    autoplayTimeout: 5000,
                    autoplayHoverPause: true,
                    loop: true,
                    navRewind: true,
                    margin: 10,
                    nav: true,
                    navText: ["<em class='porto-icon-left-open-huge'></em>","<em class='porto-icon-right-open-huge'></em>"],
                    dots: false,
                    responsive: {
                        0: {
                            items:2
                        },
                        768: {
                            items:3
                        },
                        992: {
                            items:3
                        },
                        1200: {
                            items:4
                        }
                    }
                });
            });
        </script>
        <hr style="background-image: linear-gradient(to right, transparent, rgba(0, 0, 0, 0.2), transparent);border: 0;height: 1px;margin: 30px 0 0;">
        <div class="row">
            <div class="col-md-4">
                <h2 class="filterproduct-title" style="background-image:none;margin-top:20px;margin-bottom:5px;"><span class="content"><strong>New</strong></span></h2>
                {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="latest_small_list" product_count="3" aspect_ratio="0" image_width="212" image_height="212" template="small_list.phtml"}}
            </div>
            <div class="col-md-4">
                <h2 class="filterproduct-title" style="background-image:none;margin-top:20px;margin-bottom:5px;"><span class="content"><strong>Hot</strong></span></h2>
                {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="latest_small_list" product_count="3" aspect_ratio="0" image_width="212" image_height="212" template="small_list.phtml"}}
            </div>
            <div class="col-md-4">
                <h2 class="filterproduct-title" style="background-image:none;margin-top:20px;margin-bottom:5px;"><span class="content"><strong>Sale</strong></span></h2>
                {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="latest_small_list" product_count="3" aspect_ratio="0" image_width="212" image_height="212" template="small_list.phtml"}}
            </div>
        </div>
        <div class="shop-features" style="background-color:#fff; margin-top:13px;">
            <h2 class="shop-features-title"><span>WHY SHOP WITH US?</span></h2>
            <div class="row">
                <div class="col-md-4">
                    <em class="porto-icon-star"></em>
                    <h3>DEDICATED SERVICE</h3>
                    <p>Consult our specialists for help with an order, customization, or design advice.</p>
                    <a href="#">Get in Touch &gt;</a>
                </div>
                <div class="col-md-4">
                    <em class="porto-icon-reply"></em>
                    <h3>FREE RETURNS</h3>
                    <p>We stand behind our goods and services and want you to be satisfied with them.</p>
                    <a href="#">Returns Policy &gt;</a>
                </div>
                <div class="col-md-4">
                    <em class="porto-icon-paper-plane"></em>
                    <h3>INTERNATIONAL SHIPPING</h3>
                    <p>Currently over 50 countries qualify for express international shipping.</p>
                    <a href="#">Learn More &gt;</a>
                </div>
            </div>
        </div>
    </div>
</div>
<style type="text/css">
@media (min-width: 768px) {
    .page-header .nav-sections {
        display: none;
    }
}
</style>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 7</title>
         <identifier>porto_home_7</identifier>
         <content><![CDATA[<div class="hide-border move_actions">
  <h2 class="filterproduct-title" style="margin-top:20px;margin-bottom:5px;"><span class="content"><strong>JUST ARRIVED</strong></span><span class="title_line"></span></h2>
  {{block class="Smartwave\Filterproducts\Block\Home\FeaturedList" name="featured_product" product_count="12" column_count="6" move_actions="1" aspect_ratio="0" image_width="250" image_height="333" product_type="3" template="grid.phtml"}}
</div>
<div class="row" style="margin-top:20px;">
  <div class="col-md-6">
    <h2 class="filterproduct-title" style="margin-top:20px;margin-bottom:5px;background:none;"><span class="content"><strong>LATEST BLOG POSTS</strong></span><span class="title_line"></span></h2>
    <div id="latest_news" class="recent-posts">
      <div class="owl-carousel">
        <div class="item">
          <div class="recent-inner">
            <div class="row">
              <div class="col-md-6">
                <div class="post-image"> 
                  <img src="{{media url="wysiwyg/smartwave/porto/blog/blog_img3.jpg"}}" alt="">
                  <div class="post-date">
                    <span class="day">08</span>
                    <span class="month">Dec</span>
                  </div>
                </div>
              </div>
              <div class="col-md-6">
                <div class="postTitle">
                  <h2><a href="#">New Collection</a></h2>
                </div>
                <div class="postContent"><p>Lorem Ipsum is simply dummy<br>text of the printing and typesetting <br>industry. Lorem Ipsum has...</p></div>
                <a class="readmore btn btn-default" href="#">Read more</a>
              </div>
            </div>
          </div>
        </div>  
        <div class="item">
          <div class="recent-inner">
            <div class="row">
              <div class="col-md-6">
                <div class="post-image">
                  <img src="{{media url="wysiwyg/smartwave/porto/blog/blog_img3.jpg"}}" alt="">
                  <div class="post-date">
                    <span class="day">08</span>
                    <span class="month">Dec</span>
                  </div>
                </div>
              </div>
              <div class="col-md-6">
                <div class="postTitle">
                  <h2><a href="#">Fashion Trends</a></h2>
                </div>
                <div class="postContent"><p>Lorem Ipsum is simply dummy<br>text of the printing and typesetting<br>industry. Lorem Ipsum has...</p></div>
                <a class="readmore btn btn-default" href="#">Read more</a>
              </div>
            </div>
          </div>
        </div>  
      </div>
    </div>
    <script type="text/javascript">
      require([
        'jquery',
        'owl.carousel/owl.carousel.min'
      ], function ($) {
        $("#latest_news .owl-carousel").owlCarousel({
          items: 1,
          loop: true,
          nav: false,
          dots: true
        });
      });
    </script>
  </div>
  <div class="col-md-6">
    <h2 class="filterproduct-title" style="margin-top:20px;margin-bottom:5px;background:none;"><span class="content"><strong>WHAT CLIENT'S SAY</strong></span><span class="title_line"></span></h2>
    <div id="testimonials-slider-demo-9" class="owl-carousel">
      <div class="item">
        <div class="testimonial-author">
          <div class="img-thumbnail img-thumbnail-small"><img width="60" height="60" src="{{media url="wysiwyg/smartwave/porto/testimonials/client-1-12.png"}}" alt=""/></div>
          <p><strong>John Smith</strong><span>CEO &amp; Founder - Okler</span></p>
        </div>
        <blockquote class="testimonial">
          <p>Content here, content here', making it look like readable English. Many desktop publishing packages and web page editors now use Lorem Ipsum as their default model.</p>
        </blockquote> 
      </div>
      <div class="item">
        <div class="testimonial-author">
          <div class="img-thumbnail img-thumbnail-small"><img width="60" height="60" src="{{media url="wysiwyg/smartwave/porto/testimonials/client-1-12.png"}}" alt=""/></div>
          <p><strong>John Smith</strong><span>CEO &amp; Founder - Okler</span></p>
        </div>
        <blockquote class="testimonial">
          <p>Content here, content here', making it look like readable English. Many desktop publishing packages and web page editors now use Lorem Ipsum as their default model.</p>
        </blockquote> 
      </div> 
    </div>
    <script type="text/javascript">
      require([
        'jquery',
        'owl.carousel/owl.carousel.min'
      ], function ($) {
        $("#testimonials-slider-demo-9").owlCarousel({
          items: 1,
          autoplay: true,
          autoplayTimeout: 5000,
          autoplayHoverPause: true,
          dots: true,
          nav: false,
          navRewind: true,
          animateIn: 'fadeIn',
          animateOut: 'fadeOut',
          loop: true
        });
      });
    </script>
  </div>
</div> 
<div class="our-brands" style="margin-top:15px;">
  <div class="owl-side-narrow">
    <div id="brands-slider-demo-10" class="brands-slider">
      <div class="owl-carousel">
        <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/brands/05/brand1.png"}}" alt="" /></div>
        <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/brands/05/brand2.png"}}" alt="" /></div>
        <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/brands/05/brand3.png"}}" alt="" /></div>
        <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/brands/05/brand4.png"}}" alt="" /></div>
        <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/brands/05/brand5.png"}}" alt="" /></div>
        <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/brands/05/brand1.png"}}" alt="" /></div>
        <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/brands/05/brand2.png"}}" alt="" /></div>
        <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/brands/05/brand3.png"}}" alt="" /></div>
        <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/brands/05/brand4.png"}}" alt="" /></div>
        <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/brands/05/brand5.png"}}" alt="" /></div>
      </div>
      <script type="text/javascript">
        require([
          'jquery',
          'owl.carousel/owl.carousel.min'
        ], function ($) {
          $("#brands-slider-demo-10 .owl-carousel").owlCarousel({
            autoplay: true,
            autoplayTimeout: 5000,
            autoplayHoverPause: true,
            margin: 30,
            nav: true,
            navText: ["<em class='porto-icon-left-open-big'></em>","<em class='porto-icon-right-open-big'></em>"],
            dots: false,
            loop: true,
            responsive: {
              0: {
                items:2
              },
              640: {
                items:3
              },
              768: {
                items:4
              },
              992: {
                items:5
              },
              1200: {
                items:5
              }
            }
          });
        });
      </script>
    </div>
  </div> 
</div>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[<referenceContainer name="page.top">
    <block class="Magento\Cms\Block\Block" name="home_slider">
        <arguments>
            <argument name="block_id" xsi:type="string">porto_homeslider_7</argument>
        </arguments>
    </block>
</referenceContainer>]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 7 Old Skin</title>
         <identifier>porto_home_7_old</identifier>
         <content><![CDATA[<h2 class="filterproduct-title"><span class="content"><strong>FEATURED PRODUCTS</strong></span></h2>
<div id="featured_product" class="owl-top-narrow">
    {{block class="Smartwave\Filterproducts\Block\Home\FeaturedList" name="featured_product" product_count="10" aspect_ratio="1" image_width="272" image_height="337" template="owl_list.phtml"}}
</div>
<script type="text/javascript">
    require([
        'jquery',
        'owl.carousel/owl.carousel.min'
    ], function ($) {
        $("#featured_product .owl-carousel").owlCarousel({
            autoplay: true,
            autoplayTimeout: 5000,
            autoplayHoverPause: true,
            loop: true,
            navRewind: true,
            margin: 10,
            nav: true,
            navText: ["<em class='porto-icon-left-open-huge'></em>","<em class='porto-icon-right-open-huge'></em>"],
            dots: false,
            responsive: {
                0: {
                    items:2
                },
                768: {
                    items:3
                },
                992: {
                    items:3
                },
                1200: {
                    items:4
                }
            }
        });
    });
</script>
<h2 class="filterproduct-title" style="margin-bottom: 4px; margin-top: 20px;"><span class="content"><strong>BROWSE OUR CATEGORIES</strong></span></h2>
<div id="category_slider" class="owl-top-narrow">
    <div class="owl-carousel">
        <div class="item" style="padding-top:0;">
            <a class="single-image" href="#">
                <img src="{{media url="wysiwyg/smartwave/porto/homepage/10/content/category1.jpg"}}" alt="" />
                <p style="position:absolute;width:100%;bottom:13px;text-align:center;"><span style="background-color:#333;background-color:rgba(23,23,23,.9);font-size:20.28px;color:#fff;font-weight:800;line-height:37px;display:inline-block;padding:0 10px;">HOME & GARDEN</span></p>
            </a>
        </div>
        <div class="item" style="padding-top:0;">
            <a class="single-image" href="#">
                <img src="{{media url="wysiwyg/smartwave/porto/homepage/10/content/category2.jpg"}}" alt="" />
                <p style="position:absolute;width:100%;bottom:13px;text-align:center;"><span style="background-color:#333;background-color:rgba(23,23,23,.9);font-size:20.28px;color:#fff;font-weight:800;line-height:37px;display:inline-block;padding:0 10px;">SPORTS</span></p>
            </a>
        </div>
        <div class="item" style="padding-top:0;">
            <a class="single-image" href="#">
                <img src="{{media url="wysiwyg/smartwave/porto/homepage/10/content/category3.jpg"}}" alt="" />
                <p style="position:absolute;width:100%;bottom:13px;text-align:center;"><span style="background-color:#333;background-color:rgba(23,23,23,.9);font-size:20.28px;color:#fff;font-weight:800;line-height:37px;display:inline-block;padding:0 10px;">FASHION</span></p>
            </a>
        </div>
        <div class="item" style="padding-top:0;">
            <a class="single-image" href="#">
                <img src="{{media url="wysiwyg/smartwave/porto/homepage/10/content/category4.jpg"}}" alt="" />
                <p style="position:absolute;width:100%;bottom:13px;text-align:center;"><span style="background-color:#333;background-color:rgba(23,23,23,.9);font-size:20.28px;color:#fff;font-weight:800;line-height:37px;display:inline-block;padding:0 10px;">ELECTRONICS</span></p>
            </a>
        </div>
        <div class="item" style="padding-top:0;">
            <a class="single-image" href="#">
                <img src="{{media url="wysiwyg/smartwave/porto/homepage/10/content/category1.jpg"}}" alt="" />
                <p style="position:absolute;width:100%;bottom:13px;text-align:center;"><span style="background-color:#333;background-color:rgba(23,23,23,.9);font-size:20.28px;color:#fff;font-weight:800;line-height:37px;display:inline-block;padding:0 10px;">HOME & GARDEN</span></p>
            </a>
        </div>
        <div class="item" style="padding-top:0;">
            <a class="single-image" href="#">
                <img src="{{media url="wysiwyg/smartwave/porto/homepage/10/content/category2.jpg"}}" alt="" />
                <p style="position:absolute;width:100%;bottom:13px;text-align:center;"><span style="background-color:#333;background-color:rgba(23,23,23,.9);font-size:20.28px;color:#fff;font-weight:800;line-height:37px;display:inline-block;padding:0 10px;">SPORTS</span></p>
            </a>
        </div>
        <div class="item" style="padding-top:0;">
            <a class="single-image" href="#">
                <img src="{{media url="wysiwyg/smartwave/porto/homepage/10/content/category3.jpg"}}" alt="" />
                <p style="position:absolute;width:100%;bottom:13px;text-align:center;"><span style="background-color:#333;background-color:rgba(23,23,23,.9);font-size:20.28px;color:#fff;font-weight:800;line-height:37px;display:inline-block;padding:0 10px;">FASHION</span></p>
            </a>
        </div>
        <div class="item" style="padding-top:0;">
            <a class="single-image" href="#">
                <img src="{{media url="wysiwyg/smartwave/porto/homepage/10/content/category4.jpg"}}" alt="" />
                <p style="position:absolute;width:100%;bottom:13px;text-align:center;"><span style="background-color:#333;background-color:rgba(23,23,23,.9);font-size:20.28px;color:#fff;font-weight:800;line-height:37px;display:inline-block;padding:0 10px;">ELECTRONICS</span></p>
            </a>
        </div>
    </div>
</div>
<script type="text/javascript">
    require([
        'jquery',
        'owl.carousel/owl.carousel.min'
    ], function ($) {
        $("#category_slider .owl-carousel").owlCarousel({
            autoplay: true,
            autoplayTimeout: 5000,
            autoplayHoverPause: true,
            loop: true,
            navRewind: true,
            margin: 10,
            nav: true,
            navText: ["<em class='porto-icon-left-open-huge'></em>","<em class='porto-icon-right-open-huge'></em>"],
            dots: false,
            responsive: {
                0: {
                    items:2
                },
                768: {
                    items:3
                },
                992: {
                    items:3
                },
                1200: {
                    items:4
                }
            }
        });
    });
</script>
<h2 class="filterproduct-title" style="margin-top:20px;margin-bottom:5px;"><span class="content"><strong>JUST ARRIVED</strong></span></h2>
{{block class="Smartwave\Filterproducts\Block\Home\FeaturedList" name="featured_product" product_count="12" column_count="6" move_actions="1" aspect_ratio="0" image_width="250" image_height="250" template="grid.phtml"}}
<div class="row" style="margin-top:20px;">
    <div class="col-md-6">
        <h2 class="filterproduct-title" style="margin-top:20px;margin-bottom:5px;background:none;"><span class="content"><strong>LATEST BLOG POSTS</strong></span></h2>
        <div id="latest_news" class="recent-posts">
            <div class="owl-carousel">
                <div class="item">
                    <div class="row">
                        <div class="col-md-5">
                            <div class="post-image">
                                <img src="{{media url="wysiwyg/smartwave/porto/blog/03.jpg"}}" alt="" />
                            </div>
                        </div>
                        <div class="col-md-7">
                            <div class="post-date">
                                <span class="day">08</span>
                                <span class="month">Dec</span>
                            </div>
                            <div class="postTitle">
                                <h2><a href="#">Post Format – Video</a></h2>
                            </div>
                            <div class="postContent"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras non placerat mi…</p></div>
                            <a class="readmore" href="#">Read more &gt;</a>
                        </div>
                    </div>
                </div>
                <div class="item">
                    <div class="row">
                        <div class="col-md-5">
                            <div class="post-image">
                                <img src="{{media url="wysiwyg/smartwave/porto/blog/04.jpg"}}" alt="" />
                            </div>
                        </div>
                        <div class="col-md-7">
                            <div class="post-date">
                                <span class="day">08</span>
                                <span class="month">Dec</span>
                            </div>
                            <div class="postTitle">
                                <h2><a href="#">Post Format – Image Gallery</a></h2>
                            </div>
                            <div class="postContent"><p>Euismod atras vulputate iltricies etri elit. Class aptent taciti sociosqu ad litora torquent…</p></div>
                            <a class="readmore" href="#">Read more &gt;</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <script type="text/javascript">
            require([
                'jquery',
                'owl.carousel/owl.carousel.min'
            ], function ($) {
                $("#latest_news .owl-carousel").owlCarousel({
                    items: 1,
                    loop: true,
                    nav: false,
                    dots: true
                });
            });
        </script>
    </div>
    <div class="col-md-6">
        <h2 class="filterproduct-title" style="margin-top:20px;margin-bottom:5px;background:none;"><span class="content"><strong>WHAT CLIENT'S SAY</strong></span></h2>
        <div id="testimonials-slider-demo-9" class="owl-carousel">
            <div class="item">
                <blockquote class="testimonial">
                    <p>Hello, I want to thank you for creating a great template and for the excellent and quick support and help that you have been providing to me as I begin to work with it.</p>
                </blockquote>
                <div class="testimonial-arrow-down"></div>
                <div class="testimonial-author">
                    <div class="img-thumbnail img-thumbnail-small"><img width="60" height="60" src="{{media url="wysiwyg/smartwave/porto/testimonials/client-1-11.jpg"}}" alt=""></div>
                    <p><strong>John Smith</strong><span>CEO &amp; Founder - Okler</span></p>
                </div>
            </div>
            <div class="item">
                <blockquote class="testimonial">
                    <p>Hello, I want to thank you for creating a great template and for the excellent and quick support and help that you have been providing to me as I begin to work with it.</p>
                </blockquote>
                <div class="testimonial-arrow-down"></div>
                <div class="testimonial-author">
                    <div class="img-thumbnail img-thumbnail-small"><img width="60" height="60" src="{{media url="wysiwyg/smartwave/porto/testimonials/client-1-11.jpg"}}" alt=""></div>
                    <p><strong>John Smith</strong><span>CEO &amp; Founder - Okler</span></p>
                </div>
            </div>
        </div>
        <script type="text/javascript">
            require([
                'jquery',
                'owl.carousel/owl.carousel.min'
            ], function ($) {
                $("#testimonials-slider-demo-9").owlCarousel({
                    items: 1,
                    autoplay: true,
                    autoplayTimeout: 5000,
                    autoplayHoverPause: true,
                    dots: true,
                    nav: false,
                    navRewind: true,
                    animateIn: 'fadeIn',
                    animateOut: 'fadeOut',
                    loop: true
                });
            });
        </script>
    </div>
</div>
<h2 class="filterproduct-title" style="margin-bottom: 4px;"><span class="content"><strong>Featured Brands</strong></span></h2>
<div id="brands-slider-demo-10" class="brands-slider owl-top-narrow">
    <div class="owl-carousel">
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand1.jpg"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand2.jpg"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand3.jpg"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand4.jpg"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand5.jpg"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand6.jpg"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand1.jpg"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand2.jpg"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand3.jpg"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand4.jpg"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand5.jpg"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand6.jpg"}}" alt="" /></div>
    </div>
    <script type="text/javascript">
        require([
            'jquery',
            'owl.carousel/owl.carousel.min'
        ], function ($) {
            $("#brands-slider-demo-10 .owl-carousel").owlCarousel({
                autoplay: true,
                autoplayTimeout: 5000,
                autoplayHoverPause: true,
                margin: 30,
                nav: true,
                navText: ["<em class='porto-icon-left-open-huge'></em>","<em class='porto-icon-right-open-huge'></em>"],
                dots: false,
                loop: true,
                responsive: {
                    0: {
                        items:2
                    },
                    640: {
                        items:3
                    },
                    768: {
                        items:4
                    },
                    992: {
                        items:5
                    },
                    1200: {
                        items:6
                    }
                }
            });
        });
    </script>
</div>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[<referenceContainer name="page.top">
    <block class="Magento\Cms\Block\Block" name="home_slider">
        <arguments>
            <argument name="block_id" xsi:type="string">porto_homeslider_7_old</argument>
        </arguments>
    </block>
</referenceContainer>]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 8</title>
         <identifier>porto_home_8</identifier>
         <content><![CDATA[<style type="text/css">
.column.main {
    min-height: auto;
    padding: 0;
}
.page-main, .columns .column.main {padding: 0;}
.recent-posts .item .col-md-5, .recent-posts .item .col-md-7 {
    width: 100%;
}
</style>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[<referenceContainer name="page.top">
    <block class="Magento\Cms\Block\Block" name="home_slider">
        <arguments>
            <argument name="block_id" xsi:type="string">porto_homeslider_8</argument>
        </arguments>
    </block>
</referenceContainer>]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 8 Old Skin</title>
         <identifier>porto_home_8_old</identifier>
         <content><![CDATA[<div class="row" style="margin-top: 40px;">
    <div class="col-lg-9 col-md-8">
        <div class="filterproducts-tab">
            <div class="data items" data-mage-init='{"tabs":{"openedState":"active"}}'>
                <div class="data item title" aria-labeledby="tab-label-featured-title" data-role="collapsible" id="tab-label-featured">
                    <a class="data switch" tabindex="-1" data-toggle="switch" href="#featured" id="tab-label-featured-title">Featured</a>
                </div>
                <div class="data item content hide-addtolinks" id="featured" data-role="content">
                    {{block class="Smartwave\Filterproducts\Block\Home\FeaturedList" name="featured_product" product_count="8" column_count="4" move_actions="1" aspect_ratio="0" image_width="250" image_height="250" template="grid.phtml"}}
                </div>
                <div class="data item title" aria-labeledby="tab-label-latest-title" data-role="collapsible" id="tab-label-latest">
                    <a class="data switch" tabindex="-1" data-toggle="switch" href="#latest" id="tab-label-latest-title">Latest</a>
                </div>
                <div class="data item content hide-addtolinks" id="latest" data-role="content">
                    {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="latest_product" product_count="8" column_count="4" move_actions="1" aspect_ratio="0" image_width="250" image_height="250" template="grid.phtml"}}
                </div>
            </div>
        </div>
        <div class="grid-images" style="margin:20px 0;">
            <div class="row">
                <div class="col-md-4">
                    <div class="grid1">
                        <a href="#"><img src="{{media url="wysiwyg/smartwave/porto/homepage/05/content/grid1_old.jpg"}}" alt="" /></a>
                    </div>
                    <div class="grid2">
                        <a href="#"><img src="{{media url="wysiwyg/smartwave/porto/homepage/05/content/grid2_old.jpg"}}" alt=""></a>
                    </div>
                </div>
                <div class="col-md-8">
                    <div class="grid3">
                        <a href="#"><img src="{{media url="wysiwyg/smartwave/porto/homepage/05/content/grid3_old.jpg"}}" alt=""></a>
                    </div>
                </div>
            </div>
        </div>
        <h2 class="filterproduct-title" style="margin:0 0 10px;"><span class="content"><strong>Featured Brands</strong></span></h2>
        <div id="brands-slider-demo-8" class="brands-slider">
            <div class="owl-carousel">
                <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand1.png"}}" alt="" /></div>
                <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand2.png"}}" alt="" /></div>
                <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand3.png"}}" alt="" /></div>
                <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand4.png"}}" alt="" /></div>
                <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand5.png"}}" alt="" /></div>
                <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand1.png"}}" alt="" /></div>
                <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand2.png"}}" alt="" /></div>
                <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand3.png"}}" alt="" /></div>
                <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand4.png"}}" alt="" /></div>
                <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand5.png"}}" alt="" /></div>
            </div>
        <script type="text/javascript">
            require([
                'jquery',
                'owl.carousel/owl.carousel.min'
            ], function ($) {
                $("#brands-slider-demo-8 .owl-carousel").owlCarousel({
                    autoplay: true,
                    autoplayTimeout: 5000,
                    autoplayHoverPause: true,
                    margin: 30,
                    nav: false,
                    dots: true,
                    loop: true,
                    responsive: {
                        0: {
                            items:2
                        },
                        640: {
                            items:3
                        },
                        768: {
                            items:4
                        },
                        992: {
                            items:5
                        },
                        1200: {
                            items:6
                        }
                    }
                });
            });
        </script>
        </div>
    </div>
    <div class="col-lg-3 col-md-4 sidebar">
        <div class="custom-block" style="margin-top:44px;padding-bottom:37px;margin-bottom:15px;">
            <div class="block block-border">
                <div class="block-title">Category</div>
                <div class="block-content">
                    {{block class="Smartwave\Porto\Block\CategoryCollection" name="category_sidebar" template="Smartwave_Porto::category_side.phtml"}}
                </div>
            </div>
        </div>
        <h2 class="filterproduct-title" style="margin-top:40px;margin-bottom: 5px;"><span class="content"><strong>FROM THE BLOG</strong></span></h2>
        <div id="latest_news" class="custom-block">
            <div class="recent-posts">
                <div class="owl-carousel">
                    <div class="item">
                        <div class="row">
                            <div class="col-md-5">
                                <div class="post-image">
                                    <img src="{{media url="wysiwyg/smartwave/porto/blog/03.jpg"}}" alt="" />
                                </div>
                            </div>
                            <div class="col-md-7">
                                <div class="post-date">
                                    <span class="day">08</span>
                                    <span class="month">Dec</span>
                                </div>
                                <div class="postTitle">
                                    <h2><a href="#">Post Format – Video</a></h2>
                                </div>
                                <div class="postContent"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras non placerat mi…</p></div>
                                <a class="readmore" href="#">Read more &gt;</a>
                            </div>
                        </div>
                    </div>
                    <div class="item">
                        <div class="row">
                            <div class="col-md-5">
                                <div class="post-image">
                                    <img src="{{media url="wysiwyg/smartwave/porto/blog/04.jpg"}}" alt="" />
                                </div>
                            </div>
                            <div class="col-md-7">
                                <div class="post-date">
                                    <span class="day">08</span>
                                    <span class="month">Dec</span>
                                </div>
                                <div class="postTitle">
                                    <h2><a href="#">Post Format – Image Gallery</a></h2>
                                </div>
                                <div class="postContent"><p>Euismod atras vulputate iltricies etri elit. Class aptent taciti sociosqu ad litora torquent…</p></div>
                                <a class="readmore" href="#">Read more &gt;</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <script type="text/javascript">
                require([
                    'jquery',
                    'owl.carousel/owl.carousel.min'
                ], function ($) {
                    $("#latest_news .owl-carousel").owlCarousel({
                        items: 1,
                        loop: true,
                        nav: false,
                        dots: true
                    });
                });
            </script>
        </div>
        <h2 style="font-weight:600;font-size:20px;color:#000;line-height:1;">Custom HTML Block</h2>
        <h5 style="font-family:Arial;font-weight:400;font-size:11px;color:#878787;line-height:1;margin-bottom:13px;">This is a custom sub-title.</h5>
        <p style="font-weight:400;font-size:14px;color:#666;line-height:1.42;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras non placerat mi. Etiam non tellus </p>
    </div>
</div>
<style type="text/css">
.recent-posts .item .col-md-5, .recent-posts .item .col-md-7 {
    width: 100%;
}
</style>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[<referenceContainer name="page.top">
    <block class="Magento\Cms\Block\Block" name="home_slider">
        <arguments>
            <argument name="block_id" xsi:type="string">porto_homeslider_8_old</argument>
        </arguments>
    </block>
</referenceContainer>]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 9</title>
         <identifier>porto_home_9</identifier>
         <content><![CDATA[<div class="row">
    <div class="col-md-3">
      <h2 class="filterproduct-title" style="background-image:none;margin-top:20px;margin-bottom:5px;"><span class="content"><strong>Featured</strong></span></h2>
      {{block class="Smartwave\Filterproducts\Block\Home\FeaturedList" name="latest_small_list" product_count="3" aspect_ratio="0" image_width="212" image_height="212" template="small_list.phtml"}}
    </div>
    <div class="col-md-3">
      <h2 class="filterproduct-title" style="background-image:none;margin-top:20px;margin-bottom:5px;"><span class="content"><strong>New</strong></span></h2>
      {{block class="Smartwave\Filterproducts\Block\Home\FeaturedList" name="latest_small_list" product_count="3" aspect_ratio="0" image_width="212" image_height="212" template="small_list.phtml"}}
    </div>
    <div class="col-md-3">
      <h2 class="filterproduct-title" style="background-image:none;margin-top:20px;margin-bottom:5px;"><span class="content"><strong>Hot</strong></span></h2>
      {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="latest_small_list" product_count="3" aspect_ratio="0" image_width="212" image_height="212" template="small_list.phtml"}}
    </div>
    <div class="col-md-3">
      <h2 class="filterproduct-title" style="background-image:none;margin-top:20px;margin-bottom:5px;"><span class="content"><strong>Sale</strong></span></h2>
      {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="latest_small_list" product_count="3" aspect_ratio="0" image_width="212" image_height="212" template="small_list.phtml"}}
    </div>
</div>
<style type="text/css">
.homepage-bar .col-lg-4 {
    padding-top: 15px;
    padding-bottom: 15px;
    height: 80px;
    text-align: center;
}
</style>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[<referenceContainer name="page.top">
    <block class="Magento\Cms\Block\Block" name="home_slider">
        <arguments>
            <argument name="block_id" xsi:type="string">porto_homeslider_9</argument>
        </arguments>
    </block>
</referenceContainer>]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 9 Old Skin</title>
         <identifier>porto_home_9_old</identifier>
         <content><![CDATA[<h2 class="filterproduct-title" style="margin-bottom: 4px;"><span class="content"><strong>Featured Brands</strong></span></h2>
<div id="brands-slider-demo-17" class="brands-slider owl-top-narrow">
    <div class="owl-carousel">
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand1.jpg"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand2.jpg"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand3.jpg"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand4.jpg"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand5.jpg"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand6.jpg"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand1.jpg"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand2.jpg"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand3.jpg"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand4.jpg"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand5.jpg"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand6.jpg"}}" alt="" /></div>
    </div>
    <script type="text/javascript">
        require([
            'jquery',
            'owl.carousel/owl.carousel.min'
        ], function ($) {
            $("#brands-slider-demo-17 .owl-carousel").owlCarousel({
                autoplay: true,
                autoplayTimeout: 5000,
                autoplayHoverPause: true,
                margin: 30,
                nav: true,
                navText: ["<em class='porto-icon-left-open-huge'></em>","<em class='porto-icon-right-open-huge'></em>"],
                dots: false,
                loop: true,
                responsive: {
                    0: {
                        items:2
                    },
                    640: {
                        items:3
                    },
                    768: {
                        items:4
                    },
                    992: {
                        items:5
                    },
                    1200: {
                        items:6
                    }
                }
            });
        });
    </script>
</div>
<div class="row">
    <div class="col-md-3">
        <h2 class="filterproduct-title" style="background-image:none;margin-top:20px;margin-bottom:5px;"><span class="content"><strong>Featured</strong></span></h2>
        {{block class="Smartwave\Filterproducts\Block\Home\FeaturedList" name="latest_small_list" product_count="3" aspect_ratio="0" image_width="212" image_height="212" template="small_list.phtml"}}
    </div>
    <div class="col-md-3">
        <h2 class="filterproduct-title" style="background-image:none;margin-top:20px;margin-bottom:5px;"><span class="content"><strong>New</strong></span></h2>
        {{block class="Smartwave\Filterproducts\Block\Home\FeaturedList" name="latest_small_list" product_count="3" aspect_ratio="0" image_width="212" image_height="212" template="small_list.phtml"}}
    </div>
    <div class="col-md-3">
        <h2 class="filterproduct-title" style="background-image:none;margin-top:20px;margin-bottom:5px;"><span class="content"><strong>Hot</strong></span></h2>
        {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="latest_small_list" product_count="3" aspect_ratio="0" image_width="212" image_height="212" template="small_list.phtml"}}
    </div>
    <div class="col-md-3">
        <h2 class="filterproduct-title" style="background-image:none;margin-top:20px;margin-bottom:5px;"><span class="content"><strong>Sale</strong></span></h2>
        {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="latest_small_list" product_count="3" aspect_ratio="0" image_width="212" image_height="212" template="small_list.phtml"}}
    </div>
</div>
<style type="text/css">
.homepage-bar .col-lg-4 {
    padding-top: 15px;
    padding-bottom: 15px;
    height: 80px;
    text-align: center;
}
</style>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[<referenceContainer name="page.top">
    <block class="Magento\Cms\Block\Block" name="home_slider">
        <arguments>
            <argument name="block_id" xsi:type="string">porto_homeslider_9_old</argument>
        </arguments>
    </block>
</referenceContainer>]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 10</title>
         <identifier>porto_home_10</identifier>
         <content><![CDATA[<div class="row" style="margin: 25px -10px 0 -10px">
  <div class="col-md-4 one-product" style="padding-left: 10px;padding-right: 10px;">
    <h4 class="filterproduct-title">FEATURED</h4>
    <div id="featured_product" class="hide-addtocart hide-addtolinks">
      {{block class="Smartwave\Filterproducts\Block\Home\FeaturedList" name="featured_product" product_count="3" aspect_ratio="1" image_width="350" product_type="3" template="owl_list.phtml"}}
    </div>
    <script type="text/javascript">
      require([
        'jquery',
        'owl.carousel/owl.carousel.min'
      ], function ($) {
        $("#featured_product .owl-carousel").owlCarousel({
          autoplay: true,
          autoplayTimeout: 5000,
          autoplayHoverPause: true,
          nav: false,
          dots: false,
          navRewind: true,
          animateIn: 'fadeIn',
          animateOut: 'fadeOut',
          loop: true,
          items: 1
        });
      });
    </script>
  </div>
  <div class="col-md-4 one-product" style="padding-left: 10px;padding-right: 10px;">
    <h4 class="filterproduct-title">SALES</h4>
    <div id="sales_product" class="hide-addtocart hide-addtolinks">
      {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="featured_product" product_count="3" aspect_ratio="1" image_width="350" product_type="3" template="owl_list.phtml"}}
    </div>
    <script type="text/javascript">
      require([
        'jquery',
        'owl.carousel/owl.carousel.min'
      ], function ($) {
        $("#sales_product .owl-carousel").owlCarousel({
          autoplay: true,
          autoplayTimeout: 5000,
          autoplayHoverPause: true,
          nav: false,
          dots: false,
          navRewind: true,
          animateIn: 'fadeIn',
          animateOut: 'fadeOut',
          loop: true,
          items: 1
        });
      });
    </script>
  </div>
  <div class="col-md-4 one-product" style="padding-left: 10px;padding-right: 10px;">
    <h4 class="filterproduct-title">NEW ARRIVALS</h4>
    <div id="new_product" class="hide-addtocart hide-addtolinks">
      {{block class="Smartwave\Filterproducts\Block\Home\FeaturedList" name="featured_product" product_count="3" aspect_ratio="1" image_width="350" product_type="3" template="owl_list.phtml"}}
    </div>
    <script type="text/javascript">
      require([
        'jquery',
        'owl.carousel/owl.carousel.min'
      ], function ($) {
        $("#new_product .owl-carousel").owlCarousel({
          autoplay: true,
          autoplayTimeout: 5000,
          autoplayHoverPause: true,
          nav: false,
          dots: false,
          navRewind: true,
          animateIn: 'fadeIn',
          animateOut: 'fadeOut',
          loop: true,
          items: 1
        });
      });
    </script>
  </div>
</div>
<div class="single-images" style="padding: 30px 0 15px;">
  <div class="row">
    <div class="col-md-4 col-12" style="padding-bottom:15px;">
      <a class="image-link" href="#">
        <img src="{{media url="wysiwyg/smartwave/porto/homepage/07/content/grid1n.jpg"}}" alt="" />
      </a>
    </div>
    <div class="col-md-4 col-12" style="padding-bottom:15px;">
      <a class="image-link" href="#">
        <img src="{{media url="wysiwyg/smartwave/porto/homepage/07/content/grid2n.jpg"}}" alt="" />
      </a>
    </div>
    <div class="col-md-4 col-12" style="padding-bottom:15px;">
      <a class="image-link" href="#">
        <img src="{{media url="wysiwyg/smartwave/porto/homepage/07/content/grid3n.jpg"}}" alt="" />
      </a>
    </div> 
  </div>
</div>
<div style="padding: 0 10px 10px;background-color: #fff;">
  {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="featured_product" product_count="10" column_count="5" aspect_ratio="1" image_width="300" product_type="3" template="grid.phtml"}}
</div>
<div style="background-color:#fff; margin-top:30px; padding: 35px 0 0;" class="custom-support">  
  <div class="row">
  <div class="col-md-4">
    <i class="porto-icon-earphones-alt" style="line-height:58px;font-size:40px;"></i>
    <div class="content">
      <h2>Customer Support</h2>
      <em>You Won't Be Alone</em>
      <p>We really care about you and your website as much as you do. Purchasing Porto or any other theme from us you get 100% free support.</p>
    </div>
  </div>
  <div class="col-md-4">
    <i class="porto-icon-credit-card" style="line-height:58px;font-size:40px;"></i>
    <div class="content">
      <h2>Fully Customizable</h2>
      <em>Tons Of Options</em>
      <p>With Porto you can customize the layout, colors and styles within only a few minutes. Start creating an amazing website right now!</p>
    </div>
  </div>
  <div class="col-md-4">
    <i class="porto-icon-action-undo" style="line-height:58px;font-size:40px;"></i>
    <div class="content">
      <h2>Powerful Admin</h2>
      <em>Made To Help You</em>
      <p>Porto has very powerful admin features to help customer to build their own shop in minutes without any special skills in web development.</p>
    </div>
  </div> 
  </div>
</div>  
<div class="col-lg-12" style="padding: 20px;background-color:#fff;">
  <div id="brands-slider-demo-7" class="brands-slider owl-side-narrow">
    <div class="owl-carousel">
      <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/brands/05/brand1.png"}}" alt="" /></div>
      <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/brands/05/brand2.png"}}" alt="" /></div>
      <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/brands/05/brand3.png"}}" alt="" /></div>
      <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/brands/05/brand4.png"}}" alt="" /></div>
      <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/brands/05/brand5.png"}}" alt="" /></div>
      <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/brands/05/brand1.png"}}" alt="" /></div>
      <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/brands/05/brand2.png"}}" alt="" /></div>
      <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/brands/05/brand3.png"}}" alt="" /></div>
      <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/brands/05/brand4.png"}}" alt="" /></div>
      <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/brands/05/brand5.png"}}" alt="" /></div>
    </div>
    <script type="text/javascript">
      require([
        'jquery',
        'owl.carousel/owl.carousel.min'
      ], function ($) {
        $("#brands-slider-demo-7 .owl-carousel").owlCarousel({
          autoplay: true,
          autoplayTimeout: 5000,
          autoplayHoverPause: true,
          margin: 30,
          nav: true,
          dots: false,
          loop: true,
          navText: ["<em class='porto-icon-chevron-left'></em>","<em class='porto-icon-chevron-right'></em>"],
          responsive: {
            0: {
              items:2
            },
            640: {
              items:3
            },
            768: {
              items:4
            },
            992: {
              items:5
            },
            1200: {
              items:5
            }
          }
        });
      });
    </script>
  </div>
</div>
<style type="text/css">
header.page-header.type16:not(.sticky-header) .nav-sections {
    margin-bottom: 10px;
}
</style>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[<referenceContainer name="page.top">
    <block class="Magento\Cms\Block\Block" name="home_slider">
        <arguments>
            <argument name="block_id" xsi:type="string">porto_homeslider_10</argument>
        </arguments>
    </block>
</referenceContainer>]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 10 Old Skin</title>
         <identifier>porto_home_10_old</identifier>
         <content><![CDATA[<div class="row" style="margin: 15px -8px 0 -8px;">
    <div class="col-md-4 one-product" style="padding-left: 8px; padding-right: 8px;">
        <h4 class="filterproduct-title">FEATURED</h4>
        <div id="featured_product" class="hide-addtocart hide-addtolinks">
            {{block class="Smartwave\Filterproducts\Block\Home\FeaturedList" name="featured_product" product_count="3" aspect_ratio="0" image_width="350" image_height="350" template="owl_list.phtml"}}
        </div>
        <script type="text/javascript">
            require([
                'jquery',
                'owl.carousel/owl.carousel.min'
            ], function ($) {
                $("#featured_product .owl-carousel").owlCarousel({
                    autoplay: true,
                    autoplayTimeout: 5000,
                    autoplayHoverPause: true,
                    nav: false,
                    dots: true,
                    navRewind: true,
                    animateIn: 'fadeIn',
                    animateOut: 'fadeOut',
                    loop: true,
                    items: 1
                });
            });
        </script>
    </div>
    <div class="col-md-4 one-product" style="padding-left: 8px; padding-right: 8px;">
        <h4 class="filterproduct-title">SALES</h4>
        <div id="sales_product" class="hide-addtocart hide-addtolinks">
            {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="featured_product" product_count="3" aspect_ratio="0" image_width="350" image_height="350" template="owl_list.phtml"}}
        </div>
        <script type="text/javascript">
            require([
                'jquery',
                'owl.carousel/owl.carousel.min'
            ], function ($) {
                $("#sales_product .owl-carousel").owlCarousel({
                    autoplay: true,
                    autoplayTimeout: 5000,
                    autoplayHoverPause: true,
                    nav: false,
                    dots: true,
                    navRewind: true,
                    animateIn: 'fadeIn',
                    animateOut: 'fadeOut',
                    loop: true,
                    items: 1
                });
            });
        </script>
    </div>
    <div class="col-md-4 one-product" style="padding-left: 8px; padding-right: 8px;">
        <h4 class="filterproduct-title">NEW ARRIVALS</h4>
        <div id="new_product" class="hide-addtocart hide-addtolinks">
            {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="featured_product" product_count="3" aspect_ratio="0" image_width="350" image_height="350" template="owl_list.phtml"}}
        </div>
        <script type="text/javascript">
            require([
                'jquery',
                'owl.carousel/owl.carousel.min'
            ], function ($) {
                $("#new_product .owl-carousel").owlCarousel({
                    autoplay: true,
                    autoplayTimeout: 5000,
                    autoplayHoverPause: true,
                    nav: false,
                    dots: true,
                    navRewind: true,
                    animateIn: 'fadeIn',
                    animateOut: 'fadeOut',
                    loop: true,
                    items: 1
                });
            });
        </script>
    </div>
</div>
<div class="single-images" style="padding-top: 15px;">
    <div class="row" style="margin-left:-7px;margin-right:-7px;">
        <div class="col-md-3 col-6" style="padding-left:7px;padding-right:7px;padding-bottom:15px;">
            <a class="image-link" href="#">
                <img src="{{media url="wysiwyg/smartwave/porto/homepage/07/content/grid1.jpg"}}" alt="" />
            </a>
        </div>
        <div class="col-md-3 col-6" style="padding-left:7px;padding-right:7px;padding-bottom:15px;">
            <a class="image-link" href="#">
                <img src="{{media url="wysiwyg/smartwave/porto/homepage/07/content/grid2.jpg"}}" alt="" />
            </a>
        </div>
        <div class="col-md-3 col-6" style="padding-left:7px;padding-right:7px;padding-bottom:15px;">
            <a class="image-link" href="#">
                <img src="{{media url="wysiwyg/smartwave/porto/homepage/07/content/grid3.jpg"}}" alt="" />
            </a>
        </div>
        <div class="col-md-3 col-6" style="padding-left:7px;padding-right:7px;padding-bottom:15px;">
            <a class="image-link" href="#">
                <img src="{{media url="wysiwyg/smartwave/porto/homepage/07/content/grid4.jpg"}}" alt="" />
            </a>
        </div>
     </div>
</div>
<div style="padding: 10px 20px 20px;background-color: #fff;">
    {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="featured_product" product_count="8" column_count="4" aspect_ratio="1" image_width="300" template="grid.phtml"}}
</div>
<div class="shop-features" style="background-color:#fff; margin-top:13px; padding: 35px 0;">
    <div class="row">
        <div class="col-md-4">
            <em class="porto-icon-star" style="border:0;"></em>
            <h3>DEDICATED SERVICE</h3>
            <p style="padding: 0 60px;">Consult our specialists for help with an order, customization, or design advice.</p>
            <a href="#">Get in Touch &gt;</a>
        </div>
        <div class="col-md-4">
            <em class="porto-icon-reply" style="border:0;"></em>
            <h3>FREE RETURNS</h3>
            <p style="padding: 0 60px;">We stand behind our goods and services and want you to be satisfied with them.</p>
            <a href="#">Returns Policy &gt;</a>
        </div>
        <div class="col-md-4">
            <em class="porto-icon-paper-plane" style="border:0;"></em>
            <h3>INTERNATIONAL SHIPPING</h3>
            <p style="padding: 0 70px;">Currently over 50 countries qualify for express international shipping.</p>
            <a href="#">Learn More &gt;</a>
        </div>
    </div>
</div>
<div class="col-lg-12" style="padding: 20px;background-color:#fff;">
    <div id="brands-slider-demo-7" class="brands-slider">
        <div class="owl-carousel">
            <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand1.png"}}" alt="" /></div>
            <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand2.png"}}" alt="" /></div>
            <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand3.png"}}" alt="" /></div>
            <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand4.png"}}" alt="" /></div>
            <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand5.png"}}" alt="" /></div>
            <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand1.png"}}" alt="" /></div>
            <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand2.png"}}" alt="" /></div>
            <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand3.png"}}" alt="" /></div>
            <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand4.png"}}" alt="" /></div>
            <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand5.png"}}" alt="" /></div>
        </div>
    <script type="text/javascript">
        require([
            'jquery',
            'owl.carousel/owl.carousel.min'
        ], function ($) {
            $("#brands-slider-demo-7 .owl-carousel").owlCarousel({
                autoplay: true,
                autoplayTimeout: 5000,
                autoplayHoverPause: true,
                margin: 30,
                nav: false,
                dots: true,
                loop: true,
                responsive: {
                    0: {
                        items:2
                    },
                    640: {
                        items:3
                    },
                    768: {
                        items:4
                    },
                    992: {
                        items:5
                    },
                    1200: {
                        items:6
                    }
                }
            });
        });
    </script>
    </div>
</div>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[<referenceContainer name="page.top">
    <block class="Magento\Cms\Block\Block" name="home_slider">
        <arguments>
            <argument name="block_id" xsi:type="string">porto_homeslider_10_old</argument>
        </arguments>
    </block>
</referenceContainer>]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 11</title>
         <identifier>porto_home_11</identifier>
         <content><![CDATA[<style>
.column.main {
    min-height: auto;
    padding:0;
}
.page-main {
    padding-top:0;
    padding-bottom: 0;
}
.columns .column.main {
    padding-bottom:0;
}
</style>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[<referenceContainer name="page.top">
    <block class="Magento\Cms\Block\Block" name="home_slider">
        <arguments>
            <argument name="block_id" xsi:type="string">porto_homeslider_11</argument>
        </arguments>
    </block>
</referenceContainer>]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 11 Old Skin</title>
         <identifier>porto_home_11_old</identifier>
         <content><![CDATA[<div class="single-images">
    <div class="row" style="margin-left:-10px;margin-right:-10px;">
        <div class="col-md-4" style="padding:10px">
            <div class="single-image-label">SHOP LIVING ROOM</div>
            <a class="image-link" href="#">
                <img src="{{media url="wysiwyg/smartwave/porto/homepage/18/content/image01.jpg"}}" alt="">
            </a>
            <div class="caption">LIVING ROOM STARTING AT $999</div>
        </div>
        <div class="col-md-4" style="padding:10px">
            <div class="single-image-label">SHOP DINING ROOM</div>
            <a class="image-link" href="#">
                <img src="{{media url="wysiwyg/smartwave/porto/homepage/18/content/image02.jpg"}}" alt="">
            </a>
            <div class="caption">DINING ROOM STARTING AT $999</div>
        </div>
        <div class="col-md-4" style="padding:10px">
            <div class="single-image-label">SHOP BEDROOM</div>
            <a class="image-link" href="#">
                <img src="{{media url="wysiwyg/smartwave/porto/homepage/18/content/image03.jpg"}}" alt="">
            </a>
            <div class="caption">BEDROOM STARTING AT $999</div>
        </div>
     </div>
</div>
<div style="padding-top: 20px;">
    <h2 class="filterproduct-title" style="background-image:none;font-size:17px;text-transform:none;color:#828385;font-weight:600;"><span class="content"><strong>Top Selling Items</strong></span></h2>
    <div id="featured_product" class="owl-top-narrow hide-addtolinks">
        {{block class="Smartwave\Filterproducts\Block\Home\FeaturedList" name="featured_product" product_count="10" move_actions="1" aspect_ratio="0" image_width="212" image_height="263" template="owl_list.phtml"}}
    </div>
    <script type="text/javascript">
        require([
            'jquery',
            'owl.carousel/owl.carousel.min'
        ], function ($) {
            $("#featured_product .owl-carousel").owlCarousel({
                autoplay: true,
                autoplayTimeout: 5000,
                autoplayHoverPause: true,
                loop: true,
                navRewind: true,
                margin: 10,
                nav: true,
                navText: ["<em class='porto-icon-left-open-huge'></em>","<em class='porto-icon-right-open-huge'></em>"],
                dots: false,
                responsive: {
                    0: {
                        items:2
                    },
                    768: {
                        items:3
                    },
                    992: {
                        items:4
                    },
                    1200: {
                        items:5
                    }
                }
            });
        });
    </script>
</div>
<div id="brands-slider-demo-18" class="brands-slider" style="padding-top: 50px;">
    <div class="owl-carousel">
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand1.png"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand2.png"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand3.png"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand4.png"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand5.png"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand1.png"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand2.png"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand3.png"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand4.png"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand5.png"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand1.png"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand2.png"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand3.png"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand4.png"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand5.png"}}" alt="" /></div>
    </div>
    <script type="text/javascript">
        require([
            'jquery',
            'owl.carousel/owl.carousel.min'
        ], function ($) {
            $("#brands-slider-demo-18 .owl-carousel").owlCarousel({
                autoplay: true,
                autoplayTimeout: 5000,
                autoplayHoverPause: true,
                margin: 30,
                nav: false,
                navText: ["<em class='porto-icon-left-open-huge'></em>","<em class='porto-icon-right-open-huge'></em>"],
                dots: true,
                loop: true,
                responsive: {
                    0: {
                        items:2
                    },
                    640: {
                        items:3
                    },
                    768: {
                        items:4
                    },
                    992: {
                        items:5
                    },
                    1200: {
                        items:6
                    }
                }
            });
        });
    </script>
</div>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[<referenceContainer name="page.top">
    <block class="Magento\Cms\Block\Block" name="home_slider">
        <arguments>
            <argument name="block_id" xsi:type="string">porto_homeslider_11_old</argument>
        </arguments>
    </block>
</referenceContainer>]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 12</title>
         <identifier>porto_home_12</identifier>
         <content><![CDATA[<div class="row" style="background-color:#fff;margin-top:-20px;">
  <div class="col-lg-12">
    <div class="row">
      <div class="col-xl-3"></div>
      <div class="col-xl-9">
        <div id="banner-slider-demo-12" class="owl-carousel owl-banner-carousel owl-bottom-corner-narrow">
          <div class="item">
            <img src="{{media url="wysiwyg/smartwave/porto/homepage/12/slider/slide01n.jpg"}}" alt="" /> 
          </div>
          <div class="item">
            <img src="{{media url="wysiwyg/smartwave/porto/homepage/12/slider/slide02n.jpg"}}" alt="" />
          </div>
        </div>
        <script type="text/javascript">
          require([
            'jquery',
            'owl.carousel/owl.carousel.min'
          ], function ($) {
            $("#banner-slider-demo-12").owlCarousel({
              items: 1,
              autoplay: true,
              autoplayTimeout: 5000,
              autoplayHoverPause: true,
              dots: false,
              nav: true,
              navRewind: true,
              animateIn: 'fadeIn',
              animateOut: 'fadeOut',
              loop: true,
              navText: ["<em class='porto-icon-chevron-left'></em>","<em class='porto-icon-chevron-right'></em>"]
            });
          });
        </script>
      </div>
    </div>
    <div style="background-color:#eff3f5;margin-top:27px;"> 
      <div class="homepage-bar" style="margin:0;">
        <div class="row">
          <div class="col-lg-4" style="text-align:center;">
            <i class="porto-icon-shipping" style="font-size:35px;"></i><div class="text-area"><h3>FREE SHIPPING &amp; RETURN</h3><p>Free shipping on all orders over $99.</p></div>
          </div>
          <div class="col-lg-4" style="text-align:center;">
            <i class="porto-icon-us-dollar" style="font-size:37px;"></i><div class="text-area"><h3>MONEY BACK GUARANTEE</h3><p>100% money back guarantee.</p></div>
          </div>
          <div class="col-lg-4" style="text-align:center;">
            <i class="porto-icon-support" style="font-size:37px;"></i><div class="text-area"><h3>ONLINE SUPPORT 24/7</h3><p>Lorem ipsum dolor sit amet.</p></div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
<div class="row" style="background-color:#fff;margin-top:50px;margin-bottom:20px;">
  <div class="col-lg-12">
    <h2 class="filterproduct-title" style="background:none;"><span class="content" style="background:none;"><strong>FEATURED PRODUCTS</strong></span></h2>
    {{block class="Smartwave\Filterproducts\Block\Home\FeaturedList" name="latest_product" product_count="8" column_count="4" aspect_ratio="1" image_width="300" product_type="4" template="grid.phtml"}}
  </div>
</div>
<div style="background-color:#fff;margin-top:11px;margin-bottom:11px;">
  <a href="#" style="display:block;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/12/content/huge_sale_new.jpg"}}" alt="" style="width: 100%;"></a>
</div>
<div class="row product-fullwidth" style="margin-top: 45px;margin-left: -10px;margin-right: -10px;">
  <div class="col-md-4 one-product" style="padding-left: 10px;padding-right: 10px;"> 
    <h2 class="filterproduct-title" style="background:none;"><span class="content" style="background:none;"><strong>FEATURED</strong></span></h2>
    <div id="featured_product" class="">
      {{block class="Smartwave\Filterproducts\Block\Home\FeaturedList" name="featured_product" product_count="3" aspect_ratio="1" image_width="350" product_type="7" template="owl_list.phtml"}}
    </div>
    <script type="text/javascript">
      require([
        'jquery',
        'owl.carousel/owl.carousel.min'
      ], function ($) {
        $("#featured_product .owl-carousel").owlCarousel({
          autoplay: true,
          autoplayTimeout: 5000,
          autoplayHoverPause: true,
          nav: false,
          margin: 0,
          dots: true,
          navRewind: true,
          animateIn: 'fadeIn',
          animateOut: 'fadeOut',
          loop: true,
          items: 1
        });
      });
    </script>
  </div>
  <div class="col-md-4 one-product" style="padding-left: 10px;padding-right: 10px;">
    <h2 class="filterproduct-title" style="background:none;"><span class="content" style="background:none;"><strong>SALES</strong></span></h2>
    <div id="sales_product" class="">
      {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="featured_product" product_count="3" aspect_ratio="1" image_width="350" product_type="7" template="owl_list.phtml"}}
    </div>
    <script type="text/javascript">
      require([
        'jquery',
        'owl.carousel/owl.carousel.min'
      ], function ($) {
        $("#sales_product .owl-carousel").owlCarousel({
          autoplay: true,
          autoplayTimeout: 5000,
          autoplayHoverPause: true,
          nav: false,
          dots: true,
          margin: 0,
          navRewind: true,
          animateIn: 'fadeIn',
          animateOut: 'fadeOut',
          loop: true,
          items: 1
        });
      });
    </script>
  </div>
  <div class="col-md-4 one-product" style="padding-left: 10px;padding-right: 10px;">
    <h2 class="filterproduct-title" style="background:none;"><span class="content" style="background:none;"><strong>NEW ARRIVALS</strong></span></h2>
    <div id="new_product" class="">
      {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="featured_product" product_count="3" aspect_ratio="1" image_width="350" product_type="7" template="owl_list.phtml"}}
    </div>
    <script type="text/javascript">
      require([
        'jquery',
        'owl.carousel/owl.carousel.min'
      ], function ($) {
        $("#new_product .owl-carousel").owlCarousel({
          autoplay: true,
          autoplayTimeout: 5000,
          autoplayHoverPause: true,
          nav: false,
          dots: true,
          margin: 0,
          navRewind: true,
          animateIn: 'fadeIn',
          animateOut: 'fadeOut',
          loop: true,
          items: 1
        });
      });
    </script>
  </div>
</div>
<div class="single-images" style="padding-top: 35px;">
  <div class="row">
    <div class="col-md-3 col-6" style="padding-bottom:15px;">
      <a class="image-link" href="#">
        <img src="{{media url="wysiwyg/smartwave/porto/homepage/12/content/grid1-new.jpg"}}" width="270" height="223" alt="">
      </a>
    </div>
    <div class="col-md-3 col-6" style="padding-bottom:15px;">
      <a class="image-link" href="#">
        <img src="{{media url="wysiwyg/smartwave/porto/homepage/12/content/grid2-new.jpg"}}" width="270" height="223" alt="">
      </a>
    </div>
    <div class="col-md-3 col-6" style="padding-bottom:15px;">
      <a class="image-link" href="#">
        <img src="{{media url="wysiwyg/smartwave/porto/homepage/12/content/grid3-new.jpg"}}" width="270" height="223" alt="">
      </a>
    </div>
    <div class="col-md-3 col-6" style="padding-bottom:15px;">
      <a class="image-link" href="#">
        <img src="{{media url="wysiwyg/smartwave/porto/homepage/12/content/grid4-new.jpg"}}" width="270" height="223" alt="">
      </a>
    </div>
  </div>
</div>
<div class="row" style="background-color:#fff;margin-top:20px;padding:15px 0;">
  <div class="col-lg-12">
    <h2 class="filterproduct-title" style="background:none;"><span class="content" style="background:none;"><strong>FASHION SELECTION</strong></span></h2>
    <div id="featured_product_list" class="owl-top-narrow">
      {{block class="Smartwave\Filterproducts\Block\Home\FeaturedList" name="featured_product" product_count="10" aspect_ratio="1" image_width="272" image_height="337" product_type="4" template="owl_list.phtml"}}
    </div>
    <script type="text/javascript">
      require([
        'jquery',
        'owl.carousel/owl.carousel.min'
      ], function ($) {
        $("#featured_product_list .owl-carousel").owlCarousel({
          autoplay: true,
          autoplayTimeout: 5000,
          autoplayHoverPause: true,
          loop: true,
          navRewind: true,
          margin: 0,
          nav: true,
          navText: ["<em class='porto-icon-left-open-huge'></em>","<em class='porto-icon-right-open-huge'></em>"],
          dots: false,
          responsive: {
            0: {
              items:2
            },
            768: {
              items:3
            },
            992: {
              items:3
            },
            1200: {
              items:4
            }
          }
        });
      });
    </script>
  </div>
</div>
<style type="text/css">
  .page-main {
    background-color: transparent;
    padding-bottom: 0;
  } 
  .product-item-photo {
    padding: 0;
  }
#banner-slider-demo-12 .owl-controls {
    position: absolute;
    left: 25px;
    bottom: 18px;
    margin: 0;
}
.owl-bottom-corner-narrow .owl-controls .owl-buttons div {
    color: #2f2727;
    background: transparent;
    padding: 0;
    margin: 0;
    font-size: 14px;
}
</style>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 12 - Old Skin</title>
         <identifier>porto_home_12_old</identifier>
         <content><![CDATA[<div class="row" style="background-color:#fff;margin-top:-20px;">
    <div class="col-lg-12">
        <div class="row">
            <div class="col-lg-3"></div>
            <div class="col-lg-9">
                <div id="banner-slider-demo-12" class="owl-carousel owl-banner-carousel owl-bottom-narrow">
                    <div class="item">
                        <img src="{{media url="wysiwyg/smartwave/porto/homepage/12/slider/slide01.jpg"}}" alt="" />
                        <div class="content">
                            <span style="font-weight:300;color:#303030;display:inline-block;vertical-align:middle">Now starting at <b style="font-weight:600;">$99</b></span>
                            <a class="btn btn-default" style="background-color:#303030;color:#fff;position:inline-block;vertical-align:middle;font-weight:600">SHOP NOW <i class="icon-right-dir"></i></a>
                        </div>
                    </div>
                    <div class="item">
                        <img src="{{media url="wysiwyg/smartwave/porto/homepage/12/slider/slide02.jpg"}}" alt="" />
                    </div>
                </div>
                <script type="text/javascript">
                    require([
                        'jquery',
                        'owl.carousel/owl.carousel.min'
                    ], function ($) {
                        $("#banner-slider-demo-12").owlCarousel({
                            items: 1,
                            autoplay: true,
                            autoplayTimeout: 5000,
                            autoplayHoverPause: true,
                            dots: true,
                            nav: false,
                            navRewind: true,
                            animateIn: 'fadeIn',
                            animateOut: 'fadeOut',
                            loop: true
                        });
                    });
                </script>
            </div>
        </div>
        <div class="row">
            <div class="homepage-bar">
                <div class="col-lg-4">
                    <em class="porto-icon-truck"></em><div class="text-area"><h3>FREE SHIPPING &amp; FREE RETURNS</h3><p>Free shipping on all orders over $99.</p></div>
                </div>
                <div class="col-lg-4">
                    <em class="porto-icon-dollar"></em><div class="text-area"><h3>MONEY BACK GUARANTEE</h3><p>100% money back guarantee.</p></div>
                </div>
                <div class="col-lg-4">
                    <em class="porto-icon-lifebuoy"></em><div class="text-area"><h3>ONLINE SUPPORT 24/7</h3><p>Lorem ipsum dolor sit amet.</p></div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="row" style="background-color:#fff;margin-top:10px;">
    <div class="col-lg-12">
        {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="latest_product" product_count="8" column_count="4" aspect_ratio="1" image_width="300" template="grid.phtml"}}
    </div>
</div>
<div class="row" style="background-color:#fff;margin:10px -15px;">
    <a href="#" style="display:block;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/12/content/huge_sale.jpg"}}" alt="" style="width: 100%;"></a>
</div>
<div class="row product-fullwidth" style="margin: 15px -23px 0 -23px;">
    <div class="col-md-4 one-product" style="padding-left: 8px; padding-right: 8px;">
        <h4 class="filterproduct-title">FEATURED</h4>
        <div id="featured_product" class="hide-addtocart hide-addtolinks">
            {{block class="Smartwave\Filterproducts\Block\Home\FeaturedList" name="featured_product" product_count="3" aspect_ratio="0" image_width="350" image_height="350" template="owl_list.phtml"}}
        </div>
        <script type="text/javascript">
            require([
                'jquery',
                'owl.carousel/owl.carousel.min'
            ], function ($) {
                $("#featured_product .owl-carousel").owlCarousel({
                    autoplay: true,
                    autoplayTimeout: 5000,
                    autoplayHoverPause: true,
                    nav: false,
                    dots: true,
                    navRewind: true,
                    animateIn: 'fadeIn',
                    animateOut: 'fadeOut',
                    loop: true,
                    items: 1
                });
            });
        </script>
    </div>
    <div class="col-md-4 one-product" style="padding-left: 8px; padding-right: 8px;">
        <h4 class="filterproduct-title">SALES</h4>
        <div id="sales_product" class="hide-addtocart hide-addtolinks">
            {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="featured_product" product_count="3" aspect_ratio="0" image_width="350" image_height="350" template="owl_list.phtml"}}
        </div>
        <script type="text/javascript">
            require([
                'jquery',
                'owl.carousel/owl.carousel.min'
            ], function ($) {
                $("#sales_product .owl-carousel").owlCarousel({
                    autoplay: true,
                    autoplayTimeout: 5000,
                    autoplayHoverPause: true,
                    nav: false,
                    dots: true,
                    navRewind: true,
                    animateIn: 'fadeIn',
                    animateOut: 'fadeOut',
                    loop: true,
                    items: 1
                });
            });
        </script>
    </div>
    <div class="col-md-4 one-product" style="padding-left: 8px; padding-right: 8px;">
        <h4 class="filterproduct-title">NEW ARRIVALS</h4>
        <div id="new_product" class="hide-addtocart hide-addtolinks">
            {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="featured_product" product_count="3" aspect_ratio="0" image_width="350" image_height="350" template="owl_list.phtml"}}
        </div>
        <script type="text/javascript">
            require([
                'jquery',
                'owl.carousel/owl.carousel.min'
            ], function ($) {
                $("#new_product .owl-carousel").owlCarousel({
                    autoplay: true,
                    autoplayTimeout: 5000,
                    autoplayHoverPause: true,
                    nav: false,
                    dots: true,
                    navRewind: true,
                    animateIn: 'fadeIn',
                    animateOut: 'fadeOut',
                    loop: true,
                    items: 1
                });
            });
        </script>
    </div>
</div>
<div class="row" style="background-color:#fff;margin-top:15px;padding:15px 0;">
    <div class="col-lg-12">
        <h2 class="filterproduct-title" style="background:none;"><span class="content" style="background:none;"><strong>FASHION SELECTION</strong></span></h2>
        <div id="featured_product_list" class="owl-top-narrow">
            {{block class="Smartwave\Filterproducts\Block\Home\FeaturedList" name="featured_product" product_count="10" aspect_ratio="1" image_width="272" image_height="337" template="owl_list.phtml"}}
        </div>
        <script type="text/javascript">
            require([
                'jquery',
                'owl.carousel/owl.carousel.min'
            ], function ($) {
                $("#featured_product_list .owl-carousel").owlCarousel({
                    autoplay: true,
                    autoplayTimeout: 5000,
                    autoplayHoverPause: true,
                    loop: true,
                    navRewind: true,
                    margin: 10,
                    nav: true,
                    navText: ["<em class='porto-icon-left-open-huge'></em>","<em class='porto-icon-right-open-huge'></em>"],
                    dots: false,
                    responsive: {
                        0: {
                            items:2
                        },
                        768: {
                            items:3
                        },
                        992: {
                            items:3
                        },
                        1200: {
                            items:4
                        }
                    }
                });
            });
        </script>
    </div>
</div>
<style type="text/css">
.page-main {
    background-color: transparent;
    padding-bottom: 0;
}
.homepage-bar {
    border-color: #f5f5f5;
    border-top: 0;
}
.homepage-bar p {
    font-size: 11px;
    margin-left: 5px;
}
.homepage-bar h3 {
    font-size: 13px;
}
.homepage-bar .col-lg-4 em {
    font-size: 20px;
    margin-top: -10px;
}
.homepage-bar .col-lg-4 {
    text-align: center;
    border-color: #f5f5f5;
}
.product-item-photo {
    padding: 0;
}
</style>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 13</title>
         <identifier>porto_home_13</identifier>
         <content><![CDATA[<style type="text/css">
body.boxed {
    padding: 0;
}
body.boxed .page-wrapper {
    width: 100%;
}
.page-header.type4 {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 2;
    background: transparent;
}
.page-main {
    display: none;
}
</style>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[<referenceContainer name="page.top">
    <block class="Magento\Cms\Block\Block" name="home_slider">
        <arguments>
            <argument name="block_id" xsi:type="string">porto_homeslider_13</argument>
        </arguments>
    </block>
</referenceContainer>]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 13 Old Skin</title>
         <identifier>porto_home_13_old</identifier>
         <content><![CDATA[<style type="text/css">
body.boxed {
    padding: 0;
}
body.boxed .page-wrapper {
    width: 100%;
}
.page-header.type4 {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 2;
    background: transparent;
}
.page-main {
    display: none;
}
</style>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[<referenceContainer name="page.top">
    <block class="Magento\Cms\Block\Block" name="home_slider">
        <arguments>
            <argument name="block_id" xsi:type="string">porto_homeslider_13_old</argument>
        </arguments>
    </block>
</referenceContainer>]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 14</title>
         <identifier>porto_home_14</identifier>
         <content><![CDATA[<div class="row">
  <div class="col-lg-3 col-xl-2-4">
    <div class="home-side-menu-type2" style="margin-bottom:20px;">
      <h2><em class="porto-icon-menu"></em> SHOP CATEGORIES</h2>
      <div class="side-block side-menu-type2">
        {{block class="Smartwave\Porto\Block\CategoryCollection" name="category_sidebar" template="Smartwave_Porto::category_side_2.phtml"}}
      </div>
    </div>
    <div class="featured-box-2">
      <i class="porto-icon-star-empty"></i>
      <h3>DEDICATED SERVICE</h3>
      <p>We really care about you and your website as much as you do Purchasing.</p> 
    </div>
    <div class="featured-box-2">
      <i class="porto-icon-reply"></i>
      <h3>FREE RETURNS</h3>
      <p>Your website as much as you do. Purchasing Porto or any other theme.</p> 
    </div>
  </div>
  <div class="col-lg-9 col-xl-9-6"> 
    <h2 class="filterproduct-title" style="margin-bottom: 15px;"><span class="content"><strong>FEATURED PRODUCTS</strong></span><span class="title_line"></span></h2>
    {{block class="Smartwave\Filterproducts\Block\Home\FeaturedList" name="featured_product" product_count="8" column_count="4" aspect_ratio="1" image_width="250" product_type="1" template="grid.phtml"}}
  </div>
</div>
<div class="brands-slide"> 
  <h2 class="filterproduct-title" style="margin-bottom: 4px;"><span class="content"><strong>Featured Brands</strong></span><span class="title_line"></span></h2>
  <div id="brands-slider-demo-8" class="brands-slider owl-side-narrow">
    <div class="owl-carousel">
      <div class="item"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand1.jpg"}}" alt="" /></div>
      <div class="item"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand2.jpg"}}" alt="" /></div>
      <div class="item"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand3.jpg"}}" alt="" /></div>
      <div class="item"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand4.jpg"}}" alt="" /></div>
      <div class="item"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand5.jpg"}}" alt="" /></div>
      <div class="item"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand1.jpg"}}" alt="" /></div>
      <div class="item"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand2.jpg"}}" alt="" /></div>
      <div class="item"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand3.jpg"}}" alt="" /></div>
      <div class="item"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand4.jpg"}}" alt="" /></div>
      <div class="item"><img src="{{media url="wysiwyg/smartwave/porto/brands/brand5.jpg"}}" alt="" /></div>
    </div>
    <script type="text/javascript">
      require([
        'jquery',
        'owl.carousel/owl.carousel.min'
      ], function ($) {
        $("#brands-slider-demo-8 .owl-carousel").owlCarousel({
          autoplay: true,
          autoplayTimeout: 5000,
          autoplayHoverPause: true,
          margin: 20,
          nav: true, 
          navText: ["<em class='porto-icon-left-open-big'></em>","<em class='porto-icon-right-open-big'></em>"],
          dots: false,
          loop: true,
          responsive: {
            0: {
              items:2
            },
            640: {
              items:3
            },
            768: {
              items:4
            },
            992: {
              items:5
            },
            1200: {
              items:5
            }
          }
        });
      });
    </script> 
  </div>
</div>
<h2 class="filterproduct-title" style="margin-top: 30px;margin-bottom:25px;"><span class="content"><strong>New Arrivals</strong></span><span class="title_line"></span></h2>
<div id="new_product" class="owl-bottom-narrow hide-addtocart hide-addtolinks">
  {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="new_product" product_count="12" aspect_ratio="0" image_width="212" image_height="282" product_type="1" template="owl_list.phtml"}}
</div>
<script type="text/javascript">
  require([
    'jquery',
    'owl.carousel/owl.carousel.min'
  ], function ($) {
    $("#new_product .owl-carousel").owlCarousel({
      autoplay: true,
      autoplayTimeout: 5000,
      autoplayHoverPause: true,
      loop: true,
      navRewind: true,
      margin: 0,
      nav: false,
      navText: ["<em class='porto-icon-left-open-big'></em>","<em class='porto-icon-right-open-big'></em>"],
      dots: true,
      responsive: {
        0: {
          items:2
        },
        320: {
          items:2
        },
        480: {
          items:2
        },
        640: {
          items:3
        },
        768: {
          items:4
        },
        992: {
          items:5
        },
        1200: {
          items:6
        },
        1350: {
          items:6
        }
      }
    });
  });
</script>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[<referenceContainer name="page.top">
    <block class="Magento\Cms\Block\Block" name="home_slider">
        <arguments>
            <argument name="block_id" xsi:type="string">porto_homeslider_14</argument>
        </arguments>
    </block>
</referenceContainer>]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 14 Old Skin</title>
         <identifier>porto_home_14_old</identifier>
         <content><![CDATA[<div class="homepage-bar" style="border:1px solid #e1e1e1;margin:0 0 20px 0;">
    <div class="row">
        <div class="col-lg-4" style="text-align:center;height:60px;padding-top:5px;padding-bottom:5px;">
            <em class="porto-icon-truck" style="font-size:36px;"></em><div class="text-area"><h3>FREE SHIPPING & RETURN</h3><p>Free shipping on all orders over $99.</p></div>
        </div>
        <div class="col-lg-4" style="text-align:center;height:60px;padding-top:5px;padding-bottom:5px;">
            <em class="porto-icon-dollar"></em><div class="text-area"><h3>MONEY BACK GUARANTEE</h3><p>100% money back guarantee.</p></div>
        </div>
        <div class="col-lg-4" style="text-align:center;height:60px;padding-top:5px;padding-bottom:5px;">
            <em class="porto-icon-lifebuoy" style="font-size:32px;"></em><div class="text-area"><h3>ONLINE SUPPORT 24/7</h3><p>Lorem ipsum dolor sit amet.</p></div>
        </div>
    </div>
</div>
<div class="row">
    <div class="col-lg-3 col-xl-2-4">
        <div class="home-side-menu-type2" style="margin-bottom:20px;">
            <h2><em class="porto-icon-menu"></em> SHOP CATEGORIES</h2>
            <div class="side-block side-menu-type2">
                {{block class="Smartwave\Porto\Block\CategoryCollection" name="category_sidebar" template="Smartwave_Porto::category_side_2.phtml"}}
            </div>
        </div>
        <div class="featured-box-2">
            <h3><em class="porto-icon-star"></em> DEDICATED SERVICE</h3>
            <p>Consult our specialists for help with an order, customization, or design advice.</p>
            <a href="#">Get in Touch &gt;</a>
        </div>
        <div class="featured-box-2">
            <h3><em class="porto-icon-reply"></em> FREE RETURNS</h3>
            <p>We stand behind our goods and services and want you to be satisfied with them.</p>
            <a href="#">Returns Policy &gt;</a>
        </div>
    </div>
    <div class="col-lg-9 col-xl-9-6">
        <h3 style="font-size: 15px;font-weight: 600;color: #333;margin-top:0;margin-bottom:15px;">FEATURED PRODUCTS</h3>
        {{block class="Smartwave\Filterproducts\Block\Home\FeaturedList" name="featured_product" product_count="8" column_count="4" move_actions="1" aspect_ratio="0" image_width="250" image_height="250" template="grid.phtml"}}
    </div>
</div>
<h2 class="filterproduct-title" style="margin-bottom: 4px;"><span class="content"><strong>Featured Brands</strong></span></h2>
<div id="brands-slider-demo-8" class="brands-slider owl-top-narrow">
    <div class="owl-carousel">
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand1.jpg"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand2.jpg"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand3.jpg"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand4.jpg"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand5.jpg"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand6.jpg"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand1.jpg"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand2.jpg"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand3.jpg"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand4.jpg"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand5.jpg"}}" alt="" /></div>
        <div class="item" style="padding-top:10px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand6.jpg"}}" alt="" /></div>
    </div>
    <script type="text/javascript">
        require([
            'jquery',
            'owl.carousel/owl.carousel.min'
        ], function ($) {
            $("#brands-slider-demo-8 .owl-carousel").owlCarousel({
                autoplay: true,
                autoplayTimeout: 5000,
                autoplayHoverPause: true,
                margin: 30,
                nav: true,
                navText: ["<em class='porto-icon-left-open-huge'></em>","<em class='porto-icon-right-open-huge'></em>"],
                dots: false,
                loop: true,
                responsive: {
                    0: {
                        items:2
                    },
                    640: {
                        items:3
                    },
                    768: {
                        items:4
                    },
                    992: {
                        items:5
                    },
                    1200: {
                        items:6
                    }
                }
            });
        });
    </script>
</div>
<h2 class="filterproduct-title" style="margin-top: 30px;"><span class="content"><strong>New Arrivals</strong></span></h2>
<div id="new_product" class="owl-top-narrow hide-addtocart hide-addtolinks">
    {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="new_product" product_count="12" aspect_ratio="0" image_width="212" image_height="263" template="owl_list.phtml"}}
</div>
<script type="text/javascript">
    require([
        'jquery',
        'owl.carousel/owl.carousel.min'
    ], function ($) {
        $("#new_product .owl-carousel").owlCarousel({
            autoplay: true,
            autoplayTimeout: 5000,
            autoplayHoverPause: true,
            loop: true,
            navRewind: true,
            margin: 10,
            nav: true,
            navText: ["<em class='porto-icon-left-open-huge'></em>","<em class='porto-icon-right-open-huge'></em>"],
            dots: false,
            responsive: {
                0: {
                    items:1
                },
                320: {
                    items:1
                },
                480: {
                    items:2
                },
                640: {
                    items:3
                },
                768: {
                    items:4
                },
                992: {
                    items:6
                },
                1200: {
                    items:7
                },
                1350: {
                    items:8
                }
            }
        });
    });
</script>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[<referenceContainer name="page.top">
    <block class="Magento\Cms\Block\Block" name="home_slider">
        <arguments>
            <argument name="block_id" xsi:type="string">porto_homeslider_14_old</argument>
        </arguments>
    </block>
</referenceContainer>]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 16</title>
         <identifier>porto_home_16</identifier>
         <content><![CDATA[<style type="text/css">
.page-main {
    display: none;
}
.page-header.type10.header-new-skin {
    background-color: rgba(0,0,0,.7);
}
.page-footer {
    display: none;
}
.full-screen-slider {
    position: fixed;
    left: 0;
    top: 0;
    z-index: 1;
    width: 100vw;
    height: 100vh;
}
</style>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[<referenceContainer name="page.top">
    <block class="Magento\Cms\Block\Block" name="home_slider">
        <arguments>
            <argument name="block_id" xsi:type="string">porto_homeslider_16</argument>
        </arguments>
    </block>
</referenceContainer>]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 16 Old Skin</title>
         <identifier>porto_home_16_old</identifier>
         <content><![CDATA[<style type="text/css">
.page-main {
    display: none;
}
.page-header.type10 {
    background-color: rgba(0,0,0,.5);
}
.page-footer {
    display: none;
}
.full-screen-slider {
    position: fixed;
    left: 0;
    top: 0;
    z-index: 1;
    width: 100vw;
    height: 100vh;
}
</style>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[<referenceContainer name="page.top">
    <block class="Magento\Cms\Block\Block" name="home_slider">
        <arguments>
            <argument name="block_id" xsi:type="string">porto_homeslider_16_old</argument>
        </arguments>
    </block>
</referenceContainer>]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 17</title>
         <identifier>porto_home_17</identifier>
         <content><![CDATA[{{block class="Smartwave\Filterproducts\Block\Home\FeaturedList" name="featured_product" product_count="8" column_count="4" aspect_ratio="0" image_width="250" image_height="250" product_type="2" template="grid.phtml"}}
<style type="text/css">
.products-grid.flex-grid {
    margin: 0;
}
.page-main, .columns .column.main {
    padding-top: 0;
    padding-bottom: 0;
}
</style>
<script type="text/javascript">
    require([
        'jquery'        
    ], function ($) {
        $('.products.grid .product-items li.product-item:nth-child(2n)').addClass('nth-child-2n');
        $('.products.grid .product-items li.product-item:nth-child(2n+1)').addClass('nth-child-2np1');
        $('.products.grid .product-items li.product-item:nth-child(3n)').addClass('nth-child-3n');
        $('.products.grid .product-items li.product-item:nth-child(3n+1)').addClass('nth-child-3np1');
        $('.products.grid .product-items li.product-item:nth-child(4n)').addClass('nth-child-4n');
        $('.products.grid .product-items li.product-item:nth-child(4n+1)').addClass('nth-child-4np1');
        $('.products.grid .product-items li.product-item:nth-child(5n)').addClass('nth-child-5n');
        $('.products.grid .product-items li.product-item:nth-child(5n+1)').addClass('nth-child-5np1');
        $('.products.grid .product-items li.product-item:nth-child(6n)').addClass('nth-child-6n');
        $('.products.grid .product-items li.product-item:nth-child(6n+1)').addClass('nth-child-6np1');
        $('.products.grid .product-items li.product-item:nth-child(7n)').addClass('nth-child-7n');
        $('.products.grid .product-items li.product-item:nth-child(7n+1)').addClass('nth-child-7np1');
        $('.products.grid .product-items li.product-item:nth-child(8n)').addClass('nth-child-8n');
        $('.products.grid .product-items li.product-item:nth-child(8n+1)').addClass('nth-child-8np1');
    });
</script>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[<referenceContainer name="page.top">
    <block class="Magento\Cms\Block\Block" name="home_slider">
        <arguments>
            <argument name="block_id" xsi:type="string">porto_homeslider_17</argument>
        </arguments>
    </block>
</referenceContainer>]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 17 Old Skin</title>
         <identifier>porto_home_17_old</identifier>
         <content><![CDATA[{{block class="Smartwave\Filterproducts\Block\Home\FeaturedList" name="featured_product" product_count="8" column_count="4" aspect_ratio="0" image_width="250" image_height="250" template="flex_grid.phtml"}}
<style type="text/css">
.products-grid.flex-grid {
    margin: 0;
}
.page-main, .columns .column.main {
    padding-top: 0;
    padding-bottom: 0;
}
</style>
<script type="text/javascript">
    require([
        'jquery'
    ], function ($) {
        $('.products.grid .product-items li.product-item:nth-child(2n)').addClass('nth-child-2n');
        $('.products.grid .product-items li.product-item:nth-child(2n+1)').addClass('nth-child-2np1');
        $('.products.grid .product-items li.product-item:nth-child(3n)').addClass('nth-child-3n');
        $('.products.grid .product-items li.product-item:nth-child(3n+1)').addClass('nth-child-3np1');
        $('.products.grid .product-items li.product-item:nth-child(4n)').addClass('nth-child-4n');
        $('.products.grid .product-items li.product-item:nth-child(4n+1)').addClass('nth-child-4np1');
        $('.products.grid .product-items li.product-item:nth-child(5n)').addClass('nth-child-5n');
        $('.products.grid .product-items li.product-item:nth-child(5n+1)').addClass('nth-child-5np1');
        $('.products.grid .product-items li.product-item:nth-child(6n)').addClass('nth-child-6n');
        $('.products.grid .product-items li.product-item:nth-child(6n+1)').addClass('nth-child-6np1');
        $('.products.grid .product-items li.product-item:nth-child(7n)').addClass('nth-child-7n');
        $('.products.grid .product-items li.product-item:nth-child(7n+1)').addClass('nth-child-7np1');
        $('.products.grid .product-items li.product-item:nth-child(8n)').addClass('nth-child-8n');
        $('.products.grid .product-items li.product-item:nth-child(8n+1)').addClass('nth-child-8np1');
    });
</script>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[<referenceContainer name="page.top">
    <block class="Magento\Cms\Block\Block" name="home_slider">
        <arguments>
            <argument name="block_id" xsi:type="string">porto_homeslider_17_old</argument>
        </arguments>
    </block>
</referenceContainer>]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 18</title>
         <identifier>porto_home_18</identifier>
         <content><![CDATA[<p class="filter-title-type-2" style="margin-top:60px;"><span style="text-align:center;">WEEKLY FEATURED PRODUCTS</span></p>
<div id="weekly_featured_product" class="hide-addtocart hide-addtolinks owl-middle-outer-narrow">
  {{block class="Smartwave\Filterproducts\Block\Home\FeaturedList" name="featured_product" product_count="10" aspect_ratio="1" image_width="300" image_height="300" product_type="1" template="owl_list.phtml"}}
</div>
<script type="text/javascript">
  require([
    'jquery',
    'owl.carousel/owl.carousel.min'
  ], function ($) {
    $("#weekly_featured_product .owl-carousel").owlCarousel({
      autoplay: true,
      autoplayTimeout: 5000,
      autoplayHoverPause: true,
      margin: 0,
      nav: true,
      navRewind: true,
      animateIn: 'fadeIn',
      animateOut: 'fadeOut',
      dots: false,
      navText: ["<em class='porto-icon-angle-left'></em>","<em class='porto-icon-angle-right'></em>"],
      loop: true,
      responsive: {
        0: {
          items:2
        },
        320: {
          items:2
        },
        480: {
          items:2
        },
        768: {
          items:3
        },
        992: {
          items:4
        },
        1200: {
          items:5
        }
      }
    });
  });
</script>
<p class="filter-title-type-2" style="margin-top:60px"><span style="text-align:center;font-size:17px;">FEATURED BRANDS</span></p>
<div class="owl-middle-outer-narrow">
  <div id="brands-slider-demo-18" class="owl-carousel">
    <img class="owl-lazy" data-src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand1.jpg"}}" alt="" />
    <img class="owl-lazy" data-src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand2.jpg"}}" alt="" />
    <img class="owl-lazy" data-src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand3.jpg"}}" alt="" />
    <img class="owl-lazy" data-src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand4.jpg"}}" alt="" />
    <img class="owl-lazy" data-src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand5.jpg"}}" alt="" />
    <img class="owl-lazy" data-src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand6.jpg"}}" alt="" />
    <img class="owl-lazy" data-src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand1.jpg"}}" alt="" />
    <img class="owl-lazy" data-src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand2.jpg"}}" alt="" />
    <img class="owl-lazy" data-src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand3.jpg"}}" alt="" />
    <img class="owl-lazy" data-src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand4.jpg"}}" alt="" />
    <img class="owl-lazy" data-src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand5.jpg"}}" alt="" />
    <img class="owl-lazy" data-src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand6.jpg"}}" alt="" />
  </div>
  <script type="text/javascript">
    require([
      'jquery',
      'owl.carousel/owl.carousel.min'
    ], function ($) {
      $("#brands-slider-demo-18").owlCarousel({
        autoplay: true,
        autoplayTimeout: 5000,
        autoplayHoverPause: true,
        margin: 20,
        nav: true,
        navRewind: true,
        animateIn: 'fadeIn',
        animateOut: 'fadeOut',
        dots: false, 
        navText: ["<em class='porto-icon-angle-left'></em>","<em class='porto-icon-angle-right'></em>"],
        loop: true,
        lazyLoad: true,
        responsive: {
          0: {
            items:2
          },
          320: {
            items:2
          },
          480: {
            items:2
          },
          640: {
            items:3
          },
          768: {
            items:4
          },
          992: {
            items:5
          },
          1200: {
            items:6
          }
        }
      });
    });
  </script>
</div>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[<referenceContainer name="page.top">
    <block class="Magento\Cms\Block\Block" name="home_slider">
        <arguments>
            <argument name="block_id" xsi:type="string">porto_homeslider_18</argument>
        </arguments>
    </block>
</referenceContainer>]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 18 Old Skin</title>
         <identifier>porto_home_18_old</identifier>
         <content><![CDATA[<p class="filter-title-type-2" style="margin-top:10px;"><span class="title-line">&nbsp;</span><span style="width: 315px;text-align: center;font-weight: 600;color: #3d3734;">WEEKLY FEATURED PRODUCTS</span><span class="title-line">&nbsp;</span></p>
<div id="weekly_featured_product" class="hide-addtocart hide-addtolinks owl-middle-outer-narrow">
    {{block class="Smartwave\Filterproducts\Block\Home\FeaturedList" name="featured_product" product_count="10" aspect_ratio="0" image_width="250" image_height="250" template="owl_list.phtml"}}
</div>
<script type="text/javascript">
    require([
        'jquery',
        'owl.carousel/owl.carousel.min'
    ], function ($) {
        $("#weekly_featured_product .owl-carousel").owlCarousel({
            autoplay: true,
            autoplayTimeout: 5000,
            autoplayHoverPause: true,
            margin: 10,
            nav: false,
            dots: false,
            navRewind: true,
            animateIn: 'fadeIn',
            animateOut: 'fadeOut',
            loop: true,
            responsive: {
                0: {
                    items:1
                },
                320: {
                    items:1
                },
                480: {
                    items:2
                },
                768: {
                    items:3
                },
                992: {
                    items:4
                },
                1200: {
                    items:5
                }
            }
        });
    });
</script>
<p class="filter-title-type-2" style="margin-top:30px"><span class="title-line">&nbsp;</span><span style="width: 225px;text-align: center;font-weight: 600;color: #3d3734;">FEATURED BRANDS</span><span class="title-line">&nbsp;</span></p>
<div class="owl-middle-outer-narrow">
    <div id="brands-slider-demo-18" class="owl-carousel">
        <img class="owl-lazy" data-src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand1.jpg"}}" alt="" />
        <img class="owl-lazy" data-src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand2.jpg"}}" alt="" />
        <img class="owl-lazy" data-src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand3.jpg"}}" alt="" />
        <img class="owl-lazy" data-src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand4.jpg"}}" alt="" />
        <img class="owl-lazy" data-src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand5.jpg"}}" alt="" />
        <img class="owl-lazy" data-src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand6.jpg"}}" alt="" />
        <img class="owl-lazy" data-src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand1.jpg"}}" alt="" />
        <img class="owl-lazy" data-src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand2.jpg"}}" alt="" />
        <img class="owl-lazy" data-src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand3.jpg"}}" alt="" />
        <img class="owl-lazy" data-src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand4.jpg"}}" alt="" />
        <img class="owl-lazy" data-src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand5.jpg"}}" alt="" />
        <img class="owl-lazy" data-src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand6.jpg"}}" alt="" />
    </div>
    <script type="text/javascript">
        require([
            'jquery',
            'owl.carousel/owl.carousel.min'
        ], function ($) {
            $("#brands-slider-demo-18").owlCarousel({
                autoplay: true,
                autoplayTimeout: 5000,
                autoplayHoverPause: true,
                margin: 10,
                nav: false,
                dots: false,
                navRewind: true,
                animateIn: 'fadeIn',
                animateOut: 'fadeOut',
                loop: true,
                lazyLoad: true,
                responsive: {
                    0: {
                        items:1
                    },
                    320: {
                        items:1
                    },
                    480: {
                        items:2
                    },
                    640: {
                        items:3
                    },
                    768: {
                        items:4
                    },
                    992: {
                        items:5
                    },
                    1200: {
                        items:6
                    }
                }
            });
        });
    </script>
</div>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[<referenceContainer name="page.top">
    <block class="Magento\Cms\Block\Block" name="home_slider">
        <arguments>
            <argument name="block_id" xsi:type="string">porto_homeslider_18_old</argument>
        </arguments>
    </block>
</referenceContainer>]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 15</title>
         <identifier>porto_home_15</identifier>
         <content><![CDATA[<p></p>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[<referenceContainer name="page.top">
    <block class="Magento\Cms\Block\Block" name="home_slider">
        <arguments>
            <argument name="block_id" xsi:type="string">porto_homeslider_15</argument>
        </arguments>
    </block>
</referenceContainer>]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 15 Old Skin</title>
         <identifier>porto_home_15_old</identifier>
         <content><![CDATA[<p></p>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[<referenceContainer name="page.top">
    <block class="Magento\Cms\Block\Block" name="home_slider">
        <arguments>
            <argument name="block_id" xsi:type="string">porto_homeslider_15_old</argument>
        </arguments>
    </block>
</referenceContainer>]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 19</title>
         <identifier>porto_home_19</identifier>
         <content><![CDATA[{{block class="Smartwave\Porto\Block\Template" template="Smartwave_Megamenu::onepagecategory/onepagecategory.phtml" aspect_ratio="1" image_width="300" image_height="300" move_actions="0" lazy_owl="1" columns="{ 0:{items:2},768:{items:3},992:{items:4},1200:{items:5} }" product_count="12"}}]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[<referenceContainer name="page.top">
    <block class="Magento\Cms\Block\Block" name="home_slider">
        <arguments>
            <argument name="block_id" xsi:type="string">porto_homeslider_19</argument>
        </arguments>
    </block>
</referenceContainer>]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 19 Old Skin</title>
         <identifier>porto_home_19_old</identifier>
         <content><![CDATA[{{block class="Smartwave\Porto\Block\Template" template="Smartwave_Megamenu::onepagecategory/onepagecategory.phtml" aspect_ratio="1" image_width="300" image_height="300" lazy_owl="1" columns="{ 0:{items:2},768:{items:3},992:{items:4},1200:{items:5} }" product_count="12"}}]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[<referenceContainer name="page.top">
    <block class="Magento\Cms\Block\Block" name="home_slider">
        <arguments>
            <argument name="block_id" xsi:type="string">porto_homeslider_19_old</argument>
        </arguments>
    </block>
</referenceContainer>]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 20</title>
         <identifier>porto_home_20</identifier>
         <content><![CDATA[{{block class="Smartwave\Porto\Block\Template" aspect_ratio="1" image_width="275" template="ajaxproducts/ajaxproducts.phtml"}}

<div id="home-content-slider-demo-20" class="owl-carousel owl-bottom-narrow owl-banner-carousel">
  <div class="item" style="position:relative;">
    <img src="{{media url="wysiwyg/smartwave/porto/homepage/20/content/home_shoes.jpg"}}" alt="" />
    <div class="content" style="position:absolute;right:15%;top:20%">
      <h3>Adidas Ultra Boost</h3>
      <p><img src="{{media url="wysiwyg/smartwave/porto/homepage/20/content/shoes.png"}}" alt="" /></p>
      <a href="#">Shop Now</a>
    </div>
  </div>
  <div class="item" style="position:relative;">
    <img src="{{media url="wysiwyg/smartwave/porto/homepage/20/content/home_shoes.jpg"}}" alt="" />
    <div class="content" style="position:absolute;right:15%;top:20%">
      <h3>Adidas Ultra Boost</h3>
      <p><img src="{{media url="wysiwyg/smartwave/porto/homepage/20/content/shoes.png"}}" alt="" /></p>
      <a href="#">Shop Now</a>
    </div>
  </div>
  <div class="item" style="position:relative;">
    <img src="{{media url="wysiwyg/smartwave/porto/homepage/20/content/home_shoes.jpg"}}" alt="" />
    <div class="content" style="position:absolute;right:15%;top:20%">
      <h3>Adidas Ultra Boost</h3>
      <p><img src="{{media url="wysiwyg/smartwave/porto/homepage/20/content/shoes.png"}}" alt="" /></p>
      <a href="#">Shop Now</a>
    </div>
  </div>
</div>
<script type="text/javascript">
  require([
    'jquery',
    'owl.carousel/owl.carousel.min'
  ], function ($) {
    var owl_20 = $("#home-content-slider-demo-20").owlCarousel({
      items: 1,
      autoplay: true,
      autoplayTimeout: 5000,
      autoplayHoverPause: true,
      dots: true,
      navRewind: true,
      animateIn: 'fadeIn',
      animateOut: 'fadeOut',
      loop: true,
      nav: false,
      navText: ["<em class='porto-icon-chevron-left'></em>","<em class='porto-icon-chevron-right'></em>"]
    });
  });
</script>
<div style="padding: 0 15px;margin-bottom: 50px;">
  <h2 class="filterproduct-title"><span class="content">Featured Items</span></h2>
  <div id="featured_product">
    {{block class="Smartwave\Filterproducts\Block\Home\FeaturedList" name="featured_product" product_count="10" aspect_ratio="1" image_width="212" product_type="3" template="owl_list.phtml"}}
  </div>
  <script type="text/javascript">
    require([
      'jquery',
      'owl.carousel/owl.carousel.min'
    ], function ($) {
      $("#featured_product .owl-carousel").owlCarousel({
        autoplay: true,
        autoplayTimeout: 5000,
        autoplayHoverPause: true,
        loop: true,
        navRewind: true,
        margin: 0,
        nav: false,
        navText: ["<em class='porto-icon-left-open-huge'></em>","<em class='porto-icon-right-open-huge'></em>"],
        dots: true,
        responsive: {
          0: {
            items:2
          },
          768: {
            items:3
          },
          992: {
            items:4
          },
          1200: {
            items:6
          }
        }
      });
    });
  </script>
</div>
<div class="full-width-image" style="background:url({{media url="wysiwyg/smartwave/porto/homepage/20/content/home_golf.jpg"}}) center no-repeat;background-size: cover;">
  <h3>Explore the best of you.</h3>
  <a href="#">Shop By Golf</a>
</div>
<style type="text/css">
  h2.filterproduct-title {
    background: none;  
    font-size: 22px;
    font-family: 'Oswald';
    font-weight: 400;
    line-height: 1;
    letter-spacing: 0.05em;
    text-align: center;
    color: #282d3b;
    margin-top: 100px;
    margin-bottom: 30px;
    
  }
  .filterproduct-title .content {
    padding: 0;
    background-color: transparent;
  }
  body.layout-fullwidth.cms-index-index .page-main {
    padding: 0;
  }
  .columns .column.main {
    padding: 0;
  }
  .owl-theme .owl-controls {
    margin: 0;
  } 
  #home-content-slider-demo-20 .item > div.content > h3 {
    font-family: 'Oswald';
    color: #fff;
    font-size: 40px;
    line-height: 88px;
    font-weight: 400;
    letter-spacing: 0.025em;
    margin-bottom: 20px;
    text-transform: uppercase;
  }
  #home-content-slider-demo-20 .item > div.content > a {
    box-shadow: none;
    font-family: 'Oswald';
    font-size:12px;
    font-weight:700;
    letter-spacing: 0.2em;
  }
  #home-content-slider-demo-20.owl-theme .owl-dots .owl-dot span {
    background: transparent;
    border: 2px solid #fff;
  }
  #home-content-slider-demo-20.owl-theme .owl-dots .owl-dot.active span, #home-content-slider-demo-20 .owl-theme .owl-dots .owl-dot:hover span {
    background: #fff;
  }
  #home-content-slider-demo-20.owl-bottom-narrow .owl-controls {
    bottom: 50px;
  }
  .product-item-photo {
    padding: 0;
    border: 0;
  }
  .ajax-products .product.actions {display:none;}
  .ajax-products .product-item .product-reviews-summary {
    display: none;
  }
  @media (max-width: 767px) { 
    #home-content-slider-demo-20.owl-bottom-narrow .owl-controls {
      bottom: 5px;
    }
  }
</style>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[<referenceContainer name="page.top">
    <block class="Magento\Cms\Block\Block" name="home_slider">
        <arguments>
            <argument name="block_id" xsi:type="string">porto_homeslider_20</argument>
        </arguments>
    </block>
</referenceContainer>]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 20 Old Skin</title>
         <identifier>porto_home_20_old</identifier>
         <content><![CDATA[<div style="padding: 0 15px;margin-bottom: 50px;">
    <h2 class="filterproduct-title"><span class="content"><strong>Featured Items</strong></span></h2>
    <div id="featured_product">
        {{block class="Smartwave\Filterproducts\Block\Home\FeaturedList" name="featured_product" product_count="10" aspect_ratio="1" image_width="212" template="owl_list.phtml"}}
    </div>
    <script type="text/javascript">
        require([
            'jquery',
            'owl.carousel/owl.carousel.min'
        ], function ($) {
            $("#featured_product .owl-carousel").owlCarousel({
                autoplay: true,
                autoplayTimeout: 5000,
                autoplayHoverPause: true,
                loop: true,
                navRewind: true,
                margin: 10,
                nav: false,
                navText: ["<em class='porto-icon-left-open-huge'></em>","<em class='porto-icon-right-open-huge'></em>"],
                dots: true,
                responsive: {
                    0: {
                        items:2
                    },
                    768: {
                        items:3
                    },
                    992: {
                        items:4
                    },
                    1200: {
                        items:5
                    }
                }
            });
        });
    </script>
</div>
<div id="home-content-slider-demo-20" class="owl-carousel owl-bottom-narrow owl-banner-carousel">
    <div class="item" style="position:relative;">
        <img src="{{media url="wysiwyg/smartwave/porto/homepage/20/content/home_shoes.jpg"}}" alt="" />
        <div class="content" style="position:absolute;right:15%;top:20%">
            <h3>Adidas Ultra Boost</h3>
            <p><img src="{{media url="wysiwyg/smartwave/porto/homepage/20/content/shoes.png"}}" alt="" /></p>
            <a href="#">Shop Now</a>
        </div>
    </div>
    <div class="item" style="position:relative;">
        <img src="{{media url="wysiwyg/smartwave/porto/homepage/20/content/home_shoes.jpg"}}" alt="" />
        <div class="content" style="position:absolute;right:15%;top:20%">
            <h3>Adidas Ultra Boost</h3>
            <p><img src="{{media url="wysiwyg/smartwave/porto/homepage/20/content/shoes.png"}}" alt="" /></p>
            <a href="#">Shop Now</a>
        </div>
    </div>
    <div class="item" style="position:relative;">
        <img src="{{media url="wysiwyg/smartwave/porto/homepage/20/content/home_shoes.jpg"}}" alt="" />
        <div class="content" style="position:absolute;right:15%;top:20%">
            <h3>Adidas Ultra Boost</h3>
            <p><img src="{{media url="wysiwyg/smartwave/porto/homepage/20/content/shoes.png"}}" alt="" /></p>
            <a href="#">Shop Now</a>
        </div>
    </div>
</div>
<script type="text/javascript">
    require([
        'jquery',
        'owl.carousel/owl.carousel.min'
    ], function ($) {
        var owl_20 = $("#home-content-slider-demo-20").owlCarousel({
            items: 1,
            autoplay: true,
            autoplayTimeout: 5000,
            autoplayHoverPause: true,
            dots: true,
            navRewind: true,
            animateIn: 'fadeIn',
            animateOut: 'fadeOut',
            loop: true,
            nav: false,
            navText: ["<em class='porto-icon-chevron-left'></em>","<em class='porto-icon-chevron-right'></em>"]
        });
    });
</script>
{{block class="Smartwave\Porto\Block\Template" template="ajaxproducts/ajaxproducts.phtml"}}
<div class="full-width-image" style="background:url({{media url="wysiwyg/smartwave/porto/homepage/20/content/home_golf.jpg"}}) center no-repeat;background-size: cover;">
    <h3>Explore the best of you.</h3>
    <a href="#">Shop By Golf</a>
</div>
<style type="text/css">
@media (min-width: 768px) {
    #featured_product {
        padding: 0 85px;
    }
}
h2.filterproduct-title {
    background: none;
    font-size: 40px;
    font-weight: 600;
    line-height: 1;
    text-align: center;
    color: #000;
    margin-top: 90px;
    margin-bottom: 80px;
}
.filterproduct-title .content {
    padding: 0;
    background-color: transparent;
}
body.layout-fullwidth.cms-index-index .page-main {
    padding: 0;
}
.columns .column.main {
    padding: 0;
}
.owl-theme .owl-controls {
    margin: 0;
}
#home-content-slider-demo-20.owl-theme .owl-dots .owl-dot span {
    background: transparent;
    border: 2px solid #fff;
}
#home-content-slider-demo-20.owl-theme .owl-dots .owl-dot.active span, #home-content-slider-demo-20 .owl-theme .owl-dots .owl-dot:hover span {
    background: #fff;
}
#home-content-slider-demo-20.owl-bottom-narrow .owl-controls {
    bottom: 50px;
}
.product-item-photo {
    padding: 0;
    border: 0;
}
.product.actions, .product-item .product-reviews-summary {
    display: none;
}
.product-item-name.product.name > a {
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    color: #000;
}
.product-item-name.product.name > a:hover {
    text-decoration: none;
}
.page-header.type13 {
    background: transparent;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    border: 0;
}
@media (max-width: 767px) {
    h2.filterproduct-title {
        margin: 40px 0;
        font-size: 25px;
    }
    #home-content-slider-demo-20.owl-bottom-narrow .owl-controls {
        bottom: 5px;
    }
}
</style>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[<referenceContainer name="page.top">
    <block class="Magento\Cms\Block\Block" name="home_slider">
        <arguments>
            <argument name="block_id" xsi:type="string">porto_homeslider_20_old</argument>
        </arguments>
    </block>
</referenceContainer>]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 21</title>
         <identifier>porto_home_21</identifier>
         <content><![CDATA[<div style="padding-top: 55px;">
  <div class="row">
    <div class="col-md-12">
      <h2 class="filterproduct-title"><span class="content"><strong>WEEKLY FEATURED PRODUCTS</strong></span></h2>
      <div id="featured_product" class="owl-side-narrow hide-addtolinks hide-addtocart" style="margin: 0 -10px;">
        {{block class="Smartwave\Filterproducts\Block\Home\FeaturedList" name="featured_product" product_count="10" aspect_ratio="1" image_width="300" image_height="345" template="owl_list.phtml"}}
      </div>
      <script type="text/javascript">
        require([
          'jquery',
          'owl.carousel/owl.carousel.min'
        ], function ($) {
          $("#featured_product .owl-carousel").owlCarousel({
            autoplay: true,
            autoplayTimeout: 5000,
            autoplayHoverPause: true,
            loop: true,
            navRewind: true,
            margin: 0,
            nav: true,
            navText: ["<em class='porto-icon-left-open-huge'></em>","<em class='porto-icon-right-open-huge'></em>"],
            dots: false,
            responsive: {
              0: {
                items:2
              },
              768: {
                items:3
              },
              992: {
                items:4
              },
              1200: {
                items:4
              }
            }
          });
        });
      </script>
    </div>
  </div>
</div>
<div style="padding-top: 55px;">
  <h2 class="filterproduct-title"><span class="content"><strong>Offers and deals</strong></span></h2>
  <div class="offer-deal">
    <div class="row">
      <div class="col-md-6">
        <div class="item" style="padding: 15px 0;">
          <img src="{{media url="wysiwyg/smartwave/porto/homepage/21/content/banner1.jpg"}}"/>
          <div class="content" style="position:absolute;top: 36%; left:13%;">
            <h3><a href="#">Jeans</a></h3>
            <p>$10 cashback</p>
          </div>
        </div>
      </div>
      <div class="col-md-6">
        <div class="item" style="padding: 15px 0;">
          <img src="{{media url="wysiwyg/smartwave/porto/homepage/21/content/banner2.jpg"}}" />
          <div class="content" style="position:absolute;top:35%; right:13%;">
            <h3><a href="#">25%OFF</a></h3>
            <a href="#" class="btn btn-default" style="background-color:#1FC0A0;color:#fff;">View the collection</a>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
<div style="padding-top: 15px;">
  <div class="subscribe-form" style="background: url({{media url="wysiwyg/smartwave/porto/homepage/21/content/sub-bg.jpg"}}) center right no-repeat;background-size:cover;height:351px;">
    <div class="content" style="padding: 105px 0 0 17%;">
      <h3>Never miss any deals</h3>
      <p>subscribe to the newsletter!</p>
      {{block class="Magento\Newsletter\Block\Subscribe" name="home.newsletter" template="subscribe_form_footer.phtml"}}
    </div>
  </div>
</div>
<div class="our-brands" style="padding:55px 0 15px;margin-top:15px;margin-bottom: 40px;">
  <h2 class="filterproduct-title"><span class="content"><strong>Our Brands</strong></span></h2>
  <div class="owl-side-narrow" style="margin: 0 -13px;">
    <div id="brands-slider-demo-21" class="brands-slider">
      <div class="owl-carousel">
        <div class="item" style="padding:10px 13px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand1.jpg"}}" alt="" /></div>
        <div class="item" style="padding:10px 13px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand2.jpg"}}" alt="" /></div>
        <div class="item" style="padding:10px 13px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand3.jpg"}}" alt="" /></div>
        <div class="item" style="padding:10px 13px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand4.jpg"}}" alt="" /></div>
        <div class="item" style="padding:10px 13px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand5.jpg"}}" alt="" /></div>
        <div class="item" style="padding:10px 13px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand1.jpg"}}" alt="" /></div>
        <div class="item" style="padding:10px 13px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand2.jpg"}}" alt="" /></div>
        <div class="item" style="padding:10px 13px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand3.jpg"}}" alt="" /></div>
        <div class="item" style="padding:10px 13px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand4.jpg"}}" alt="" /></div>
        <div class="item" style="padding:10px 13px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/brand_logos/brand5.jpg"}}" alt="" /></div>
      </div>
      <script type="text/javascript">
        require([
          'jquery',
          'owl.carousel/owl.carousel.min'
        ], function ($) {
          $("#brands-slider-demo-21 .owl-carousel").owlCarousel({
            autoplay: true,
            autoplayTimeout: 5000,
            autoplayHoverPause: true,
            margin: 0,
            nav: true,
            navText: ["<em class='porto-icon-left-open-huge'></em>","<em class='porto-icon-right-open-huge'></em>"],
            dots: false,
            loop: true,
            responsive: {
              0: {
                items:2
              },
              640: {
                items:3
              },
              768: {
                items:4
              },
              992: {
                items:5
              },
              1200: {
                items:6
              }
            }
          });
        });
      </script>
    </div>
  </div>
</div>
<style>
.column.main {
    min-height: auto;
    padding:0;
}
.page-main {
    padding-top:0;
    padding-bottom: 0;
}
.columns .column.main {
    padding-bottom:0;
}
</style>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[<referenceContainer name="page.top">
    <block class="Magento\Cms\Block\Block" name="home_slider">
        <arguments>
            <argument name="block_id" xsi:type="string">porto_homeslider_21</argument>
        </arguments>
    </block>
</referenceContainer>]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 22</title>
         <identifier>porto_home_22</identifier>
         <content><![CDATA[<style type="text/css">
.page-main {
    max-width: 100%;
    padding: 0;
}
.columns .column.main {
    padding: 0;
}
#banner-slider-demo-22 h5 {
    font-size: 27px;
    line-height: 1.2;
    text-transform: uppercase;
    font-weight: 400;
    letter-spacing: -.01em;
    margin: 0;
    margin-bottom: 0;
    color: #444;
}
#banner-slider-demo-22 h2 {
    font-size: 60px;
    line-height: 1.2;
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: -.05em;
    margin: 0;
    margin-left: -3px;
    margin-bottom: 7px;
    color: #222529;
}
#banner-slider-demo-22 p {
    margin: 0;
}
#banner-slider-demo-22 a.btn {
    font-size: 16px;
    font-weight: 600;
    text-transform: uppercase;
    color: #fff;
    background-color: #222529;
    margin-top: 30px;
    padding: 20px 47px;
}
@media (max-width: 991px) {
    #banner-slider-demo-22 h5 {
        font-size: 20px;
    }
    #banner-slider-demo-22 h2 {
        font-size: 36px;
    }
}
.banner-container {
    position: relative;
}
.banner-thumbs-container {
    position: absolute;
    width: 100%;
    text-align: right;
    top: 50%;
    transform: translateY(-50%);
    z-index: 1;
    pointer-events: none;
}
.owl-thumbs .owl-thumb-item {
    display: block;
    margin-left: auto;
    border: 0;
    background: transparent;
    padding-right: 35px;
    margin-bottom: 12px;
    text-align: right;
    color: #171f2f;
    font-size: 17px;
    white-space: nowrap;
    font-weight: 600;
    height: auto;
    position: relative;
    pointer-events: all;
}
.owl-thumbs .owl-thumb-item.active {
    color: #ff6840;
}
.owl-thumbs .owl-thumb-item:after {
    content: '';
    position: absolute;
    right: 0;
    top: 50%;
    border-top: 2px solid;
    width: 16px;
}
.home-ads .porto-ibanner-desc {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: between;
    justify-content: space-between;
    -ms-flex-align: center;
    align-items: center;
    padding: 10px;
    flex-direction: initial;
}
.home-ads .porto-ibanner-desc .porto-ibanner-title {
    font-size: 35px;
    line-height: 1.2;
    padding-left: 30px;
    max-width: 33.3333%;
    -ms-flex: 0 0 33.3333%;
    flex: 0 0 33.3333%;
    text-align: left;
    font-weight: 700;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-order: 2;
    order: 2;
    font-family: 'Open Sans';
}
.home-ads .porto-ibanner-desc .porto-ibanner-content {
    padding-left: 40px;
    flex-direction: column;
    max-width: 33.3333%;
    -ms-flex: 0 0 33.3333%;
    flex: 0 0 33.3333%;
    text-align: left;
    font-weight: 700;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-order: 2;
    order: 2;
    font-size: 13px;
    color: #222529;
}
.home-ads .porto-ibanner-desc .porto-ibanner-content h4 {
    font-size: 16px;
    margin: 0;
    line-height: 19px;
    font-weight: 700;
    color: #444
}
.home-ads .porto-ibanner-desc .porto-ibanner-content h4 b {
    font-size: 1.625em;
    line-height: 1.5;
    display: block;
}
.home-ads .porto-ibanner-desc .btn {
    padding: 10px 20px;
    background-color: #f4631b;
    border: 0;
    text-transform: uppercase;
    text-shadow: none;
    font-family: 'Open Sans';
    letter-spacing: 0;
    font-weight: 700;
    margin-top: 15px;
}
.special-offers-section .product-item-photo > a {
    display: block;
    overflow: hidden;
    padding-top: 75%;
    position: relative;
}
.special-offers-section .product-item-photo > a > img {
    object-fit: cover;
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
}
.special-offers-section .product-item .product-reviews-summary {
    display: none;
}
.special-offers-section .price-box {
    margin-top: 5px;
}
@media (max-width: 575px) {
    .home-ads .porto-ibanner-desc .porto-ibanner-title {
        font-size: 23px;
    }
}
@media (min-width: 768px) {
    .filterproducts-tab .data.items > .item.title.active > a.data.switch {
        border-bottom: 3px solid;
    }
    .filterproducts-tab .data.items > .item.title {
        background: none;
    }
    .filterproducts-tab .data.items > .item.title > a.data.switch {
        text-decoration: none;
        border: 0;
        padding: 0 22px 19px;
        text-transform: none;
        font-weight: 600;
        display: block;
        border-bottom: 3px solid transparent;
    }
    .filterproducts-tab .data.items > .item.content {
        margin-top: 42px;
        border-top: 1px solid rgba(0,0,0,0.08);
        padding-top: 17px;
    }
    .filterproducts-tab .data.items {
        background: none;
    }
}
@media (max-width: 1220px) {
.filterproducts-tab .data.items > .item.title > a.data.switch {
    padding-left: 8px;
    padding-right: 8px;
}
}
.brands-slider .owl-carousel .owl-item img {
    margin: 0 auto;
}
</style>
<div class="banner-container">
    <div id="banner-slider-demo-22" class="owl-carousel owl-banner-carousel" data-slider-id="1">
        <div class="item" style="background:url({{media url="wysiwyg/smartwave/porto/homepage/22/home_slide1.jpg"}})  center center no-repeat;background-size:cover;">
            <div class="container" style="position:relative;height:532px;"> 
                <div class="content" style="position:absolute;z-index:1;top: 50%;left: 0;text-align: left;padding-left: 15px;transform: translateY(-50%);">
                    <h5>Start the Revolution</h5>
                    <h2>drone pro 4</h2>
                    <h5>From <strong>$499</strong></h5>
                    <p><a class="btn" href="#">Buy Now</a></p>
                </div>
            </div>
        </div>
        <div class="item" style="background:url({{media url="wysiwyg/smartwave/porto/homepage/22/home_slide2.jpg"}})  center center no-repeat;background-size:cover;">
            <div class="container" style="position:relative;height:532px;">
                <div class="content" style="position:absolute;z-index:1;top: 50%;left: 0;text-align: left;padding-left: 15px;transform: translateY(-50%);">
                    <h5>Start the Revolution</h5>
                    <h2>drone pro 4</h2>
                    <h5>From <strong>$499</strong></h5>
                    <p><a class="btn" href="#">Buy Now</a></p>
                </div>
            </div>
        </div>
        <div class="item" style="background:url({{media url="wysiwyg/smartwave/porto/homepage/22/home_slide3.jpg"}})  center center no-repeat;background-size:cover;">
            <div class="container" style="position:relative;height:532px;">
                <div class="content" style="position:absolute;z-index:1;top: 50%;left: 0;text-align: left;padding-left: 15px;transform: translateY(-50%);">
                    <h5>Start the Revolution</h5>
                    <h2>drone pro 4</h2>
                    <h5>From <strong>$499</strong></h5>
                    <p><a class="btn" href="#">Buy Now</a></p>
                </div>
            </div>
        </div>
    </div>
    <div class="banner-thumbs-container">
        <div class="container">
            <div class="owl-thumbs" data-slider-id="1">
                <button class="owl-thumb-item active">Drones</button>
                <button class="owl-thumb-item">Phones</button>
                <button class="owl-thumb-item">Accessories</button>
            </div>
        </div>
    </div>
    <script type="text/javascript">
    require([
        'jquery',
        'owlcarousel',
        'owlcarousel_thumbs'
    ], function ($) {
        var banner_owl = $("#banner-slider-demo-22");
        banner_owl.owlCarousel({
            items: 1,
            autoplay: true,
            autoplayTimeout: 5000,
            autoplayHoverPause: true,
            dots: false,
            nav: false,
            navRewind: true,
            animateIn: 'fadeIn',
            animateOut: 'fadeOut',
            loop: true,
            lazyLoad: true,
            navText: ["<em class='porto-icon-chevron-left'></em>","<em class='porto-icon-chevron-right'></em>"],
            thumbs: true,
            thumbImage: false,
            thumbsPrerendered: true,
            thumbContainerClass: 'owl-thumbs',
            thumbItemClass: 'owl-thumb-item'
        });
    });
    </script>
</div>
<div class="container" style="padding-top: 3.5vw;padding-bottom: 2.5vw;">
    <h2 class="filterproduct-title"><span class="content"><strong>Featured Products</strong></span></h2>
    {{block class="Smartwave\Filterproducts\Block\Home\FeaturedList" name="featured" aspect_ratio="1" column_count="6" product_count="6" image_width="212" product_type="3" template="grid.phtml"}}
</div>
<div style="background-color: #f4f4f4;">
    <div class="container" style="padding-top: 3.5vw;padding-bottom: 2.5vw;">
        <div id="category-slider-demo-22" style="margin-left: -10px;margin-right: -10px;">
            <div class="owl-carousel">
                <div class="item">
                    <a href="#" class="shop-by-cat-item cat-has-icon">
                        <span class="cat-detail">
                            <i class="porto-new-icon-category-fashion"></i>
                            <h3>Fashion</h3>
                        </span>
                    </a>
                </div>
                <div class="item">
                    <a href="#" class="shop-by-cat-item cat-has-icon">
                        <span class="cat-detail">
                            <i class="porto-new-icon-category-electronics"></i>
                            <h3>Electronics</h3>
                        </span>
                    </a>
                </div>
                <div class="item">
                    <a href="#" class="shop-by-cat-item cat-has-icon">
                        <span class="cat-detail">
                            <i class="porto-new-icon-category-gifts"></i>
                            <h3>Gifts</h3>
                        </span>
                    </a>
                </div>
                <div class="item">
                    <a href="#" class="shop-by-cat-item cat-has-icon">
                        <span class="cat-detail">
                            <i class="porto-new-icon-category-garden"></i>
                            <h3>Garden</h3>
                        </span>
                    </a>
                </div>
                <div class="item">
                    <a href="#" class="shop-by-cat-item cat-has-icon">
                        <span class="cat-detail">
                            <i class="porto-new-icon-category-music"></i>
                            <h3>Music</h3>
                        </span>
                    </a>
                </div>
                <div class="item">
                    <a href="#" class="shop-by-cat-item cat-has-icon">
                        <span class="cat-detail">
                            <i class="porto-new-icon-category-motors"></i>
                            <h3>Motors</h3>
                        </span>
                    </a>
                </div>
            </div>
            <script type="text/javascript">
            require([
                'jquery',
                'owl.carousel/owl.carousel.min'
            ], function ($) {
                $("#category-slider-demo-22 .owl-carousel").owlCarousel({
                    autoplay: true,
                    autoplayTimeout: 5000,
                    autoplayHoverPause: true,
                    margin: 0,
                    nav: false,
                    navText: ["<em class='porto-icon-left-open-big'></em>","<em class='porto-icon-right-open-big'></em>"],
                    dots: false,
                    loop: false,
                    responsive: {
                        0: {
                            items:2
                        },
                        640: {
                            items:3
                        },
                        768: {
                            items:4
                        },
                        992: {
                            items:5
                        },
                        1200: {
                            items:6
                        }
                    }
                });
            });
            </script>
        </div>
    </div>
</div>
<div class="container" style="padding-top: 3.5vw;padding-bottom: 2.5vw;">
    <div class="row home-ads" style="margin-bottom: 16px;">
        <div class="col-lg-6">
            <div class="porto-ibanner">
                <img src="{{media url="wysiwyg/smartwave/porto/homepage/22/home_ads1.jpg"}}" alt="" />
                <div class="porto-ibanner-desc">
                    <h2 class="porto-ibanner-title" style="color: #222529;">ACTION CAMERAS</h2>
                    <div class="porto-ibanner-content">
                        <h4>Starting From <b>$399</b></h4>
                        <p><a class="btn btn-primary">Shop Now</a></p>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-lg-6">
            <div class="porto-ibanner">
                <img src="{{media url="wysiwyg/smartwave/porto/homepage/22/home_ads2.jpg"}}" alt="" />
                <div class="porto-ibanner-desc">
                    <h2 class="porto-ibanner-title" style="color: #222529;">FOR ALL STYLES</h2>
                    <div class="porto-ibanner-content" style="padding-left: 0;padding-right: 40px;order: 1;text-align: right;">
                        <h4>Starting From <b>$199</b></h4>
                        <p><a class="btn btn-primary">Shop Now</a></p>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <h2 class="filterproduct-title"><span class="content"><strong>New Arrivals</strong></span></h2>
    {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="latest" aspect_ratio="1" column_count="6" product_count="6" image_width="212" product_type="3" template="grid.phtml"}}
</div>
<div class="special-offers-section" style="background-color: #f4f4f4;">
    <div class="container" style="padding-top: 3.5vw;padding-bottom: 2.5vw;">
        <div class="row">
            <div class="col-lg-4">
                <h2 class="filterproduct-title" style="padding-bottom: 10px;margin-bottom: 30px;"><span class="content"><strong>Special Offer</strong></span></h2>
                <a href="#"><img src="{{media url="wysiwyg/smartwave/porto/homepage/22/home_ads3.jpg"}}" alt="" /></a>
            </div>
            <div class="col-lg-8">
                <div class="filterproducts-tab" style="padding-top: 10px;">
                    <div class="data items" data-mage-init='{"tabs":{"openedState":"active"}}'>
                        <div class="data item title" aria-labeledby="tab-label-featured-title" data-role="collapsible" id="tab-label-featured">
                            <a class="data switch" tabindex="-1" data-toggle="switch" href="#featured" id="tab-label-featured-title">Bestsellers</a>
                        </div>
                        <div class="data item content" id="featured" data-role="content">
                            {{block class="Smartwave\Filterproducts\Block\Home\FeaturedList" name="featured_product" product_count="4" column_count="4" aspect_ratio="0" image_width="250" image_height="250" product_type="3" template="grid.phtml"}}
                        </div>
                        <div class="data item title" aria-labeledby="tab-label-latest-title" data-role="collapsible" id="tab-label-latest">
                            <a class="data switch" tabindex="-1" data-toggle="switch" href="#latest" id="tab-label-latest-title">Audio Speakers</a>
                        </div>
                        <div class="data item content" id="latest" data-role="content">
                            {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="latest_product" product_count="4" column_count="4" aspect_ratio="0" image_width="250" image_height="250" product_type="3" template="grid.phtml"}}
                        </div>
                        <div class="data item title" aria-labeledby="tab-label-latest-title" data-role="collapsible" id="tab-label-latest">
                            <a class="data switch" tabindex="-1" data-toggle="switch" href="#latest" id="tab-label-latest-title">Cameras</a>
                        </div>
                        <div class="data item content" id="latest" data-role="content">
                            {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="latest_product" product_count="4" column_count="4" aspect_ratio="0" image_width="250" image_height="250" product_type="3" template="grid.phtml"}}
                        </div>
                        <div class="data item title" aria-labeledby="tab-label-latest-title" data-role="collapsible" id="tab-label-latest">
                            <a class="data switch" tabindex="-1" data-toggle="switch" href="#latest" id="tab-label-latest-title">Lamps</a>
                        </div>
                        <div class="data item content" id="latest" data-role="content">
                            {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="latest_product" product_count="4" column_count="4" aspect_ratio="0" image_width="250" image_height="250" product_type="3" template="grid.phtml"}}
                        </div>
                        <div class="data item title" aria-labeledby="tab-label-latest-title" data-role="collapsible" id="tab-label-latest">
                            <a class="data switch" tabindex="-1" data-toggle="switch" href="#latest" id="tab-label-latest-title">Computer</a>
                        </div>
                        <div class="data item content" id="latest" data-role="content">
                            {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="latest_product" product_count="4" column_count="4" aspect_ratio="0" image_width="250" image_height="250" product_type="3" template="grid.phtml"}}
                        </div>
                        <div class="data item title" aria-labeledby="tab-label-latest-title" data-role="collapsible" id="tab-label-latest">
                            <a class="data switch" tabindex="-1" data-toggle="switch" href="#latest" id="tab-label-latest-title">Mobile Phones</a>
                        </div>
                        <div class="data item content" id="latest" data-role="content">
                            {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="latest_product" product_count="4" column_count="4" aspect_ratio="0" image_width="250" image_height="250" product_type="3" template="grid.phtml"}}
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="container home-subcats" style="padding-top: 3.5vw;padding-bottom: 2.5vw;">
    <div class="row">
        <div class="col-md-6 col-xl-3">
            <div class="porto-sicon-wrapper style_1">
                <div class="porto-sicon-box left-icon">
                    <div class="porto-sicon-left">
                        <img src="{{media url="wysiwyg/smartwave/porto/homepage/22/subcat1.jpg"}}" alt="" />
                    </div>
                    <div class="porto-sicon-body">
                        <div class="porto-sicon-header">
                            <h3 class="porto-sicon-title" style="font-weight:700;font-size:17px;line-height:20px;color:#222529;">Top Sharp<br>Knives</h3>
                        </div>
                        <div class="porto-sicon-description" style="">
                            <a class="btn btn-dark" href="#">Shop Now</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-md-6 col-xl-3">
            <div class="porto-sicon-wrapper style_1">
                <div class="porto-sicon-box left-icon">
                    <div class="porto-sicon-left">
                        <img src="{{media url="wysiwyg/smartwave/porto/homepage/22/subcat2.jpg"}}" alt="" />
                    </div>
                    <div class="porto-sicon-body">
                        <div class="porto-sicon-header">
                            <h3 class="porto-sicon-title" style="font-weight:700;font-size:17px;line-height:20px;color:#222529;">HD Vision<br>Web Cameras</h3>
                        </div>
                        <div class="porto-sicon-description" style="">
                            <a class="btn btn-dark" href="#">Shop Now</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-md-6 col-xl-3">
            <div class="porto-sicon-wrapper style_1">
                <div class="porto-sicon-box left-icon">
                    <div class="porto-sicon-left">
                        <img src="{{media url="wysiwyg/smartwave/porto/homepage/22/subcat3.jpg"}}" alt="" />
                    </div>
                    <div class="porto-sicon-body">
                        <div class="porto-sicon-header">
                            <h3 class="porto-sicon-title" style="font-weight:700;font-size:17px;line-height:20px;color:#222529;">Mobiles And<br>Tablets</h3>
                        </div>
                        <div class="porto-sicon-description" style="">
                            <a class="btn btn-dark" href="#">Shop Now</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-md-6 col-xl-3">
            <div class="porto-sicon-wrapper style_1">
                <div class="porto-sicon-box left-icon">
                    <div class="porto-sicon-left">
                        <img src="{{media url="wysiwyg/smartwave/porto/homepage/22/subcat4.jpg"}}" alt="" />
                    </div>
                    <div class="porto-sicon-body">
                        <div class="porto-sicon-header">
                            <h3 class="porto-sicon-title" style="font-weight:700;font-size:17px;line-height:20px;color:#222529;">Smart<br>Watches</h3>
                        </div>
                        <div class="porto-sicon-description" style="">
                            <a class="btn btn-dark" href="#">Shop Now</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div style="padding-top: 50px; padding-bottom: 50px; background-color:#f4f4f4;" class="custom-support">
    <div class="container">
        <div class="row">
            <div class="col-md-4" style="margin: 25px 0;">
                <i class="porto-icon-shipping" style="line-height:58px;font-size:50px;"></i>
                <div class="content">
                    <h2 style="font-weight:700;font-size:18px;line-height:27px;">FREE SHIPPING & RETURNS</h2>
                    <em style="font-weight:600;font-size:17px;color:#21293c;">All Orders Over $99</em>
                    <p style="font-size:16px;line-height:26px;color:#7b858a;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis nec vestibulum magna, et dapibus.</p>
                </div>
            </div>
            <div class="col-md-4" style="margin: 25px 0;">
                <i class="porto-icon-money" style="line-height:58px;font-size:50px;"></i>
                <div class="content">
                    <h2 style="font-weight:700;font-size:18px;line-height:27px;">MONEY BACK GUARANTEE</h2>
                    <em style="font-weight:600;font-size:17px;color:#21293c;">Safe & Fast</em>
                    <p style="font-size:16px;line-height:26px;color:#7b858a;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis nec vestibulum magna, et dapibus.</p>
                </div>
            </div>
            <div class="col-md-4" style="margin: 25px 0;">
                <i class="porto-icon-support" style="line-height:58px;font-size:50px;"></i>
                <div class="content">
                    <h2 style="font-weight:700;font-size:18px;line-height:27px;">ONLINE SUPPORT</h2>
                    <em style="font-weight:600;font-size:17px;color:#21293c;">Need Assistence?</em>
                    <p style="font-size:16px;line-height:26px;color:#7b858a;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis nec vestibulum magna, et dapibus.</p>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="container" style="padding-top: 3.5vw;padding-bottom: 2.5vw;">
    <div class="row">
        <div class="col-md-6 col-lg-3">
            <h2 class="filterproduct-title" style="background-image:none;margin-top:20px;margin-bottom:20px;"><span class="content"><strong>Top Rated Products</strong></span></h2>
            {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="latest_small_list" product_count="3" aspect_ratio="0" image_width="212" image_height="212"  template="small_list.phtml"}}
        </div>
        <div class="col-md-6 col-lg-3">
            <h2 class="filterproduct-title" style="background-image:none;margin-top:20px;margin-bottom:20px;"><span class="content"><strong>Top Selling Products</strong></span></h2>
            {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="latest_small_list" product_count="3" aspect_ratio="0" image_width="212" image_height="212" template="small_list.phtml"}}
        </div>
        <div class="col-md-6 col-lg-3">
            <h2 class="filterproduct-title" style="background-image:none;margin-top:20px;margin-bottom:20px;"><span class="content"><strong>On Sale Products</strong></span></h2>
            {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="latest_small_list" product_count="3" aspect_ratio="0" image_width="212" image_height="212" template="small_list.phtml"}}
        </div>
        <div class="col-md-6 col-lg-3">
            <h2 class="filterproduct-title" style="background-image:none;margin-top:20px;margin-bottom:20px;"><span class="content"><strong>Latest Products</strong></span></h2>
            {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="latest_small_list" product_count="3" aspect_ratio="0" image_width="212" image_height="212" template="small_list.phtml"}}
        </div>
    </div>
    <div class="our-brands" style="margin-top:15px;">
        <h2 class="filterproduct-title" style="background-image:none;margin-top:40px;margin-bottom:30px;"><span class="content"><strong>Top Brands</strong></span></h2>
        <div id="brands-slider-demo-22" class="brands-slider">
            <div class="owl-carousel">
                <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/brands/05/brand1.png"}}" alt="" /></div>
                <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/brands/05/brand2.png"}}" alt="" /></div>
                <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/brands/05/brand3.png"}}" alt="" /></div>
                <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/brands/05/brand4.png"}}" alt="" /></div>
                <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/brands/05/brand5.png"}}" alt="" /></div>
                <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/brands/05/brand1.png"}}" alt="" /></div>
                <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/brands/05/brand2.png"}}" alt="" /></div>
                <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/brands/05/brand3.png"}}" alt="" /></div>
                <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/brands/05/brand4.png"}}" alt="" /></div>
                <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/brands/05/brand5.png"}}" alt="" /></div>
            </div>
            <script type="text/javascript">
            require([
                'jquery',
                'owl.carousel/owl.carousel.min'
            ], function ($) {
                $("#brands-slider-demo-22 .owl-carousel").owlCarousel({
                    autoplay: true,
                    autoplayTimeout: 5000,
                    autoplayHoverPause: true,
                    margin: 30,
                    nav: false,
                    navText: ["<em class='porto-icon-left-open-big'></em>","<em class='porto-icon-right-open-big'></em>"],
                    dots: false,
                    loop: true,
                    responsive: {
                        0: {
                            items:2
                        },
                        640: {
                            items:3
                        },
                        768: {
                            items:4
                        },
                        992: {
                            items:5
                        },
                        1200: {
                            items:5
                        }
                    }
                });
            });
            </script>
        </div>
    </div>
</div>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 23</title>
         <identifier>porto_home_23</identifier>
         <content><![CDATA[<style type="text/css">
.page-main {
    max-width: 100%;
    padding: 0;
}
.columns .column.main {
    padding: 0;
}
#banner-slider-demo-23 {
    background-color: #e2e2e0;
}
#banner-slider-demo-23 .slide-content h2 {
    font-family: "Nanum Brush Script";
    font-weight: 400;
    color: #c59b9c !important;
    font-size: 68px;
    line-height: 40px;
    margin: 0;
    margin-bottom: 16px;
}
#banner-slider-demo-23 .slide-content a > i:first-child:before {
    content: '';
    display: block;
    border-top: 1px solid #666;
    position: absolute;
    left: 0;
    right: 0;
    bottom: -3px;
}
#banner-slider-demo-23 .slide-content a > i:first-child {
    position: relative;
}
#banner-slider-demo-23 .slide-content a {
    font-size: 22px;
    color: #666;
    text-decoration: none;
    display: inline-block;
}
#banner-slider-demo-23 .slide-content a > i.porto-icon-right-open-big {
    font-size: 15px;
    display: inline-block;
    vertical-align: middle;
    margin-left: 5px;
}
#banner-slider-demo-23 .container {
    position: relative;
}
#banner-slider-demo-23 .slide-content {
    position: absolute;
    left: 20px;
    top: 50%;
    transform: translateY(-50%);
}
.custom-font1 {
    font-family: "Nanum Brush Script";
    font-weight: 400;
}
.home-banner1 .porto-ibanner-desc h3 {
    margin: 0;
    line-height: .8;
    font-size: 41px;
    color: #222529;
    text-transform: uppercase;
    letter-spacing: -1px;
}
.home-banner3 .porto-ibanner-desc h2 {
    font-weight: 700;
}
.porto-ibanner .porto-ibanner-content h4 {
    text-transform: uppercase;
    line-height: 1;
    font-size: 30px;
    margin: 0;
    letter-spacing: -0.75px;
    margin-bottom: 24px;
    color: #222529;
}
.porto-ibanner .porto-ibanner-content a {
    font-size: 14px;
    color: #666;
    text-decoration: none;
}
.home-banner1 .porto-ibanner-content a {
    font-size: 17px;
}
.home-banner6 .porto-ibanner-content a {
    font-size: 20px;
}
.porto-ibanner .porto-ibanner-content a i:first-child {
    display: inline-block;
    border-bottom: 1px solid;
    line-height: 1.4;
}
.porto-ibanner .porto-ibanner-content a i.porto-icon-right-open-big {
    font-size: 12px;
    margin-left: 6px;
}
.home-banner3 .porto-ibanner-desc h2 {
    font-weight: 700;
}
.porto-ibanner-desc h2 {
    font-size: 20px;
    font-family: inherit;
    font-weight: 600;
    letter-spacing: -0.5px;
}
.porto-ibanner .porto-ibanner-desc {
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: space-between;
    padding: 13% 15px;
}
.home-banner1 .porto-ibanner-desc {
    align-items: flex-end;
    justify-content: center;
    text-align: justify;
    padding-right: 9%;
}
.home-banner2 .porto-ibanner-desc {
    justify-content: flex-end;
}
.home-banner4 .porto-ibanner-desc {
    justify-content: flex-start;
}
.home-banner6 .porto-ibanner-title {
    font-size: 30px;
    font-weight: 700;
}
.homepage-bar {
    border: 0;
    background-color: transparent;
    margin-bottom: 40px;
}
.shop-by-cat-item {
    margin: 0;
    position: relative;
}
.shop-by-cat-item .cat-detail {
    position: absolute;
    left: 25%;
    right: 25%;
    text-align: center;
    bottom: 0;
    padding: 30px 0;
    background-color: #fff;
    z-index: 2;
}
.shop-by-cat-item .cat-detail h3 {
    margin: 0;
    letter-spacing: 5.25px;
    color: #222529;
}
.shop-by-cat-item:before {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background-color: #000;
    z-index: 1;
    visibility: hidden;
    opacity: 0;
    transition: all .3s;
}
.shop-by-cat-item:hover:before {
    visibility: visible;
    opacity: .1;
}
#category-slider-demo-23 .owl-controls {
    margin: 0;
}
.brands-slider .owl-carousel .owl-item img {
    margin: 0 auto;
}
.homepage-bar .col-lg-4 {
    padding-top: 10px;
    padding-bottom: 10px;
}
.homepage-bar h3 {
    font-weight: 600;
    font-size: 14px;
    line-height: 22px;
    color: #222529;
    margin: 0 0 3px;
}
.homepage-bar p {
    font-weight: 300;
    font-size: 13px;
    line-height: 18px;
    color: #839199;
    letter-spacing: 0.2px;
}
.homepage-bar i {
    margin-top: 2px;
    line-height: 1;
}
</style>
<div id="banner-slider-demo-23" class="owl-carousel owl-banner-carousel owl-middle-narrow">
    <div class="item">
        <div class="container">
            <img class="owl-lazy" data-src="{{media url="wysiwyg/smartwave/porto/homepage/23/slide01.jpg"}}" alt="" />
            <div class="slide-content">
                <h2>Discover our Arrivals!</h2>
                <p><a href="#"><i>View our Dresses</i><i class="porto-icon-right-open-big"></i></a></p>
            </div>
        </div>
    </div>
    <div class="item">
        <div class="container">
            <img class="owl-lazy" data-src="{{media url="wysiwyg/smartwave/porto/homepage/23/slide02.jpg"}}" alt="" />
            <div class="slide-content" style="right: 20px;left: auto;">
                <h2>Trendy Collections!</h2>
                <p><a href="#"><i>View our Specials</i><i class="porto-icon-right-open-big"></i></a></p>
            </div>
        </div>
    </div>
</div>
<script type="text/javascript">
require([
    'jquery',
    'owl.carousel/owl.carousel.min'
], function ($) {
    var banner_owl = $("#banner-slider-demo-23");
    banner_owl.owlCarousel({
        items: 1,
        autoplay: true,
        autoplayTimeout: 5000,
        autoplayHoverPause: true,
        dots: false,
        nav: true,
        navRewind: true,
        animateIn: 'fadeIn',
        animateOut: 'fadeOut',
        loop: true,
        lazyLoad: true,
        navText: ["<em class='porto-icon-left-open-big'></em>","<em class='porto-icon-right-open-big'></em>"]
    });
});
</script>
<div class="container" style="margin-top: 30px;padding: 50px 15px 20px;">
    <h2 style="font-size: 30px;line-height: 1;text-align: center;font-weight:700;text-transform: uppercase;color: #222529;margin: 0;letter-spacing: -0.75px;margin-bottom: 4px;">Welcome to Little Porto’s World</h2>
    <p style="font-size: 28px;color: #666;line-height: 1.2;text-align: center;margin-bottom: 30px;" class="custom-font1">Enjoy the exceptional quality in all our products</p>
    <div class="row">
        <div class="col-lg-6">
            <div class="porto-ibanner home-banner1">
                <img src="{{media url="wysiwyg/smartwave/porto/homepage/23/home_banner1.jpg"}}" alt="" />
                <div class="porto-ibanner-desc">
                    <div class="porto-ibanner-content" style="">
                        <h3 class="custom-font1">Discounts</h3>
                        <h4>up to 70%</h4>
                        <p><a href="#"><i>View our Deals</i><i class="porto-icon-right-open-big"></i></a></p>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-md-6 col-lg-3">
            <div class="porto-ibanner home-banner2">
                <img src="{{media url="wysiwyg/smartwave/porto/homepage/23/home_banner2.jpg"}}" alt="" />
                <div class="porto-ibanner-desc">
                    <h2 class="porto-ibanner-title" style="color: #222529;">SUMMER CLASSICS</h2>
                    <div class="porto-ibanner-content" style="">
                        <a href="#"><i>View our Classics</i><i class="porto-icon-right-open-big"></i></a>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-md-6 col-lg-3">
            <div class="porto-ibanner home-banner3">
                <img src="{{media url="wysiwyg/smartwave/porto/homepage/23/home_banner3.jpg"}}" alt="" />
                <div class="porto-ibanner-desc">
                    <h2 class="porto-ibanner-title" style="color: #222529;">MOTHER & DAUGHTER</h2>
                    <div class="porto-ibanner-content" style="">
                        <a href="#"><i>View our Outfits</i><i class="porto-icon-right-open-big"></i></a>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-md-6 col-lg-3">
            <div class="porto-ibanner home-banner4">
                <img src="{{media url="wysiwyg/smartwave/porto/homepage/23/home_banner4.jpg"}}" alt="" />
                <div class="porto-ibanner-desc">
                    <h2 class="porto-ibanner-title" style="color: #222529;">BABIES OUTFITS</h2>
                    <div class="porto-ibanner-content" style="">
                        <a href="#"><i>View our Outfits</i><i class="porto-icon-right-open-big"></i></a>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-md-6 col-lg-3">
            <div class="porto-ibanner home-banner5">
                <img src="{{media url="wysiwyg/smartwave/porto/homepage/23/home_banner5.jpg"}}" alt="" />
                <div class="porto-ibanner-desc">
                    <h2 class="porto-ibanner-title" style="color: #222529;">BABIES DRESSES</h2>
                    <div class="porto-ibanner-content" style="">
                        <a href="#"><i>View our Dresses</i><i class="porto-icon-right-open-big"></i></a>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-lg-6">
            <div class="porto-ibanner home-banner6">
                <img src="{{media url="wysiwyg/smartwave/porto/homepage/23/home_banner6.jpg"}}" alt="" />
                <div class="porto-ibanner-desc">
                    <h2 class="porto-ibanner-title" style="color: #222529;">SHOES FOR BABIES</h2>
                    <div class="porto-ibanner-content" style="">
                        <a href="#"><i>View our Deals</i><i class="porto-icon-right-open-big"></i></a>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="homepage-bar">
    <div class="container">
        <div class="row">
            <div class="col-lg-4 col-md-4" style="text-align:center;">
                <i class="porto-icon-shipping" style="font-size:40px;"></i>
                <div class="text-area"><h3>FREE SHIPPING & RETURN</h3><p>Free shipping on all orders over $99.</p></div>
            </div>
            <div class="col-lg-4 col-md-4" style="text-align:center;">
                <i class="porto-icon-money" style="font-size:40px;"></i>
                <div class="text-area"><h3>MONEY BACK GUARANTEE</h3><p>100% money back guarantee.</p></div>
            </div>
            <div class="col-lg-4 col-md-4" style="text-align:center;">
                <i class="porto-icon-support" style="font-size:40px;"></i>
                <div class="text-area"><h3>ONLINE SUPPORT 24/7</h3><p>Lorem ipsum dolor sit amet.</p></div>
            </div>
        </div>
    </div>
</div>
<div class="container" style="margin-bottom: 60px;">
    {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="latest" aspect_ratio="1" column_count="4" product_count="4" image_width="212" product_type="3" template="grid.phtml"}}
</div>
<div>
    <div class="row no-gutters">
        <div class="col-lg-3" style="background-color: #e2e2e0;padding-top: 40px;padding-bottom: 40px;display: flex;flex-direction: column;justify-content: center;">
            <h4 style="font-size: 54px;line-height: 1;text-align: center;color: #c59b9c;margin: 0;" class="custom-font1">Best Collections</h4>
            <p style="font-size: 16px;color: #666666;line-height: 1;text-align: center;margin: 0;">Selected Products From Famous Brands</p>
        </div>
        <div class="col-lg-9">
            <div id="category-slider-demo-23">
                <div class="owl-carousel">
                    <div class="item">
                        <a href="#" class="shop-by-cat-item">
                            <img src="{{media url="wysiwyg/smartwave/porto/homepage/23/cat1.jpg"}}" alt="" />
                            <span class="cat-detail">
                                <h3>BOYS</h3>
                            </span>
                        </a>
                    </div>
                    <div class="item">
                        <a href="#" class="shop-by-cat-item">
                            <img src="{{media url="wysiwyg/smartwave/porto/homepage/23/cat2.jpg"}}" alt="" />
                            <span class="cat-detail">
                                <h3>BABIES</h3>
                            </span>
                        </a>
                    </div>
                    <div class="item">
                        <a href="#" class="shop-by-cat-item">
                            <img src="{{media url="wysiwyg/smartwave/porto/homepage/23/cat3.jpg"}}" alt="" />
                            <span class="cat-detail">
                                <h3>GIRLS</h3>
                            </span>
                        </a>
                    </div>
                </div>
                <script type="text/javascript">
                require([
                    'jquery',
                    'owl.carousel/owl.carousel.min'
                ], function ($) {
                    $("#category-slider-demo-23 .owl-carousel").owlCarousel({
                        autoplay: true,
                        autoplayTimeout: 5000,
                        autoplayHoverPause: true,
                        margin: 0,
                        nav: false,
                        navText: ["<em class='porto-icon-left-open-big'></em>","<em class='porto-icon-right-open-big'></em>"],
                        dots: false,
                        loop: false,
                        responsive: {
                            0: {
                                items:1
                            },
                            560: {
                                items:2
                            },
                            768: {
                                items:3
                            }
                        }
                    });
                });
                </script>
            </div>
        </div>
    </div>
</div>
<div class="container" style="margin-top: 30px;padding: 50px 15px;">
    {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="latest" aspect_ratio="1" column_count="4" product_count="4" image_width="212" product_type="3" template="grid.phtml"}}
</div>
<div style="border-top: 1px solid #e7e7e7;padding: 15px 0;">
    <div class="container">
        <div id="brands-slider-demo-23" class="brands-slider">
            <div class="owl-carousel">
                <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/brands/05/brand1.png"}}" alt="" /></div>
                <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/brands/05/brand2.png"}}" alt="" /></div>
                <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/brands/05/brand3.png"}}" alt="" /></div>
                <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/brands/05/brand4.png"}}" alt="" /></div>
                <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/brands/05/brand5.png"}}" alt="" /></div>
                <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/brands/05/brand1.png"}}" alt="" /></div>
                <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/brands/05/brand2.png"}}" alt="" /></div>
                <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/brands/05/brand3.png"}}" alt="" /></div>
                <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/brands/05/brand4.png"}}" alt="" /></div>
                <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/brands/05/brand5.png"}}" alt="" /></div>
            </div>
            <script type="text/javascript">
            require([
                'jquery',
                'owl.carousel/owl.carousel.min'
            ], function ($) {
                $("#brands-slider-demo-23 .owl-carousel").owlCarousel({
                    autoplay: true,
                    autoplayTimeout: 5000,
                    autoplayHoverPause: true,
                    margin: 30,
                    nav: false,
                    navText: ["<em class='porto-icon-left-open-big'></em>","<em class='porto-icon-right-open-big'></em>"],
                    dots: false,
                    loop: true,
                    responsive: {
                        0: {
                            items:2
                        },
                        640: {
                            items:3
                        },
                        768: {
                            items:4
                        },
                        992: {
                            items:5
                        },
                        1200: {
                            items:5
                        }
                    }
                });
            });
            </script>
        </div>
    </div>
</div>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 24</title>
         <identifier>porto_home_24</identifier>
         <content><![CDATA[<style type="text/css">
.page-main {
    max-width: 100%;
    padding: 0;
}
.columns .column.main {
    padding: 0;
}
#banner-slider-demo-24.owl-theme .owl-controls .owl-nav [class*=owl-] {
    color: #fff;
    font-size: 26px;
}
#banner-slider-demo-24 .product-slide > .product-img img {
    width: 100%;
}
#banner-slider-demo-24 .product-slide > .product-img {
    border-radius: 5px;
    overflow: hidden;
}
#banner-slider-demo-24 .product-slide {
    display: flex;
    padding: 14vh 0;
    align-items: center;
}
#banner-slider-demo-24 .slide-content {
    text-align: right;
    position: relative;
}
#banner-slider-demo-24 .slide-content h3 {
    font-family: Poppins;
    font-size: 25px;
    font-weight: 700;
    background: #fff;
    border-radius: 5px;
    padding: 19px 40px;
    text-align: center;
    margin: 0;
    margin-bottom: 65px;
    letter-spacing: -0.25px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    position: relative;
    margin-left: -40px;
}
#banner-slider-demo-24 .slide-content h3 a {
    color: #2b2b2d;
    text-decoration: none;
}
#banner-slider-demo-24 .slide-content h3 a:hover {
    color: #ea6253;
}
#banner-slider-demo-24 .slide-price {
    width: max-content;
    margin-left: auto;
    display: flex;
    padding: 30px 45px 40px;
    background-color: #fff;
    border-radius: 100px;
    color: #141a1f;
    font-family: Poppins;
    text-align: left;
    align-items: center;
}
#banner-slider-demo-24 .slide-price-text {
    font-size: 20px;
    font-weight: 700;
    line-height: 1.1;
}
#banner-slider-demo-24 .slide-price-text > small {
    font-size: 13px;
    font-weight: 400;
}
#banner-slider-demo-24 .slide-price-box ins {
    font-size: 42px;
    text-decoration: none;
    font-weight: 700;
}
#banner-slider-demo-24 .slide-price-box del {
    font-size: 23px;
    font-weight: 700;
    color: #777;
    margin-right: 5px;
}
#banner-slider-demo-24 .slide-price-box {
    text-align: right;
    line-height: 1;
    margin-left: 40px;
}
#banner-slider-demo-24 a.btn.tocart {
    background-color: #141a1f;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0;
    padding: 10px 35px 10px 42px;
    height: auto;
    border-radius: 30px 0 0 30px;
    margin-right: 90px;
    overflow: visible;
    line-height: 36px;
    text-transform: uppercase;
    color: #fff;
    text-decoration: none;
    margin-top: -20px;
    position: relative;
    border: 0;
}
#banner-slider-demo-24 a.btn.tocart:after {
    display: inline-block;
    content: '\f054';
    font-family: 'Font Awesome 5 Free';
    padding: 9px 0;
    position: absolute;
    left: 100%;
    top: 0;
    height: 100%;
    width: 52px;
    margin-left: 5px;
    background-color: inherit;
    border-radius: 0 50px 50px 0;
}
#banner-slider-demo-24 .right-img .slide-content {
    text-align: left;
}
#banner-slider-demo-24 .right-img .slide-content h3 {
    margin-left: 0;
    margin-right: -30px;
}
#banner-slider-demo-24 .right-img .slide-price {
    margin-left: 0;
    margin-right: auto;
}
#banner-slider-demo-24 .right-img a.btn.tocart {
    margin-right: 56px;
    margin-left: 45px;
}
@media (min-width: 575px) {
    #banner-slider-demo-24 .product-slide > .product-img {
        flex: 0 0 62%;
        max-width: 62%;
        margin: 0;
    }
    #banner-slider-demo-24 .slide-content {
        flex: 0 0 38%;
        max-width: 38%;
    }
    #banner-slider-demo-24 .product-slide.right-img > .product-img {
        order: 2;
    }
}
.custom-support {
    position: relative;
}
.custom-support .content a {
    font-size: 12px;
    font-weight: 700;
    border: 1px solid rgba(0,0,0,0.09);
    border-radius: 50px;
    padding: 12px 30px;
    border-bottom-color: rgba(0,0,0,0.2);
    transition: all .1s;
}
.custom-support .content a:hover {
    background-color: #f2f2f2;
    color: #333;
}
.custom-support div.content>p {
    margin-bottom: 20px;
}
.custom-shape.custom-shape-type1 {
    position: absolute;
    top: 50%;
    right: 0;
    z-index: 3;
}
.custom-shape.custom-shape-type2 {
    position: absolute;
    top: 30%;
    left: 0;
    z-index: 0;
}
a.btn.btn-custom {
    font-size: 12px;
    font-weight: 700;
    border: 1px solid rgba(0,0,0,0.09);
    border-radius: 50px;
    padding: 12px 30px;
    border-bottom-color: rgba(0,0,0,0.2);
    color: #333;
    transition: all .1s;
}
a.btn.btn-custom:hover {
    background-color: #f2f2f2;
}
#brands-slider-demo-24 .owl-item {
    opacity: .2;
    transition: opacity .3s;
}
#brands-slider-demo-24 .owl-item.center {
    opacity: 1;
}
#testimonials-slider .item {
    border: 2px solid #ea6253;
    border-radius: 3px;
    padding: 25px 30px 70px 25px;
    margin: 0;
}
.cms-index-index .testimonial-author .img-thumbnail {
    border: 0;
    border-radius: 50px;
    overflow: hidden;
    width: 55px;
    height: 55px;
    margin-right: 24px;
}
.cms-index-index .testimonial-author:after {
    content: '';
    display: block;
    clear: both;
}
.cms-index-index .testimonial-author .img-thumbnail img {
    max-width: 100%;
}
.cms-index-index .testimonial-author p >span {
    font-size: 13px;
    line-height: 1.2;
}
.cms-index-index .testimonial-author p >strong {
    color: #2b2b2d;
    text-transform: uppercase;
    line-height: 1.2;
    font-size: 13px;
    padding-top: 12px;
}
.cms-index-index blockquote.testimonial {
    background-color: transparent;
    color: #777;
    font-family: "Open Sans";
    font-weight: 400;
    font-size: 14px;
    line-height: 1.5;
    font-style: normal;
    padding: 20px 50px 20px 60px;
    margin-top: 15px;
}
.cms-index-index blockquote.testimonial:before, .cms-index-index blockquote.testimonial:after {
    color: #ea6253;
    font-family: Playfair Display,Georgia,serif;
}
.owl-theme.owl-bottomleft-narrow .owl-controls {
    position: absolute;
    left: 80px;
    bottom: 20px;
    margin: 0;
}
.owl-theme.owl-bottomleft-narrow .owl-dots .owl-dot span {
    background-color: transparent;
    border: 2px solid rgba(0,0,0,0.2);
    margin: 2px;
    width: 13px;
    height: 13px;
    border-radius: 10px;
}
.owl-theme.owl-bottomleft-narrow .owl-dots .owl-dot.active span, .owl-theme.owl-bottomleft-narrow .owl-dots .owl-dot:hover span {
    border-color: #05131c;
}
.owl-theme.owl-bottomleft-narrow .owl-dots .owl-dot.active span:after, .owl-theme.owl-bottomleft-narrow .owl-dots .owl-dot:hover span:after {
    content: '';
    display: block;
    width: 3px;
    height: 3px;
    background-color: #05131c;
    margin: 3px auto;
    border-radius: 50%;
}
.recent-posts .post-date {
    float: none;
    text-align: left;
}
.recent-posts .postTitle a {
    color: #2b2b2d;
    font-weight: 700;
    font-size: 16px;
}
.recent-posts .postTitle a:hover {
    text-decoration: underline;
}
.recent-posts .postTitle {
    min-height: 0;
}
.recent-posts .postContent {
    font-size: 14px;
    line-height: 26px;
    letter-spacing: 0.07px;
}
.recent-posts a.readmore {
    color: #222529;
    font-size: 12px;
    line-height: 26px;
    font-weight: 600;
    letter-spacing: 0.07px;
    font-family: Poppins;
    text-transform: uppercase;
}
</style>
<div id="banner-slider-demo-24" class="owl-carousel owl-banner-carousel owl-middle-narrow curved-border">
    <div class="item" style="background:url({{media url="wysiwyg/smartwave/porto/homepage/24/home_slide1.jpg"}})  center center no-repeat;background-size:cover;">
        <div class="container">
            <div class="product-slide">
                <div class="product-img">
                    <img class="owl-lazy" data-src="{{media url="wysiwyg/smartwave/porto/homepage/24/product1.jpg"}}" alt="" />
                </div>
                <div class="slide-content">
                    <h3><a href="#">Portoblee - Responsive Theme</a></h3>
                    <div class="slide-price">
                        <div class="slide-price-text"><small>get yours now</small><br/>SALE 34%</div>
                        <div class="slide-price-box"><del>$59</del><br/><ins>$39</ins></div>
                    </div>
                    <a href="#" class="btn tocart"><span>Add to Cart</span></a>
                </div>
            </div>
        </div>
    </div>
    <div class="item" style="background:url({{media url="wysiwyg/smartwave/porto/homepage/24/home_slide2.jpg"}})  center center no-repeat;background-size:cover;">
        <div class="container">
            <div class="product-slide right-img">
                <div class="product-img">
                    <img class="owl-lazy" data-src="{{media url="wysiwyg/smartwave/porto/homepage/24/product2.jpg"}}" alt="" />
                </div>
                <div class="slide-content">
                    <h3><a href="#">Shoport - eCommerce Theme</a></h3>
                    <div class="slide-price">
                        <div class="slide-price-text"><small>get yours now</small><br/>SALE 50%</div>
                        <div class="slide-price-box"><del>$399</del><br/><ins>$198</ins></div>
                    </div>
                    <a href="#" class="btn tocart" style="background-color: #ea6253"><span>Add to Cart</span></a>
                </div>
            </div>
        </div>
    </div>
</div>
<script type="text/javascript">
require([
    'jquery',
    'owl.carousel/owl.carousel.min'
], function ($) {
    var banner_owl = $("#banner-slider-demo-24");
    banner_owl.owlCarousel({
        items: 1,
        autoplay: true,
        autoplayTimeout: 5000,
        autoplayHoverPause: true,
        dots: false,
        nav: true,
        navRewind: true,
        animateIn: 'fadeIn',
        animateOut: 'fadeOut',
        loop: true,
        lazyLoad: true,
        navText: ["<em class='porto-icon-left-open-big'></em>","<em class='porto-icon-right-open-big'></em>"]
    });
});
</script>
<div style="padding-top: 50px; padding-bottom: 50px;" class="custom-support">
    <div class="container">
        <div class="row">
            <div class="col-md-4" style="margin: 25px 0;">
                <img src="{{media url="wysiwyg/smartwave/porto/homepage/24/shop24_home_icon1.png"}}" alt="" />
                <div class="content">
                    <h2 style="font-weight:700;font-size:16px;line-height:1;margin:20px 0;">DEDICATED SERVICE</h2>
                    <p style="font-size:14px;line-height:24px;color:#777;">Consult our specialists for help with an order, customization, or design advice.</p>
                    <a href="#" class="btn">GET IN TOUCH</a>
                </div>
            </div>
            <div class="col-md-4" style="margin: 25px 0;">
                <img src="{{media url="wysiwyg/smartwave/porto/homepage/24/shop24_home_icon2.png"}}" alt="" />
                <div class="content">
                    <h2 style="font-weight:700;font-size:16px;line-height:1;margin:20px 0;">MONEY BACK GUARANTEE</h2>
                    <p style="font-size:14px;line-height:24px;color:#777;">Consult our specialists for help with an order, customization, or design advice.</p>
                    <a href="#" class="btn">GET IN TOUCH</a>
                </div>
            </div>
            <div class="col-md-4" style="margin: 25px 0;">
                <img src="{{media url="wysiwyg/smartwave/porto/homepage/24/shop24_home_icon3.png"}}" alt="" />
                <div class="content">
                    <h2 style="font-weight:700;font-size:16px;line-height:1;margin:20px 0;">SECURE PAYMENT</h2>
                    <p style="font-size:14px;line-height:24px;color:#777;">Consult our specialists for help with an order, customization, or design advice.</p>
                    <a href="#" class="btn">GET IN TOUCH</a>
                </div>
            </div>
        </div>
    </div>
    <div class="custom-shape custom-shape-type1">
        <img src="{{media url="wysiwyg/smartwave/porto/homepage/24/shop24_home_shape1.png"}}" alt="" />
    </div>
</div>
<div style="position: relative;margin-top: 30px;padding-top: 140px;padding-bottom: 50px;background-color: #f4f4f4;" class="curved-border curved-border-top">
    <div class="container">
        <h2 class="filterproduct-title"><span class="content"><strong>FEATURED ITEMS</strong></span></h2>
        <div id="featured_product" class="" style="margin: 0 -10px;">
            {{block class="Smartwave\Filterproducts\Block\Home\FeaturedList" name="featured_product" product_type="3" product_count="10" aspect_ratio="1" image_width="400" image_height="400" template="owl_list.phtml"}}
        </div>
        <script type="text/javascript">
        require([
          'jquery',
          'owl.carousel/owl.carousel.min'
        ], function ($) {
          $("#featured_product .owl-carousel").owlCarousel({
            autoplay: true,
            autoplayTimeout: 5000,
            autoplayHoverPause: true,
            loop: false,
            navRewind: true,
            margin: 0,
            nav: false,
            navText: ["<em class='porto-icon-left-open-huge'></em>","<em class='porto-icon-right-open-huge'></em>"],
            dots: false,
            responsive: {
              0: {
                items:1
              },
              768: {
                items:2
              },
              992: {
                items:3
              },
              1200: {
                items:3
              }
            }
          });
        });
        </script>
        <hr style="background-color: #e1e1e1;margin: 22px 0 44px;">
        <div style="padding-top: 50px;padding-bottom: 50px;">
            <div class="row no-padding" style="background-color: #fff;align-items: center;">
                <div class="col-md-6">
                    <img src="{{media url="wysiwyg/smartwave/porto/homepage/24/shop24_home_banner1.jpg"}}" alt="" style="display: block;width: 100%;height: auto;object-fit: cover;"/>
                </div>
                <div class="col-md-6">
                    <div class="row" style="padding: 30px 0;align-items: center;">
                        <div class="col-sm-7">
                            <h2 style="font-size: 32px;line-height: 1.2;font-weight:700;color: #2b2b2d;margin: 0;margin-bottom: 5px;">Meet Porto</h2>
                            <p style="font-size: 22px;line-height: 1.3;color: #777;letter-spacing: 0.07px;">The easier way to build your<br>portfolio &amp; showcase your work.</p>
                        </div>
                        <div class="col-sm-5 text-left text-sm-center">
                            <a href="#" class="btn" style="color: #fff;background-color: #07080a;font-family: Poppins;font-weight: 700;font-size: 14px;padding: 15px 35px;border-radius: 50px;"><span>GET STARTED</span><i class="fas fa-chevron-right" style="margin-left: 7px;"></i></a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>  
    <div class="custom-shape custom-shape-type2">
        <img src="{{media url="wysiwyg/smartwave/porto/homepage/24/shop24_home_shape2.png"}}" alt="" />
    </div>
</div>
<div class="container" style="padding-top: 50px;padding-bottom: 50px;margin-top: 50px;">
    <h2 class="filterproduct-title"><span class="content"><strong>BEST SELLING ITEMS</strong></span></h2>
    {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="latest" aspect_ratio="1" column_count="3" product_count="6" image_width="400" product_type="3" template="grid.phtml"}}
    <p style="text-align: center;margin: 0;margin-bottom: 60px;"><a href="#" class="btn btn-custom" style=""><span>VIEW MORE</span></a></p>
    <h2 class="filterproduct-title separator-line"><span class="content"><strong>AS FEATURED AT</strong></span></h2>
    <div id="brands-slider-demo-24" class="brands-slider">
        <div class="owl-carousel">
            <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/24/logo-1.png"}}" alt="" /></div>
            <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/24/logo-2.png"}}" alt="" /></div>
            <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/24/logo-3.png"}}" alt="" /></div>
            <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/24/logo-4.png"}}" alt="" /></div>
            <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/24/logo-5.png"}}" alt="" /></div>
            <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/24/logo-6.png"}}" alt="" /></div>
            <div class="item" style="padding:10px 0;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/24/logo-7.png"}}" alt="" /></div>
        </div>
        <script type="text/javascript">
        require([
            'jquery',
            'owl.carousel/owl.carousel.min'
        ], function ($) {
            $("#brands-slider-demo-24 .owl-carousel").owlCarousel({
                autoplay: true,
                autoplayTimeout: 5000,
                autoplayHoverPause: true,
                margin: 30,
                nav: false,
                navText: ["<em class='porto-icon-left-open-big'></em>","<em class='porto-icon-right-open-big'></em>"],
                dots: false,
                loop: true,
                center: true,
                responsive: {
                    0: {
                        items:2
                    },
                    640: {
                        items:3
                    },
                    768: {
                        items:4
                    },
                    992: {
                        items:6
                    },
                    1200: {
                        items:7
                    }
                }
            });
        });
        </script>
    </div>
</div>
<div style="padding-top: 70px;padding-bottom: 70px;background-color: #f4f4f4;">
    <div class="container">
        <div class="row align-items-center">
            <div class="col-md-6">
                <div id="testimonials-slider" class="owl-carousel owl-theme owl-bottomleft-narrow">
                    <div class="item">
                        <div class="testimonial-author">
                            <div class="img-thumbnail img-thumbnail-small"><img width="60" height="60" src="{{media url="wysiwyg/smartwave/porto/homepage/24/shop24_author1.jpg"}}" alt=""/></div>
                            <p><strong>John Smith</strong><span>Porto CO SEO</span></p>
                        </div>
                        <blockquote class="testimonial">
                            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum molestie, massa ut semper egestas, ex ligula ifend neque, eget pharetra elit lectus ac ex.risus.</p>
                        </blockquote> 
                    </div>
                    <div class="item">
                        <div class="testimonial-author">
                            <div class="img-thumbnail img-thumbnail-small"><img width="60" height="60" src="{{media url="wysiwyg/smartwave/porto/homepage/24/shop24_author1.jpg"}}" alt=""/></div>
                            <p><strong>Bob Smith</strong><span>Porto CO SEO</span></p>
                        </div>
                        <blockquote class="testimonial">
                            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum molestie, massa ut semper egestas, ex ligula ifend neque, eget pharetra elit lectus ac ex.risus.</p>
                        </blockquote> 
                    </div>
                </div>
                <script type="text/javascript">
                require([
                    'jquery',
                    'owl.carousel/owl.carousel.min'
                ], function ($) {
                    $("#testimonials-slider").owlCarousel({
                        autoplay: true,
                        autoplayTimeout: 5000,
                        autoplayHoverPause: true,
                        margin: 0,
                        nav: false,
                        dots: true,
                        navRewind: true,
                        animateIn: 'fadeIn',
                        animateOut: 'fadeOut',
                        loop: true,
                        items: 1
                    });
                });
                </script>
            </div>
            <div class="col-md-6">
                <h2 style="margin-top: 0;font-size: 20px;font-weight: 700;margin-bottom:20px;color: #2b2b2d;" class="">FROM THE BLOG</h2>
                <div id="latest_news" class="owl-top-narrow">
                    <div class="recent-posts">
                        <div class="owl-carousel">
                            <div class="item">
                                <div class="post-date">25-FEB-2019</div>
                                <div class="postTitle">
                                    <h2><a href="#">Post Format – Video</a></h2>
                                </div>
                                <div class="postContent"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras non placerat mi. Etiam non...</p></div>
                                <a class="readmore" href="#">Read more &gt;</a>
                            </div>
                            <div class="item">
                                <div class="post-date">26-FEB-2019</div>
                                <div class="postTitle">
                                    <h2><a href="#">Post Format – Image Gallery</a></h2>
                                </div>
                                <div class="postContent"><p>Leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with...</p></div>
                                <a class="readmore" href="#">Read more &gt;</a>
                            </div>
                        </div>
                    </div>
                    <script type="text/javascript">
                        require([
                            'jquery',
                            'owl.carousel/owl.carousel.min'
                        ], function ($) {
                            $("#latest_news .owl-carousel").owlCarousel({
                                loop: false,
                                margin: 10,
                                nav: false,
                                navText: ["<em class='porto-icon-left-open-huge'></em>","<em class='porto-icon-right-open-huge'></em>"],
                                dots: false,
                                responsive: {
                                    0: {
                                        items:1
                                    },
                                    640: {
                                        items:2
                                    },
                                    768: {
                                        items:2
                                    },
                                    992: {
                                        items:2
                                    },
                                    1200: {
                                        items:2
                                    }
                                }
                            });
                        });
                    </script>
                </div>
            </div>
        </div>
    </div>
</div>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 25</title>
         <identifier>porto_home_25</identifier>
         <content><![CDATA[<style>
.page-main {
    max-width: 100%;
    padding: 0;
}
.columns .column.main {
    padding-bottom: 0;
}
.bg-grey-gradient {
    background-image: linear-gradient(to bottom,#f4f4f4,#fff);
}
#main-slider-demo-25 img {
    width: 100%;
}
#main-slider-demo-25 .products-grid:not(.side-list):not(.small-list) .product-item .product-item-info {
    padding: 0;
    border: 0;
    box-shadow: none;
}
.category-product-item {
    position: relative;
    cursor: pointer;
}
.category-product-item:before {
    background-color: rgba(27, 27, 23, 0.01);
    content: "";
    transition: all 0.3s;
    bottom: 0;
    color: #FFF;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    display: block;
    z-index: 1;
}
.owl-item > .item:hover > .category-product-item:before {
    background-color: rgba(27, 27, 23, 0.16);
}
.category-product-item > .cat-detail {
    position: absolute;
    left: 0;
    right: 0;
    text-align: center;
    top: 12%;
    color: #fff;
    z-index: 2;
}
.category-product-item + .products-grid .product-item {
    width: 100%;
}
.category-product-item + .products-grid {
    max-width: 50%;
    margin: -37% auto 0;
}
@media (max-width: 991px) {
    .category-product-item + .products-grid {
        max-width: 70%;
    }
}
.category-product-item .cat-detail h3 {
    font-size: 22px;
    font-weight: 700;
    margin: 0 0 10px;
    line-height: 1.35;
}
.category-product-item .cat-detail h5 {
    font-size: 14px;
    margin: -10px 0 0;
    font-weight: 500;
    text-transform: uppercase;
    line-height: 1.8;
    opacity: .7;
}
.category-product-item .cat-detail > a {
    font-size: 12px;
    color: #fff;
    display: inline-block;
    text-transform: uppercase;
    margin-top: 4%;
    padding: 10px;
}
.category-product-item .cat-detail > a > i {
    margin-left: 8px;
}
@media (max-width: 767px) {
    .category-product-item .cat-detail h3 {
        font-size: 18px;
    }
    .category-product-item .cat-detail h5 {
        font-size: 12px;
    }
}
#main-slider-demo-25 .products-grid .product-labels, #main-slider-demo-25 .products-grid .product-item .product-item-inner, #main-slider-demo-25 .products-grid .product-item .product-item-info .weltpixel-quickview.weltpixel_quickview_button_v2 {
    display: none;
}
#main-slider-demo-25 .products-grid .product-item .product-item-info.type1 {
    background: transparent;
}
#main-slider-demo-25 .owl-middle-narrow.owl-theme .owl-controls {
    top: 32%;
    opacity: 1;
    visibility: visible;
}
#main-slider-demo-25 .owl-middle-narrow.owl-theme .owl-controls .owl-nav [class*=owl-] {
    font-size: 18px;
    color: #fff;
}
.products-pd-1 > .products-grid .product-item .product-item-info {
    border: 0 !important;
    box-shadow: none !important;
    padding: 20px 40px 5px !important;
}
.products-pd-1 > .products-grid .product-item {
    padding: 1px;
}
.products-pd-1 > .products-grid {
    margin: -1px;
}
.products-pd-1 .products-grid .product-item .product-item-inner, .products-pd-1 .product-item .product-reviews-summary, .products-pd-1 .products-grid .product-item .product-item-info .weltpixel-quickview.weltpixel_quickview_button_v2, .products-pd-1 .product-labels {
    display: none;
}
.products-pd-1 > .products-grid .product-item .price-box {
    white-space: nowrap;
}
.cms-index-index .column.main .block.newsletter {
    width: auto;
    max-width: 570px;
    margin: 0 auto;
}
.cms-index-index .column.main .block.newsletter .field .control:before {
    display: none;
}
.cms-index-index .column.main .block.newsletter input {
    border-radius: 24px 0 0 24px;
    background: #f4f4f4;
    border: none;
    height: 48px;
    font-size: 12px;
    font-style: italic;
    color: #777;
    outline: none;
    box-shadow: none;
    text-align: left;
    line-height: 1.42857;
    padding: 8px 12px;
    padding-left: 25px;
    font-family: inherit;
}
.cms-index-index .column.main .block.newsletter .action.subscribe {
    padding-left: 25px;
    padding-right: 30px;
    border-radius: 0 24px 24px 0;
    height: 48px;
    font-size: 12px;
    font-weight: 700;
    background: #333;
    box-shadow: none;
    border: 0;
}
</style>
<div class="bg-grey-gradient" style="padding-top: 20px;">
    <div id="main-slider-demo-25">
        <div class="owl-carousel owl-middle-narrow">
            <div class="item">
                <div class="category-product-item">
                    <img src="{{media url="wysiwyg/smartwave/porto/homepage/25/arts-photography.jpg"}}" alt="" />
                    <span class="cat-detail">
                        <h3>Arts & Photography</h3>
                        <h5>2 Products</h5>
                        <a href="#"><span>View All Products</span><i class="fas fa-long-arrow-alt-right"></i></a>
                    </span>
                </div>
                {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="latest_product" product_count="1" column_count="1" aspect_ratio="1" image_width="250" product_type="1" lazyload="none" template="grid.phtml"}}
            </div>
            <div class="item">
                <div class="category-product-item">
                    <img src="{{media url="wysiwyg/smartwave/porto/homepage/25/business-investing.jpg"}}" alt="" />
                    <span class="cat-detail">
                        <h3>Business & Investing</h3>
                        <h5>3 Products</h5>
                        <a href="#"><span>View All Products</span><i class="fas fa-long-arrow-alt-right"></i></a>
                    </span>
                </div>
                {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="latest_product" product_count="1" column_count="1" aspect_ratio="1" image_width="250" product_type="1" lazyload="none" template="grid.phtml"}}
            </div>
            <div class="item">
                <div class="category-product-item">
                    <img src="{{media url="wysiwyg/smartwave/porto/homepage/25/literature-fiction.jpg"}}" alt="" />
                    <span class="cat-detail">
                        <h3>Literature & Fiction</h3>
                        <h5>4 Products</h5>
                        <a href="#"><span>View All Products</span><i class="fas fa-long-arrow-alt-right"></i></a>
                    </span>
                </div>
                {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="latest_product" product_count="1" column_count="1" aspect_ratio="1" image_width="250" product_type="1" lazyload="none" template="grid.phtml"}}
            </div>
            <div class="item">
                <div class="category-product-item">
                    <img src="{{media url="wysiwyg/smartwave/porto/homepage/25/mystery-suspense.jpg"}}" alt="" />
                    <span class="cat-detail">
                        <h3>Mystery Suspense</h3>
                        <h5>4 Products</h5>
                        <a href="#"><span>View All Products</span><i class="fas fa-long-arrow-alt-right"></i></a>
                    </span>
                </div>
                {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="latest_product" product_count="1" column_count="1" aspect_ratio="1" image_width="250" product_type="1" lazyload="none" template="grid.phtml"}}
            </div>
            <div class="item">
                <div class="category-product-item">
                    <img src="{{media url="wysiwyg/smartwave/porto/homepage/25/scifi-fantasy.jpg"}}" alt="" />
                    <span class="cat-detail">
                        <h3>Scifi Fantasty</h3>
                        <h5>3 Products</h5>
                        <a href="#"><span>View All Products</span><i class="fas fa-long-arrow-alt-right"></i></a>
                    </span>
                </div>
                {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="latest_product" product_count="1" column_count="1" aspect_ratio="1" image_width="250" product_type="1" lazyload="none" template="grid.phtml"}}
            </div>
        </div>
        <script type="text/javascript">
        require([
            'jquery',
            'owl.carousel/owl.carousel.min'
        ], function ($) {
            $("#main-slider-demo-25 .owl-carousel").owlCarousel({
                autoplay: true,
                autoplayTimeout: 5000,
                autoplayHoverPause: true,
                stagePadding: 70,
                margin: 20,
                nav: true,
                navText: ["<em class='porto-icon-left-open-big'></em>","<em class='porto-icon-right-open-big'></em>"],
                dots: false,
                loop: true,
                responsive: {
                    0: {
                        items:1
                    },
                    560: {
                        items:2
                    },
                    768: {
                        items:3
                    }
                }
            });
        });
        </script>
    </div>
</div>
<div style="background-color: #f4f4f4;padding: 50px 0;">
    <div class="container">
        <h2 class="filterproduct-title"><span class="content"><strong>Best Sellers Books</strong></span><a href="#" class=""><span>View All Products</span><i class="fas fa-long-arrow-alt-right"></i></a></h2>
        <div class="row no-padding" style="margin: -1px;">
            <div class="col-md-4" style="padding: 1px !important;">
                <div style="padding: 50px 0;background-color: #fff;height: 100%;display: flex;flex-direction: column;align-items: center;justify-content: center;">
                    <h5 style="font-size: 18px;color: rgba(34,37,41,0.6);line-height: 1;text-align: center;font-weight:200;margin: 0;margin-bottom: 4px;"><i>BOOK CLUB</i></h5>
                    <h2 style="font-size: 28px;line-height: 32px;text-align: center;font-weight:600;color: #222529;letter-spacing: -0.24px;margin: 0;margin-bottom: 32px;padding: 0 15%;">A selection with only the best books</h2>
                    <p style="margin-bottom: 43px;"><img src="{{media url="wysiwyg/smartwave/porto/homepage/25/shop25_book_img.png"}}" alt="" /></p>
                    <p style="margin: 0;"><a href="#" class="btn" style="background-color: #3256f4;color: #fff;font-size: 16px;font-weight: 500;line-height: 1.4;padding: 13px 32px;"><span>EXPLORE BOOKS</span><i class="fas fa-long-arrow-alt-right" style="margin-left: 10px;"></i></a></p>
                </div>
            </div>
            <div class="col-md-8 products-pd-1" style="padding: 1px !important;">
                {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="latest_product" product_count="8" column_count="4" aspect_ratio="1" image_width="250" product_type="1" template="grid.phtml"}}
            </div>
        </div>
    </div>
</div>
<div style="background-color: #fff;padding: 50px 0;">
    <div class="container">
        <div class="row">
            <div class="col-md-4" style="margin-bottom: 48px;">
                <div class="column-inner">
                    <div class="row no-padding justify-content-end" style="background: url({{media url="wysiwyg/smartwave/porto/homepage/25/shop25_home_banner1.jpg"}}) no-repeat;background-size: cover;padding: 45px 0 30px;">
                        <div class="col-auto" style="padding-right: 24px !important;">
                            <h2 style="font-size: 19px;line-height: 1;font-weight:600;margin: 0;margin-bottom: 8px;text-transform: uppercase;color: #fff;">Award Winners</h2>
                            <p style="color: rgba(255,255,255,0.5);margin-bottom: 16px;">12 Books</p>
                            <p style="margin: 0;"><a href="#" class="btn" style="background-color: #3256f4;color: #fff;font-size: 12px;font-weight: 600;line-height: 1.4;padding: 9px 15px;"><span>VIEW COLLECTIONS</span><i class="fas fa-long-arrow-alt-right" style="margin-left: 10px;"></i></a></p>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-md-4" style="margin-bottom: 48px;">
                <div class="column-inner">
                    <div class="row no-padding justify-content-end" style="background: url({{media url="wysiwyg/smartwave/porto/homepage/25/shop25_home_banner2.jpg"}}) no-repeat;background-size: cover;padding: 45px 0 30px;">
                        <div class="col-auto" style="padding-right: 24px !important;">
                            <h2 style="font-size: 19px;line-height: 1;font-weight:600;margin: 0;margin-bottom: 8px;text-transform: uppercase;color: #fff;">Deals In Books</h2>
                            <p style="color: rgba(255,255,255,0.5);margin-bottom: 16px;">21 Books</p>
                            <p style="margin: 0;"><a href="#" class="btn" style="background-color: #fe1656;color: #fff;font-size: 12px;font-weight: 600;line-height: 1.4;padding: 9px 15px;"><span>VIEW COLLECTIONS</span><i class="fas fa-long-arrow-alt-right" style="margin-left: 10px;"></i></a></p>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-md-4" style="margin-bottom: 48px;">
                <div class="column-inner">
                    <div class="row no-padding justify-content-end" style="background: url({{media url="wysiwyg/smartwave/porto/homepage/25/shop25_home_banner3.jpg"}}) no-repeat;background-size: cover;padding: 45px 0 30px;">
                        <div class="col-auto" style="padding-right: 24px !important;">
                            <h2 style="font-size: 19px;line-height: 1;font-weight:600;margin: 0;margin-bottom: 8px;text-transform: uppercase;color: #fff;">Most Gifted</h2>
                            <p style="color: rgba(255,255,255,0.5);margin-bottom: 16px;">38 Books</p>
                            <p style="margin: 0;"><a href="#" class="btn" style="background-color: #0590b3;color: #fff;font-size: 12px;font-weight: 600;line-height: 1.4;padding: 9px 15px;"><span>VIEW COLLECTIONS</span><i class="fas fa-long-arrow-alt-right" style="margin-left: 10px;"></i></a></p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <h2 class="filterproduct-title" style="margin-bottom: 10px;"><span class="content"><strong>Featured Books</strong></span></h2>
        {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="latest_product" product_count="6" column_count="6" aspect_ratio="1" image_width="250" product_type="3" template="grid.phtml"}}
    </div>
</div>
<div style="padding: 60px 0;background: #3256f4 url({{media url="wysiwyg/smartwave/porto/homepage/25/shop25_home_book.png"}}) center right no-repeat;background-size: 41% auto;">
    <div class="container">
        <div class="row align-items-center">
            <div class="col-md-7 col-lg-5 col-7">
                <div style="display: inline-block;">
                    <h5 style="font-size: 18px;color: rgba(255,255,255,0.6);line-height: 1.5;font-weight:200;margin: 0;"><i>AVAILABLE ONCE A YEAR</i></h5>
                    <h2 style="font-weight:600;color:#ffffff;font-size:29px;line-height:40px;margin: 0;">Get 30% off on orders over $299</h2>
                    <p style="font-weight:500;color: #ffffff;font-size:12px;line-height:16px;text-align:right;margin: 0;">* SELECTED BOOKS</p>
                </div>
            </div>
            <div class="col-md-7 col-lg-3 col-7">
                <a href="#" class="btn" style="background-color: #383f48;color: #fff;font-size: 16px;font-weight: 500;line-height: 1.4;padding: 13px 32px;"><span>EXPLORE BOOKS</span><i class="fas fa-long-arrow-alt-right" style="margin-left: 10px;"></i></a>
            </div>
        </div>
    </div>
</div>
<div style="background-color: #f4f4f4;padding: 50px 0;">
    <div class="container">
        <h2 class="filterproduct-title" style="margin-bottom: 10px;"><span class="content"><strong>Recent Books</strong></span></h2>
        {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="latest_product" product_count="6" column_count="6" aspect_ratio="1" image_width="250" product_type="3" template="grid.phtml"}}
    </div>
</div>
<div style="background-color: #fff;padding: 50px 0 55px;text-align: center;">
    <div class="container">
        <p style="margin-bottom: 8px;"><i class="far fa-envelope" style="font-size: 30px; line-height: 1; color: #333;"></i></p>
        <h2 style="color: #222529;font-size: 24px;line-height: 30px;letter-spacing: -0.24px;margin: 0;font-weight: 600;">Subscribe to Our Newsletter</h2>
        <p style="color: #777;font-size: 14px;line-height: 25px;margin-bottom: 24px;">Get all the latest information on Events, Sales and Offers.</p>
        {{block class="Magento\Newsletter\Block\Subscribe" name="home.newsletter" template="subscribe_form_footer.phtml"}}
    </div>
</div>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 26</title>
         <identifier>porto_home_26</identifier>
         <content><![CDATA[<style>
.page-main {
    max-width: 100%;
    padding: 0;
}
.columns .column.main {
    padding: 0;
}
.row.no-padding > .homebanner-left {
    padding-left: 22px !important;
}
@media (min-width: 768px) {
    .row.no-padding > .homebanner-left {
        padding-left: 24px !important;
    }
}
@media (min-width: 1260px) {
    .row.no-padding > .homebanner-left {
        padding-left: 70px !important;
    }
}
.newsletter-section .field.newsletter label {
    display: none;
}
.newsletter-section .field.newsletter .control {
    display: flex;
}
.newsletter-section .field.newsletter .control > input {
    height: 48px;
    border-radius: 24px 0 0 24px;
    font-style: italic;
    font-size: 12px;
    padding-left: 20px;
    box-shadow: none;
    background-color: #fff;
    color: #777;
    border-color: rgba(0,0,0,0.09);
}
.newsletter-section .field.newsletter .control > button {
    padding: 10px 35px 10px 30px;
    border-radius: 0 24px 24px 0;
    height: 48px;
    color: #ffffff;
    background-color: #323232;
    border-color: #323232 #323232 #191919;
}
.product-tag-section {
    margin-bottom: 35px;
    background: #f4f4f4;
    padding: 20px 0 0 20px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.product-tag-section a.tag-cloud-link {
    font-size: 13px;
    font-weight: 600;
    color: #222529;
    text-transform: uppercase;
    border: 1px solid #e7e7e7;
    background: #fff;
    border-radius: 0;
    margin: 0 20px 20px 0;
    min-width: 110px;
    padding: 13px;
    text-align: center;
    line-height: 1;
    display: inline-block;
    text-decoration: none;
}
.white-product-section .products {
    margin: 0;
}
.white-product-section .products .product-item {
    padding: 0;
}
@media (max-widdth: 575px){
    .white-product-section .products-grid .product-item {
        width: 100%;
    }
}
.homepage-bar {
    border: 0;
    background-color: #f4f4f4;
}
.homepage-bar .col-lg-4 {
    border-left-color: #fff;
    border-left-width: 2px;
    text-align: center !important;
}
.homepage-bar [class*=" porto-icon-"], .homepage-bar [class^=porto-icon-], .homepage-bar [class*=" porto-new-icon-"], .homepage-bar [class^=porto-new-icon-] {
    font-size: 32px;
}
.homepage-bar .row {
    margin: 0;
}
.homepage-bar .row > div {
    display: flex;
    align-items: center;
    justify-content: center;
}
.homepage-bar .col-lg-4 > * {
    display: inline-block;
    vertical-align: middle;
}
.homepage-bar h3 {
    line-height: 1;
    margin-bottom: 3px;
}
@media (max-width: 991px) {
    .homepage-bar .col-lg-4 {
        border-top: 2px solid #fff;
    }
    .homepage-bar .col-lg-4:first-child {
        border-top: 0;
    }
}
.recent-posts .item .col-md-5, .recent-posts .item .col-md-7 {
    max-width: 100%;
    flex: 0 0 100%;
    position: static;
}
.recent-posts .item .post-image {
    padding: 0;
    border: 0;
    width: 100%;
    padding-top: 46%;
    position: relative;
    margin-bottom: 20px;
}
.recent-posts .item .post-image img {
    border-radius: 0;
    object-fit: cover;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    transition: transform .3s;
}
.recent-posts .item .post-image:hover img {
    transform: scale(1.2);
}
.recent-posts .post-date {
    float: none;
    display: inline-block;
    position: absolute;
    top: 0;
    margin: 10px 0 0 10px;
}
.recent-posts .post-date .day {
    background-color: #323232;
    color: #fff;
    padding-bottom: 0;
    line-height: 1;
    padding-top: 10px;
}
.recent-posts .post-date .month {
    background-color: #323232;
    color: #fff;
    font-size: 13px;
    line-height: 1.2;
    text-transform: uppercase;
    padding-top: 0;
    padding-bottom: 10px;
}
.recent-posts .postTitle h2 a {
    color: #2b2b2b;
}
.recent-posts .postTitle h2 {
    font-size: 17px;
    font-weight: 600;
    line-height: 1.3;
    margin-bottom: 7px;
}
.recent-posts .postTitle {
    min-height: 0;
}
.recent-posts .postContent {
    line-height: 25px;
}
.recent-posts a.readmore {
    font-size: 13px;
    margin-left: 5px;
}
</style>
<div class="container">
    <div class="row">
        <div class="col-md-8" style="margin-bottom: 20px;">
            <div class="row no-padding" style="background-color: #f4f4f4;">
                <div class="col-md-5 homebanner-left" style="padding-top: 60px !important;padding-bottom: 12px !important;">
                    <img src="{{media url="wysiwyg/smartwave/porto/homepage/26/shop26_brand.png"}}" alt="" style="display: block;margin-bottom: 16px;" />
                    <p style="font-size: 22px;line-height: 1;font-weight: 500;text-transform: uppercase;margin-bottom: 8px;">car shock absorbers</p>
                    <h2 style="font-size: 35px;line-height: 1.1;font-weight: 700;text-transform: uppercase;margin: 0;margin-bottom: 24px;color: #323232;letter-spacing: -0.7px">STARTING<br/>AT <small style="font-size: 50%;font-weight: inherit;vertical-align: top;line-height: 1.6;display: inline-block;color: inherit;font-family: inherit;">$</small>99<small style="font-size: 50%;font-weight: inherit;vertical-align: top;line-height: 1.6;display: inline-block;color: inherit;font-family: inherit;">99</small></h2>
                    <h3 style="font-size: 16px;line-height: 1;font-weight: 400;color: #222529;margin: 0;margin-bottom: 16px;">Start Shopping Right Now</h3>
                    <p style="font-size: 11px;line-height: 1.4;font-weight: 400;margin-bottom: 16px;">* Get Plus Discount Buying Package</p>
                    <p style="margin: 0;"><button class="btn" style="background-color: #323232;color: #fff;font-size: 14px;font-weight: 700;text-transform: uppercase;line-height: 1.3333;padding: 17px 32px;height: auto;border: 0;">View Sale</button></p>
                </div>
                <div class="col-md-7">
                    <img src="{{media url="wysiwyg/smartwave/porto/homepage/26/shop26_home_banner1.jpg"}}" alt=""/>
                </div>
            </div>
        </div>
        <div class="col-md-4" style="margin-bottom: 20px;">
            <div class="d-flex align-items-center" style="background: url({{media url="wysiwyg/smartwave/porto/homepage/26/shop26_home_banner2.jpg"}}) center no-repeat;background-size: cover;width: 100%;height: 100%;padding: 40px;justify-content: flex-end;">
                <div style="text-align: right;">
                    <h3 style="font-size: 20px;line-height: 1.2;font-weight: 700;margin: 0;margin-bottom: 8px;text-transform: uppercase;" class="theme-color">FLASH SALE</h3>
                    <h3 style="font-size: 20px;color: #a2a2a2;line-height: 1.2;font-weight: 500;margin: 0; margin-bottom: 8px;">ALL HIGH PERFORMANCE<br>WHEELS AND TIRES</h3>
                    <h2 style="font-size: 30px;line-height: 1;font-weight: 700;text-transform: uppercase;margin: 0;margin-bottom: 24px;color: #fff;letter-spacing: -0.7px">STARTING<br/>AT <small style="font-size: 50%;font-weight: inherit;vertical-align: top;line-height: 1.6;display: inline-block;color: inherit;">$</small>99<small style="font-size: 50%;font-weight: inherit;vertical-align: top;line-height: 1.6;display: inline-block;color: inherit;">99</small></h2>
                    <p style="margin: 0;"><button class="btn" style="background-color: #dae0e5;color: #222529;font-size: 14px;font-weight: 700;text-transform: uppercase;line-height: 1.3333;padding: 17px 32px;height: auto;border: 0;">View Sale</button></p>
                </div>
            </div>
        </div>
    </div>
    <div class="newsletter-section theme-border-color" style="margin-bottom: 35px;padding: 16px 20px;border: 1px solid;">
        <div class="row">
            <div class="col-md-5 d-flex align-items-center">
                <i class="far fa-envelope" style="color:#ec7200;font-size:45px;display:inline-block;margin: 0 15px 0 16px;"></i>
                <div>
                    <h2 style="font-weight:600;font-size:18px;line-height:18px;color:#323232;margin:0;margin-bottom: 3px;">Get Special Offers and Savings</h2>
                    <p style="font-weight:400;font-size:13px;line-height:15px;margin:0;">Get all the latest information on Events, Sales and Offers.</p>
                </div>
            </div>
            <div class="col-md-7">
                {{block class="Magento\Newsletter\Block\Subscribe" name="home.newsletter" template="subscribe_form.phtml"}}
            </div>
        </div>
    </div>
    <div class="popular-section">
        <h2 class="filterproduct-title" style="margin-bottom: 14px;"><span class="content"><strong>POPULAR ITEMS</strong></span></h2>
        {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="latest_product" product_count="6" column_count="6" aspect_ratio="0" image_width="250" image_height="250" template="grid.phtml"}}
    </div>
    <div class="product-tag-section" style="margin-bottom: 35px;background: #f4f4f4;padding: 20px 0 0 20px;display: flex;flex-wrap: wrap;justify-content: space-between">
        <a href="#" class="tag-cloud-link">Cadillac</a>
        <a href="#" class="tag-cloud-link">Chevy</a>
        <a href="#" class="tag-cloud-link">Dodge</a>
        <a href="#" class="tag-cloud-link">Ford</a>
        <a href="#" class="tag-cloud-link">Honda</a>
        <a href="#" class="tag-cloud-link">Hyundai</a>
        <a href="#" class="tag-cloud-link">Jeep</a>
        <a href="#" class="tag-cloud-link">Nissan</a>
        <a href="#" class="tag-cloud-link">Toyota</a>
    </div>
</div>
<div class="white-product-section" style="padding-top: 40px;padding-bottom: 40px;background-color: #f4f4f4;">
    <div class="container">
        {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="latest" aspect_ratio="1" column_count="3" product_count="6" image_width="212" product_type="11" template="grid.phtml"}}
    </div>
</div>
<div class="container" style="padding-top: 40px;">
    <div class="row align-items-center" style="padding: 16px 24px 0 24px;margin: 0;margin-bottom: 35px;background: url({{media url="wysiwyg/smartwave/porto/homepage/26/shop26_home_banner3.jpg"}}) center no-repeat;background-size: cover;">
        <div class="col-lg-9" style="margin-bottom: 16px;">
            <h2 style="font-size: 20.5px;line-height: 1.2;font-weight:700;margin: 0;margin-right: 16px;color: #fff;" class="d-inline-block"><i style="font-weight: 700;font-style: normal;display: inline-block;padding: 8px 9px;margin-right: 5px;background: linear-gradient(to right,#ec7200,#ffaa01);color: #fff;transform: rotate(-1deg);">BIG SALE</i> ALL HIGH PERFORMANCE ITEMS UP TO 70% OFF</h2>
            <h6 style="font-size: 13px;color: rgba(255,255,255,0.7);line-height: 1.5;font-weight:500;margin: 0;" class="vc_custom_heading d-inline-block mb-0 align-left">Online Purchases Only</h6>
        </div>
        <div class="col-lg-3 text-lg-right" style="margin-bottom: 16px;">
            <button class="btn" style="background-color: #dae0e5;color: #222529;font-size: 14px;font-weight: 700;text-transform: uppercase;line-height: 1.3333;padding: 17px 32px;height: auto;border: 0;">View Sale</button>
        </div>
    </div>  
    <div class="topseller-section">
        <h2 class="filterproduct-title" style="margin-bottom: 14px;"><span class="content"><strong>TOP SELLER</strong></span></h2>
        {{block class="Smartwave\Filterproducts\Block\Home\FeaturedList" name="latest_product" product_count="6" column_count="6" aspect_ratio="0" image_width="250" image_height="250" template="grid.phtml"}}
    </div>
    <div class="homepage-bar" style="margin-bottom: 40px;">
        <div class="row">
            <div class="col-lg-4">
                <i class="porto-icon-shipping theme-color"></i>
                <div class="text-area"><h3>Free Shipping on Orders Over $99</h3><p>For more than 100,000 parts!</p></div>
            </div>
            <div class="col-lg-4">
                <i class="porto-icon-money theme-color"></i>
                <div class="text-area"><h3>Up to 40% OFF on Selected Items</h3><p>Available for all Categories!</p></div>
            </div>
            <div class="col-lg-4">
                <i class="porto-new-icon-secure-payment theme-color"></i>
                <div class="text-area"><h3>100% Secure Payment</h3><p>We ensure secure payment!</p></div>
            </div>
        </div>
    </div>
    <div class="brands-slider-section">
        <h2 class="filterproduct-title" style="margin-bottom: 40px;"><span class="content"><strong>BRANDS WE TRUST</strong></span></h2>
        <div id="brands-slider-demo-26" class="brands-slider" style="text-align: center;margin-bottom: 40px;">
            <div class="owl-carousel">
                <div class="item"><img src="{{media url="wysiwyg/smartwave/porto/homepage/26/shop26_logo1.png"}}" alt="" style="display: inline-block;" /></div>
                <div class="item"><img src="{{media url="wysiwyg/smartwave/porto/homepage/26/shop26_logo2.png"}}" alt="" style="display: inline-block;" /></div>
                <div class="item"><img src="{{media url="wysiwyg/smartwave/porto/homepage/26/shop26_logo3.png"}}" alt="" style="display: inline-block;" /></div>
                <div class="item"><img src="{{media url="wysiwyg/smartwave/porto/homepage/26/shop26_logo4.png"}}" alt="" style="display: inline-block;" /></div>
                <div class="item"><img src="{{media url="wysiwyg/smartwave/porto/homepage/26/shop26_logo5.png"}}" alt="" style="display: inline-block;" /></div>
                <div class="item"><img src="{{media url="wysiwyg/smartwave/porto/homepage/26/shop26_logo6.png"}}" alt="" style="display: inline-block;" /></div>
            </div>
            <script type="text/javascript">
                require([
                    'jquery',
                    'owl.carousel/owl.carousel.min'
                ], function ($) {
                    $("#brands-slider-demo-26 .owl-carousel").owlCarousel({
                        autoplay: false,
                        autoplayTimeout: 5000,
                        autoplayHoverPause: true,
                        margin: 0,
                        nav: false,
                        navText: ["<em class='porto-icon-left-open-huge'></em>","<em class='porto-icon-right-open-huge'></em>"],
                        dots: false,
                        loop: false,
                        responsive: {
                            0: {
                                items:2
                            },
                            640: {
                                items:3
                            },
                            768: {
                                items:4
                            },
                            992: {
                                items:5
                            },
                            1200: {
                                items:6
                            }
                        }
                    });
                });
            </script>
        </div>
    </div>
</div>
<div style="padding-top: 50px;padding-bottom: 40px;background-color: #f4f4f4;">
    <div class="container">
        <div id="latest_news">
            <!--{-{block class="Magefan\Blog\Block\Sidebar\Recent" name="blog.home.recent" template="recent_home.phtml"}-}-->
            <div class="recent-posts">
                <div class="owl-carousel">
                    <div class="item">
                        <div class="row">
                            <div class="col-md-5">
                                <div class="post-image">
                                    <img src="{{media url="wysiwyg/smartwave/porto/homepage/26/shop26_post1.jpg"}}" alt="" />
                                </div>
                            </div>
                            <div class="col-md-7">
                                <div class="post-date">
                                    <span class="day">08</span>
                                    <span class="month">DEC</span>
                                </div>
                                <div class="postTitle">
                                    <h2><a href="{{store url='blog/post/post-format-standard'}}">Post Format Standard</a></h2>
                                </div>
                                <div class="postContent"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras non placerat mi. Etiam...<a class="readmore" href="#">read more &gt;</a></p></div>
                            </div>
                        </div>
                    </div>
                    <div class="item">
                        <div class="row">
                            <div class="col-md-5">
                                <div class="post-image">
                                    <img src="{{media url="wysiwyg/smartwave/porto/homepage/26/shop26_post2.jpg"}}" alt="" />
                                </div>
                            </div>
                            <div class="col-md-7">
                                <div class="post-date">
                                    <span class="day">15</span>
                                    <span class="month">FEB</span>
                                </div>
                                <div class="postTitle">
                                    <h2><a href="#">Post Format Video</a></h2>
                                </div>
                                <div class="postContent"><p>Leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s...<a class="readmore" href="#">read more &gt;</a></p></div>
                            </div>
                        </div>
                    </div>
                    <div class="item">
                        <div class="row">
                            <div class="col-md-5">
                                <div class="post-image">
                                    <img src="{{media url="wysiwyg/smartwave/porto/homepage/26/shop26_post3.jpg"}}" alt="" />
                                </div>
                            </div>
                            <div class="col-md-7">
                                <div class="post-date">
                                    <span class="day">27</span>
                                    <span class="month">JUN</span>
                                </div>
                                <div class="postTitle">
                                    <h2><a href="#">Post Format Image</a></h2>
                                </div>
                                <div class="postContent"><p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem...<a class="readmore" href="#">read more &gt;</a></p></div>                                
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <script type="text/javascript">
                require([
                    'jquery',
                    'owl.carousel/owl.carousel.min'
                ], function ($) {
                    $("#latest_news .owl-carousel").owlCarousel({
                        loop: false,
                        margin: 20,
                        nav: false,
                        navText: ["<em class='porto-icon-left-open-huge'></em>","<em class='porto-icon-right-open-huge'></em>"],
                        dots: false,
                        responsive: {
                            0: {
                                items:1
                            },
                            640: {
                                items:2
                            },
                            768: {
                                items:2
                            },
                            992: {
                                items:2
                            },
                            1200: {
                                items:3
                            }
                        }
                    });
                });
            </script>
        </div>
    </div>
</div>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 27</title>
         <identifier>porto_home_27</identifier>
         <content><![CDATA[<style>
.page-main {
    max-width: 100%;
    padding: 0;
}
.columns .column.main {
    padding: 0;
}
.home-slider {
    position: relative;
    color: #222529;
    border-bottom: 1px solid #e7e7e7;
}
.home-slider:before {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 61%;
    display: block;
    background: #f7f6f7;
    content: '';
}
.owl-middle-narrow .owl-theme .owl-controls, .owl-middle-narrow.owl-theme .owl-controls {
    visibility: visible;
    opacity: 1;
    width: calc(100% + 100px);
    margin-left: -50px;
}
.owl-middle-narrow .owl-theme .owl-controls .owl-nav [class*=owl-], .owl-middle-narrow.owl-theme .owl-controls .owl-nav [class*=owl-] {
    font-size: 24px;
    color: #333;
}
.home-subcats {
    background-color: #f4f4f4;
    border: 1px solid #f4f4f4;
}
.home-subcats .porto-sicon-box {
    padding: 10px;
    justify-content: center;
    margin: 0;
    background-color: #fff;
}
.home-subcats .left-icon .porto-sicon-body, .home-subcats .left-icon .porto-sicon-left {
    flex: 0 0 auto;
}
.home-subcats .left-icon .porto-sicon-left {
    margin-right: 15px;
}
.home-subcats .owl-controls {
    display: none;
}
.h-100 > .porto-ultimate-content-box {
    height: 100%;
    font-size: .6666vw;
}
@media (max-width: 767px) {
    .h-100 > .porto-ultimate-content-box {
        min-height: 50vw;
        font-size: 1vw;
    }
}
</style>
<div class="home-slider" style="margin-bottom: 35px;">
    <div class="container">
        <div id="banner-slider-demo-27" class="owl-carousel owl-banner-carousel owl-middle-narrow">
            <div class="item">
                <div class="row">
                    <div class="col-lg-4 py-5 pl-lg-5" style="display: flex;align-items: center;justify-content: center;padding-right: 0;">
                        <div style="text-align: left;">
                            <p style="font-size: 34px;color: #999999;line-height: 1;font-weight: 500;margin: 0 0 4px;">EXTRA</p>
                            <h3 style="font-size: 69px;line-height: 1;font-weight: 700;margin: 0 0 4px;">20% OFF</h3>
                            <h4 style="font-size: 34px;line-height: 1;text-align: center;font-weight: 700;margin: 0 0 16px;" class="heading-middle-border-center">BIKES</h4>
                            <h2 style="font-size: 46px;line-height: 1;font-weight:700;font-family: 'Segoe Script','Savoye LET';padding-bottom: 24px;margin: 0 0 48px;">Sumer Sale</h2>
                            <button class="btn" style="font-size: 16px;font-weight: 600;letter-spacing: 2.4px;line-height: 1.42857;background-color: #07080a;color: #fff;padding: 18px 64px;height: auto;">SHOP ALL SALE</button>
                        </div>
                    </div>
                    <div class="col-lg-8 text-center text-lg-left pt-0 pt-lg-5 pb-5 slash-bg" style="background: url({{media url="wysiwyg/smartwave/porto/homepage/27/shop27_home_slide_bg.png"}}) left center no-repeat;background-size: cover;padding-left: 5%;">
                        <img src="{{media url="wysiwyg/smartwave/porto/homepage/27/shop27_home_slide1.png"}}" alt="" style="margin-bottom: 48px;display: inline-block;" />
                        <div style="">
                            <h3 style="font-size: 18px;font-weight:700;margin: 0 48px 8px;display: inline-block;vertical-align: middle;">ONLY <b style="display: inline-block;color: #b35827;font-size: 2em;position: relative;top: 3px;line-height: 1;vertical-align: middle;"><small style="font-size: 50%;line-height: 1.6;vertical-align: top;font-weight: inherit;color: inherit;font-family: inherit;">$</small>399<small style="font-size: 50%;line-height: 1.6;vertical-align: top;font-weight: inherit;color: inherit;font-family: inherit;">99</small></b></h3>
                            <div style="display: inline-block;vertical-align: middle;">
                                <h2 style="font-weight:500;font-size:16px;line-height:16px;margin: 0;letter-spacing: -0.5px;">Start Shopping Right Now</h2>
                                <p style="font-size:11px;margin: 0;line-height: 24px;color: #777;letter-spacing: 0;">* Get Plus Discount Buying Package</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="item">
                <div class="row">
                    <div class="pt-0 pt-lg-5 pb-5 col-lg-7 text-center text-lg-right" style="padding-left: 5%;">
                        <img src="{{media url="wysiwyg/smartwave/porto/homepage/27/shop27_home_slide2.png"}}" alt="" style="margin-bottom: 48px;display: inline-block;" />
                    </div>
                    <div class="col-lg-5 py-5 pl-lg-5" style="display: flex;align-items: center;justify-content: center;padding-right: 0;">
                        <div style="text-align: left;">
                            <p style="font-size: 34px;color: #999999;line-height: 1;font-weight: 500;margin: 0 0 4px;">EXTRA</p>
                            <h3 style="font-size: 69px;line-height: 1;font-weight: 700;margin: 0 0 4px;">20% OFF</h3>
                            <h4 style="font-size: 34px;line-height: 1;text-align: center;font-weight: 700;margin: 0 0 16px;" class="heading-middle-border-center">BIKES</h4>
                            <h2 style="font-size: 46px;line-height: 1;font-weight:700;font-family: 'Segoe Script','Savoye LET';padding-bottom: 24px;margin: 0 0 48px;">Sumer Sale</h2>
                            <button class="btn" style="font-size: 16px;font-weight: 600;letter-spacing: 2.4px;line-height: 1.42857;background-color: #07080a;color: #fff;padding: 18px 64px;height: auto;">SHOP ALL SALE</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <script type="text/javascript">
        require([
            'jquery',
            'owl.carousel/owl.carousel.min'
        ], function ($) {
            var banner_owl = $("#banner-slider-demo-27");
            banner_owl.owlCarousel({
                items: 1,
                autoplay: true,
                autoplayTimeout: 5000,
                autoplayHoverPause: true,
                dots: false,
                nav: true,
                navRewind: true,
                animateIn: 'fadeIn',
                animateOut: 'fadeOut',
                loop: true,
                lazyLoad: true,
                navText: ["<em class='porto-icon-left-open-big'></em>","<em class='porto-icon-right-open-big'></em>"]
            });
        });
        </script>
    </div>
</div>
<div class="container">
    <h2 class="filterproduct-title" style="margin-bottom: 26px;"><span class="content"><strong>MOST POPULAR PRODUCTS</strong></span></h2>
    <div id="popular_product" class="owl-middle-narrow" style="margin: 0 -10px;">
        {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="popular_product" product_type="1" product_count="10" aspect_ratio="1" image_width="320" image_height="320" template="owl_list.phtml"}}
    </div>
    <script type="text/javascript">
    require([
      'jquery',
      'owl.carousel/owl.carousel.min'
    ], function ($) {
      $("#popular_product .owl-carousel").owlCarousel({
        autoplay: true,
        autoplayTimeout: 5000,
        autoplayHoverPause: true,
        loop: false,
        navRewind: true,
        margin: 0,
        nav: true,
        navText: ["<em class='porto-icon-left-open-big'></em>","<em class='porto-icon-right-open-big'></em>"],
        dots: false,
        responsive: {
          0: {
            items:1
          },
          480: {
            items:2
          },
          768: {
            items:3
          },
          992: {
            items:4
          },
          1200: {
            items:5
          }
        }
      });
    });
    </script>
    <div id="category-slider-demo-27" class="home-subcats" style="margin-top: 20px;margin-bottom: 40px;">
        <div class="owl-carousel">
            <div class="item">
                <div class="porto-sicon-wrapper style_1">
                    <div class="porto-sicon-box left-icon">
                        <div class="porto-sicon-left">
                            <img src="{{media url="wysiwyg/smartwave/porto/homepage/27/shop27_icon1.png"}}" alt="" />
                        </div>
                        <div class="porto-sicon-body">
                            <div class="porto-sicon-header">
                                <h3 class="porto-sicon-title" style="font-weight:700;font-size:16px;line-height:20px;color:#222529;">BIKE SADDLES</h3>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="item">
                <div class="porto-sicon-wrapper style_1">
                    <div class="porto-sicon-box left-icon">
                        <div class="porto-sicon-left">
                            <img src="{{media url="wysiwyg/smartwave/porto/homepage/27/shop27_icon2.png"}}" alt="" />
                        </div>
                        <div class="porto-sicon-body">
                            <div class="porto-sicon-header">
                                <h3 class="porto-sicon-title" style="font-weight:700;font-size:16px;line-height:20px;color:#222529;">BIKE SADDLES</h3>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="item">
                <div class="porto-sicon-wrapper style_1">
                    <div class="porto-sicon-box left-icon">
                        <div class="porto-sicon-left">
                            <img src="{{media url="wysiwyg/smartwave/porto/homepage/27/shop27_icon3.png"}}" alt="" />
                        </div>
                        <div class="porto-sicon-body">
                            <div class="porto-sicon-header">
                                <h3 class="porto-sicon-title" style="font-weight:700;font-size:16px;line-height:20px;color:#222529;">BIKE SADDLES</h3>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="item">
                <div class="porto-sicon-wrapper style_1">
                    <div class="porto-sicon-box left-icon">
                        <div class="porto-sicon-left">
                            <img src="{{media url="wysiwyg/smartwave/porto/homepage/27/shop27_icon4.png"}}" alt="" />
                        </div>
                        <div class="porto-sicon-body">
                            <div class="porto-sicon-header">
                                <h3 class="porto-sicon-title" style="font-weight:700;font-size:16px;line-height:20px;color:#222529;">BIKE SADDLES</h3>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="item">
                <div class="porto-sicon-wrapper style_1">
                    <div class="porto-sicon-box left-icon">
                        <div class="porto-sicon-left">
                            <img src="{{media url="wysiwyg/smartwave/porto/homepage/27/shop27_icon5.png"}}" alt="" />
                        </div>
                        <div class="porto-sicon-body">
                            <div class="porto-sicon-header">
                                <h3 class="porto-sicon-title" style="font-weight:700;font-size:16px;line-height:20px;color:#222529;">BIKE SADDLES</h3>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <script type="text/javascript">
        require([
            'jquery',
            'owl.carousel/owl.carousel.min'
        ], function ($) {
            $("#category-slider-demo-27 .owl-carousel").owlCarousel({
                autoplay: true,
                autoplayTimeout: 5000,
                autoplayHoverPause: true,
                margin: 0,
                nav: false,
                navText: ["<em class='porto-icon-left-open-big'></em>","<em class='porto-icon-right-open-big'></em>"],
                dots: false,
                loop: false,
                responsive: {
                    0: {
                        items:1
                    },
                    575: {
                        items:2
                    },
                    768: {
                        items:3
                    },
                    992: {
                        items:4
                    },
                    1280: {
                        items:5
                    }
                }
            });
        });
        </script>
    </div>
</div>
<div style="margin-bottom: 40px;">
    <div class="row" style="margin: 0 -5px;">
        <div class="col-md-4" style="padding: 5px;">
            <img src="{{media url="wysiwyg/smartwave/porto/homepage/27/shop27_home_banner1.jpg"}}" alt="" style="display: block;width: 100%;" />
        </div>
        <div class="col-md-8 h-100" style="padding: 5px;">
            <div class="porto-ultimate-content-box" style="background: url({{media url="wysiwyg/smartwave/porto/homepage/27/shop27_home_banner2.jpg"}}) center no-repeat;background-size: cover;padding-top: 2.5%;">
                <h3 style="font-size: 2.1875em;color: #999999;font-weight: 500;line-height: 1;margin: 0;margin-left: 37%;">GET READY</h3>
                <h2 style="font-size: 4.5em;line-height: 1;font-weight: 700;color: #222529;margin: 0;margin-left: 42%;vertical-align: middle;" class="mb-2 mb-lg-3 mr-3 mr-lg-4 d-inline-block">20% OFF</h2>
                <div class="mb-2 mb-lg-3 d-none d-sm-inline-block" style="vertical-align: middle;">
                    <button class="btn" style="font-size: 13px;font-weight: 600;letter-spacing: 1.92px;line-height: 1.42857;background-color: #222529;color: #fff;padding: 14px 51px;height: auto;">SHOP ALL SALE</button>
                </div>
                <h2 style="font-size: 2.65em;line-height: 1;color: #222529;font-weight: 700;margin: 0;margin-bottom: 25px;margin-left: 46%;margin-right: 22%;">BIKES</h2>
            </div>
        </div>
    </div>
</div>
<div class="container">
    <h2 class="filterproduct-title" style="margin-bottom: 26px;"><span class="content"><strong>TRENDING ACCESSORIES</strong></span></h2>
    <div id="trending_product" class="" style="margin: 0 -10px;">
        {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="trending_product" product_type="1" product_count="10" aspect_ratio="1" image_width="320" image_height="320" template="owl_list.phtml"}}
    </div>
    <script type="text/javascript">
    require([
      'jquery',
      'owl.carousel/owl.carousel.min'
    ], function ($) {
      $("#trending_product .owl-carousel").owlCarousel({
        autoplay: true,
        autoplayTimeout: 5000,
        autoplayHoverPause: true,
        loop: false,
        navRewind: true,
        margin: 0,
        nav: false,
        navText: ["<em class='porto-icon-left-open-big'></em>","<em class='porto-icon-right-open-big'></em>"],
        dots: false,
        responsive: {
          0: {
            items:1
          },
          480: {
            items:2
          },
          768: {
            items:3
          },
          992: {
            items:4
          },
          1200: {
            items:5
          }
        }
      });
    });
    </script>
    <div style="margin-top: 20px;margin-bottom: 40px;">
        <div class="row">
            <div class="col-xl-6">
                <div class="py-4 py-sm-3 h-100" style="background-color: #f4f4f4;height: 100%;">
                    <div class="row" style="height: 100%;">
                        <div class="col-sm-4 d-flex align-items-center justify-content-center" style="flex-direction: column;color: #222529;">
                            <h3 style="font-size: 33px;line-height: 1;text-align: center;font-weight: 700;margin: 0;font-family: 'Segoe Script','Savoye LET';">Sumer Sale</h3>
                            <h2 style="font-size: 49px;line-height: 1;text-align: center;font-weight: 700;margin: 0;letter-spacing: 0.5px">20% OFF</h2>
                        </div>
                        <div class="col-sm-4 py-3 py-sm-0 d-flex align-items-center">
                            <img src="{{media url="wysiwyg/smartwave/porto/homepage/27/shop27_home_banner3.jpg"}}" alt="" style="display: block;margin: 0 auto;" />
                        </div>
                        <div class="col-sm-4 d-flex align-items-center justify-content-center" style="text-align: center;">
                            <button class="btn" style="font-size: 14px;font-weight: 600;letter-spacing: 2.1px;line-height: 1.3333;background-color: #222529;color: #fff;padding: 16px 0;height: auto;width: 200px;max-width: calc(100% - 20px);">SHOP ALL SALE</button>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-xl-6">
                <div class="py-4 py-sm-3 h-100" style="background-color: #4db7b3;height: 100%;">
                    <div class="row" style="height: 100%;">
                        <div class="col-sm-4 d-flex align-items-center justify-content-center" style="flex-direction: column;color: #fff;">
                            <h3 style="font-size: 33px;line-height: 1;text-align: center;font-weight: 700;margin: 0;font-family: 'Segoe Script','Savoye LET';">Flash Sale</h3>
                            <h2 style="font-size: 49px;line-height: 1;text-align: center;font-weight: 700;margin: 0;letter-spacing: 0.5px">30% OFF</h2>
                        </div>
                        <div class="col-sm-4 py-3 py-sm-0 d-flex align-items-center">
                            <img src="{{media url="wysiwyg/smartwave/porto/homepage/27/shop27_home_banner4.jpg"}}" alt="" style="display: block;margin: 0 auto;" />
                        </div>
                        <div class="col-sm-4 d-flex align-items-center justify-content-center" style="text-align: center;">
                            <button class="btn" style="font-size: 14px;font-weight: 600;letter-spacing: 2.1px;line-height: 1.3333;background-color: #fff;color: #222529;padding: 16px 0;height: auto;width: 200px;max-width: calc(100% - 20px);">SHOP ALL SALE</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 28</title>
         <identifier>porto_home_28</identifier>
         <content><![CDATA[<style>
.page-main {
    max-width: 100%;
    padding: 0;
}
.columns .column.main {
    padding: 0;
}
.homepage-bar {
    border-top: 0;
    border-bottom: 1px solid #eee;
    border-bottom-color: rgba(0,0,0,0.06);
    background-color: transparent;
    text-align: center;
    padding: 20px 0 10px;
}
.homepage-bar > .row > * {
    display: flex;
    align-items: center;
    justify-content: center;
}
.homepage-bar [class*=" porto-icon-"], .homepage-bar [class^=porto-icon-], .homepage-bar [class*=" porto-new-icon-"], .homepage-bar [class^=porto-new-icon-] {
    font-size: 35px;
    color: #333;
    display: inline-block;
    vertical-align: middle;
    line-height: 1;
}
.homepage-bar [class^="porto-icon-"]:before, .homepage-bar [class*=" porto-icon-"]:before, .homepage-bar [class^="porto-new-icon-"]:before, .homepage-bar [class*=" porto-new-icon-"]:before{
    vertical-align: middle;
}
.homepage-bar .text-area {
    color: #222529;
}
.homepage-bar h3 {
    font-size: 14px;
    line-height: 1;
    margin-bottom: 3px;
    color: #222529;
}
.homepage-bar p {
    font-size: 13px;
    line-height: 15px;
    color: #777;
}
@media (min-width: 768px) {
    .filterproducts-tab .data.items {
        background: transparent;
    }
    .filterproducts-tab .data.items>.item.title {
        float: right;
        background-color: transparent;
    }
    .filterproducts-tab .data.items>.item.title a.switch {
        border: 0;
        padding: 0;
        margin-right: 30px;
        font-size: 14px;
        font-weight: 500;
        line-height: 24px;
        text-transform: uppercase;
        letter-spacing: 0.15em;
        border-bottom: 3px solid transparent;
        display: inline-block;
    }
    .filterproducts-tab .data.items>.item.title.active a.switch, .filterproducts-tab .data.items>.item.title a.switch:hover  {
        border-bottom: 3px solid;
        text-decoration: none;
        color: #606da6;
    }
    .filterproducts-tab .data.items>.item.content {
        margin-top: 50px;
        box-sizing: border-box;
        float: left;
        margin-right: -100%;
        margin-left: 0;
        width: 100%;
    }
    .filterproduct-title + .filterproducts-tab {
        margin-top: -54px;
    }
}
.recent-posts .item .post-image {
    position: relative;
    border: 0;
    border-radius: 0;
    padding: 0;
}
.recent-posts .item .post-image img {
    border-radius: 0;
    display: block;
}
.recent-posts .post-date {
    float: none;
    position: absolute;
    left: 12px;
    top: 12px;
    background-color: #606da6;
    margin: 0;
    padding: 15px;
}
.recent-posts .post-date .day {
    color: #fff;
    background-color: transparent;
    padding-bottom: 0;
    font-size: 28px;
    line-height: 1;
    padding: 0;
}
.recent-posts .post-date .month {
    background-color: transparent;
    padding: 0;
    font-size: 12px;
    line-height: 1;
    margin-top: 4px;
    opacity: .5;
    width: auto;
}
@media (min-width: 1160px) {
    .recent-posts > .item > .row > .col-md-5 {
        flex: 0 0 50%;
        max-width: 50%;
    }
    .recent-posts > .item > .row > .col-md-7 {
        max-width: 50%;
        flex: 0 0 50%;
    }
}
.recent-posts .postCats > span {
    display: inline-block;
    padding: 8px 15px;
    background: #222529;
    color: #fff;
    font-size: 11px;
    font-weight: 600;
    text-indent: 0;
    line-height: 1;
    text-transform: uppercase;
    border-radius: .25rem;
    letter-spacing: 0.01em;
    vertical-align: middle;
}
.recent-posts .postCats {
    margin-bottom: 16px;
}
.recent-posts .postTitle {
    min-height: 0;
}
.recent-posts .postTitle h2 {
    margin-bottom: 12px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.recent-posts .postTitle h2 > a {
    color: #222529;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: 0.3px;
}
.recent-posts .postContent {
    font-size: 13px;
    line-height: 25px;
    font-family: 'Open Sans';
    letter-spacing: 0.1px;
}
.recent-posts .postContent > p {
    margin-bottom: 20px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
@media (min-width: 1440px) {
.recent-posts .postContent > p {
    -webkit-line-clamp: 3;
}
}
.recent-posts a.readmore {
    border-radius: 0;
    font-size: 11px;
    padding: 8px 20px;
    color: #222529;
    border: 2px solid #e7e7e7;
    height: auto;
    display: inline-block;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.65px;
    line-height: 1.3333;
    transition: all .3s;
    text-decoration: none;
}
.recent-posts a.readmore:hover {
    color: #fff;
    background-color: #606da6;
    border-color: #606da6;
}
</style>
<div class="home-banner" style="margin-top: 20px;">
    <div class="container">
        <div class="row">
            <div class="mb-3 mb-lg-0 col-lg-5">
                <div class="porto-ultimate-content-box" style="background: url({{media url="wysiwyg/smartwave/porto/homepage/28/shop28_home_banner1.jpg"}}) center no-repeat;background-size: cover;margin-bottom: 20px;padding-top: 17%;padding-right: 27px;padding-bottom: 30px;background-color: #f0f5f9;text-align: right;color: #222529;">
                    <h2 style="font-size: 34px;line-height: 1.2;font-weight: 700;margin: 0;">BLACK</h2>
                    <h3 style="font-size: 28px;line-height: 1.2;font-weight: 700;margin: 0;" class="mb-3">Armchairs</h3>
                    <h4 style="font-size: 15px;line-height: 1.2;font-weight: 600;margin: 0;color: #ed7e63;" class="mb-4">STARTING FROM $399</h4>
                    <p style="margin: 0;">
                        <button class="btn btn-default btn-xs btn-icon-right">SHOP NOW <i class="fas fa-long-arrow-alt-right"></i></button>
                    </p>
                </div>
                <div class="row">
                    <div class="mb-3 mb-md-0 col col-sm-2/5">
                        <div class="porto-ultimate-content-box" style="background: url({{media url="wysiwyg/smartwave/porto/homepage/28/shop28_home_banner2.jpg"}}) center no-repeat;background-size: cover;padding-top: 35px;background-color: #222529;height: 100%;min-height: 315px;box-shadow: rgba(0, 0, 0, 0.06) 0px 0px 20px -1px;color: #fff;">
                            <h5 style="font-size: 12px;color: rgba(255,255,255,0.4);line-height: 1.5;text-align: center;font-weight: 500;margin: 0;letter-spacing: 0.025em;">CHECK NEW ARRIVALS</h5>
                            <h3 style="font-size: 25px;line-height: 1.2;text-align: center;font-weight: 700;margin: 0;">COOL LAMPS</h3>
                        </div>
                    </div>
                    <div class="col col-sm-3/5">
                        <div class="porto-ultimate-content-box" style="background: url({{media url="wysiwyg/smartwave/porto/homepage/28/shop28_home_banner3.jpg"}}) center no-repeat;background-size: cover;background-color: #606da6;height: 100%;min-height: 315px;box-shadow: rgba(0, 0, 0, 0.06) 0px 0px 20px -1px;color: #fff;padding-right: 20px;padding-bottom: 35px;padding-left: 20px;display: flex;flex-direction: column;justify-content: flex-end;">
                            <h6 style="font-size: 13px;color: rgba(255,255,255,0.4);text-align: center;font-weight: 500;margin: 0;">EXCLUSIVE NEW COLLECTION</h6>
                            <h3 style="font-size: 28px;line-height: 1.2;text-align: center;font-weight: 700;margin: 0;">LUXURIOUS JACUZZI</h3>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-lg-7">
                <div class="porto-ultimate-content-box content-align-start" style="background: url({{media url="wysiwyg/smartwave/porto/homepage/28/shop28_home_banner4.jpg"}}) center no-repeat;background-size: cover;background-color: #f4f4f4;height: 100%;padding: 10% 0 10% 9%;display: flex;flex-direction: column;justify-content: center;color: #222529;">
                    <h2 style="font-size: 45px;line-height: 1.2;font-weight: 700;margin: 0;margin-left: -30px;margin-bottom: 32px;text-align: right;">WOODEN<br>Black Chair</h2>
                    <div style="font-size: 24px;line-height: 1;font-weight: 700;margin: 0;margin-bottom: 10px;background-color: #222529;color: #fff;" class="coupon-text">GO COUPON</div>
                    <div style="font-size: 21px;line-height: 1;font-weight: 700;margin: 0;margin-bottom: 40px;" class="coupon-text-sale"><i>UP TO</i><b>$100</b> OFF</div>
                    <h4 style="font-size: 20px;line-height: 1.2;font-weight: 600;margin: 0;margin-bottom: 30px;color: #ed7e63;">STARTING FROM $199</h4>
                    <p style="margin: 0;">
                        <button class="btn btn-default btn-lg btn-icon-right">SHOP NOW <i class="fas fa-long-arrow-alt-right"></i></button>
                    </p>
                </div>
            </div>
        </div>
        <div class="homepage-bar" style="margin-top: 20px;margin-bottom: 40px;">
            <div class="row">
                <div class="col-md-6 col-lg-3" style="margin-bottom: 20px;">
                    <i class="porto-icon-shipping"></i>
                    <div class="text-area"><h3>FREE SHIPPING & RETURN</h3><p>Free shipping on all orders over $99.</p></div>
                </div>
                <div class="col-md-6 col-lg-3" style="margin-bottom: 20px;">
                    <i class="porto-icon-money"></i>
                    <div class="text-area"><h3>MONEY BACK GUARANTEE</h3><p>100% money back guarantee</p></div>
                </div>
                <div class="col-md-6 col-lg-3" style="margin-bottom: 20px;">
                    <i class="porto-icon-support"></i>
                    <div class="text-area"><h3>ONLINE SUPPORT 24/7</h3><p>Lorem ipsum dolor sit amet.</p></div>
                </div>
                <div class="col-md-6 col-lg-3" style="margin-bottom: 20px;">
                    <i class="porto-new-icon-secure-payment"></i>
                    <div class="text-area"><h3>SECURE PAYMENT</h3><p>Lorem ipsum dolor sit amet.</p></div>
                </div>
            </div>
        </div>
        <div style="">
            <h2 class="filterproduct-title" style="margin-bottom: 30px;"><span class="content"><strong>FEATURED PRODUCTS</strong></span></h2>
            <div class="filterproducts-tab">
                <div class="data items" data-mage-init='{"tabs":{"openedState":"active","openOnFocus":false}}'>
                    <div class="data item title" aria-labeledby="tab-label-outdoor-title" data-role="collapsible" id="tab-label-outdoor">
                        <a class="data switch" tabindex="-1" data-toggle="switch" href="#outdoor" id="tab-label-outdoor-title">OUTDOOR</a>
                    </div>
                    <div class="data item content" id="outdoor" data-role="content">
                        <div id="outdoor_product" class="owl-middle-narrow">
                            {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="featured_product" product_count="8" product_type="1" aspect_ratio="1" image_width="250" image_height="250" template="owl_list.phtml"}}
                        </div>
                        <script type="text/javascript">
                            require([
                                'jquery',
                                'owl.carousel/owl.carousel.min'
                            ], function ($) {
                                $("#outdoor_product .owl-carousel").owlCarousel({
                                    autoplay: true,
                                    autoplayTimeout: 5000,
                                    autoplayHoverPause: true,
                                    loop: false,
                                    navRewind: true,
                                    margin: 0,
                                    nav: true,
                                    navText: ["<em class='porto-icon-left-open-big'></em>","<em class='porto-icon-right-open-big'></em>"],
                                    dots: false,
                                    responsive: {
                                        0: {
                                            items:1
                                        },
                                        320: {
                                            items:1
                                        },
                                        480: {
                                            items:2
                                        },
                                        640: {
                                            items:3
                                        },
                                        768: {
                                            items:4
                                        },
                                        992: {
                                            items:4
                                        },
                                        1200: {
                                            items:5
                                        }
                                    }
                                });
                            });
                        </script>
                    </div>
                    <div class="data item title" aria-labeledby="tab-label-office-title" data-role="collapsible" id="tab-label-office">
                        <a class="data switch" tabindex="-1" data-toggle="switch" href="#office" id="tab-label-office-title">OFFICE</a>
                    </div>
                    <div class="data item content" id="office" data-role="content">
                        <div id="office_product" class="owl-middle-narrow">
                            {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="featured_product" product_count="8" product_type="1" aspect_ratio="1" image_width="250" image_height="250" template="owl_list.phtml"}}
                        </div>
                        <script type="text/javascript">
                            require([
                                'jquery',
                                'owl.carousel/owl.carousel.min'
                            ], function ($) {
                                $("#office_product .owl-carousel").owlCarousel({
                                    autoplay: true,
                                    autoplayTimeout: 5000,
                                    autoplayHoverPause: true,
                                    loop: false,
                                    navRewind: true,
                                    margin: 0,
                                    nav: true,
                                    navText: ["<em class='porto-icon-left-open-big'></em>","<em class='porto-icon-right-open-big'></em>"],
                                    dots: false,
                                    responsive: {
                                        0: {
                                            items:1
                                        },
                                        320: {
                                            items:1
                                        },
                                        480: {
                                            items:2
                                        },
                                        640: {
                                            items:3
                                        },
                                        768: {
                                            items:4
                                        },
                                        992: {
                                            items:4
                                        },
                                        1200: {
                                            items:5
                                        }
                                    }
                                });
                            });
                        </script>
                    </div>
                    <div class="data item title" aria-labeledby="tab-label-living-title" data-role="collapsible" id="tab-label-living">
                        <a class="data switch" tabindex="-1" data-toggle="switch" href="#living" id="tab-label-living-title">LIVING</a>
                    </div>
                    <div class="data item content" id="living" data-role="content">
                        <div id="living_product" class="owl-middle-narrow">
                            {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="featured_product" product_count="8" product_type="1" aspect_ratio="1" image_width="250" image_height="250" template="owl_list.phtml"}}
                        </div>
                        <script type="text/javascript">
                            require([
                                'jquery',
                                'owl.carousel/owl.carousel.min'
                            ], function ($) {
                                $("#living_product .owl-carousel").owlCarousel({
                                    autoplay: true,
                                    autoplayTimeout: 5000,
                                    autoplayHoverPause: true,
                                    loop: false,
                                    navRewind: true,
                                    margin: 0,
                                    nav: true,
                                    navText: ["<em class='porto-icon-left-open-big'></em>","<em class='porto-icon-right-open-big'></em>"],
                                    dots: false,
                                    responsive: {
                                        0: {
                                            items:1
                                        },
                                        320: {
                                            items:1
                                        },
                                        480: {
                                            items:2
                                        },
                                        640: {
                                            items:3
                                        },
                                        768: {
                                            items:4
                                        },
                                        992: {
                                            items:4
                                        },
                                        1200: {
                                            items:5
                                        }
                                    }
                                });
                            });
                        </script>
                    </div>
                    <div class="data item title" aria-labeledby="tab-label-bedroom-title" data-role="collapsible" id="tab-label-bedroom">
                        <a class="data switch" tabindex="-1" data-toggle="switch" href="#bedroom" id="tab-label-bedroom-title">BEDROOM</a>
                    </div>
                    <div class="data item content" id="bedroom" data-role="content">
                        <div id="bedroom_product" class="owl-middle-narrow">
                            {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="featured_product" product_count="8" product_type="1" aspect_ratio="1" image_width="250" image_height="250" template="owl_list.phtml"}}
                        </div>
                        <script type="text/javascript">
                            require([
                                'jquery',
                                'owl.carousel/owl.carousel.min'
                            ], function ($) {
                                $("#bedroom_product .owl-carousel").owlCarousel({
                                    autoplay: true,
                                    autoplayTimeout: 5000,
                                    autoplayHoverPause: true,
                                    loop: false,
                                    navRewind: true,
                                    margin: 0,
                                    nav: true,
                                    navText: ["<em class='porto-icon-left-open-big'></em>","<em class='porto-icon-right-open-big'></em>"],
                                    dots: false,
                                    responsive: {
                                        0: {
                                            items:1
                                        },
                                        320: {
                                            items:1
                                        },
                                        480: {
                                            items:2
                                        },
                                        640: {
                                            items:3
                                        },
                                        768: {
                                            items:4
                                        },
                                        992: {
                                            items:4
                                        },
                                        1200: {
                                            items:5
                                        }
                                    }
                                });
                            });
                        </script>
                    </div>
                    <div class="data item title" aria-labeledby="tab-label-dining-title" data-role="collapsible" id="tab-label-dining">
                        <a class="data switch" tabindex="-1" data-toggle="switch" href="#dining" id="tab-label-dining-title">DINING</a>
                    </div>
                    <div class="data item content" id="dining" data-role="content">
                        <div id="dining_product" class="owl-middle-narrow">
                            {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="featured_product" product_count="8" product_type="1" aspect_ratio="1" image_width="250" image_height="250" template="owl_list.phtml"}}
                        </div>
                        <script type="text/javascript">
                            require([
                                'jquery',
                                'owl.carousel/owl.carousel.min'
                            ], function ($) {
                                $("#dining_product .owl-carousel").owlCarousel({
                                    autoplay: true,
                                    autoplayTimeout: 5000,
                                    autoplayHoverPause: true,
                                    loop: false,
                                    navRewind: true,
                                    margin: 0,
                                    nav: true,
                                    navText: ["<em class='porto-icon-left-open-big'></em>","<em class='porto-icon-right-open-big'></em>"],
                                    dots: false,
                                    responsive: {
                                        0: {
                                            items:1
                                        },
                                        320: {
                                            items:1
                                        },
                                        480: {
                                            items:2
                                        },
                                        640: {
                                            items:3
                                        },
                                        768: {
                                            items:4
                                        },
                                        992: {
                                            items:4
                                        },
                                        1200: {
                                            items:5
                                        }
                                    }
                                });
                            });
                        </script>
                    </div>
                    <div class="data item title" aria-labeledby="tab-label-kitchen-title" data-role="collapsible" id="tab-label-kitchen">
                        <a class="data switch" tabindex="-1" data-toggle="switch" href="#kitchen" id="tab-label-kitchen-title">KITCHEN</a>
                    </div>
                    <div class="data item content" id="kitchen" data-role="content">
                        <div id="kitchen_product" class="owl-middle-narrow">
                            {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="featured_product" product_count="8" product_type="1" aspect_ratio="1" image_width="250" image_height="250" template="owl_list.phtml"}}
                        </div>
                        <script type="text/javascript">
                            require([
                                'jquery',
                                'owl.carousel/owl.carousel.min'
                            ], function ($) {
                                $("#kitchen_product .owl-carousel").owlCarousel({
                                    autoplay: true,
                                    autoplayTimeout: 5000,
                                    autoplayHoverPause: true,
                                    loop: false,
                                    navRewind: true,
                                    margin: 0,
                                    nav: true,
                                    navText: ["<em class='porto-icon-left-open-big'></em>","<em class='porto-icon-right-open-big'></em>"],
                                    dots: false,
                                    responsive: {
                                        0: {
                                            items:1
                                        },
                                        320: {
                                            items:1
                                        },
                                        480: {
                                            items:2
                                        },
                                        640: {
                                            items:3
                                        },
                                        768: {
                                            items:4
                                        },
                                        992: {
                                            items:4
                                        },
                                        1200: {
                                            items:5
                                        }
                                    }
                                });
                            });
                        </script>
                    </div>
                    <div class="data item title" aria-labeledby="tab-label-new-title" data-role="collapsible" id="tab-label-new">
                        <a class="data switch" tabindex="-1" data-toggle="switch" href="#new" id="tab-label-new-title">NEW ARRIVALS</a>
                    </div>
                    <div class="data item content" id="new" data-role="content">
                        <div id="new_product" class="owl-middle-narrow">
                            {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="featured_product" product_count="8" product_type="1" aspect_ratio="1" image_width="250" image_height="250" template="owl_list.phtml"}}
                        </div>
                        <script type="text/javascript">
                            require([
                                'jquery',
                                'owl.carousel/owl.carousel.min'
                            ], function ($) {
                                $("#new_product .owl-carousel").owlCarousel({
                                    autoplay: true,
                                    autoplayTimeout: 5000,
                                    autoplayHoverPause: true,
                                    loop: false,
                                    navRewind: true,
                                    margin: 0,
                                    nav: true,
                                    navText: ["<em class='porto-icon-left-open-big'></em>","<em class='porto-icon-right-open-big'></em>"],
                                    dots: false,
                                    responsive: {
                                        0: {
                                            items:1
                                        },
                                        320: {
                                            items:1
                                        },
                                        480: {
                                            items:2
                                        },
                                        640: {
                                            items:3
                                        },
                                        768: {
                                            items:4
                                        },
                                        992: {
                                            items:4
                                        },
                                        1200: {
                                            items:5
                                        }
                                    }
                                });
                            });
                        </script>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="parallax-container parallax-wrapper" style="margin-top: 20px;"> 
    <div class="parallax" data-stellar-background-ratio="0.5" style="background:url({{media url="wysiwyg/smartwave/porto/homepage/28/shop28_home_parallax.jpg"}}) center no-repeat; color: #fff; position: relative;padding-top: 100px;padding-bottom: 100px;">
        <div class="parallax-content">
            <div class="container"> 
                <div class="row align-items-center">
                    <div class="d-flex justify-content-center justify-content-md-start mb-5 mb-md-0 col-md-6">
                        <div class="">
                            <p style="font-size: 16px;color: rgba(255,255,255,0.4);line-height: 1.2;font-weight: 700;margin: 0;letter-spacing: 0.4px;font-family: 'Open Sans';">IT IS TIME FOR A</p>
                            <h2 style="font-size: 50px;line-height: 1;font-weight: 700;margin: 0 0 8px">Modern Bathroom</h2>
                            <p style="margin: 0;text-align: right;">
                                <button class="btn btn-default btn-lg btn-white-color btn-icon-right">SHOP NOW <i class="fas fa-long-arrow-alt-right"></i></button>
                            </p>
                        </div>
                    </div>
                    <div class="d-flex justify-content-center justify-content-md-end col-md-6 col-xl-5">
                        <div class="">
                            <div style="font-size: 30px;line-height: 1.2;font-weight: 700;margin: 0 0 10px;background-color: #fff;color: #222529;" class="coupon-text">Exclusive COUPON</div>
                            <div style="font-size: 26px;line-height: 1;font-weight: 700" class="vc_custom_heading coupon-text-sale"><i>up to</i><b class="theme-bg-color">$200</b> OFF</div>
                        </div>
                    </div>
                </div>
            </div> 
        </div>
    </div>
</div>
<div style="padding-top: 80px;padding-bottom: 60px;">
    <div class="container">
        <div style="padding-bottom: 40px;margin-bottom: 45px;border-bottom: 1px solid #eee;border-bottom-color: rgba(0,0,0,0.06);">
            {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="all_product" product_count="10" column_count="5" product_type="3" aspect_ratio="1" image_width="250" image_height="250" template="grid.phtml"}}
            <p style="margin: 20px 0 0;text-align: center;">
                <button class="btn btn-default btn-lg btn-icon-right" style="color: #222529;">BROWSE ALL <i class="fas fa-long-arrow-alt-right"></i></button>
            </p>
        </div>
        <div class="row">
            <div class="mb-4 mb-lg-0 col-lg-6">
                <h2 style="font-size: 22px;line-height: 1;font-weight: 700;letter-spacing: 0.15em;margin: 0;margin-bottom: 20px;color: #222529;"><span style="display: inline-block;vertical-align: middle;padding-right: 25px;margin-right: 25px;border-right: 1px solid #e7e7e7;">RECENT ARTICLE</span><a href="javascript:void(0)" style="font-size: 14px;text-decoration: none;letter-spacing: 2.1px;">VIEW BLOG <i class="fas fa-long-arrow-alt-right" style="margin-left: 15px;"></i></a></h2>
                <div class="recent-posts">
                    <div class="item">
                        <div class="row align-items-center">
                            <div class="col-md-5">
                                <div class="post-image">
                                    <img src="{{media url="wysiwyg/smartwave/porto/homepage/28/shop28_home_post1.jpg"}}" alt="">
                                    <div class="post-date">
                                        <span class="day">24</span>
                                        <span class="month">JUL-19</span>
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-7">
                                <div class="postCats">
                                    <span>DESIGN TRENDS</span>
                                </div>
                                <div class="postTitle">
                                    <h2><a href="#">Top quality flooring and parquets</a></h2>
                                </div>
                                <div class="postContent"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras non placerat mi. Etiam non tellus sem. Aenean pretium convallis lorem, sit amet dapibus...</p><a class="readmore" href="#">read more &gt;</a></div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-lg-6">
                <h2 style="font-size: 22px;line-height: 1;font-weight: 700;letter-spacing: 0.15em;margin: 0;margin-bottom: 20px;color: #222529;"><span style="display: inline-block;vertical-align: middle;padding-right: 25px;margin-right: 25px;border-right: 1px solid #e7e7e7;">FROM INSTAGRAM</span><a href="javascript:void(0)" style="font-size: 14px;text-decoration: none;letter-spacing: 2.1px;">@PORTODECOR <i class="fas fa-long-arrow-alt-right" style="margin-left: 15px;"></i></a></h2>
                <div class="instagram-photos">
                    <div class="photo-item">
                        <img src="{{media url="wysiwyg/smartwave/porto/homepage/28/instagram_01.jpg"}}" alt="">
                    </div>
                    <div class="photo-item">
                        <img src="{{media url="wysiwyg/smartwave/porto/homepage/28/instagram_02.jpg"}}" alt="">
                    </div>
                    <div class="photo-item">
                        <img src="{{media url="wysiwyg/smartwave/porto/homepage/28/instagram_03.jpg"}}" alt="">
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 29</title>
         <identifier>porto_home_29</identifier>
         <content><![CDATA[<style>
.page-main {
    max-width: 100%;
    padding: 0;
}
.columns .column.main {
    padding: 0;
}
#gift_product .products-grid .product-item .product-item-info.type1 {
    background: none;
}
#gift_product .products-grid .product-item .product-item-inner {
    display: none;
}
#gift_product .product-item:hover .product-item-info.type1 .product-item-photo {
    box-shadow: none;
}
#gift_product .products-grid .product-item .product-item-info.type1 .weltpixel-quickview.weltpixel_quickview_button_v2, #gift_product .products-grid .product-item .product-item-info.type1 .product-reviews-summary {
    display: none;
}
#gift_product .product-item-info.type1 .product-item-photo {
    margin: 0;
}
#gift_product .price-box {
    margin-bottom: 0;
}
#gift_product .products-grid .product-item-info.type1 .product-item-details {
    padding-top: 0;
}
.home-banner .products-grid.columns1 .product-image-photo {
    max-width: 64%;
}
.home-banner .products-grid.columns1 .product-item-info {
    background-color: #f6f7f9;
}
.home-banner .products-grid.columns1 .product-item .product-item-info .weltpixel-quickview.weltpixel_quickview_button_v2, .home-banner .products-grid.columns1 .product-item .product-reviews-summary, .home-banner .products-grid.columns1 .product-item .product-item-inner {
    display: none;
}
.home-banner .products-grid.columns1 .price-box {
    margin-bottom: 0;
}
.home-banner .products-grid.columns1 .product-item:hover .product-item-info.type1 .product-item-photo {
    box-shadow: none;
}
.home-banner .products-grid.columns1 .product-item .product-item-info.type1 .product-item-photo {
    margin: 0;
}
.home-banner .products-grid.columns1 .product-item-info.type1 .product-item-details {
    padding-top: 0;
}
.highlighted-word {
    position: relative;
    display: inline-block;
    background-position: right bottom !important;
    padding-bottom: 8px;
}
.gift-finder-form select {
    height: 46px;
    font-weight: 500;
    font-size: 13px;
    line-height: 1.42857;
    box-shadow: none !important;
    margin-bottom: 8px;
    padding: 8px 12px;
    padding-right: 25px;
    color: #777;
    font-family: inherit;
    border-color: rgba(0,0,0,0.09);
}
.home-banners .porto-ultimate-content-box-container:before {
    content: '';
    position: absolute;
    top: 0;
    right: 188px;
    left: 0;
    height: 100%;
    background: #fff;
    transition: right .25s,background .25s;
    z-index: 1;
}
.home-banners .porto-ultimate-content-box-container:after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    border-right: 215px solid;
    opacity: .7;
    border-top: 180px solid transparent;
    border-bottom: 180px solid transparent;
    z-index: 1;
}
.home-banners .porto-ultimate-content-box:after {
    content: '';
    border-bottom: 180px solid #fff;
    border-right: 188px solid transparent;
    position: absolute;
    bottom: 0;
    right: 0;
    transition: border-right .25s,border-bottom-color .25s;
    display: block;
    z-index: 1;
}
.home-banners .porto-ultimate-content-box:before {
    content: '';
    border-top: 180px solid #fff;
    border-right: 188px solid transparent;
    position: absolute;
    top: 0;
    right: 0;
    transition: border-right .25s,border-top-color .25s;
    display: block;
    z-index: 1;
    left: auto;
    bottom: auto;
    opacity: 1;
    background: none;
}
.home-banners .porto-ultimate-content-box > * {
    z-index: 2;
}
.home-banners .porto-ultimate-content-box-container:hover > div:before, .home-banners .porto-ultimate-content-box-container:hover > div:after {
    border-right-width: 215px;
    border-bottom-color: #fcfcfc;
    border-top-color: #fcfcfc;
}
.home-banners .porto-ultimate-content-box-container:hover:before {
    right: 215px;
    background: #fcfcfc;
}
.homepage-bar {
    background-color: #fff;
    border: 1px solid #e7e7e7;
    padding-top: 18px;
    padding-bottom: 18px;
}
.homepage-bar .col-lg-4 {
    border-left-color: #e7e7e7;
    border-left-width: 1px;
    text-align: center !important;
    padding-top: 0;
    padding-bottom: 0;
}
.homepage-bar [class*=" porto-icon-"], .homepage-bar [class^=porto-icon-], .homepage-bar [class*=" porto-new-icon-"], .homepage-bar [class^=porto-new-icon-] {
    font-size: 32px;
}
.homepage-bar .row {
    margin: 0;
}
.homepage-bar .row > div {
    display: flex;
    align-items: center;
    justify-content: center;
}
.homepage-bar .col-lg-4 > * {
    display: inline-block;
    vertical-align: middle;
}
.homepage-bar h3 {
    line-height: 1;
    margin-bottom: 3px;
    font-family: 'Open Sans';
    font-size: 14px;
    color: #222529;
}
.homepage-bar p {
    font-size: 13px;
    margin: 0;
    line-height: 1;
    font-family: 'Open Sans';
    font-weight: 300;
}
@media (max-width: 991px) {
    .homepage-bar {
        padding: 0;
    }
    .homepage-bar .col-lg-4 {
        border-top: 1px solid #e7e7e7;
        padding-top: 18px;
        padding-bottom: 18px;
    }
    .homepage-bar .col-lg-4:first-child {
        border-top: 0;
    }
}
</style>
<div class="container">
    <div class="home-banner" style="margin-top: 20px;margin-bottom: 20px;">
        <div class="row">
            <div class="mb-3 mb-lg-0 col-lg-6">
                <div class="row" style="margin: 0;background-color: #f6f7f9;height: 100%;">
                    <div class="col-sm-6 pr-sm-2 col-md-6 d-flex align-items-center justify-content-center justify-content-sm-end" style="padding: 0;padding-top: 30px;padding-bottom: 30px;">
                        <div class="text-center text-sm-right">
                            <p style="font-size: 13px;line-height: 1;font-weight: 500;margin: 0;" class="mb-2 text-center text-sm-right align-right">An entire week to enjoy all offers</p>
                            <h3 style="font-size: 42px;line-height: 1.2;font-weight: 700;margin: 0;color: #293871;" class="ls-0 mb-0 text-center text-sm-right align-right text-uppercase">THE WEEK</h3>
                            <h4 style="font-size: 32px;line-height: 1;font-weight: 700;margin: 0;color: #d66a79;" class="mb-4 text-center text-sm-right align-right">Gift Shop</h4>
                            <p style="margin: 0;">
                                <button class="btn btn-default btn-lg">SHOP NOW</button>
                            </p>
                        </div>
                    </div>
                    <div class="col-sm-6" style="padding: 0;overflow: hidden;">
                        <div id="gift_product" class="owl-bottom-narrow" style="margin: 24px 0;">
                            {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="gift_product" product_count="3" product_type="1" aspect_ratio="1" image_width="250" image_height="250" template="owl_list.phtml"}}
                        </div>
                        <script type="text/javascript">
                            require([
                                'jquery',
                                'owl.carousel/owl.carousel.min'
                            ], function ($) {
                                $("#gift_product .owl-carousel").owlCarousel({
                                    autoplay: true,
                                    autoplayTimeout: 5000,
                                    autoplayHoverPause: true,
                                    loop: true,
                                    navRewind: true,
                                    margin: 0,
                                    nav: false,
                                    navText: ["<em class='porto-icon-left-open-big'></em>","<em class='porto-icon-right-open-big'></em>"],
                                    dots: true,
                                    items: 1
                                });
                            });
                        </script>
                    </div>
                </div>
            </div>
            <div class="mb-3 mb-md-0 col-md-6 col-lg-3">
                <div style="background-color: #d66a79;height: 100%;padding: 20px;">
                    <h2 style="font-size: 15px;line-height: 1;text-align: center;font-weight: 700;margin: -20px -20px 20px -20px;background-color: #f86c86;padding: 20px 0;color: #fff;">FLASH SALE RUNNING!</h2>
                    {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="latest_product_1" product_count="1" column_count="1" aspect_ratio="1" image_width="250" product_type="1" lazyload="none" template="grid.phtml"}}
                    <button class="btn btn-secondary btn-md" style="margin-top: 20px;width: 100%;">SHOP SALE NOW</button>
                </div>
            </div>
            <div class="col-md-6 col-lg-3">
                <div style="padding: 42px 20px 12px;height: 100%;background: #000 url({{media url="wysiwyg/smartwave/porto/homepage/29/shop29_home_banner8.jpg"}}) center no-repeat;background-size: cover;text-align: center;">
                    <h2 style="font-size: 26px;line-height: 1;text-align: center;font-weight: 700;margin: 0 0 4px;letter-spacing: 0.3px;color: #fff;">GIFT FINDER</h2>
                    <h4 style="font-size: 15px;color: #999;text-align: center;font-weight: 500;margin: 0 0 16px;letter-spacing: 0.3px;background: url({{media url="wysiwyg/smartwave/porto/homepage/29/shop29_highlighted-word.png"}}) right bottom no-repeat;line-height: 24px;" class="highlighted-word">Find the Perfect Gift</h4>
                    <div class="gift-finder-form" style="margin: 30px 0;">
                        <select class="porto_dropdown_price_range" id="min_price">
                            <option value="">Price Range</option>
                            <option value="0-50">0 - 50</option>
                            <option value="50-100">50 - 100</option>
                            <option value="100-500">100 - 500</option>
                        </select>
                        <select class="porto_dropdown_product_attributes" id="filter_color">
                            <option value="">By color</option>
                            <option value="49">Black</option>
                            <option value="51">Brown</option>
                            <option value="56">Orange</option>
                            <option value="58">Red</option>
                            <option value="60">Yellow</option>
                        </select>
                        <select class="porto_dropdown_product_attributes" id="filter_size">
                            <option value="">By size</option>
                            <option value="91">55 cm</option>
                            <option value="92">65 cm</option>
                            <option value="93">75 cm</option>
                        </select>
                        <button class="btn btn-primary btn-md" style="margin-top: 16px;margin-bottom: 8px;width: 100%;">VIEW SUGGESTIONS</button>
                    </div>
                    <script type="text/javascript">
                        require([
                            'jquery'
                        ], function ($) {
                            $(".gift-finder-form button").off("click").on("click", function(){
                                var shop_url = "{{store url=""}}shop.html?";
                                var price = $("#min_price").val();
                                var color = $("#filter_color").val();
                                var size = $("#filter_size").val();
                                var params = "";
                                if(color)
                                    params += "&color=" + color;
                                if(price)
                                    params += "&price=" + price;
                                if(size)
                                    params += "&size=" + size;
                                if(params)
                                    shop_url += params.substring(1);
                                window.location.href = shop_url;
                            });
                        });
                    </script>
                </div>
            </div>
        </div>
    </div>
    <div style="">
        <div class="row">
            <div class="col-sm-6 col-md-3">
                <div class="porto-ultimate-content-box" style="background: #f6f7f9 url({{media url="wysiwyg/smartwave/porto/homepage/29/shop29_home_banner1.jpg"}}) 95% center no-repeat;">
                    <h2 style="font-size: 24px;line-height: 1;font-weight: 700;margin: 0;margin-bottom: 4px;color: #222529;">GIFTS $10</h2>
                    <p style="font-size: 20px;line-height: 1;font-weight: 400;margin: 0;font-family: 'Open Sans';" class="mb-5 pb-xl-2">&amp; under</p>
                    <p style="margin: 0;font-size: 12px;line-height: 1;font-weight: 700;text-decoration: none;"><a href="#">SHOP NOW</a></p>
                </div>
            </div>
            <div class="col-sm-6 col-md-3">
                <div class="porto-ultimate-content-box" style="background: #f6f7f9 url({{media url="wysiwyg/smartwave/porto/homepage/29/shop29_home_banner2.jpg"}}) 95% center no-repeat;">
                    <h2 style="font-size: 24px;line-height: 1;font-weight: 700;margin: 0;margin-bottom: 4px;color: #222529;">GIFTS $20</h2>
                    <p style="font-size: 20px;line-height: 1;font-weight: 400;margin: 0;font-family: 'Open Sans';" class="mb-5 pb-xl-2">&amp; under</p>
                    <p style="margin: 0;font-size: 12px;line-height: 1;font-weight: 700;text-decoration: none;"><a href="#">SHOP NOW</a></p>
                </div>
            </div>
            <div class="col-sm-6 col-md-3">
                <div class="porto-ultimate-content-box" style="background: #f6f7f9 url({{media url="wysiwyg/smartwave/porto/homepage/29/shop29_home_banner3.jpg"}}) 95% center no-repeat;">
                    <h2 style="font-size: 24px;line-height: 1;font-weight: 700;margin: 0;margin-bottom: 4px;color: #222529;">GIFTS $30</h2>
                    <p style="font-size: 20px;line-height: 1;font-weight: 400;margin: 0;font-family: 'Open Sans';" class="mb-5 pb-xl-2">&amp; under</p>
                    <p style="margin: 0;font-size: 12px;line-height: 1;font-weight: 700;text-decoration: none;"><a href="#">SHOP NOW</a></p>
                </div>
            </div>
            <div class="col-sm-6 col-md-3">
                <div class="porto-ultimate-content-box" style="background: #f6f7f9 url({{media url="wysiwyg/smartwave/porto/homepage/29/shop29_home_banner4.jpg"}}) 95% center no-repeat;">
                    <h2 style="font-size: 24px;line-height: 1;font-weight: 700;margin: 0;margin-bottom: 4px;color: #222529;">GIFTS $40</h2>
                    <p style="font-size: 20px;line-height: 1;font-weight: 400;margin: 0;font-family: 'Open Sans';" class="mb-5 pb-xl-2">&amp; under</p>
                    <p style="margin: 0;font-size: 12px;line-height: 1;font-weight: 700;text-decoration: none;"><a href="#">SHOP NOW</a></p>
                </div>
            </div>
        </div>
    </div>
    <div style="margin-top: 20px;margin-bottom: 20px;">
        <h2 class="filterproduct-title"><span class="content"><strong>Best Selling Gifts</strong></span></h2>
        <div id="bestsellers" class="owl-top-narrow" style="margin: 0 -10px;">
            {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="featured_product" product_count="8" product_type="3" aspect_ratio="1" image_width="250" image_height="250" template="owl_list.phtml"}}
        </div>
        <script type="text/javascript">
            require([
                'jquery',
                'owl.carousel/owl.carousel.min'
            ], function ($) {
                $("#bestsellers .owl-carousel").owlCarousel({
                    autoplay: true,
                    autoplayTimeout: 5000,
                    autoplayHoverPause: true,
                    loop: false,
                    navRewind: true,
                    margin: 0,
                    nav: false,
                    navText: ["<em class='porto-icon-left-open-big'></em>","<em class='porto-icon-right-open-big'></em>"],
                    dots: true,
                    responsive: {
                        0: {
                            items:1
                        },
                        320: {
                            items:1
                        },
                        480: {
                            items:2
                        },
                        640: {
                            items:3
                        },
                        768: {
                            items:3
                        },
                        992: {
                            items:4
                        },
                        1200: {
                            items:4
                        }
                    }
                });
            });
        </script>
    </div>
</div>
<div class="home-banners" style="padding: 40px 0;background-color: #f6f7f9;">
    <div class="container">
        <div class="row">
            <div class="mb-3 mb-md-0 col-md-4">
                <div class="porto-ultimate-content-box-container" style="color: #d66a79;">
                    <div class="porto-ultimate-content-box" style="background: #fff url({{media url="wysiwyg/smartwave/porto/homepage/29/shop29_home_banner5.jpg"}}) right center no-repeat;height: 100%;padding: 30px 0 30px 30px;min-height: 360px;box-shadow: none;background-size: contain;margin: 0;">
                        <p style="font-size: 20px;color: #777777;line-height: 1;font-family: 'Open Sans';font-weight: 400;margin-bottom: 8px;">Shop Gifts</p>
                        <h2 style="font-size: 34px;line-height: 1;font-weight: 700;margin: 0;margin-bottom: 32px;color: #222529;letter-spacing: 0.3px;">FOR HER</h2>
                        <p style="position: absolute;bottom: 0;margin-bottom: 30px;"><button class="btn btn-default btn-lg">SHOP NOW</button></p>
                    </div>
                </div>
            </div>
            <div class="mb-3 mb-md-0 col-md-4">
                <div class="porto-ultimate-content-box-container" style="color: #293871;">
                    <div class="porto-ultimate-content-box" style="background: #fff url({{media url="wysiwyg/smartwave/porto/homepage/29/shop29_home_banner6.jpg"}}) right center no-repeat;height: 100%;padding: 30px 0 30px 30px;min-height: 360px;box-shadow: none;background-size: contain;margin: 0;">
                        <p style="font-size: 20px;color: #777777;line-height: 1;font-family: 'Open Sans';font-weight: 400;margin-bottom: 8px;">Shop Gifts</p>
                        <h2 style="font-size: 34px;line-height: 1;font-weight: 700;margin: 0;margin-bottom: 32px;color: #222529;letter-spacing: 0.3px;">FOR HIM</h2>
                        <p style="position: absolute;bottom: 0;margin-bottom: 30px;"><button class="btn btn-default btn-lg">SHOP NOW</button></p>
                    </div>
                </div>
            </div>
            <div class="mb-3 mb-md-0 col-md-4">
                <div class="porto-ultimate-content-box-container" style="color: #c6a99b;">
                    <div class="porto-ultimate-content-box" style="background: #fff url({{media url="wysiwyg/smartwave/porto/homepage/29/shop29_home_banner7.jpg"}}) right center no-repeat;height: 100%;padding: 30px 0 30px 30px;min-height: 360px;box-shadow: none;background-size: contain;margin: 0;">
                        <p style="font-size: 20px;color: #777777;line-height: 1;font-family: 'Open Sans';font-weight: 400;margin-bottom: 8px;">Shop Gifts</p>
                        <h2 style="font-size: 34px;line-height: 1;font-weight: 700;margin: 0;margin-bottom: 32px;color: #222529;letter-spacing: 0.3px;">FOR KIDS</h2>
                        <p style="position: absolute;bottom: 0;margin-bottom: 30px;"><button class="btn btn-default btn-lg">SHOP NOW</button></p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div style="padding: 30px 0;">
    <div class="container">
        <div class="homepage-bar" style="margin-bottom: 40px;">
            <div class="row">
                <div class="col-lg-4">
                    <i class="porto-icon-shipping" style="color: #d66a79;"></i>
                    <div class="text-area"><h3>FREE SHIPPING & RETURN</h3><p>Free shipping on all orders over $99.</p></div>
                </div>
                <div class="col-lg-4">
                    <i class="porto-icon-money" style="color: #d66a79;"></i>
                    <div class="text-area"><h3>MONEY BACK GUARRANTEE</h3><p>100% money back guarantee.</p></div>
                </div>
                <div class="col-lg-4">
                    <i class="porto-icon-support" style="color: #d66a79;"></i>
                    <div class="text-area"><h3>ONLINE SUPPORT 24/7</h3><p>Lorem ipsum dolor sit amet.</p></div>
                </div>
            </div>
        </div>
        <h2 class="filterproduct-title"><span class="content"><strong>Our Recommedations</strong></span></h2>
        <div id="recommend" class="owl-top-narrow" style="margin: 0 -10px;">
            {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="featured_product" product_count="8" product_type="3" aspect_ratio="1" image_width="250" image_height="250" template="owl_list.phtml"}}
        </div>
        <script type="text/javascript">
            require([
                'jquery',
                'owl.carousel/owl.carousel.min'
            ], function ($) {
                $("#recommend .owl-carousel").owlCarousel({
                    autoplay: true,
                    autoplayTimeout: 5000,
                    autoplayHoverPause: true,
                    loop: false,
                    navRewind: true,
                    margin: 0,
                    nav: false,
                    navText: ["<em class='porto-icon-left-open-big'></em>","<em class='porto-icon-right-open-big'></em>"],
                    dots: true,
                    responsive: {
                        0: {
                            items:1
                        },
                        320: {
                            items:1
                        },
                        480: {
                            items:2
                        },
                        640: {
                            items:3
                        },
                        768: {
                            items:3
                        },
                        992: {
                            items:4
                        },
                        1200: {
                            items:4
                        }
                    }
                });
            });
        </script>
    </div>
</div>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - Homepage 30</title>
         <identifier>porto_home_30</identifier>
         <content><![CDATA[<style>
.page-main {
    max-width: 100%;
    padding: 0;
}
.columns .column.main {
    padding: 0;
}
.homepage-bar {
    background-color: transparent;
    border: 0;
}
.homepage-bar .col-lg-4 {
    text-align: center;
    border-color: #2c2f33;
    padding-top: 10px;
    padding-bottom: 10px;
}
.homepage-bar h3 {
    color: #fff;
    font-size: 15px;
}
.homepage-bar p {
    font-size: 13px;
    line-height: 20px;
    font-weight: 300;
    color: #839199;
}
#recent_one_product .products-grid .owl-carousel .product-item, #popular_one_product .products-grid .owl-carousel .product-item {
    padding: 20px;
}
#recent_one_product .products-grid, #popular_one_product .products-grid {
    margin: 0;
}
#recent_product .products-grid, #popular_product .products-grid {
    margin-top: -10px;
}
#recent_one_product.owl-bottom-narrow .owl-controls .owl-dots, #popular_one_product.owl-bottom-narrow .owl-controls .owl-dots {
    margin: 0 0 50px;
}
#recent_one_product.owl-bottom-narrow .owl-controls, #popular_one_product.owl-bottom-narrow .owl-controls {
    position: relative;
    bottom: 0;
    margin: 0;
}
#recent_one_product .products-grid .product-item .product-item-inner, #popular_one_product .products-grid .product-item .product-item-inner {
    display: none;
}
#recent_one_product .product-item-info .product.name a, #popular_one_product .product-item-info .product.name a {
    font-size: 22px;
}
</style>
<div style="margin-top: 20px;">
    <div class="container">
        <div class="row">
            <div class="col-md-8" style="margin-bottom: 20px;">
                <div class="porto-ultimate-content-box has-content-pos justify-content-center" style="background-size: cover;background-repeat: no-repeat;background-position: center center;background-color: rgba(0, 0, 0, 0);box-shadow: none;min-height: 440px;background-image: url({{media url="wysiwyg/smartwave/porto/homepage/30/shop30_home_banner1.jpg"}});padding-right: 40px;color: #fff;">
                    <h3 style="font-size: 18px;line-height: 1;font-weight: 700;margin: 0 0 20px;padding: 10px 12px;text-align: right;font-family: 'Open Sans';" class="align-self-end theme-bg-color">50% OFF</h3>
                    <h2 style="font-size: 40px;line-height: 1;font-weight: 700;margin: 0 0 8px;text-align: right;font-family: 'Open Sans';">PORTOGEAR 2</h2>
                    <h3 style="font-size: 28px;line-height: 1.2;font-weight: 600;margin: 0;text-align: right;font-family: 'Open Sans';"><del style="font-size: 65%;color: #a7a7a7;display: inline-block;margin-right: .2143em;vertical-align: baseline;">$59</del> $29</h3>
                    <p style="margin: 0;position: absolute;right: 0;bottom: 0;margin-right: 20px;margin-bottom: 20px;">
                        <button class="btn btn-default btn-lg">Shop Now</button>
                    </p>
                </div>
            </div>
            <div class="col-md-4">
                <div class="porto-ultimate-content-box has-content-pos justify-content-end" style="background-size: contain;background-repeat: no-repeat;background-position: left center;background-color: #181a1c;box-shadow: none;min-height: 210px;background-image: url({{media url="wysiwyg/smartwave/porto/homepage/30/shop30_home_banner2.png"}});padding-right: 20px;padding-bottom: 20px;margin-bottom: 20px;color: #fff;">
                    <h3 style="font-size: 13px;color: rgba(255,255,255,0.4);line-height: 1;font-weight: 700;margin: 0 0 8px;text-align: right;font-family: 'Open Sans';letter-spacing: 0.025em;">FLASH SALES ON</h3>
                    <h2 style="font-size: 28px;line-height: 0.9;font-weight: 700;margin: 0 0 48px;text-align: right;font-family: 'Open Sans';letter-spacing: 0.01em;">CONSOLES</h2>
                    <p style="margin: 0;text-align: right;">
                        <button class="btn btn-default btn-sm">Shop Now</button>
                    </p>
                </div>
                <div class="porto-ultimate-content-box has-content-pos" style="background-size: cover;background-repeat: no-repeat;background-position: center center;box-shadow: none;min-height: 210px;background-image: url({{media url="wysiwyg/smartwave/porto/homepage/30/shop30_home_banner3.jpg"}});padding-left: 20px;padding-top: 20px;margin-bottom: 20px;color: #fff;">
                    <h3 style="font-size: 13px;color: rgba(255,255,255,0.4);line-height: 1;font-weight: 700;margin: 0 0 4px;text-align: left;font-family: 'Open Sans';letter-spacing: 0.025em;">CHECK NEW WIRELESS</h3>
                    <h2 style="font-size: 23px;line-height: 1;font-weight: 700;margin: 0 0 16px;text-align: left;font-family: 'Open Sans';letter-spacing: 0.01em;">CONTROLLERS</h2>
                    <h3 style="font-size: 16px;line-height: 1;font-weight: 700;margin: 0;text-align: left;font-family: 'Open Sans';text-transform: uppercase;margin-left: 8px;" class="coupon-text-sale"><i>Up To</i><b style="background: #ee8379;">50%</b> OFF</h3>
                    <p style="margin: 0;position: absolute;right: 0;bottom: 0;margin-right: 20px;margin-bottom: 20px;">
                        <button class="btn btn-default btn-sm">Shop Now</button>
                    </p>
                </div>
            </div>
        </div>
        <div class="homepage-bar" style="margin-top: 10px;margin-bottom: 30px;">
            <div class="row">
                <div class="col-lg-4">
                    <i class="porto-icon-shipping" style="color: #0078f2;"></i>
                    <div class="text-area"><h3>FREE SHIPPING &amp; RETURN</h3><p>Free shipping on all orders over $99</p></div>
                </div>
                <div class="col-lg-4">
                    <i class="porto-icon-money" style="color: #0078f2;"></i>
                    <div class="text-area"><h3>MONEY BACK GUARRANTEE</h3><p>100% money back guarantee</p></div>
                </div>
                <div class="col-lg-4">
                    <i class="porto-icon-support" style="color: #0078f2;"></i>
                    <div class="text-area"><h3>ONLINE SUPPORT 24/7</h3><p>Lorem ipsum dolor sit amet</p></div>
                </div>
            </div>
        </div>
    </div>
</div>
<div style="padding: 65px 0 40px;background-color: #1c1e21;">
    <div class="container" style="position: relative;">
        <h2 class="filterproduct-title"><span class="content"><strong>Featured Product and Offers</strong></span><a href="#"><span>VIEW ALL PRODUCTS</span><i class="fas fa-long-arrow-alt-right"></i></a></h2>
        {{block class="Smartwave\Filterproducts\Block\Home\FeaturedList" name="featured_product" product_count="4" column_count="4" aspect_ratio="1" image_width="250" product_type="3" template="grid.phtml"}}
        <div class="float-elements">
            <p style="position: absolute; top: 0px; left: -22%; animation-delay: 1400ms;" data-appear-animation="zoomIn" data-appear-animation-delay="1400" class="appear-animation zoomIn appear-animation-visible"><img src="{{media url="wysiwyg/smartwave/porto/homepage/30/shop30_home_floating5.png"}}" alt="" width="82" height="92" data-plugin-float-element="" data-plugin-options="{'startPos': 'none', 'speed': 3, 'transition': true}"></p>
            <p style="position: absolute; top: 39%; left: -26%; animation-delay: 2000ms;" data-appear-animation="zoomIn" data-appear-animation-delay="2000" class="appear-animation zoomIn appear-animation-visible"><img src="{{media url="wysiwyg/smartwave/porto/homepage/30/shop30_home_floating6.png"}}" alt="" width="102" height="102" data-plugin-float-element="" data-plugin-options="{'startPos': 'none', 'speed': 3.5, 'transition': true, 'horizontal': true}"></p>
            <p style="position: absolute; top: 62%; left: -14%; animation-delay: 800ms;" data-appear-animation="zoomIn" data-appear-animation-delay="800" class="appear-animation zoomIn appear-animation-visible"><img src="{{media url="wysiwyg/smartwave/porto/homepage/30/shop30_home_floating7.png"}}" alt="" width="85" height="85" data-plugin-float-element="" data-plugin-options="{'startPos': 'none', 'speed': 2.5, 'transition': true}"></p>
            <p style="position: absolute; top: 22%; left: -12%; animation-delay: 1100ms;" data-appear-animation="zoomIn" data-appear-animation-delay="1100" class="appear-animation zoomIn appear-animation-visible"><img src="{{media url="wysiwyg/smartwave/porto/homepage/30/shop30_home_floating8.png"}}" alt="" width="82" height="82" data-plugin-float-element="" data-plugin-options="{'startPos': 'none', 'speed': 2, 'transition': true, 'horizontal': true}"></p>
            <p style="position: absolute; top: 58%; right: -26%; animation-delay: 1400ms;" data-appear-animation="zoomIn" data-appear-animation-delay="1400" class="appear-animation zoomIn appear-animation-visible"><img src="{{media url="wysiwyg/smartwave/porto/homepage/30/shop30_home_floating1.png"}}" alt="" width="107" height="122" data-plugin-float-element="" data-plugin-options="{'startPos': 'none', 'speed': 3, 'transition': true}"></p>
            <p style="position: absolute; top: 25%; right: -26%; animation-delay: 2000ms;" data-appear-animation="zoomIn" data-appear-animation-delay="2000" class="appear-animation zoomIn appear-animation-visible"><img src="{{media url="wysiwyg/smartwave/porto/homepage/30/shop30_home_floating2.png"}}" alt="" width="81" height="80" data-plugin-float-element="" data-plugin-options="{'startPos': 'none', 'speed': 3.5, 'transition': true, 'horizontal': true}"></p>
            <p style="position: absolute; top: 0px; right: -16%; animation-delay: 800ms;" data-appear-animation="zoomIn" data-appear-animation-delay="800" class="appear-animation zoomIn appear-animation-visible"><img src="{{media url="wysiwyg/smartwave/porto/homepage/30/shop30_home_floating3.png"}}" alt="" width="98" height="97" data-plugin-float-element="" data-plugin-options="{'startPos': 'none', 'speed': 2.5, 'transition': true}"></p>
            <p style="position: absolute; top: 38%; right: -11%; animation-delay: 1100ms;" data-appear-animation="zoomIn" data-appear-animation-delay="1100" class="appear-animation zoomIn appear-animation-visible"><img src="{{media url="wysiwyg/smartwave/porto/homepage/30/shop30_home_floating4.png"}}" alt="" width="86" height="87" data-plugin-float-element="" data-plugin-options="{'startPos': 'none', 'speed': 2, 'transition': true, 'horizontal': true}"></p>
        </div>
        <script type="text/javascript">
            require([
                'jquery',
                'floatelement'
            ], function ($) {
                $("[data-plugin-float-element]:not(.manual)").each(function() {
                    var options = $(this).data("plugin-options");
                    if (options && "string" == typeof options)
                        try {
                            options = JSON.parse(options.replace(/'/g, '"').replace(";", ""))
                        } catch (options) {}
                    $(this).themePluginFloatElement(options)
                })
            });
        </script>
    </div>
</div>
<div style="padding: 40px 0;">
    <div class="container">
        <div class="row" style="margin: 0;background-color: #f4f4f4;margin-bottom: 32px;">
            <div class="col-md-4" style="padding: 70px 0;background: url({{media url="wysiwyg/smartwave/porto/homepage/30/shop30_shop_banner.jpg"}}) center no-repeat;background-size: cover;">
            </div>
            <div class="col-md-5" style="padding-top: 24px;padding-bottom: 24px;display: flex;flex-direction: column;justify-content: center;">
                <h2 style="font-size: 38px;color: #181a1c;line-height: 1;font-weight: 800;font-family: 'Open Sans';letter-spacing: 0.01em;margin: 0 0 4px;">PORTO SWITCH LITE</h2>
                <h3 style="font-size: 18px;color: #777;line-height: 1;font-weight: 700;font-family: 'Open Sans';letter-spacing: 0.025em;margin: 0;">NOW AVAILABLE FOR PRE-ORDER</h3>
            </div>
            <div class="col-md-3" style="display: flex;flex-direction: column;justify-content: center;">
                <p class="mb-3 mb-md-0">
                    <button class="btn btn-default btn-lg" style="font-size: 13px;line-height: 1.4857;width: 180px;padding-left: 0;padding-right: 0;max-width: 100%;">PRE-ORDER NOW</button>
                </p>
            </div>
        </div>
        <h2 class="filterproduct-title"><span class="content"><strong>Recently Released</strong></span><a href="#"><span>VIEW ALL PRODUCTS</span><i class="fas fa-long-arrow-alt-right"></i></a></h2>
        <div class="row">
            <div class="col-md-4" style="margin-bottom: 20px;">
                <div style="background-color: #1c1e21;">
                    <div id="recent_one_product" class="owl-bottom-narrow" style="margin: 0;">
                        {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="gift_product" product_count="3" product_type="1" aspect_ratio="1" image_width="320" image_height="320" template="owl_list.phtml"}}
                    </div>
                    <script type="text/javascript">
                        require([
                            'jquery',
                            'owl.carousel/owl.carousel.min'
                        ], function ($) {
                            $("#recent_one_product .owl-carousel").owlCarousel({
                                autoplay: true,
                                autoplayTimeout: 5000,
                                autoplayHoverPause: true,
                                loop: true,
                                navRewind: true,
                                margin: 0,
                                nav: false,
                                navText: ["<em class='porto-icon-left-open-big'></em>","<em class='porto-icon-right-open-big'></em>"],
                                dots: true,
                                items: 1
                            });
                        });
                    </script>
                </div>
            </div>
            <div class="col-md-8" style="margin-bottom: 20px;">
                <div id="recent_product">
                    {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="featured_product" product_count="8" column_count="4" aspect_ratio="1" image_width="250" product_type="3" template="grid.phtml"}}
                </div>
            </div>
        </div>
        <hr style="border-color: rgba(255,255,255,.06);margin: 0 0 40px;height: 1px;width: 100%;"/>
        <h2 class="filterproduct-title"><span class="content"><strong>Most Popular</strong></span><a href="#"><span>VIEW ALL PRODUCTS</span><i class="fas fa-long-arrow-alt-right"></i></a></h2>
        <div class="row">
            <div class="col-md-8" style="margin-bottom: 20px;">
                <div id="popular_product">
                    {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="featured_product" product_count="8" column_count="4" aspect_ratio="1" image_width="250" product_type="3" template="grid.phtml"}}
                </div>
            </div>
            <div class="col-md-4" style="margin-bottom: 20px;">
                <div style="background-color: #1c1e21;">
                    <div id="popular_one_product" class="owl-bottom-narrow" style="margin: 0;">
                        {{block class="Smartwave\Filterproducts\Block\Home\LatestList" name="gift_product" product_count="3" product_type="1" aspect_ratio="1" image_width="320" image_height="320" template="owl_list.phtml"}}
                    </div>
                    <script type="text/javascript">
                        require([
                            'jquery',
                            'owl.carousel/owl.carousel.min'
                        ], function ($) {
                            $("#popular_one_product .owl-carousel").owlCarousel({
                                autoplay: true,
                                autoplayTimeout: 5000,
                                autoplayHoverPause: true,
                                loop: true,
                                navRewind: true,
                                margin: 0,
                                nav: false,
                                navText: ["<em class='porto-icon-left-open-big'></em>","<em class='porto-icon-right-open-big'></em>"],
                                dots: true,
                                items: 1
                            });
                        });
                    </script>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-md-6">
                <div class="porto-ultimate-content-box has-content-pos justify-content-center" style="background-size: cover; min-height: 400px; background: url({{media url="wysiwyg/smartwave/porto/homepage/30/shop30_home_banner4.jpg"}}) center no-repeat;padding-right: 20px;margin-bottom: 20px;">
                    <p style="font-size: 13px;line-height: 1;font-weight: 700;font-family: 'Open Sans';margin: 0 0 4px;letter-spacing: 0.07px;text-align: right;color: #777;">FEEL LIKE A PLAYER</p>
                    <h2 style="font-size: 36px;line-height: 1;font-weight: 800;font-family: 'Open Sans';margin: 0 0 4px;letter-spacing: -0.025em;text-align: right;color: #000;"><i>PROBALL 2019</i></h2>
                    <h3 style="font-size: 28px;line-height: 1;font-weight: 600;font-family: 'Open Sans';margin: 0;text-align: right;color: #000;" class="vc_custom_heading mb-0 align-right heading-quaternary">$29</h3>
                    <p style="margin: 0;position: absolute;right: 0;bottom: 0;margin-right: 20px;margin-bottom: 20px;">
                        <button class="btn btn-default btn-sm">Shop Now</button>
                    </p>
                </div>
            </div>
            <div class="col-md-6">
                <div class="porto-ultimate-content-box has-content-pos justify-content-center" style="background-size: cover; min-height: 400px; background: url({{media url="wysiwyg/smartwave/porto/homepage/30/shop30_home_banner5.jpg"}}) center no-repeat;padding-left: 20px;margin-bottom: 20px;">
                    <p style="font-size: 13px;line-height: 1;font-weight: 700;font-family: 'Open Sans';margin: 0 0 4px;letter-spacing: 0.07px;text-align: left;color: #777;">BE A KENDO WARRIOR</p>
                    <h2 style="font-size: 36px;line-height: 1;font-weight: 800;font-family: 'Open Sans';margin: 0 0 4px;letter-spacing: -0.025em;text-align: left;color: #fff;"><i>PROWARRIOR</i></h2>
                    <h3 style="font-size: 28px;line-height: 1;font-weight: 600;font-family: 'Open Sans';margin: 0;text-align: left;color: #fff;" class="vc_custom_heading mb-0 align-right heading-quaternary"><del style="font-size: 65%;color: #a7a7a7;display: inline-block;margin-right: .2143em;vertical-align: baseline;">$59</del> $29</h3>
                    <p style="margin: 0;position: absolute;left: 0;bottom: 0;margin-left: 20px;margin-bottom: 20px;">
                        <button class="btn btn-default btn-sm" style="background-color: #fff;color: #222529;">Shop Now</button>
                    </p>
                </div>
            </div>
        </div>
    </div>
</div>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - About Us</title>
         <identifier>about-porto</identifier>
         <content><![CDATA[<br/>
<div class="entry-content">
    <div class="row">
        <div class="row-wrapper container">
            <div class="row">
                <div class="col-lg-12">
                    <h2 class="word-rotator-title">The New Way to <strong><span class="word-rotate"><span class="word-rotate-items" style="top: 0px;"><span>success.</span><span>advance.</span><span>progress.</span></span></span></strong></h2>
                </div>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="row-wrapper container">
            <div class="row">
                <div class="col-lg-10">
                    <p class="lead">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque rutrum pellentesque imperdiet. Nulla lacinia iaculis nulla non <span class="alternative-font">metus.</span> pulvinar. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Ut eu risus enim, ut pulvinar lectus. Sed hendrerit nibh.</p> 
                </div>
                <div class="col-lg-2">
                    <a class="btn btn-primary push-top" title="Join Our Team!" href="#">Join Our Team!</a>
                </div> 
            </div>
        </div>
    </div>
    <div class="row">
        <div class="row-wrapper container">
            <div class="row">
                <div class="col-lg-12">
                    <hr class="tall"/>
                </div>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="row-wrapper container">
            <div class="row">
                <div class="col-lg-12">
                    <h3 class=""><strong>Who</strong> We Are</h3>
                    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur pellentesque neque eget diam posuere porta. Quisque ut nulla at nunc <a href="#">vehicula</a> lacinia. Proin adipiscing porta tellus, ut feugiat nibh adipiscing sit amet. In eu justo a felis faucibus ornare vel id metus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; In eu libero ligula. Fusce eget metus lorem, ac viverra leo. Nullam convallis, arcu vel pellentesque sodales, nisi est varius diam, ac ultrices sem ante quis sem. Proin ultricies volutpat sapien, nec scelerisque ligula mollis lobortis. Curabitur pellentesque neque eget diam posuere porta. Quisque ut nulla at nunc vehicula lacinia. Proin adipiscing porta tellus, ut feugiat nibh adipiscing <span class="alternative-font">metus</span> sit amet. In eu justo a felis faucibus ornare vel id metus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; In eu libero ligula. Fusce eget metus lorem, ac viverra leo. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; In eu libero ligula. Fusce eget metus lorem, ac viverra leo. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; In eu libero ligula.</p>
                </div>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="row-wrapper container">
            <div class="row">
                <div class="col-lg-12">
                    <hr class="tall"/>
                </div>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="row-wrapper container">
            <div class="row">
                <div class="col-lg-12">
                    <h3 class="push-top">Our <strong>History</strong></h3>
                </div>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="row-wrapper container" style="margin-bottom: 25px;">
            <div class="row">
                <div class="col-lg-12">
                    <div class="history">
                        <div class="thumb">
                            <img width="150" height="150" src="{{media url="wysiwyg/smartwave/porto/aboutus/office-1-150x150.jpg"}}" class="attachment-thumbnail" alt="office-1"/>
                        </div>
                        <div class="featured-box" style="height: auto;">
                            <div class="box-content">
                                <h4><strong>2012</strong></h4>
                                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur pellentesque neque eget diam posuere porta. Quisque ut nulla at nunc vehicula lacinia. Proin adipiscing porta tellus, Curabitur pellentesque neque eget diam posuere porta. Quisque ut nulla at nunc vehicula lacinia. Proin adipiscing porta tellus,</p>
                            </div>
                        </div><!--.feature-box-->
                    </div><!--.history-->
                    <div class="history">
                        <div class="thumb">
                            <img width="150" height="150" src="{{media url="wysiwyg/smartwave/porto/aboutus/office-2-150x150.jpg"}}" class="attachment-thumbnail" alt="office-2"/>
                        </div>
                        <div class="featured-box" style="height: auto;">
                            <div class="box-content">
                                <h4><strong>2010</strong></h4>
                                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur pellentesque neque eget diam posuere porta. Quisque ut nulla at nunc vehicula lacinia. Proin adipiscing porta tellus, Curabitur pellentesque neque eget diam posuere porta. Quisque ut nulla at nunc vehicula lacinia.</p>
                            </div>
                        </div><!--.feature-box-->
                    </div><!--.history-->
                    <div class="history">
                        <div class="thumb">
                            <img width="150" height="150" src="{{media url="wysiwyg/smartwave/porto/aboutus/office-3-150x150.jpg"}}" class="attachment-thumbnail" alt="office-3"/>
                        </div>
                        <div class="featured-box" style="height: auto;">
                            <div class="box-content">
                                <h4><strong>2005</strong></h4>
                                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur pellentesque neque eget diam posuere porta. Quisque ut nulla at nunc vehicula lacinia. Proin adipiscing porta tellus, Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur pellentesque neque eget diam posuere porta. Quisque ut nulla at nunc vehicula lacinia. Proin adipiscing porta tellus, Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur pellentesque neque eget diam posuere porta. Quisque ut nulla at nunc vehicula lacinia. Proin adipiscing porta tellus,</p>
                            </div>
                        </div><!--.feature-box-->
                    </div><!--.history-->
                    <div class="history">
                        <div class="thumb">
                            <img width="150" height="150" src="{{media url="wysiwyg/smartwave/porto/aboutus/office-4-150x150.jpg"}}" class="attachment-thumbnail" alt="office-4"/>
                        </div>
                        <div class="featured-box" style="height: auto;">
                            <div class="box-content">
                                <h4><strong>2000</strong></h4>
                                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur pellentesque neque eget diam posuere porta. Quisque ut nulla at nunc vehicula lacinia. Proin adipiscing porta tellus, Curabitur pellentesque neque eget diam posuere porta. Quisque ut nulla at nunc vehicula lacinia. Proin adipiscing porta tellus, Curabitur pellentesque neque eget diam posuere porta. Quisque ut nulla at nunc vehicula lacinia. Proin adipiscing porta tellus,</p>
                            </div>
                        </div><!--.feature-box-->
                    </div><!--.history-->
                </div>
            </div>
        </div>
    </div>
</div>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - About Us 1</title>
         <identifier>about-porto-1</identifier>
         <content><![CDATA[<div class="content-row" style="border: 0;">
    <h2>THE NEW WAY TO SUCCESS</h2>
    <h4>Who we are</h4>
    <div class="row">
        <div class="col-lg-6">
            <p>Aliquam consectetur et lorem semper scelerisque. Proin est nibh, vestibulum vitae congue nec, tristique eu justo. Maecenas eu nunc lacinia, porta lorem vitae, viverra velit. Nulla dolor libero, rhoncus quis luctus eu, fermentum sed leo. Morbi ut risus porttitor odio sodales pulvinar. Sed gravida nulla sed sapien vulputate, eget malesuada justo egestas. Pellentesque sem mi, vulputate ac iaculis sit amet, sagittis feugiat dui. Proin non pellentesque leo. Vestibulum varius laoreet posuere. Etiam fringilla diam odio.</p>
            <p>Nulla felis nibh, bibendum a leo ut, egestas ornare felis. Nam pretium mauris justo, eget commodo est fringilla vel. Proin condimentum, lacus sit amet finibus gravida, sapien ligula mattis leo, sit amet mattis leo lacus sit amet lectus. Nulla facilisi. Etiam porta iaculis velit id pulvinar. Sed dolor odio, eleifend eget aliquam vitae, efficitur vitae dolor. Integer ornare neque ac leo sollicitudin, at vestibulum ante scelerisque. Nullam ut elit sed lorem tempus feugiat in et lectus. Mauris interdum molestie placerat. Nullam dolor nunc, elementum et tincidunt id, vestibulum quis turpis. Integer imperdiet a eros a laoreet. Nam mattis vel ligula non imperdiet. Suspendisse potenti. Fusce purus sem, dapibus eu fermentum eget, aliquam vehicula ligula.</p>
        </div>
        <div class="col-lg-6">
            <p>Quisque congue dignissim dui sed luctus. Morbi nec mi vitae magna finibus ullamcorper. Etiam mattis blandit convallis. Suspendisse eu elementum leo. Vestibulum molestie nunc et efficitur egestas. Vivamus arcu lectus, laoreet vel consectetur bibendum, elementum non nunc. Proin porttitor velit odio, ac mattis quam tincidunt eget. Fusce semper nunc eget efficitur efficitur. Nam ullamcorper, enim id tincidunt feugiat, velit mauris fermentum nulla, at tempor eros turpis sit amet massa. Ut a semper lectus, sed hendrerit risus. In hac habitasse platea dictumst. Curabitur venenatis cursus posuere. Praesent turpis nisi, aliquam at facilisis non, sagittis vel urna. Donec diam lorem, feugiat vitae laoreet in, sagittis a lorem.</p>
            <p>Aliquam consectetur et lorem semper scelerisque. Proin est nibh, vestibulum vitae congue nec, tristique eu justo. Maecenas eu nunc lacinia, porta lorem vitae, viverra velit. Nulla dolor libero, rhoncus quis luctus eu, fermentum sed leo. Morbi ut risus porttitor odio sodales pulvinar. Sed gravida nulla sed sapien vulputate, eget malesuada justo egestas. Pellentesque sem mi, vulputate ac iaculis sit amet, sagittis feugiat dui. Proin non pellentesque leo. Vestibulum varius laoreet posuere. Etiam fringilla diam odio.</p>
        </div>
    </div>
</div>
<div class="content-row">
    <h2>OUR HISTORY</h2>
    <div class="row" style="margin-bottom: 20px;">
        <div class="col-lg-5">
            <div id="custom-owl-slider-aboutus-1" class="owl-carousel">
                <div class="item">
                    <img src="{{media url="wysiwyg/smartwave/porto/aboutus/slide1.jpg"}}" alt="" />
                </div>
                <div class="item">
                    <img src="{{media url="wysiwyg/smartwave/porto/aboutus/slide2.jpg"}}" alt="" />
                </div>
                <div class="item">
                    <img src="{{media url="wysiwyg/smartwave/porto/aboutus/slide3.jpg"}}" alt="" />
                </div>
            </div>
            <script type="text/javascript">
                require([
                    'jquery',
                    'owl.carousel/owl.carousel.min'
                ], function ($) {
                    $("#custom-owl-slider-aboutus-1").owlCarousel({
                        items: 1,
                        autoplay: false,
                        autoplayTimeout: 5000,
                        autoplayHoverPause: true,
                        dots: true,
                        nav: false,
                        navRewind: true,
                        animateIn: 'fadeIn',
                        animateOut: 'fadeOut',
                        loop: true
                    });
                });
            </script>
        </div>
        <div class="col-lg-7">
            <h4>2014</h4>
            <p>Aliquam consectetur et lorem semper scelerisque. Proin est nibh, vestibulum vitae congue nec, tristique eu justo. Maecenas eu nunc lacinia, porta lorem vitae, viverra velit. Nulla dolor libero, rhoncus quis luctus eu, fermentum sed leo. Morbi ut risus porttitor odio sodales pulvinar. Sed gravida nulla sed sapien vulputate, eget malesuada justo egestas. Pellentesque sem mi, vulputate ac iaculis sit amet, sagittis feugiat dui. Proin non pellentesque leo. Vestibulum varius laoreet posuere. Etiam fringilla diam odio.</p>
            <p>Nulla felis nibh, bibendum a leo ut, egestas ornare felis. Nam pretium mauris justo, eget commodo est fringilla vel. Proin condimentum, lacus sit amet finibus gravida, sapien ligula mattis leo, sit amet mattis leo lacus sit amet lectus. Nulla facilisi. Etiam porta iaculis velit id pulvinar. Sed dolor odio, eleifend eget aliquam vitae, efficitur vitae dolor. Integer ornare neque ac leo sollicitudin, at vestibulum ante scelerisque. Nullam ut elit sed lorem tempus feugiat in et lectus. Mauris interdum molestie placerat. Nullam dolor nunc, elementum et tincidunt id, vestibulum quis turpis. Integer imperdiet a eros a laoreet. Nam mattis vel ligula non imperdiet. Suspendisse potenti. Fusce purus sem, dapibus eu fermentum eget, aliquam vehicula ligula.</p>
        </div>
    </div>
    <div class="row" style="margin-bottom: 20px;">
        <div class="col-lg-7">
            <h4>2015</h4>
            <p>Aliquam consectetur et lorem semper scelerisque. Proin est nibh, vestibulum vitae congue nec, tristique eu justo. Maecenas eu nunc lacinia, porta lorem vitae, viverra velit. Nulla dolor libero, rhoncus quis luctus eu, fermentum sed leo. Morbi ut risus porttitor odio sodales pulvinar. Sed gravida nulla sed sapien vulputate, eget malesuada justo egestas. Pellentesque sem mi, vulputate ac iaculis sit amet, sagittis feugiat dui. Proin non pellentesque leo. Vestibulum varius laoreet posuere. Etiam fringilla diam odio.</p>
            <p>Nulla felis nibh, bibendum a leo ut, egestas ornare felis. Nam pretium mauris justo, eget commodo est fringilla vel. Proin condimentum, lacus sit amet finibus gravida, sapien ligula mattis leo, sit amet mattis leo lacus sit amet lectus. Nulla facilisi. Etiam porta iaculis velit id pulvinar. Sed dolor odio, eleifend eget aliquam vitae, efficitur vitae dolor. Integer ornare neque ac leo sollicitudin, at vestibulum ante scelerisque. Nullam ut elit sed lorem tempus feugiat in et lectus. Mauris interdum molestie placerat. Nullam dolor nunc, elementum et tincidunt id, vestibulum quis turpis. Integer imperdiet a eros a laoreet. Nam mattis vel ligula non imperdiet. Suspendisse potenti. Fusce purus sem, dapibus eu fermentum eget, aliquam vehicula ligula.</p>
        </div>
        <div class="col-lg-5">
            <div id="custom-owl-slider-aboutus-2" class="owl-carousel">
                <div class="item">
                    <img src="{{media url="wysiwyg/smartwave/porto/aboutus/slide2.jpg"}}" alt="" />
                </div>
                <div class="item">
                    <img src="{{media url="wysiwyg/smartwave/porto/aboutus/slide3.jpg"}}" alt="" />
                </div>
                <div class="item">
                    <img src="{{media url="wysiwyg/smartwave/porto/aboutus/slide1.jpg"}}" alt="" />
                </div>
            </div>
            <script type="text/javascript">
                require([
                    'jquery',
                    'owl.carousel/owl.carousel.min'
                ], function ($) {
                    $("#custom-owl-slider-aboutus-2").owlCarousel({
                        items: 1,
                        autoplay: false,
                        autoplayTimeout: 5000,
                        autoplayHoverPause: true,
                        dots: true,
                        nav: false,
                        navRewind: true,
                        animateIn: 'fadeIn',
                        animateOut: 'fadeOut',
                        loop: true
                    });
                });
            </script>
        </div>
    </div>
    <div class="row" style="margin-bottom: 20px;">
        <div class="col-lg-5">
            <div id="custom-owl-slider-aboutus-3" class="owl-carousel">
                <div class="item">
                    <img src="{{media url="wysiwyg/smartwave/porto/aboutus/slide3.jpg"}}" alt="" />
                </div>
                <div class="item">
                    <img src="{{media url="wysiwyg/smartwave/porto/aboutus/slide1.jpg"}}" alt="" />
                </div>
                <div class="item">
                    <img src="{{media url="wysiwyg/smartwave/porto/aboutus/slide2.jpg"}}" alt="" />
                </div>
            </div>
            <script type="text/javascript">
                require([
                    'jquery',
                    'owl.carousel/owl.carousel.min'
                ], function ($) {
                    $("#custom-owl-slider-aboutus-3").owlCarousel({
                        items: 1,
                        autoplay: false,
                        autoplayTimeout: 5000,
                        autoplayHoverPause: true,
                        dots: true,
                        nav: false,
                        navRewind: true,
                        animateIn: 'fadeIn',
                        animateOut: 'fadeOut',
                        loop: true
                    });
                });
            </script>
        </div>
        <div class="col-lg-7">
            <h4>2016</h4>
            <p>Aliquam consectetur et lorem semper scelerisque. Proin est nibh, vestibulum vitae congue nec, tristique eu justo. Maecenas eu nunc lacinia, porta lorem vitae, viverra velit. Nulla dolor libero, rhoncus quis luctus eu, fermentum sed leo. Morbi ut risus porttitor odio sodales pulvinar. Sed gravida nulla sed sapien vulputate, eget malesuada justo egestas. Pellentesque sem mi, vulputate ac iaculis sit amet, sagittis feugiat dui. Proin non pellentesque leo. Vestibulum varius laoreet posuere. Etiam fringilla diam odio.</p>
            <p>Nulla felis nibh, bibendum a leo ut, egestas ornare felis. Nam pretium mauris justo, eget commodo est fringilla vel. Proin condimentum, lacus sit amet finibus gravida, sapien ligula mattis leo, sit amet mattis leo lacus sit amet lectus. Nulla facilisi. Etiam porta iaculis velit id pulvinar. Sed dolor odio, eleifend eget aliquam vitae, efficitur vitae dolor. Integer ornare neque ac leo sollicitudin, at vestibulum ante scelerisque. Nullam ut elit sed lorem tempus feugiat in et lectus. Mauris interdum molestie placerat. Nullam dolor nunc, elementum et tincidunt id, vestibulum quis turpis. Integer imperdiet a eros a laoreet. Nam mattis vel ligula non imperdiet. Suspendisse potenti. Fusce purus sem, dapibus eu fermentum eget, aliquam vehicula ligula.</p>
        </div>
    </div>
</div>
<style type="text/css">
.content-row {
    border-top: 1px solid #dfdfdf;
    padding: 40px 0;
}
.content-row:first-child {
    border-top: 0;
}
h2 {
    font-family: "Oswald";
    font-size: 30px;
    color: #000;
    font-weight: 700;
    letter-spacing: 1px;
    margin: 0;
    margin-bottom: 60px;
    line-height: 1;
}
h4 {
    font-size: 20px;
    font-weight: 400;
    color: #000;
    line-height: 1;
    margin: 0;
    margin-top: 5px;
    margin-bottom: 30px;
}
@media(min-width: 1680px) {
    .content-row {
        padding: 60px 100px;
    }
    .content-row > .row {
        margin: 0 -30px;
    }
    .content-row > .row > div {
        padding: 0 30px;
    }
    h2 {
        font-size: 40px;
        margin-bottom: 80px;
    }
    h4 {
        font-size: 25px;
        margin-bottom: 40px;
    }
}
@media(min-width: 1900px) {
    .content-row {
        padding: 80px 190px;
    }
    .content-row > .row {
        margin: 0 -50px;
    }
    .content-row > .row > div {
        padding: 0 50px;
    }
    h2 {
        font-size: 50px;
        margin-bottom: 100px;
    }
    h4 {
        font-size: 30px;
        margin-bottom: 50px;
    }
}
</style>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - About Us 2</title>
         <identifier>about-porto-2</identifier>
         <content><![CDATA[<div class="content-row" style="padding: 71px 0 75px;">
  <div class="container"> 
    <div class="row">
      <div class="col-md-12">
        <h2>Who we are</h2>
        <p style="margin-bottom: 40px;">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et<br>dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex<br>ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat<br>nulla pariatur. Excepteur sint occaecat.</p>
        <img src="{{media url="wysiwyg/smartwave/porto/aboutus/about-image.jpg"}}" class="img-responsive" alt="" style="max-width: 100%;" />
      </div> 
    </div>
    <div class="row" style="margin: 50px 0 0;">
      <div class="col-md-2"></div>
      <div class="col-md-8 brand-item">
        <span>50+<b>Fashion Brands</b></span>
        <span>150+<b>Fashion Products</b></span>
        <span>250+<b>Regular Buyers</b></span>
      </div>
      <div class="col-md-2"></div>
    </div>
  </div>
</div>
<div class="content-row fullwidth-row" style="background-color:#efefef;padding: 71px 0 75px;">
  <div class="container">
    <h2>Our History</h2>
  </div>
  <div class="container">
    <div class="row">
      <div class="col-md-4">
        <img src="{{media url="wysiwyg/smartwave/porto/aboutus/about-image2.jpg"}}" class="img-responsive" alt="">
      </div>
      <div class="col-md-8">  
        <div class="filter-history" style="padding-top: 35px;">
          <div class="tab-main-content">
            <div class="tab-content" id="h2016_contents">
              <h3>2016</h3>
              <p>Eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim<br>veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo<br>consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum<br>dolore eu fugiat nulla pariatur. Excepteur sint occaecat.</p>
            </div>
            <div class="tab-content" id="h2014_contents" style="display: none;">
              <h3>2014</h3>
              <p>Eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim<br>veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo<br>consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum<br>dolore eu fugiat nulla pariatur. Excepteur sint occaecat.</p>
            </div>
            <div class="tab-content" id="h2012_contents" style="display: none;">
              <h3>2012</h3>
              <p>Eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim<br>veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo<br>consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum<br>dolore eu fugiat nulla pariatur. Excepteur sint occaecat.</p>
            </div>
            <div class="tab-content" id="h2010_contents" style="display: none;">
              <h3>2016</h3>
              <p>Eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim<br>veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo<br>consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum<br>dolore eu fugiat nulla pariatur. Excepteur sint occaecat.</p>
            </div>
          </div> 
          <ul class="nav-tabs">
            <li id="h2016" class="active"><a href="javascript:void(0)">2016</a></li>
            <li id="h2014" class=""><a href="javascript:void(0)">2014</a></li>
            <li id="h2012" class=""><a href="javascript:void(0)">2012</a></li>
            <li id="h2010" class=""><a href="javascript:void(0)">2010</a></li>
          </ul>
        </div>
        <script type="text/javascript">
            require([
                'jquery'
            ], function ($) {
                $(".nav-tabs > li > a").off("click").on("click",function(){
                    $(this).parent().parent().children("li").removeClass("active");
                    $(this).parent().parent().parent().children(".tab-main-content").children(".tab-content").hide();
                    $("#" + $(this).parent().attr("id") + "_contents").show();
                    $(this).parent().addClass("active");
                });
            });
        </script>
      </div>
    </div>
  </div>
</div>
<style>
  .main-container,.col-main {
    padding: 0;
  }
  .main.container {
    width: 100%;
    padding: 0;
  }
  .content-row {
    text-align:center;
    font-size: 15px;
    line-height: 27px;
    letter-spacing: 0.005em;
  }
  .content-row h2 {
    font-size: 25px;
    font-weight: 700;
    color:#21293c;
    text-transform: uppercase;
    margin-bottom: 30px;
    line-height: 1;
  }
  .content-row .brand-item span {
    font-family: 'Oswald';
    font-size:36px;
    font-weight:400;
    text-align:center;
    color:#21293c;
    display:inline-block;
    padding: 0 35px;
  }
  .content-row .brand-item b {
    font-family:'Open Sans';
    font-size:16px;
    color:#7a7d82;
    font-weight:400;
    display:block;
    padding-top: 10px;
  }
  .filter-history .tab-content {
    width: calc(100% - 73px);
    display: inline-block;
    float: left;
    text-align: left;
    font-size: 15px;
    letter-spacing: 0.005em;
    line-height: 27px;
    padding-left: 30px;
  }
  .filter-history .tab-content h3 { 
    font-family: 'Oswald';
    font-size: 30px;
    font-weight: 400;
    color: #21293c;
    margin-bottom: 32px;
  }
  .filter-history .nav-tabs {
    width: 73px;
    list-style: none;
    display: inline-block;
    padding: 0;
    margin-top: 43px;
  }
  .filter-history .nav-tabs li {
    display: block;
  }
  .filter-history .nav-tabs li a {
    font-family: 'Oswald';
    font-size: 18px;
    font-weight: 400;
    letter-spacing: 0.05em;
    color: #979797;
    padding: 14px 3px;
    display: block;
    position: relative;
    text-align: right;
  }
  .filter-history .nav-tabs li.active a {
    color: #21293c;
  }
  .filter-history .nav-tabs li a:before {
    content: "\f883";
    color: #979797;
    font-family: 'porto-icons';
    font-size: 10px;
    padding-right: 20px;
    margin-top: -5px;
    position: absolute;
    top: 21px;
    left: 0;
  }
  .filter-history .nav-tabs li.active a:before {
    color: #6f727b;
  }
</style>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - About Us 3</title>
         <identifier>about-porto-3</identifier>
         <content><![CDATA[<div class="content-row" style="padding: 30px 0 40px;">
    <h2>WHO WE ARE</h2>
    <div class="row">
        <div class="col-lg-8">
            <p style="font-family:'Open Sans';font-size:14px;font-weight:400;color:#676a6d;margin:0;margin-bottom: 15px;line-height:2;padding-right: 25px;">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. posuere cubilia Curae; In eu libero ligula. Fusce eget metus lorem, ac viverra leo. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; In eu libero ligula. Fusce eget metus lorem, ac viverra leo. desktop publishing software like Aldus PageMaker including versions. was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently.</p>
        </div>
        <div class="col-lg-4">
            <div class="support-block"> 
                <div>
                    <i class="porto-icon-shipped"></i>
                    <h3>FREE SHIPPING & RETURN</h3>
                    <p>Free shipping on all orders over $99.</p>
                </div>
                <div>
                    <i class="porto-icon-us-dollar"></i>
                    <h3>MONEY BACK GUARANTEE</h3>
                    <p>100% money back guarantee</p>
                </div>
                <div>
                    <i class="porto-icon-online-support"></i>
                    <h3>ONLINE SUPPORT 24/7</h3>
                    <p>Lorem ipsum dolor sit amet.</p>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="content-row fullwidth-row" style="background-color:#efefef;padding:50px 0 57px;">
    <div class="container">
        <h2>OUR TEAM</h2>
        <div class="row">
            <div class="col-md-3 col-sm-6">
                <div class="team-member">
                    <img src="{{media url="wysiwyg/smartwave/porto/aboutus/3/member-1.jpg"}}" alt="" />
                    <h5>JANE DOE</h5>
                </div>
            </div>
            <div class="col-md-3 col-sm-6">
                <div class="team-member">
                    <img src="{{media url="wysiwyg/smartwave/porto/aboutus/3/member-2.jpg"}}" alt="" />
                    <h5>JOHN DOE</h5>
                </div>
            </div>
            <div class="col-md-3 col-sm-6">
                <div class="team-member">
                    <img src="{{media url="wysiwyg/smartwave/porto/aboutus/3/member-3.jpg"}}" alt="" />
                    <h5>GEORGE DOE</h5>
                </div>
            </div>
            <div class="col-md-3 col-sm-6">
                <div class="team-member">
                    <img src="{{media url="wysiwyg/smartwave/porto/aboutus/3/member-4.jpg"}}" alt="" />
                    <h5>ALICE DOE</h5>
                </div>
            </div>
        </div>
        <button class="btn" style="font-family: 'Oswald';font-weight: 400;font-size: 14px;color: #fff;background-color: #111;padding: 10px 20px;border-radius: 3px;display: block;margin: 0 auto;line-height: 1.5;height: auto;border: 0;">JOIN OUR TEAM</button>
    </div>
</div>
<div class="content-row" style="padding-top: 55px;">
    <h2>OUR HISTORY</h2>
    <div class="row">
        <div class="col-lg-6">
            <div class="history-item">
                <div class="image-area">
                    <img src="{{media url="wysiwyg/smartwave/porto/aboutus/3/history-1.jpg"}}" alt="" />
                    <span>2000</span>
                </div>
                <div class="content-area">
                    <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took.</p>
                </div>
            </div>
        </div>
        <div class="col-lg-6">
            <div class="history-item">
                <div class="image-area">
                    <img src="{{media url="wysiwyg/smartwave/porto/aboutus/3/history-2.jpg"}}" alt="" />
                    <span>2010</span>
                </div>
                <div class="content-area">
                    <p>Readable English. Many desktop publishing packages and web page editors now use Lorem Ipsum as their default model text, and a search for 'lorem ipsum' will uncover many web sites.</p>
                </div>
            </div>
        </div>
        <div class="col-lg-6">
            <div class="history-item">
                <div class="image-area">
                    <img src="{{media url="wysiwyg/smartwave/porto/aboutus/3/history-3.jpg"}}" alt="" />
                    <span>2015</span>
                </div>
                <div class="content-area">
                    <p>There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly.</p>
                </div>
            </div>
        </div>
        <div class="col-lg-6">
            <div class="history-item">
                <div class="image-area">
                    <img src="{{media url="wysiwyg/smartwave/porto/aboutus/3/history-4.jpg"}}" alt="" />
                    <span>2018</span>
                </div>
                <div class="content-area">
                    <p>The standard chunk of Lorem Ipsum used since the 1500s is reproduced below for those interested. Sections 1.10.32 and 1.10.33 from "de Finibus Bonorum et Malorum.</p>
                </div>
            </div>
        </div>
    </div>
</div>
<style type="text/css">
.content-row h2 {
    font-size: 21px;
    color: #252525;
    font-weight: 700;
    font-family: 'Open Sans';
    margin-bottom: 15px;
}
.support-block {
    border: 1px solid #dedede;
    border-bottom: 0;
}
.support-block > div {
    border-bottom: 1px solid #dedede;
    padding: 10px;
    line-height: 1.4;
}
.support-block > div:after {
    content: '';
    display: table;
    clear: both;
}
.support-block > div > i {
    font-size: 38px;
    color: #252525;
    float: left;
    margin: 0 15px;
}
.support-block > div > h3 {
    color: #252525;
    font-family: 'Open Sans';
    font-size: 14px;
    font-weight: 600;
    margin: 5px 0;
}
.support-block > div > p {
    margin: 0;
    font-family: 'Open Sans';
    font-size: 13px;
    font-weight: 400;
    color: #839199;
    line-height: 1.4;
    margin-left: 83px;
}
.team-member {
    background-color: #fff;
    margin-bottom: 28px;
    transition: all 0.3s;
}
.team-member:hover {
    box-shadow: 0 0 10px 2px rgba(0,0,0,0.3);
}
.team-member img {
    width: 100%;
    display: block;
}
.team-member h5 {
    padding: 30px 0;
    text-align: center;
    font-family: 'Oswald';
    font-size: 16px;
    line-height: 1;
    color: #111;
    font-weight: 400;
    margin: 0;
}
.history-item {
    display: flex;
    margin: 10px 0;
}
.history-item > .image-area {
    position: relative;
}
.history-item > .image-area span {
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    text-align: center;
    font-family: 'Oswald';
    font-size: 54px;
    font-weight: 300;
    line-height: 1;
    color: #fff;
    margin-top: -27px;
}
.history-item > .content-area {
    border: 1px solid #dedede;
    border-left: 0;
    padding: 45px 25px;
}
.history-item > .content-area p {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 5;
    overflow: hidden;
    margin: 0;
    font-family: 'Open Sans';
    font-size: 14px;
    font-weight: 400;
    line-height: 2;
    color: #676a6d;
}
.history-item > .image-area img {
    max-width: none;
    display: block;
}
</style>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - About Us 4</title>
         <identifier>about-porto-4</identifier>
         <content><![CDATA[<div class="content-row" style="padding: 40px 0 60px;">
    <h2>OUR STORY</h2>
    <p style="font-family:'Open Sans';font-size:15px;font-weight:400;line-height:1.8;margin-bottom:20px;color:#7b858a;">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.</p>
    <p style="font-family:'Open Sans';font-size:15px;font-weight:400;line-height:1.8;margin-bottom:20px;color:#7b858a;">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</p>
    <p style="font-family:'Open Sans';font-size:18px;font-weight:400;line-height:1.5;margin-bottom:20px;color:#21293c;">“ Many desktop publishing packages and web page editors now use Lorem Ipsum as their default model search for evolved over sometimes by accident, sometimes on purpose  ”</p>
</div>
<div class="content-row fullwidth-row" style="background-color:#efefef;padding:50px 0 57px;">
    <div class="container">
        <h2>WHY CHOOSE US</h2>
        <div class="row">
            <div class="col-lg-4">
                <div class="service-block">
                    <i class="porto-icon-shipped theme-color"></i>
                    <h3>Free Shipping</h3>
                    <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industr.</p>
                </div>
            </div>
            <div class="col-lg-4">
                <div class="service-block">
                    <i class="porto-icon-us-dollar theme-color"></i>
                    <h3>100% money back guarantee.</h3>
                    <p>There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form.</p>
                </div>
            </div>
            <div class="col-lg-4">
                <div class="service-block">
                    <i class="porto-icon-online-support theme-color"></i>
                    <h3>Online Support 24/7</h3>
                    <p>There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form.</p>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="content-row" style="padding: 50px 0 40px;">
    <h2 style="text-align: center;margin-bottom: 40px;">HAPPY CLIENTS</h2>
    <div id="testimonials-slider" class="owl-carousel owl-theme">
        <div class="item">
            <div class="testimonial-author">
                <div class="img-thumbnail img-thumbnail-small"><img width="60" height="60" src="{{media url="wysiwyg/smartwave/porto/aboutus/4/client1.png"}}" alt=""/></div>
                <p><strong>John Smith</strong><span>Porto CO SEO</span></p>
            </div>
            <blockquote class="testimonial">
                <p>Lorem ipsum dolor sit amet, consectetur elitad adipiscing Cras non placerat mipsum dolor sit amet, consectetur elitad adipiscing cas non placerat mi.</p>
            </blockquote> 
        </div>
        <div class="item">
            <div class="testimonial-author">
                <div class="img-thumbnail img-thumbnail-small"><img width="60" height="60" src="{{media url="wysiwyg/smartwave/porto/aboutus/4/client2.png"}}" alt=""/></div>
                <p><strong>Bob Smith</strong><span>Porto CO SEO</span></p>
            </div>
            <blockquote class="testimonial">
                <p>Lorem ipsum dolor sit amet, consectetur elitad adipiscing Cras non placerat mipsum dolor sit amet, consectetur elitad adipiscing cas non placerat mi.</p>
            </blockquote> 
        </div>
    </div>
    <script type="text/javascript">
    require([
        'jquery',
        'owl.carousel/owl.carousel.min'
    ], function ($) {
        $("#testimonials-slider").owlCarousel({
            autoplay: true,
            autoplayTimeout: 5000,
            autoplayHoverPause: true,
            margin: 0,
            nav: false,
            dots: false,
            navRewind: true,
            animateIn: 'fadeIn',
            animateOut: 'fadeOut',
            loop: true,
            responsive: {
                0: {
                    items:1
                },
                768: {
                    items:1
                },
                992: {
                    items:1
                },
                1200: {
                    items:2
                }
            }
        });
    });
    </script>
</div>
<div class="content-row fullwidth-row" style="background-color:#efefef;">
    <div class="container">
        <div class="counters">
            <div class="row">
                <div class="col-lg-2 col-md-4 col-6">
                    <div class="counter counter-primary" data-appear-animation="bounceIn" data-appear-animation-delay="300">
                        <strong data-to="200" data-append="+">200+</strong>
                        <label>MILLION CUSTOMERS</label>
                    </div>
                </div>
                <div class="col-lg-2 col-md-4 col-6">
                    <div class="counter counter-primary" data-appear-animation="bounceIn" data-appear-animation-delay="600">
                        <strong data-to="1800" data-append="+">1800+</strong>
                        <label>TEAM MEMBERS</label>
                    </div>
                </div>
                <div class="col-lg-2 col-md-4 col-6">
                    <div class="counter counter-primary" data-appear-animation="bounceIn" data-appear-animation-delay="900">
                        <strong data-to="24" data-append="<span>HR</span>">24<span>HR</span></strong>
                        <label>SUPPORT AVAILABLE</label>
                    </div>
                </div>
                <div class="col-lg-2 col-md-4 col-6">
                    <div class="counter counter-primary" data-appear-animation="bounceIn" data-appear-animation-delay="1200">
                        <strong data-to="265" data-append="+">265+</strong>
                        <label>CUP OF COFFEE</label>
                    </div>
                </div>
                <div class="col-lg-2 col-md-4 col-6">
                    <div class="counter counter-primary" data-appear-animation="bounceIn" data-appear-animation-delay="1200">
                        <strong data-to="99" data-append="<span>%</span>">99<span>%</span></strong>
                        <label>POSITIVE REVIEWS</label>
                    </div>
                </div>
            </div>
            <script type="text/javascript">
                // Counter
                require([
                    'jquery'
                ], function ($) {
                    'use strict';
                    if ($.isFunction($.fn['themePluginCounter'])) {
                        $(function() {
                            $('[data-plugin-counter]:not(.manual), .counters [data-to]').each(function() {
                                var $this = $(this), opts;
                                var pluginOptions = $this.data('plugin-options');
                                if (pluginOptions)
                                    opts = pluginOptions;
                                $this.themePluginCounter(opts);
                            });
                        });
                    }
                });
            </script>
        </div>
    </div>
</div>
<style type="text/css">
h2 {
    font-family: 'Open Sans';
    font-size: 19px;
    font-weight: 700;
    color: #21293c;
    margin-bottom: 20px;
}
.service-block {
    background-color: #fff;
    padding: 30px 45px 40px 45px;
}
.service-block > i {
    font-size: 50px;
    margin: 0 -10px;
}
.service-block > h3 {
    font-family: 'Open Sans';
    font-size: 18px;
    line-height: 2;
    font-weight: 600;
    color: #21293c;
    margin-bottom: 15px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.service-block > p {
    font-family: 'Open Sans';
    font-size: 15px;
    font-weight: 400;
    line-height: 2;
    color: #7b858a;
    margin: 0;
    height: 120px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
}
blockquote.testimonial {
    border: 0;
    background-color: transparent !important;
    color: #62615e;
    font-size: 14px;
    font-style: normal;
    line-height: 24px;
    font-weight: 400;
    font-family: 'Open Sans';
    margin: 0;
    padding: 15px 30px 15px 50px;
    float: left;
    margin-top: 5px;
    position: relative;
    margin-left: 73px;
}
blockquote.testimonial p {
    line-height: 1.8;
}
blockquote.testimonial:before {
    left: 10px;
    top: 0;
    content: "\201C";
    font-style: normal;
    line-height: 1;
    position: absolute;
    color: #08c;
    font-family: 'porto';
    font-weight: 400;
    font-size: 54px;
}
.testimonial-arrow-down {
    border:15px solid transparent;
    border-top-color:#08c;
    border-bottom:0;
    height:0;
    margin:0 0 0 25px;
    width:0;
}
.testimonial-author {
    margin:8px 0 0 8px;
}
.testimonial-author .img-thumbnail {
    float: left;
    margin-right: 25px;
    position: relative;
    line-height: 1.5;
    background-color: #fff;
    display: inline-block;
    max-width: 100%;
    height: auto;
    border-radius: 50% !important;
}
.testimonial-author .img-thumbnail img {
    max-width:60px;
    display:inline-block;
    height:auto;
}
.testimonial-author p {
    color:#666;
    margin:0 0 0 25px;
    text-align:left;
    line-height:24px;
    text-transform: uppercase;
}
.testimonial-author p >strong {
    color:#111;
    display:block;
    padding-top:7px;
    font-size:14px;
}
.testimonial-author span {
    color:#666;
    display:block;
    font-size:12px;
}
.page-main {
    padding-bottom: 0;
}
.columns .column.main {
    padding-bottom: 0;
}
.counters {
    padding-bottom: 20px;
}
.counter {
    padding: 40px 0;
}
.counter > label {
    display: block;
    font-family: 'Open Sans';
    font-size: 14px;
    font-weight: 400;
    color: #7b858a;
}
.counter > strong {
    font-family: 'Open Sans';
    font-size: 32px;
    font-weight: 800;
    color: #08c;
}
.counter > strong span {
    font-size: 19px;
}
@media (min-width: 992px) {
    .counters .col-lg-2 {
        -webkit-flex: 0 0 20%;
        -moz-flex: 0 0 20%;
        -ms-flex: 0 0 20%;
        flex: 0 0 20%;
        max-width: 20%;
    }
}
</style>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[<referenceContainer name="page.top">
    <block class="Magento\Cms\Block\Block" name="top_banner">
        <arguments>
            <argument name="block_id" xsi:type="string">porto_about_us_4_top_block</argument>
        </arguments>
    </block>
</referenceContainer>]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - About Us 7</title>
         <identifier>about-porto-7</identifier>
         <content><![CDATA[<div class="content-row" style="padding: 35px 0 75px;">
    <h2 style="font-size:30px;text-align:center;margin-bottom:30px;">ABOUT US</h2>
    <p style="font-size:14px;color:#7b7f83;line-height:2;text-align:center;margin:0 auto;max-width:835px;">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing.</p>
</div>
<div class="content-row fullwidth-row" style="background-color:#f2f4f6; padding: 70px 0;">
    <div class="container">
        <div class="owl-side-narrow">
            <div id="brands-slider-about" class="owl-carousel owl-theme">
                <div class="item" style="padding:10px 0;">
                    <img alt="" src="{{media url="wysiwyg/smartwave/porto/aboutus/7/brand1.png"}}"/>
                </div>
                <div class="item" style="padding:10px 0;">
                    <img alt="" src="{{media url="wysiwyg/smartwave/porto/aboutus/7/brand2.png"}}"/>
                </div>
                <div class="item" style="padding:10px 0;">
                    <img alt="" src="{{media url="wysiwyg/smartwave/porto/aboutus/7/brand3.png"}}"/>
                </div>
                <div class="item" style="padding:10px 0;">
                    <img alt="" src="{{media url="wysiwyg/smartwave/porto/aboutus/7/brand4.png"}}"/>
                </div>
                <div class="item" style="padding:10px 0;">
                    <img alt="" src="{{media url="wysiwyg/smartwave/porto/aboutus/7/brand5.png"}}"/>
                </div>
                <div class="item" style="padding:10px 0;">
                    <img alt="" src="{{media url="wysiwyg/smartwave/porto/aboutus/7/brand1.png"}}"/>
                </div>
                <div class="item" style="padding:10px 0;">
                    <img alt="" src="{{media url="wysiwyg/smartwave/porto/aboutus/7/brand2.png"}}"/>
                </div>
                <div class="item" style="padding:10px 0;">
                    <img alt="" src="{{media url="wysiwyg/smartwave/porto/aboutus/7/brand3.png"}}"/>
                </div>
                <div class="item" style="padding:10px 0;">
                    <img alt="" src="{{media url="wysiwyg/smartwave/porto/aboutus/7/brand4.png"}}"/>
                </div>
                <div class="item" style="padding:10px 0;">
                    <img alt="" src="{{media url="wysiwyg/smartwave/porto/aboutus/7/brand5.png"}}"/>
                </div>
            </div>
            <script type="text/javascript">
            require([
                'jquery',
                'owl.carousel/owl.carousel.min'
            ], function ($) {
                $("#brands-slider-about").owlCarousel({
                    autoplay: true,
                    autoplayTimeout: 5000,
                    autoplayHoverPause: true,
                    margin: 0,
                    nav: true,
                    dots: false,
                    navRewind: true,
                    loop: true,
                    navText: ["<i class='porto-icon-left-open-big'></i>","<i class='porto-icon-right-open-big'></i>"],
                    responsive: {
                        0: {
                            items:2
                        },
                        768: {
                            items:4
                        },
                        992: {
                            items:5
                        },
                        1200: {
                            items:5
                        }
                    }
                });
            });
            </script>
        </div>
    </div>
</div>
<div class="content-row" style="padding:50px 0 0;">
    <h2 style="font-size:16px;margin-bottom:40px;position:relative;"><span style="position:relative;z-index:1;background-color:#fff;padding-right:30px;">OUR TEAM</span><hr style="position:absolute;left:0;top:50%;width:100%;margin:0;border:0;border-top:1px solid #dde0e2;margin-top:-1px;z-index:0;"></h2>
    <div class="row">
        <div class="col-md-3 col-sm-6">
            <div class="team-member">
                <img src="{{media url="wysiwyg/smartwave/porto/aboutus/3/member-1.jpg"}}" alt="">
                <h5>JANE DOE</h5>
            </div>
        </div>
        <div class="col-md-3 col-sm-6">
            <div class="team-member">
                <img src="{{media url="wysiwyg/smartwave/porto/aboutus/3/member-2.jpg"}}" alt="">
                <h5>JOHN DOE</h5>
            </div>
        </div>
        <div class="col-md-3 col-sm-6">
            <div class="team-member">
                <img src="{{media url="wysiwyg/smartwave/porto/aboutus/3/member-3.jpg"}}" alt="">
                <h5>GEORGE DOE</h5>
            </div>
        </div>
        <div class="col-md-3 col-sm-6">
            <div class="team-member">
                <img src="{{media url="wysiwyg/smartwave/porto/aboutus/3/member-4.jpg"}}" alt="">
                <h5>ALICE DOE</h5>
            </div>
        </div>
    </div>
</div>
<style type="text/css">
.content-row h2 {
    font-size: 21px;
    color: #252525;
    font-weight: 700;
    font-family: 'Open Sans';
    margin-bottom: 15px;
}
.team-member {
    background-color: #fff;
    margin-bottom: 28px;
    transition: all 0.3s;
}
.team-member:hover {
    box-shadow: 0 0 10px 2px rgba(0,0,0,0.3);
}
.team-member img {
    width: 100%;
    display: block;
}
.team-member h5 {
    padding: 30px 0;
    text-align: center;
    font-family: 'Oswald';
    font-size: 16px;
    line-height: 1;
    color: #111;
    font-weight: 400;
    margin: 0;
}
.owl-side-narrow {
    margin: 0 -10px;
}
.owl-side-narrow .owl-controls .owl-nav [class*=owl-] {
    color: #c5c5c5;
    background: transparent;
    padding: 0;
    margin: 0;
    font-size: 24px;
    position: absolute;
    top: 50%;
    margin-top: -18px;
}
.owl-side-narrow .owl-controls .owl-nav .owl-prev {
    left: 0;
}
.owl-side-narrow .owl-controls .owl-nav .owl-next {
    right: 0;
}
.owl-side-narrow .owl-carousel {
    padding: 0 80px;
}
.owl-side-narrow .owl-carousel .owl-item.loading {
    min-height: 60px;
}
.owl-side-narrow .owl-controls {
    margin: 0;
}
#brands-slider-about img {
    opacity: 0.5;
}
</style>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[<referenceContainer name="page.top">
    <block class="Magento\Cms\Block\Block" name="top_banner">
        <arguments>
            <argument name="block_id" xsi:type="string">porto_about_us_7_top_block</argument>
        </arguments>
    </block>
</referenceContainer>]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - About Us 8</title>
         <identifier>about-porto-8</identifier>
         <content><![CDATA[<div class="content-row" style="padding: 30px 0 40px;">
    <div class="row">
        <div class="col-lg-7">
            <h2>OUR HISTORY</h2>
            <p style="font-family:'Open Sans';font-size:15px;font-weight:400;color:#767f84;margin-bottom:20px;line-height:2;padding-right: 25px;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras dapibus a eros in venenatis. Cras mauris arcu, suscipit id lacinia sed, pulvinar in urna. Donec urna nisi, efficitur fermentum ullamcorper non, mattis et est. Nullam malesuada leo leo, non tempus turpis accumsan a. Sed tincidunt feugiat purus, sed lobortis justo consequat in. Phasellus lectus magna, accumsan eget felis in, hendrerit malesuada lectus. Duis orci nunc, vulputate vel sapien nec, sodales sollicitudin ligula.</p>
        </div>
        <div class="col-lg-5">
            <h2>CLIENT REVIEWS</h2>
            <div id="testimonials-slider" class="owl-carousel owl-theme">
                <div class="item">
                    <div class="testimonial-author">
                        <div class="img-thumbnail img-thumbnail-small"><img width="60" height="60" src="{{media url="wysiwyg/smartwave/porto/aboutus/4/client1.png"}}" alt=""/></div>
                        <p><strong>John Smith</strong><span>Porto CO SEO</span></p>
                    </div>
                    <blockquote class="testimonial">
                        <p>Lorem ipsum dolor sit amet, consectetur elitad adipiscing Cras non placerat mipsum dolor sit amet, consectetur elitad adipiscing.</p>
                    </blockquote> 
                </div>
                <div class="item">
                    <div class="testimonial-author">
                        <div class="img-thumbnail img-thumbnail-small"><img width="60" height="60" src="{{media url="wysiwyg/smartwave/porto/aboutus/4/client2.png"}}" alt=""/></div>
                        <p><strong>Bob Smith</strong><span>Porto CO SEO</span></p>
                    </div>
                    <blockquote class="testimonial">
                        <p>Lorem ipsum dolor sit amet, consectetur elitad adipiscing Cras non placerat mipsum dolor sit amet, consectetur elitad adipiscing.</p>
                    </blockquote> 
                </div>
            </div>
            <script type="text/javascript">
            require([
                'jquery',
                'owl.carousel/owl.carousel.min'
            ], function ($) {
                $("#testimonials-slider").owlCarousel({
                    items: 1,
                    autoplay: true,
                    autoplayTimeout: 5000,
                    autoplayHoverPause: true,
                    margin: 0,
                    nav: false,
                    dots: false,
                    navRewind: true,
                    animateIn: 'fadeIn',
                    animateOut: 'fadeOut',
                    loop: true
                });
            });
            </script>
        </div>
    </div>
</div>
<div class="content-row fullwidth-row" style="background-color:#f1f1f1;padding:50px 0 30px;">
    <div class="container">
        <h2>PHOTO GALLERY</h2>
        <div class="photo-gallery">
            <div class="row">
                <div class="col-6 col-md-3">
                    <img src="{{media url="wysiwyg/smartwave/porto/aboutus/8/gallery1.jpg"}}" alt="" style="width: 100%;margin-bottom:30px;"/>
                </div>
                <div class="col-6 col-md-3">
                    <img src="{{media url="wysiwyg/smartwave/porto/aboutus/8/gallery2.jpg"}}" alt="" style="width: 100%;margin-bottom:30px;"/>
                </div>
                <div class="col-6 col-md-3">
                    <img src="{{media url="wysiwyg/smartwave/porto/aboutus/8/gallery3.jpg"}}" alt="" style="width: 100%;margin-bottom:30px;"/>
                </div>
                <div class="col-6 col-md-3">
                    <img src="{{media url="wysiwyg/smartwave/porto/aboutus/8/gallery4.jpg"}}" alt="" style="width: 100%;margin-bottom:30px;"/>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="content-row" style="padding: 60px 0">
    <div class="row">
        <div class="col-lg-6">
            <img src="{{media url="wysiwyg/smartwave/porto/aboutus/8/our-mission.jpg"}}" alt="" style="width: 100%;" />
        </div>
        <div class="col-lg-6">
            <div style="padding:45px 0 45px 20px;">
                <h2>OUR MISSION</h2>
                <p style="font-size:15px;font-weight:400;line-height:1.8;color:#767f84;margin-bottom: 30px;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 3;overflow: hidden;max-height: 77px;">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled.</p>
                <h2>OUR VISION</h2>
                <p style="font-size:15px;font-weight:400;line-height:1.8;color:#767f84;margin-bottom:0;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 3;overflow: hidden;max-height: 77px;">Standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only look now. </p>
            </div>
        </div>
    </div>
</div>
<div class="content-row fullwidth-row" style="background-color:#f1f1f1;">
    <div class="container">
        <div class="support-block row"> 
            <div class="col-lg-4">
                <i class="porto-icon-shipped"></i>
                <h3>FREE SHIPPING</h3>
                <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry.</p>
            </div>
            <div class="col-lg-4">
                <i class="porto-icon-us-dollar"></i>
                <h3>100% MONEY BACK GUARANTEE</h3>
                <p>There are many variations of passages of Lorem Ipsum available, but the majority.</p>
            </div>
            <div class="col-lg-4">
                <i class="porto-icon-online-support"></i>
                <h3>ONLINE SUPPORT 24/7</h3>
                <p>There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form.</p>
            </div>
        </div>
    </div>
</div>
<style type="text/css">
.content-row h2 {
    font-size: 16px;
    font-family: 'Oswald';
    color: #282d3b;
    font-weight: 700;
    line-height: 1;
    padding: 10px 0;
    border-bottom: 1px solid #e7e7e7;
    margin-bottom: 30px;
}
blockquote.testimonial {
    border: 0;
    background-color: transparent !important;
    color: #62615e;
    font-size: 14px;
    font-style: normal;
    line-height: 24px;
    font-weight: 400;
    font-family: 'Open Sans';
    margin: 0;
    padding: 15px 30px 15px 50px;
    float: left;
    margin-top: 5px;
    position: relative;
    margin-left: 73px;
}
blockquote.testimonial p {
    line-height: 1.8;
}
blockquote.testimonial:before {
    left: 10px;
    top: 0;
    content: "\201C";
    font-style: normal;
    line-height: 1;
    position: absolute;
    color: #ee3d43;
    font-family: 'porto';
    font-weight: 400;
    font-size: 54px;
}
.testimonial-arrow-down {
    border:15px solid transparent;
    border-top-color:#ee3d43;
    border-bottom:0;
    height:0;
    margin:0 0 0 25px;
    width:0;
}
.testimonial-author {
    margin:8px 0 0 8px;
}
.testimonial-author .img-thumbnail {
    float: left;
    margin-right: 25px;
    position: relative;
    line-height: 1.5;
    background-color: #fff;
    display: inline-block;
    max-width: 100%;
    height: auto;
    border-radius: 50% !important;
}
.testimonial-author .img-thumbnail img {
    max-width:60px;
    display:inline-block;
    height:auto;
}
.testimonial-author p {
    color:#666;
    margin:0 0 0 25px;
    text-align:left;
    line-height:24px;
    text-transform: uppercase;
}
.testimonial-author p >strong {
    color:#111;
    display:block;
    padding-top:7px;
    font-size:14px;
}
.testimonial-author span {
    color:#666;
    display:block;
    font-size:12px;
}
.columns .column.main {
    padding-bottom: 0;
}
.support-block {
}
.support-block > div {
    padding: 50px 15px 50px 5px;
    line-height: 1.4;
}
.support-block > div:after {
    content: '';
    display: table;
    clear: both;
}
.support-block > div > i {
    font-size: 55px;
    color: #ee3d43;
    float: left;
    margin: 0 15px 0 0;
}
.support-block > div > h3 {
    color: #21293c;
    font-family: 'Oswald';
    font-size: 14px;
    font-weight: 700;
    margin: 10px 0;
}
.support-block > div > p {
    margin: 0;
    font-family: 'Open Sans';
    font-size: 15px;
    font-weight: 400;
    color: #7b858a;
    line-height: 1.8;
    margin-left: 92px;
    letter-spacing: -0.5px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    max-height: 60px;
}
.page-main {
    padding-bottom: 0;
}
</style>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[<referenceContainer name="page.top">
    <block class="Magento\Cms\Block\Block" name="top_banner">
        <arguments>
            <argument name="block_id" xsi:type="string">porto_about_us_8_top_block</argument>
        </arguments>
    </block>
</referenceContainer>]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - About Us 9</title>
         <identifier>about-porto-9</identifier>
         <content><![CDATA[<div class="content-row" style="padding: 50px 0 60px;">
    <p style="font-family:'Open Sans';font-size:15px;font-weight:400;color:#4a505e;line-height:2;max-width:660px;text-align:center;margin:0 auto;">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing.</p>
</div>
<div class="content-row fullwidth-row" style="background-color:#f1f1f1;position:relative;min-height:450px;">
    <div class="fullwidth-half-bg" style="background:url({{media url="wysiwyg/smartwave/porto/aboutus/9/fullwidth-half-bg.jpg"}}) center no-repeat;background-size:cover;"></div>
    <div class="container">
        <div class="row">
            <div class="offset-lg-6 col-lg-6" style="padding-top:70px;padding-bottom:70px;">
                <h2>OUR HISTORY</h2>
                <div class="history-accordion">
                    <ul>
                        <li class="active">
                            <div class="history-title">2000</div>
                            <div class="history-content" style="display:block;">
                                Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make .
                            </div>
                        </li>
                        <li>
                            <div class="history-title">2005</div>
                            <div class="history-content" style="display:none;">
                                Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make .
                            </div>
                        </li>
                        <li>
                            <div class="history-title">2010</div>
                            <div class="history-content" style="display:none;">
                                Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make .
                            </div>
                        </li>
                        <li>
                            <div class="history-title">2015</div>
                            <div class="history-content" style="display:none;">
                                Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make .
                            </div>
                        </li>
                        <li>
                            <div class="history-title">2018</div>
                            <div class="history-content" style="display:none;">
                                Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make .
                            </div>
                        </li>
                    </ul>
                </div>
                <script type="text/javascript">
                    require([
                        'jquery'
                    ], function ($) {
                        $(document).ready(function(){
                            $(".history-accordion .history-title").off("click").on("click",function(){
                                if(!$(this).parent().hasClass("active")) {
                                    $(this).parent().parent().children("li.active").children(".history-content").slideUp();
                                    $(this).parent().parent().children("li.active").removeClass("active");
                                    $(this).parent().addClass("active");
                                    $(this).parent().children(".history-content").slideDown();
                                } else {
                                    $(this).parent().removeClass("active");
                                    $(this).parent().children(".history-content").slideUp();
                                }
                            });
                        });
                    });
                </script>
            </div>
        </div>
    </div>
</div>
<div class="content-row custom-support" style="padding: 60px 0 30px;">
    <h2 style="margin-bottom: 40px;">OUR FEATURES</h2>
    <div class="row">
        <div class="col-md-4">
            <i class="porto-icon-star" style="border-radius:50%;border:2px solid #7aa93c;color:#7aa93c;background-color:transparent;line-height:58px;font-size:25px;"></i>
            <div class="content">
                <h2>Dedicated Service</h2> 
                <p>Consult our specialists for help<br>with an order, customization,<br>or design advice</p>
            </div>
        </div>
        <div class="col-md-4">
            <i class="porto-icon-reply" style="border-radius:50%;border:2px solid #7aa93c;color:#7aa93c;background-color:transparent;line-height:58px;font-size:25px;"></i>
            <div class="content">
                <h2>Free returns</h2> 
                <p>We stand behind our goods<br>and services and want you to be<br>satisfied with them.</p>
            </div>
        </div>
        <div class="col-md-4">
            <i class="porto-icon-paper-plane" style="border-radius:50%;border:2px solid #7aa93c;color:#7aa93c;background-color:transparent;line-height:58px;font-size:25px;"></i>
            <div class="content">
                <h2>International shipping</h2> 
                <p>Currently over 50 countries<br>qualify for express international<br>shipping.</p>
            </div>
        </div>
    </div>
</div>
<div class="content-row fullwidth-row" style="background-color:#f3f3f3;padding:57px 0;">
    <div class="container">
        <h2 style="margin-bottom:20px;">OUR TEAM</h2>
        <div id="member-slider-about" class="owl-carousel owl-theme">
            <div class="item">
                <div class="team-member">
                    <img src="{{media url="wysiwyg/smartwave/porto/aboutus/3/member-1.jpg"}}" alt="" />
                    <h5>JANE DOE</h5>
                    <span>CEO & FOUNDER</span>
                </div>
            </div>
            <div class="item">
                <div class="team-member">
                    <img src="{{media url="wysiwyg/smartwave/porto/aboutus/3/member-2.jpg"}}" alt="" />
                    <h5>JOHN DOE</h5>
                    <span>DESIGN</span>
                </div>
            </div>
            <div class="item">
                <div class="team-member">
                    <img src="{{media url="wysiwyg/smartwave/porto/aboutus/3/member-3.jpg"}}" alt="" />
                    <h5>GEORGE DOE</h5>
                    <span>MARKETING</span>
                </div>
            </div>
            <div class="item">
                <div class="team-member">
                    <img src="{{media url="wysiwyg/smartwave/porto/aboutus/3/member-4.jpg"}}" alt="" />
                    <h5>ALICE DOE</h5>
                    <span>FINANCIAL</span>
                </div>
            </div>
            <div class="item">
                <div class="team-member">
                    <img src="{{media url="wysiwyg/smartwave/porto/aboutus/3/member-1.jpg"}}" alt="" />
                    <h5>JANE DOE</h5>
                    <span>CEO & FOUNDER</span>
                </div>
            </div>
            <div class="item">
                <div class="team-member">
                    <img src="{{media url="wysiwyg/smartwave/porto/aboutus/3/member-2.jpg"}}" alt="" />
                    <h5>JOHN DOE</h5>
                    <span>DESIGN</span>
                </div>
            </div>
            <div class="item">
                <div class="team-member">
                    <img src="{{media url="wysiwyg/smartwave/porto/aboutus/3/member-3.jpg"}}" alt="" />
                    <h5>GEORGE DOE</h5>
                    <span>MARKETING</span>
                </div>
            </div>
            <div class="item">
                <div class="team-member">
                    <img src="{{media url="wysiwyg/smartwave/porto/aboutus/3/member-4.jpg"}}" alt="" />
                    <h5>ALICE DOE</h5>
                    <span>FINANCIAL</span>
                </div>
            </div>
        </div>
    </div>
    <script>
        require([
            'jquery',
            'owl.carousel/owl.carousel.min'
        ], function ($) {
            $("#member-slider-about").owlCarousel({
                autoplay: true,
                autoplayTimeout: 5000,
                autoplayHoverPause: true,
                margin: 0,
                nav: false,
                dots: true,
                navRewind: true,
                animateIn: 'fadeIn',
                animateOut: 'fadeOut',
                loop: true,
                responsive: {
                    0: {
                        items:2
                    },
                    768: {
                        items:3
                    },
                    992: {
                        items:4
                    },
                    1200: {
                        items:4
                    }
                }
            });
        });
    </script>
</div>
<style type="text/css">
.top-container >.breadcrumbs {
    border-bottom: 1px solid #ececec;
    padding-bottom: 8px;
}
.fullwidth-half-bg {
    width: 100%;
    min-height: 450px;
}
@media (min-width: 992px) {
    .fullwidth-half-bg {
        width: 50%;
        width: calc(50% - 30px);
        height: 100%;
        position: absolute;
        left: 0;
        top: 0;
    }
}
.content-row h2 {
    font-size: 16px;
    font-family: 'Oswald';
    color: #282d3b;
    font-weight: 700;
    line-height: 1;
    margin-bottom: 30px;
}
.history-accordion > ul {
    list-style: none;
    padding: 0;
    margin: 0;
}
.history-accordion .history-title {
    font-family: 'Oswald';
    font-size: 14px;
    font-weight: 700;
    color: #282d3b;
    padding: 15px 0;
    border-bottom: 1px solid #e4e4e4;
    position: relative;
    cursor: pointer;
}
.history-accordion li.active .history-title {
    color: #7aa93c;
    border-color: #7aa93c;
}
.history-accordion .history-title:after {
    content: "\f882";
    font-family: 'porto-icons';
    font-size: 10px;
    line-height: 20px;
    width: 20px;
    text-align: center;
    display: block;
    position: absolute;
    right: 20px;
    top: 16px;
    color: #7f8284;
}
.history-accordion li.active .history-title:after {
    color: #7aa93c;
    content: "\f883";
}
.history-accordion .history-content {
    font-size: 14px;
    font-weight: 400;
    line-height: 2;
    color: #4a505e;
    padding: 20px 0;
}
.custom-support div.content {
    padding-bottom: 20px;
    margin-left: 90px;
}
.custom-support div.content>h2 {
    font-family: 'Open Sans';
    font-size: 15px;
    font-weight: 700;
    color:#2b2b2d;
    text-transform: uppercase;
    line-height: 22px;
    margin-bottom: 4px;
}
.custom-support div.content>p {
    font-size: 14px;
    color: #4a505e;
    letter-spacing: 0.01em;
    line-height: 27px;
}
.team-member span {
    display: block;
    font-size: 14px;
    color: #8c8e94;
    margin-bottom: 10px;
}
.team-member h5 {
    font-size: 14px;
    font-weight: 700;
    color: #282d3b;
    margin: 25px 0 5px;
}
.team-member img {
    width: 160px;
    height: 160px;
    border-radius: 50%;
}
.team-member {
    background-color: #fff;
    padding: 25px 0;
    text-align: center;
}
#member-slider-about {
    margin: 0 -15px;
}
#member-slider-about .item {
    padding: 15px;
}
#member-slider-about .owl-dots .owl-dot.active span, #member-slider-about .owl-dots .owl-dot:hover span {
    background-color: #696969;
}
#member-slider-about .owl-dots .owl-dot span {
    background-color: #d1d1d1;
    width: 12px;
    height: 12px;
    margin: 5px;
}
.page-main, .columns .column.main {
    padding-bottom: 0;
}
#member-slider-about .owl-item img {
    display: inline-block
}
</style>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[<referenceContainer name="page.top">
    <block class="Magento\Cms\Block\Block" name="top_banner">
        <arguments>
            <argument name="block_id" xsi:type="string">porto_about_us_9_top_block</argument>
        </arguments>
    </block>
</referenceContainer>]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - About Us 13</title>
         <identifier>about-porto-13</identifier>
         <content><![CDATA[<div class="content-row" style="padding-bottom:75px;">
    <div class="row">
        <div class="col-xl-5">
            <img src="{{media url="wysiwyg/smartwave/porto/aboutus/13/history.jpg"}}" style="width: 100%;padding-right: 40px;" alt="" />
        </div>
        <div class="col-xl-7">
            <h2 style="text-align:left;margin-bottom:20px;margin-top: 30px;">OUR HISTORY</h2>
            <div class="row">
                <div class="col-md-6">
                    <p style="padding-right: 60px;margin-bottom: 30px;">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only  five centuries It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus </p>
                </div>
                <div class="col-md-6">
                    <p style="padding-right: 60px;margin-bottom: 30px;">Been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only  five centuries It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus.</p>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="content-row" style="background-color: #e0e2e3;padding-top:75px;padding-bottom:75px;">
    <h2>OUR SPECIAL FEATURES<em>Lorem ipsum is simply dummy text</em></h2>
    <div class="support-block row">
        <div class="col-xl-3 col-lg-6">
            <div class="support-item">
                <i class="porto-icon-support"></i>
                <h3>ONLINE SUPPORT</h3>
                <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's </p>
            </div>
        </div>
        <div class="col-xl-3 col-lg-6">
            <div class="support-item">
                <i class="porto-icon-shipping"></i>
                <h3>FREE SHIPPING & RETURN</h3>
                <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's </p>
            </div>
        </div>
        <div class="col-xl-3 col-lg-6">
            <div class="support-item">
                <i class="porto-icon-money"></i>
                <h3>MONEY BACK GUARANTEE</h3>
                <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's </p>
            </div>
        </div>
        <div class="col-xl-3 col-lg-6">
            <div class="support-item">
                <i class="porto-icon-shirt"></i>
                <h3>NEW STYLES EVERY DAY</h3>
                <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's </p>
            </div>
        </div>
    </div>
</div>
<div class="content-row" style="padding-bottom:75px;padding-top:75px;">
    <h2 style="margin-bottom:15px;">OUR TEAM<em>Lorem ipsum is simply dummy text</em></h2>
    <div class="row">
        <div class="col-lg-2 col-md-4 col-sm-6">
            <div class="team-member">
                <img src="{{media url="wysiwyg/smartwave/porto/aboutus/13/member1.jpg"}}" style="width: 100%;" alt="" />
                <div class="member-detail">JOHN DOE</div>
            </div>
        </div>
        <div class="col-lg-2 col-md-4 col-sm-6">
            <div class="team-member">
                <img src="{{media url="wysiwyg/smartwave/porto/aboutus/13/member2.jpg"}}" style="width: 100%;" alt="" />
                <div class="member-detail">JOSIE DOE</div>
            </div>
        </div>
        <div class="col-lg-2 col-md-4 col-sm-6">
            <div class="team-member">
                <img src="{{media url="wysiwyg/smartwave/porto/aboutus/13/member3.jpg"}}" style="width: 100%;" alt="" />
                <div class="member-detail">BOB DOE</div>
            </div>
        </div>
        <div class="col-lg-2 col-md-4 col-sm-6">
            <div class="team-member">
                <img src="{{media url="wysiwyg/smartwave/porto/aboutus/13/member4.jpg"}}" style="width: 100%;" alt="" />
                <div class="member-detail">HENRY DOE</div>
            </div>
        </div>
        <div class="col-lg-2 col-md-4 col-sm-6">
            <div class="team-member">
                <img src="{{media url="wysiwyg/smartwave/porto/aboutus/13/member5.jpg"}}" style="width: 100%;" alt="" />
                <div class="member-detail">AMANDA DOE</div>
            </div>
        </div>
        <div class="col-lg-2 col-md-4 col-sm-6">
            <div class="team-member">
                <img src="{{media url="wysiwyg/smartwave/porto/aboutus/13/member6.jpg"}}" style="width: 100%;" alt="" />
                <div class="member-detail">GREG DOE</div>
            </div>
        </div>
    </div>
</div>
<div class="content-row" style="padding-top:75px;padding-bottom:75px;">
    <h2>TESTIMONIALS<em>What our client says about us</em></h2>
    <div id="testimonials-slider" class="owl-carousel owl-theme">
        <div class="item">
            <blockquote class="testimonial">
                <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled.</p>
            </blockquote> 
            <div class="testimonial-author">
                <div class="img-thumbnail img-thumbnail-small"><img width="60" height="60" src="{{media url="wysiwyg/smartwave/porto/aboutus/4/client1.png"}}" alt=""/></div>
                <p><strong>JOHN DOE</strong><span>SEO</span></p>
            </div>
        </div>
        <div class="item">
            <blockquote class="testimonial">
                <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled.</p>
            </blockquote> 
            <div class="testimonial-author">
                <div class="img-thumbnail img-thumbnail-small"><img width="60" height="60" src="{{media url="wysiwyg/smartwave/porto/aboutus/4/client2.png"}}" alt=""/></div>
                <p><strong>BRENDA DOE</strong><span>Founder</span></p>
            </div>
        </div>
    </div>
    <script type="text/javascript">
    require([
        'jquery',
        'owl.carousel/owl.carousel.min'
    ], function ($) {
        $("#testimonials-slider").owlCarousel({
            autoplay: true,
            autoplayTimeout: 5000,
            autoplayHoverPause: true,
            margin: 0,
            nav: false,
            dots: false,
            navRewind: true,
            animateIn: 'fadeIn',
            animateOut: 'fadeOut',
            loop: true,
            responsive: {
                0: {
                    items:1
                },
                768: {
                    items:2
                },
                992: {
                    items:2
                },
                1200: {
                    items:2
                }
            }
        });
    });
    </script>
</div>
<style type="text/css">
.columns .column.main {
    padding: 0;
}
.content-row {
    padding: 0 15px;
}
.row {
    margin: 0 -6px;
}
.row > [class*="col-"], .row > [class^="col-"] {
    padding-left: 6px;
    padding-right: 6px;
}
@media(min-width: 768px) {
    .top-container >.breadcrumbs > .container, .content-row {
        padding: 0 25px;
    }
}
.content-row h2 {
    font-size: 24px;
    font-family: 'Oswald';
    color: #141a1f;
    margin-bottom: 25px;
    text-align: center;
}
.content-row h2 em {
    font-family: 'Poppins';
    font-weight: 400;
    font-style: normal;
    font-size: 15px;
    color: #646a70;
    display: block;
    line-height: 2;
}
.content-row p {
    font-family: 'Poppins';
    font-weight: 400;
    font-size: 15px;
    color: #646a70;
    line-height: 1.8;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 8;
    overflow: hidden;
}
@media(max-width: 1600px) {
.content-row p {
    -webkit-line-clamp: 5;
}
}
@media(max-width: 1199px) {
.content-row p {
    display: block;
}
}
.support-block .support-item {
    padding: 35px 70px 50px 30px;
    line-height: 1.4;
    background-color: #fff;
    margin-bottom: 12px;
}
.support-block .support-item:after {
    content: '';
    display: table;
    clear: both;
}
.support-block .support-item > i {
    font-size: 50px;
    color: #141a1f;
    float: left;
    margin: 0 15px 0 0;
}
.support-block .support-item > h3 {
    color: #141a1f;
    font-family: 'Poppins';
    font-size: 18px;
    font-weight: 500;
    margin: 10px 0;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}
.support-block .support-item > p {
    margin: 0;
    font-size: 15px;
    font-weight: 400;
    color: #646a70;
    line-height: 1.8;
    margin-left: 85px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    max-height: 81px;
}
.team-member .member-detail {
    font-family: 'Oswald';
    font-size: 16px;
    font-weight: 400;
    color: #fff;
    line-height: 1;
    position: absolute;
    left: 32px;
    bottom: 35px;
}
.team-member {
    position: relative;
    margin-bottom: 12px;
}
blockquote.testimonial {
    border: 0;
    background-color: transparent !important;
    color: #62615e;
    font-size: 14px;
    font-style: normal;
    line-height: 24px;
    font-weight: 400;
    font-family: 'Open Sans';
    margin: 0;
    padding: 15px 70px 15px 50px;
    margin-top: 5px;
    position: relative;
}
blockquote.testimonial p {
    line-height: 1.8;
    margin: 0;
}
blockquote.testimonial:before {
    left: 10px;
    top: 0;
    content: "\201C";
    font-style: normal;
    line-height: 1;
    position: absolute;
    color: #141a1f;
    font-family: 'porto';
    font-weight: 400;
    font-size: 54px;
}
blockquote.testimonial:after {
    right: 30px;
    bottom: 0;
    content: "\201D";
    font-style: normal;
    line-height: 1;
    position: absolute;
    color: #141a1f;
    font-family: 'porto';
    font-weight: 400;
    font-size: 54px;
    transform: rotateX(180deg);
}
.testimonial-arrow-down {
    border:15px solid transparent;
    border-top-color:#ee3d43;
    border-bottom:0;
    height:0;
    margin:0 0 0 25px;
    width:0;
}
.testimonial-author {
    margin: 30px 0 0 0;
    padding-left: 50px;
}
.testimonial-author .img-thumbnail {
    float: left;
    margin-right: 25px;
    position: relative;
    line-height: 1.5;
    background-color: #fff;
    display: inline-block;
    max-width: 100%;
    height: auto;
    border-radius: 50% !important;
}
.testimonial-author .img-thumbnail img {
    max-width:60px;
    display:inline-block;
    height:auto;
}
.testimonial-author p {
    color:#666;
    margin:0 0 0 25px;
    text-align:left;
    line-height:24px;
    text-transform: uppercase;
}
.testimonial-author p >strong {
    color: #303539;
    display: block;
    padding-top: 7px;
    font-size: 16px;
    font-family: 'Oswald';
    font-weight: 400;
}
.testimonial-author span {
    color: #646a70;
    display: block;
    font-size: 15px;
    font-family: 'Poppins';
    text-transform: none;
}
.page-wrapper > .breadcrumbs {
    margin: 0;
}
.page-main {
    max-width: 100%;
    padding: 0;
}
@media (min-width:1200px) {
    body.layout-fullwidth .page-wrapper > .breadcrumbs .items {
        padding-left: 25px;
        padding-right: 25px;
    }
}
</style>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[<referenceContainer name="page.top">
    <block class="Magento\Cms\Block\Block" name="top_banner">
        <arguments>
            <argument name="block_id" xsi:type="string">porto_about_us_13_top_block</argument>
        </arguments>
    </block>
</referenceContainer>]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - About Us 15</title>
         <identifier>about-porto-15</identifier>
         <content><![CDATA[<div style="background:url({{media url="wysiwyg/smartwave/porto/aboutus/15/top-bg.jpg"}}) bottom no-repeat;background-size: cover;text-align: left;padding: 190px 0 180px;">
    <div class="container">
        <em style="font-family:'Oswald';font-size:24px;font-weight:300;color:#161616;font-style: normal;line-height:1;display:block;margin-bottom:5px;padding-left:50px;">CHECK OUR</em>
        <h2 style="font-family:'Open Sans';font-size:34px;font-weight:800;color:#161616;font-style:normal;line-height:1;margin:0;padding-left:50px;">HISTORY</h2>
    </div>
</div>
<div class="content-row" style="background-color:#f4f4f2;padding-top:95px;padding-bottom:90px;">
    <div class="container">
        <h2 style="text-align:center;"><em>WHAT WE ARE</em>ABOUT US</h2>
        <p style="max-width:760px;margin:0 auto;text-align:center;">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages</p>
    </div>
</div>
<div class="content-row" style="background:url({{media url="wysiwyg/smartwave/porto/aboutus/15/middle-bg.jpg"}}) 30% top no-repeat;background-size:cover;padding-top:100px;padding-bottom:50px;">
    <div class="container">
        <div class="row">
            <div class="col-lg-7 offset-lg-5">
                <h2><em>SPECIALITY</em>WHY CHOOSE US</h2>
                <div class="support-block row">
                    <div class="col-lg-6">
                        <div class="support-item">
                            <i class="porto-icon-support"></i>
                            <h3>ONLINE SUPPORT</h3>
                            <p>Lorem Ipsum is simply dummy text of the printing and typesetting. industry.</p>
                        </div>
                    </div>
                    <div class="col-lg-6">
                        <div class="support-item">
                            <i class="porto-icon-shipping"></i>
                            <h3>FREE SHIPPING &amp; RETURN</h3>
                            <p>Lorem Ipsum is simply dummy text of the printing and typesetting. industry.</p>
                        </div>
                    </div>
                    <div class="col-lg-6">
                        <div class="support-item">
                            <i class="porto-icon-money"></i>
                            <h3>MONEY BACK GUARANTEE</h3>
                            <p>Lorem Ipsum is simply dummy text of the printing and typesetting. industry.</p>
                        </div>
                    </div>
                    <div class="col-lg-6">
                        <div class="support-item">
                            <i class="porto-icon-shirt"></i>
                            <h3>NEW STYLES EVERY DAY</h3>
                            <p>Lorem Ipsum is simply dummy text of the printing and typesetting. industry.</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="content-row" style="background-color:#f4f4f2;padding-top:95px;padding-bottom:90px;">
    <div class="container">
        <div class="row">
            <div class="col-lg-3">
                <h2 style="margin-top:35px;"><em>OUR</em>TEAM</h2>
                <p style="max-width:235px;">Lorem Ipsum is simply dummy text of the printing and Lorem typesetting industry looking Ipsum has been.</p>
            </div>
            <div class="col-lg-9">
                <div id="member-slider-about" class="owl-carousel owl-theme">
                    <div class="item">
                        <div class="team-member">
                            <img src="{{media url="wysiwyg/smartwave/porto/aboutus/3/member-1.jpg"}}" alt="">
                            <h5>JANE DOE</h5>
                        </div>
                    </div>
                    <div class="item">
                        <div class="team-member">
                            <img src="{{media url="wysiwyg/smartwave/porto/aboutus/3/member-2.jpg"}}" alt="">
                            <h5>JOHN DOE</h5>
                        </div>
                    </div>
                    <div class="item">
                        <div class="team-member">
                            <img src="{{media url="wysiwyg/smartwave/porto/aboutus/3/member-3.jpg"}}" alt="">
                            <h5>GEORGE DOE</h5>
                        </div>
                    </div>
                    <div class="item">
                        <div class="team-member">
                            <img src="{{media url="wysiwyg/smartwave/porto/aboutus/3/member-4.jpg"}}" alt="">
                            <h5>ALICE DOE</h5>
                        </div>
                    </div>
                </div>
                <script type="text/javascript">
                require([
                    'jquery',
                    'owl.carousel/owl.carousel.min'
                ], function ($) {
                    $("#member-slider-about").owlCarousel({
                        autoplay: true,
                        autoplayTimeout: 5000,
                        autoplayHoverPause: true,
                        margin: 0,
                        nav: false,
                        dots: false,
                        navRewind: true,
                        loop: true,
                        navText: ["<em class='porto-icon-left-open-big'></em>","<em class='porto-icon-right-open-big'></em>"],
                        responsive: {
                            0: {
                                items:1
                            },
                            768: {
                                items:2
                            },
                            992: {
                                items:3
                            },
                            1200: {
                                items:3
                            }
                        }
                    });
                });
                </script>
            </div>
        </div>
    </div>
</div>
<style type="text/css">
.page-header.type17 {
    position: absolute;
    background-color: transparent;
    width: 100%;
}
.page-wrapper > .breadcrumbs {
    display: none;
}
.columns .column.main {
    padding: 0;
}
.page-main {
    max-width: 100%;
    padding: 0;
}
.content-row h2 em {
    display: block;
    font-size: 26px;
    font-weight: 300;
    font-style: normal;
    margin-bottom: 5px;
}
.content-row h2 {
    font-size: 44px;
    color: #161616;
    font-family: 'Oswald';
    font-weight: 400;
    line-height: 1;
    margin-bottom: 35px;
}
.content-row p {
    font-family: 'Poppins';
    font-size: 14px;
    line-height: 2;
    color: #282d3b;
}
.support-block .support-item {
    line-height: 1.4;
    margin-bottom: 50px;
}
.support-block .support-item:after {
    content: '';
    display: table;
    clear: both;
}
.support-block .support-item > i {
    font-size: 44px;
    color: #53514e;
    float: left;
    margin: -5px 15px 0 -10px;
}
.support-block .support-item > h3 {
    color: #141a1f;
    font-family: 'Poppins';
    font-size: 18px;
    font-weight: 500;
    margin: 10px 0;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}
.support-block .support-item > p {
    margin: 0;
    font-size: 15px;
    font-weight: 400;
    color: #646a70;
    line-height: 1.8;
    margin-left: 68px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    max-height: 81px;
}
.team-member {
    background-color: #fff;
}
.team-member img {
    width: 100%;
    display: block;
}
.team-member h5 {
    padding: 30px 0;
    text-align: center;
    font-family: 'Oswald';
    font-size: 16px;
    line-height: 1;
    color: #111;
    font-weight: 400;
    margin: 0;
}
#member-slider-about .item {
    padding: 0 15px;
}
#member-slider-about {
    margin: 0 -15px;
}
</style>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - About Us 18</title>
         <identifier>about-porto-18</identifier>
         <content><![CDATA[<div class="content-row" style="padding-top:55px;padding-bottom:80px;">
    <div class="row">
        <div class="col-xl-4">
            <h2>ABOUT US</h2>
            <h4>Lorem Ipsum is simply dummy text of the printing and typesetting industry. has been the industry's</h4>
            <p>long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English.</p>
        </div>
        <div class="col-xl-8">
            <div class="row">
                <div class="col-md-5">
                    <img src="{{media url="wysiwyg/smartwave/porto/aboutus/18/aboutus.jpg"}}" alt="" style="width:95%;display:block;margin:25px auto;" />
                </div>
                <div class="col-md-7">
                    <div class="history-accordion">
                        <ul>
                            <li class="active">
                                <div class="history-title">Company History</div>
                                <div class="history-content" style="display: block;">
                                    leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop.
                                </div>
                            </li>
                            <li class="">
                                <div class="history-title">Our Vision</div>
                                <div class="history-content" style="display: none;">
                                    leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop.
                                </div>
                            </li>
                            <li class="">
                                <div class="history-title">Our Mission</div>
                                <div class="history-content" style="display: none;">
                                    leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop.
                                </div>
                            </li>
                            <li class="">
                                <div class="history-title">Funfacts</div>
                                <div class="history-content" style="display: none;">
                                    leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop.
                                </div>
                            </li>
                        </ul>
                    </div>
                    <script type="text/javascript">
                    require([
                        'jquery',
                        'owl.carousel/owl.carousel.min'
                    ], function ($) {
                        $(document).ready(function(){
                            $(".history-accordion .history-title").off("click").on("click",function(){
                                if(!$(this).parent().hasClass("active")) {
                                    $(this).parent().parent().children("li.active").children(".history-content").slideUp();
                                    $(this).parent().parent().children("li.active").removeClass("active");
                                    $(this).parent().addClass("active");
                                    $(this).parent().children(".history-content").slideDown();
                                } else {
                                    $(this).parent().removeClass("active");
                                    $(this).parent().children(".history-content").slideUp();
                                }
                            });
                        });
                    });
                    </script>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="content-row fullwidth-row" style="background-color:#efefef;padding:80px 0;">
    <div class="container">
        <h2 style="margin-bottom:40px;">OUR TEAM</h2>
        <div class="row">
            <div class="col-md-3 col-sm-6">
                <div class="team-member">
                    <img src="{{media url="wysiwyg/smartwave/porto/aboutus/3/member-1.jpg"}}" alt="">
                    <h5>JANE DOE</h5>
                </div>
            </div>
            <div class="col-md-3 col-sm-6">
                <div class="team-member">
                    <img src="{{media url="wysiwyg/smartwave/porto/aboutus/3/member-2.jpg"}}" alt="">
                    <h5>JOHN DOE</h5>
                </div>
            </div>
            <div class="col-md-3 col-sm-6">
                <div class="team-member">
                    <img src="{{media url="wysiwyg/smartwave/porto/aboutus/3/member-3.jpg"}}" alt="">
                    <h5>GEORGE DOE</h5>
                </div>
            </div>
            <div class="col-md-3 col-sm-6">
                <div class="team-member">
                    <img src="{{media url="wysiwyg/smartwave/porto/aboutus/3/member-4.jpg"}}" alt="">
                    <h5>ALICE DOE</h5>
                </div>
            </div>
        </div>
        <button class="btn" style="font-family: 'Oswald';font-weight: 400;font-size: 14px;color: #fff;background-color: #515151;padding: 10px 20px;border-radius: 3px;display: block;margin: 0 auto;margin-top:50px;border: 0;line-height: 1.5;height: auto;">JOIN OUR TEAM</button>
    </div>
</div>
<div class="content-row" style="padding-top:75px;padding-bottom:75px;text-align:center;">
    <h2>TESTIMONIALS</h2>
    <div id="testimonials-slider" class="owl-carousel owl-theme">
        <div class="item">
            <blockquote class="testimonial">
                <p>Long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here</p>
            </blockquote> 
            <div class="testimonial-author">
                <div class="img-thumbnail img-thumbnail-small"><img width="60" height="60" src="{{media url="wysiwyg/smartwave/porto/aboutus/4/client1.png"}}" alt=""/></div>
                <p><strong>John Doe</strong><span>Porto SEO</span></p>
            </div>
        </div>
        <div class="item">
            <blockquote class="testimonial">
                <p>Long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here</p>
            </blockquote> 
            <div class="testimonial-author">
                <div class="img-thumbnail img-thumbnail-small"><img width="60" height="60" src="{{media url="wysiwyg/smartwave/porto/aboutus/4/client2.png"}}" alt=""/></div>
                <p><strong>Brenda DOE</strong><span>Porto Founder</span></p>
            </div>
        </div>
    </div>
    <script type="text/javascript">
    require([
        'jquery',
        'owl.carousel/owl.carousel.min'
    ], function ($) {
        $("#testimonials-slider").owlCarousel({
            items: 1,
            autoplay: true,
            autoplayTimeout: 5000,
            autoplayHoverPause: true,
            margin: 0,
            nav: false,
            dots: false,
            navRewind: true,
            loop: true,
            navText: ["<em class='porto-icon-left-open-big'></em>","<em class='porto-icon-right-open-big'></em>"]
        });
    });
    </script>
</div>
<style type="text/css">
.page-wrapper >.breadcrumbs {
    display: none;
}
.content-row h2 {
    font-family: 'Oswald';
    font-size: 24px;
    font-weight: 400;
    line-height: 1;
    color: #141a1f;
    margin-bottom: 25px;
}
.content-row h4 {
    font-family: 'Poppins';
    font-size: 18px;
    font-weight: 400;
    line-height: 1.8;
    color: #282d3b;
    margin-bottom: 30px;
}
.content-row p {
    font-family: 'Poppins';
    font-size: 14px;
    font-weight: 400;
    line-height: 2;
    color: #5e6065;
    margin-bottom: 0;   
}
@media (min-width: 1200px) {
    .col-xl-4 {
        -webkit-flex: 0 0 37.5%;
        -moz-flex: 0 0 37.5%;
        -ms-flex: 0 0 37.5%;
        flex: 0 0 37.5%;
        max-width: 37.5%;
    }
    .col-xl-8 {
        -webkit-flex: 0 0 62.5%;
        -moz-flex: 0 0 62.5%;
        -ms-flex: 0 0 62.5%;
        flex: 0 0 62.5%;
        max-width: 62.5%;
    }
}
.history-accordion > ul {
    list-style: none;
    padding: 0;
    margin: 0;
}
.history-accordion li {
    margin: 0;
}
.history-accordion .history-title {
    font-family: 'Poppins';
    font-size: 18px;
    font-weight: 500;
    color: #282d3b;
    padding: 15px 0;
    position: relative;
    cursor: pointer;
}
.history-accordion .history-title:after {
    content: "\f882";
    font-family: 'porto-icons';
    font-size: 8px;
    line-height: 16px;
    width: 16px;
    text-align: center;
    display: block;
    position: absolute;
    right: 0;
    top: 17px;
    color: #fff;
    background-color: #929292;
    border-radius: 50%;
}
.history-accordion li.active .history-title:after {
    background-color: #282d3b;
    content: "\f883";
}
.history-accordion .history-content {
    font-family: 'Poppins';
    font-size: 14px;
    font-weight: 400;
    line-height: 2;
    color: #5e6065;
    padding: 20px 0;
}
.team-member {
    background-color: #fff;
}
.team-member img {
    width: 100%;
    display: block;
}
.team-member h5 {
    padding: 30px 0;
    text-align: center;
    font-family: 'Oswald';
    font-size: 16px;
    line-height: 1;
    color: #111;
    font-weight: 400;
    margin: 0;
}
blockquote.testimonial {
    border: 0;
    background-color: transparent !important;
    margin: 0;
    padding: 15px 50px 15px 30px;
    position: relative;
    max-width: 650px;
    margin: 0 auto;
}
blockquote.testimonial p {
    line-height: 2;
    margin: 0;
    font-size: 16px;
}
blockquote.testimonial:before {
    left: 10px;
    top: 0;
    content: "\201C";
    font-style: normal;
    line-height: 1;
    position: absolute;
    color: #141a1f;
    font-family: 'porto';
    font-weight: 400;
    font-size: 30px;
}
blockquote.testimonial:after {
    right: 30px;
    bottom: 0;
    content: "\201D";
    font-style: normal;
    line-height: 1;
    position: absolute;
    color: #141a1f;
    font-family: 'porto';
    font-weight: 400;
    font-size: 30px;
    transform: rotateX(180deg);
}
.testimonial-arrow-down {
    border:15px solid transparent;
    border-top-color:#ee3d43;
    border-bottom:0;
    height:0;
    margin:0 0 0 25px;
    width:0;
}
.testimonial-author {
    margin: 30px 0 0 0;
}
.testimonial-author .img-thumbnail {
    position: relative;
    line-height: 1.5;
    background-color: #fff;
    display: inline-block;
    max-width: 100%;
    height: auto;
    border-radius: 50% !important;
}
.testimonial-author .img-thumbnail img {
    max-width:60px;
    display:inline-block;
    height:auto;
}
.testimonial-author p {
    color:#666;
    line-height:24px;
}
.testimonial-author p >strong {
    color: #282d3b;
    display: block;
    padding-top: 20px;
    font-size: 18px;
    font-family: 'Poppins';
    font-weight: 500;
}
.testimonial-author span {
    color: #5e6065;
    display: block;
    font-size: 14px;
    font-family: 'Poppins';
    text-transform: none;
}
.page-main, .columns .column.main {
    padding-top: 0;
    padding-bottom: 0;
}
</style>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[<referenceContainer name="page.top">
    <block class="Magento\Cms\Block\Block" name="top_banner">
        <arguments>
            <argument name="block_id" xsi:type="string">porto_about_us_18_top_block</argument>
        </arguments>
    </block>
</referenceContainer>]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - About Us 19</title>
         <identifier>about-porto-19</identifier>
         <content><![CDATA[<div class="content-row" style="padding-top:55px;">
    <img src="{{media url="wysiwyg/smartwave/porto/aboutus/19/top-bg.jpg"}}" style="width: 100%;" alt="" />
</div>
<div class="content-row" style="padding-top:60px;padding-bottom:65px;border-bottom:1px solid #e2e2e2;">
    <h2>ABOUT US</h2>
    <p style="max-width:964px;margin:0 auto;">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages</p>
</div>
<div class="content-row" style="padding-top:77px;padding-bottom:85px;">
    <h2 style="margin-bottom:45px;">OUR TEAM</h2>
    <div id="member-slider-about" class="owl-carousel owl-theme">
        <div class="item">
            <div class="team-member">
                <img src="{{media url="wysiwyg/smartwave/porto/aboutus/3/member-1.jpg"}}" alt="">
                <h5>JANE DOE</h5>
            </div>
        </div>
        <div class="item">
            <div class="team-member">
                <img src="{{media url="wysiwyg/smartwave/porto/aboutus/3/member-2.jpg"}}" alt="">
                <h5>JOHN DOE</h5>
            </div>
        </div>
        <div class="item">
            <div class="team-member">
                <img src="{{media url="wysiwyg/smartwave/porto/aboutus/3/member-3.jpg"}}" alt="">
                <h5>GEORGE DOE</h5>
            </div>
        </div>
        <div class="item">
            <div class="team-member">
                <img src="{{media url="wysiwyg/smartwave/porto/aboutus/3/member-4.jpg"}}" alt="">
                <h5>ALICE DOE</h5>
            </div>
        </div>
        <div class="item">
            <div class="team-member">
                <img src="{{media url="wysiwyg/smartwave/porto/aboutus/3/member-1.jpg"}}" alt="">
                <h5>JANE DOE</h5>
            </div>
        </div>
        <div class="item">
            <div class="team-member">
                <img src="{{media url="wysiwyg/smartwave/porto/aboutus/3/member-2.jpg"}}" alt="">
                <h5>JOHN DOE</h5>
            </div>
        </div>
        <div class="item">
            <div class="team-member">
                <img src="{{media url="wysiwyg/smartwave/porto/aboutus/3/member-3.jpg"}}" alt="">
                <h5>GEORGE DOE</h5>
            </div>
        </div>
        <div class="item">
            <div class="team-member">
                <img src="{{media url="wysiwyg/smartwave/porto/aboutus/3/member-4.jpg"}}" alt="">
                <h5>ALICE DOE</h5>
            </div>
        </div>
    </div>
    <script type="text/javascript">
    require([
        'jquery',
        'owl.carousel/owl.carousel.min'
    ], function ($) {
        $("#member-slider-about").owlCarousel({
            autoplay: true,
            autoplayTimeout: 5000,
            autoplayHoverPause: true,
            margin: 0,
            nav: false,
            dots: false,
            navRewind: true,
            loop: true,
            navText: ["<em class='porto-icon-left-open-big'></em>","<em class='porto-icon-right-open-big'></em>"],
            responsive: {
                0: {
                    items:2
                },
                768: {
                    items:3
                },
                992: {
                    items:4
                },
                1200: {
                    items:5
                }
            }
        });
    });
    </script>
</div>
<div class="content-row" style="padding:75px 100px;background-color:#ededed;">
    <h2 style="text-align: center;margin-bottom: 40px;">HAPPY BUYERS</h2>
    <div id="testimonials-slider" class="owl-carousel owl-theme">
        <div class="item">
            <div class="testimonial-author">
                <div class="img-thumbnail img-thumbnail-small"><img width="60" height="60" src="{{media url="wysiwyg/smartwave/porto/aboutus/4/client1.png"}}" alt=""/></div>
            </div>
            <blockquote class="testimonial">
                <p>Remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software.</p>
                <p class="testimonial-author-detail"><strong>John Smith Doe</strong><span>CEO</span></p>
            </blockquote> 
        </div>
        <div class="item">
            <div class="testimonial-author">
                <div class="img-thumbnail img-thumbnail-small"><img width="60" height="60" src="{{media url="wysiwyg/smartwave/porto/aboutus/4/client2.png"}}" alt=""/></div>
            </div>
            <blockquote class="testimonial">
                <p>Remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software.</p>
                <p class="testimonial-author-detail"><strong>Bob Smith Doe</strong><span>Founder</span></p>
            </blockquote> 
        </div>
    </div>
    <script type="text/javascript">
    require([
        'jquery',
        'owl.carousel/owl.carousel.min'
    ], function ($) {
        $("#testimonials-slider").owlCarousel({
            autoplay: true,
            autoplayTimeout: 5000,
            autoplayHoverPause: true,
            margin: 0,
            nav: false,
            dots: false,
            navRewind: true,
            loop: true,
            navText: ["<em class='porto-icon-left-open-big'></em>","<em class='porto-icon-right-open-big'></em>"],
            responsive: {
                0: {
                    items:1
                },
                768: {
                    items:1
                },
                992: {
                    items:1
                },
                1200: {
                    items:2
                }
            }
        });
    });
    </script>
</div>
<div class="content-row" style="padding:75px 0 0;margin-bottom:-30px;">
    <h2 style="text-align: center;margin-bottom: 25px;">OUR PARTNERS</h2>
    <div class="owl-side-narrow">
        <div id="brands-slider-about" class="owl-carousel owl-theme">
            <div class="item" style="padding:10px 0;text-align:center;">
                <img class="lazyOwl" alt="" src="{{media url="wysiwyg/smartwave/porto/aboutus/7/brand1.png"}}"/>
            </div>
            <div class="item" style="padding:10px 0;text-align:center;">
                <img class="lazyOwl" alt="" src="{{media url="wysiwyg/smartwave/porto/aboutus/7/brand2.png"}}"/>
            </div>
            <div class="item" style="padding:10px 0;text-align:center;">
                <img class="lazyOwl" alt="" src="{{media url="wysiwyg/smartwave/porto/aboutus/7/brand3.png"}}"/>
            </div>
            <div class="item" style="padding:10px 0;text-align:center;">
                <img class="lazyOwl" alt="" src="{{media url="wysiwyg/smartwave/porto/aboutus/7/brand4.png"}}"/>
            </div>
            <div class="item" style="padding:10px 0;text-align:center;">
                <img class="lazyOwl" alt="" src="{{media url="wysiwyg/smartwave/porto/aboutus/7/brand5.png"}}"/>
            </div>
            <div class="item" style="padding:10px 0;text-align:center;">
                <img class="lazyOwl" alt="" src="{{media url="wysiwyg/smartwave/porto/aboutus/7/brand1.png"}}"/>
            </div>
            <div class="item" style="padding:10px 0;text-align:center;">
                <img class="lazyOwl" alt="" src="{{media url="wysiwyg/smartwave/porto/aboutus/7/brand2.png"}}"/>
            </div>
            <div class="item" style="padding:10px 0;text-align:center;">
                <img class="lazyOwl" alt="" src="{{media url="wysiwyg/smartwave/porto/aboutus/7/brand3.png"}}"/>
            </div>
            <div class="item" style="padding:10px 0;text-align:center;">
                <img class="lazyOwl" alt="" src="{{media url="wysiwyg/smartwave/porto/aboutus/7/brand4.png"}}"/>
            </div>
            <div class="item" style="padding:10px 0;text-align:center;">
                <img class="lazyOwl" alt="" src="{{media url="wysiwyg/smartwave/porto/aboutus/7/brand5.png"}}"/>
            </div>
        </div>
        <script type="text/javascript">
        require([
            'jquery',
            'owl.carousel/owl.carousel.min'
        ], function ($) {
            $("#brands-slider-about").owlCarousel({
                autoplay: true,
                autoplayTimeout: 5000,
                autoplayHoverPause: true,
                margin: 0,
                nav: true,
                dots: false,
                navRewind: true,
                loop: true,
                navText: ["<em class='porto-icon-left-open-big'></em>","<em class='porto-icon-right-open-big'></em>"],
                responsive: {
                    0: {
                        items:2
                    },
                    768: {
                        items:3
                    },
                    992: {
                        items:4
                    },
                    1200: {
                        items:5
                    }
                }
            });
        });
        </script>
    </div>
</div>
<style type="text/css">
@media (min-width: 768px) {
    #maincontent.onepage-category {
        padding-top: 20px;
    }
}
.page-wrapper > .breadcrumbs {
    margin: 0;
}
.content-row h2 {
    font-family: 'Oswald';
    font-size: 26px;
    font-weight: 400;
    line-height: 1;
    color: #000;
    margin-bottom: 25px;
    text-align: center;
}
.content-row p {
    font-family: 'Poppins';
    font-size: 14px;
    font-weight: 400;
    line-height: 2;
    color: #555;
    margin: 0;
    text-align: center;
}
.team-member {
    background-color: #fff;
}
.team-member img {
    width: 100%;
    display: block;
}
.team-member h5 {
    padding: 30px 0;
    text-align: center;
    font-family: 'Oswald';
    font-size: 16px;
    line-height: 1;
    color: #111;
    font-weight: 400;
    margin: 0;
}
#member-slider-about .item {
    padding: 0 15px;
}
#member-slider-about {
    margin: 0 -15px;
}
blockquote.testimonial {
    border: 0;
    background-color: transparent !important;
    color: #62615e;
    font-size: 14px;
    font-style: normal;
    line-height: 24px;
    font-weight: 400;
    font-family: 'Open Sans';
    margin: 0;
    padding: 0 65px 0 0;
    position: relative;
    margin-left: 70px;
}
blockquote.testimonial p {
    line-height: 2;
    text-align: left;
    color: #555;
    font-family: "Poppins";
}
blockquote.testimonial:before {
    content: '"';
    font-style: normal;
    line-height: 1;
    color: #21293c;
    font-family: 'Open Sans';
    font-weight: 700;
    font-size: 23px;
    margin-right: 10px;
    float: left;
}
blockquote.testimonial .testimonial-author-detail {
    line-height: 1.5;
    margin-top: 30px;
    padding-left: 15px;
}
.testimonial-arrow-down {
    border:15px solid transparent;
    border-top-color:#08c;
    border-bottom:0;
    height:0;
    margin:0 0 0 25px;
    width:0;
}
.testimonial-author {
    float: left;
}
.testimonial-author .img-thumbnail {
    margin-right: 25px;
    position: relative;
    line-height: 1.5;
    background-color: #fff;
    display: inline-block;
    max-width: 100%;
    height: auto;
    border-radius: 50% !important;
}
.testimonial-author .img-thumbnail img {
    max-width:60px;
    display:inline-block;
    height:auto;
}
.testimonial-author-detail strong {
    font-size: 16px;
    font-weight: 500;
    color: #282d3b;
}
.testimonial-author-detail span {
    color:#7b858a;
    display:block;
    font-size:15px;
    font-weight: 400;
}
.owl-side-narrow {
    margin: 0 -10px;
}
.owl-side-narrow .owl-controls .owl-buttons div {
    color: #c5c5c5;
    background: transparent;
    padding: 0;
    margin: 0;
    font-size: 24px;
    position: absolute;
    top: 50%;
    margin-top: -18px;
}
.owl-side-narrow .owl-controls .owl-buttons div.owl-prev {
    left: 0;
}
.owl-side-narrow .owl-controls .owl-buttons div.owl-prev i:before {
    content: "\e829";
}
.owl-side-narrow .owl-controls .owl-buttons div.owl-next {
    right: 0;
}
.owl-side-narrow .owl-controls .owl-buttons div.owl-next i:before {
    content: "\e828";
}
.owl-side-narrow .owl-carousel {
    padding: 0 80px;
}
.owl-side-narrow .owl-carousel .owl-item.loading {
    min-height: 60px;
}
.owl-side-narrow .owl-controls {
    margin: 0;
}
#brands-slider-about img {
    opacity: 0.5;
}
</style>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>Porto - About Us 20</title>
         <identifier>about-porto-20</identifier>
         <content><![CDATA[<style type="text/css">
.page-header.type13.header-newskin {
    background-color: transparent;
    position: absolute;
    width: 100%;
    left: 0;
    top: 0;
}
.page-wrapper > .breadcrumbs {
    display: none;
}
</style>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[<referenceContainer name="page.top">
    <block class="Magento\Cms\Block\Block" name="top_banner">
        <arguments>
            <argument name="block_id" xsi:type="string">porto_about_us_20_top_block</argument>
        </arguments>
    </block>
</referenceContainer>]]></layout_update_xml>
      </cms_item>
      <cms_item>
         <title>404 Not Found 2</title>
         <identifier>no-route-2</identifier>
         <content><![CDATA[<h1 style="text-align:center;margin: 20px 0; font-size: 70px;margin-top:70px"><span style="display: inline-block;vertical-align:middle;">404</span><i class="porto-icon-doc" style="display: inline-block;vertical-align:middle;"></i></h1>
<p style="text-align:center; font-size: 15px;">You might want to check that URL again or head over to our <a href="{{config path="web/unsecure/base_url"}}">homepage.</a></p>]]></content>
         <is_active>1</is_active>
         <page_layout>1column</page_layout>
         <layout_update_xml><![CDATA[]]></layout_update_xml>
      </cms_item>
   </pages>
</root>