<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-sm-5">
                        <div class="post-image">
                            <img src="{{media url="wysiwyg/smartwave/porto/blog/03.jpg"}}" alt="" />
                        </div>
                    </div>
                    <div class="col-sm-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-sm-5">
                        <div class="post-image">
                            <img src="{{media url="wysiwyg/smartwave/porto/blog/04.jpg"}}" alt="" />
                        </div>
                    </div>
                    <div class="col-sm-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>