<div class="group-block slider-post-14">{{widget type="Magefan\Blog\Block\Widget\Recent" title="Latest Blog" number_of_posts="6" custom_template="Magefan_Blog::widget/recent-id14.phtml"}}</div>
<div class="group-block slider-brand-14 lazyload-container">
<div class="list-brands-id14">
<div class="owl-carousel slider-brands-id14">
<div class="item"><a title="Brand" href="#"><img class="mark-lazy" src="{{media url="wysiwyg/brand/brand-1.jpg"}}" alt="Brand" /></a></div>
<div class="item"><a title="Brand" href="#"><img class="mark-lazy" src="{{media url="wysiwyg/brand/brand-2.jpg"}}" alt="Brand" /></a></div>
<div class="item"><a title="Brand" href="#"><img class="mark-lazy" src="{{media url="wysiwyg/brand/brand-3.jpg"}}" alt="Brand" /></a></div>
<div class="item"><a title="Brand" href="#"><img class="mark-lazy" src="{{media url="wysiwyg/brand/brand-4.jpg"}}" alt="Brand" /></a></div>
<div class="item"><a title="Brand" href="#"><img class="mark-lazy" src="{{media url="wysiwyg/brand/brand-5.jpg"}}" alt="Brand" /></a></div>
<div class="item"><a title="Brand" href="#"><img class="mark-lazy" src="{{media url="wysiwyg/brand/brand-6.jpg"}}" alt="Brand" /></a></div>
<div class="item"><a title="Brand" href="#"><img class="mark-lazy" src="{{media url="wysiwyg/brand/brand-1.jpg"}}" alt="Brand" /></a></div>
<div class="item"><a title="Brand" href="#"><img class="mark-lazy" src="{{media url="wysiwyg/brand/brand-2.jpg"}}" alt="Brand" /></a></div>
<div class="item"><a title="Brand" href="#"><img class="mark-lazy" src="{{media url="wysiwyg/brand/brand-3.jpg"}}" alt="Brand" /></a></div>
<div class="item"><a title="Brand" href="#"><img class="mark-lazy" src="{{media url="wysiwyg/brand/brand-4.jpg"}}" alt="Brand" /></a></div>
</div>
<script type="text/javascript">
	require([
		'jquery',
		'owlcarousel',
		'domReady!'
	], function ($) {
		setTimeout(function(){
			var brand_slider = $(".slider-brands-id14");
			brand_slider.owlCarousel({				
				nav: true,
				dots:false,
				margin: 18,
				
				responsive: {
					0: {
						items:1
					},
					480: {
						items:2
					},
					768: {
						items:3
					},
					991: {
						items:6
					},						
					1200: {
						items:7,
						margin: 19,
					},						
					1440: {
						items:8
					}
				}
			});	  
		}, 1000);
	});				
</script>
</div>
</div>