<div class="slideshow col-lg-9 col-xs-12">
	<div class="swiper-viewport">
		<div id="slideshow{{ module }}" class="swiper-container">
			<div class="swiper-wrapper">
				{% for banner in banners %}
					<div class="swiper-slide text-center {{ banner.title }}">
						{% if banner.link %}
							<a href="{{ banner.link }}"><img src="{{ banner.image }}" alt="{{ banner.title }}" class="img-responsive" /></a>
						{% else %}
							<img src="{{ banner.image }}" alt="{{ banner.title }}" class="img-responsive" />
						{% endif %}
					</div>
				{% endfor %}
			</div>
		</div>
		<div class="swiper-pagination slideshow{{ module }}"></div>
		<div class="swiper-pager hidden">
			<div class="swiper-button-prev"><i class="fa fa-angle-left"></i></div>
			<div class="swiper-button-next"><i class="fa fa-angle-right"></i></div>
		</div>
	</div>
</div>
<script><!--
$('#slideshow{{ module }}').swiper({
	mode: 'horizontal',
	slidesPerView: 1,
	pagination: '.slideshow{{ module }}',
	paginationClickable: true,
	nextButton: '.swiper-button-next',
	prevButton: '.swiper-button-prev',
	spaceBetween: 0,
	autoplay: 4000,
	autoplayDisableOnInteraction: true,
	loop: true
});
--></script>
