<div class="row">
<div class="col-lg-9 home-slidershow">
<div class="sm-imageslider">
<div class="sm-imageslider-inner">
<div class="sm-imageslider-content owl-carousel owl-theme">
<div class="item"><a title="title" href="#"><img src="{{media url="wysiwyg/imageslider/sl1-id10.jpg"}}" alt="Slider Image" /></a></div>
<div class="item"><a title="title" href="#"><img src="{{media url="wysiwyg/imageslider/sl2-id10.jpg"}}" alt="Slider Image" /></a></div>
<div class="item"><a title="title" href="#"><img src="{{media url="wysiwyg/imageslider/sl3-id10.jpg"}}" alt="Slider Image" /></a></div>
</div>
</div>
</div>
<script type="text/javascript">
	require([
		'jquery',
		'owlcarousel'
	], function ($) {
		$(".sm-imageslider-content").owlCarousel({
			items:1,
			autoplay:true,
			loop:true,
			nav : true, 
			dots: false,
			autoplaySpeed : 500,
			navSpeed : 500,
			dotsSpeed : 500,
			autoplayHoverPause: true,
			margin:1,
		});	  
	});	
								
			
</script>
</div>
<div class="col-lg-3 banner1-id10">
<ul class="static-image">
<li><a title="Static Image" href="#"><img src="{{media url="wysiwyg/banner/img1-id10.jpg"}}" alt="Image" /></a></li>
<li><a title="Static Image" href="#"><img src="{{media url="wysiwyg/banner/img2-id10.jpg"}}" alt="Image" /></a></li>
</ul>
</div>
</div>
<div class="slider-brand-wrapper lazyload-container">
<div class="owl-carousel slider-brand">
<div class="item"><a title="Brand" href="#"><img class="mark-lazy" src="{{media url="wysiwyg/brand/logo-1.png"}}" alt="Brand" /></a></div>
<div class="item"><a title="Brand" href="#"><img class="mark-lazy" src="{{media url="wysiwyg/brand/logo-2.png"}}" alt="Brand" /></a></div>
<div class="item"><a title="Brand" href="#"><img class="mark-lazy" src="{{media url="wysiwyg/brand/logo-3.png"}}" alt="Brand" /></a></div>
<div class="item"><a title="Brand" href="#"><img class="mark-lazy" src="{{media url="wysiwyg/brand/logo-2.png"}}" alt="Brand" /></a></div>
<div class="item"><a title="Brand" href="#"><img class="mark-lazy" src="{{media url="wysiwyg/brand/logo-1.png"}}" alt="Brand" /></a></div>
<div class="item"><a title="Brand" href="#"><img class="mark-lazy" src="{{media url="wysiwyg/brand/logo-3.png"}}" alt="Brand" /></a></div>
<div class="item"><a title="Brand" href="#"><img class="mark-lazy" src="{{media url="wysiwyg/brand/logo-1.png"}}" alt="Brand" /></a></div>
<div class="item"><a title="Brand" href="#"><img class="mark-lazy" src="{{media url="wysiwyg/brand/logo-2.png"}}" alt="Brand" /></a></div>
</div>
<script type="text/javascript">
	require([
		'jquery',
		'owlcarousel'
	], function ($) {
		$('.slider-brand').owlCarousel({
			margin:35,
			nav:true,
			dots: false,
			loop:false,
			responsive: {
				0: {
					items:2
				},
				480: {
					items:3
				},
				768: {
					items:4
				},
				991: {
					items:4
				},						
				1200: {
					items:5
				}
			}
		})
	});
	
</script>
</div>
<div class="banner2-id10 lazyload-container">
<div class="static-image">
<ul class="row">
<li class="col-lg-4 col-md-4 col-sm-4"><a title="Static Image" href="#"><img class="mark-lazy" src="{{media url="wysiwyg/banner/img3-id10.jpg"}}" alt="Image" /></a></li>
<li class="col-lg-4 col-md-4 col-sm-4"><a title="Static Image" href="#"><img class="mark-lazy" src="{{media url="wysiwyg/banner/img4-id10.jpg"}}" alt="Image" /></a></li>
<li class="col-lg-4 col-md-4 col-sm-4"><a title="Static Image" href="#"><img class="mark-lazy" src="{{media url="wysiwyg/banner/img5-id10.jpg"}}" alt="Image" /></a></li>
</ul>
</div>
</div>