<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-sm-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-sm-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-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: 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>