<div class="homepage-bar" style="border:1px solid #e1e1e1;margin:0 0 20px 0;">
    <div class="row">
        <div class="col-md-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-md-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-md-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-md-3 col-lg-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-md-9 col-lg-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>