{% if S_BANNER_SCROLL_ENABLED %}

{% if BANNER_IS_COLLAPSIBLE %}
<a class="category{% if S_BANNER_HIDDEN %} hidden-category{% endif %}" style="display: none; height: 0"></a>
{% endif %}

<div class="forabg rbs-fit-{{ RBS_RESIZE_MODE }}" id="bannerscroll">
	<div class="inner">
		<ul class="topiclist">
			<li class="header">
				<dl class="row-item">
					<dt><i class="icon fa-thumbs-up fa-fw" aria-hidden="true"></i> {{ lang('BANNER_SCROLL_INDEX') }}</dt>
					<dd></dd>
				</dl>

				<span class="bsticker responsive-hide">
					<a href="#" title="{{ lang('PREVIOUS_SCROLL') }}" id="tickerb-previous"><i class="icon fa-step-backward fa-fw" aria-hidden="true"></i></a>
					<a href="#" title="{{ lang('NEXT_SCROLL') }}" id="tickerb-next"><i class="icon fa-step-forward fa-fw" aria-hidden="true"></i></a>
					<a href="#" title="{{ lang('STOP_SCROLL') }}" id="stopb"><i class="icon fa-stop fa-fw" aria-hidden="true"></i></a>
					<a href="#" title="{{ lang('START_SCROLL') }}" id="startb"><i class="icon fa-play fa-fw" aria-hidden="true"></i></a>
				</span>

				{% if BANNER_IS_COLLAPSIBLE %}
				<a href="{{ U_BANNER_COLLAPSE_URL }}"
					class="collapse-btn bannerscroll-collapse"
					data-hidden="{{ S_BANNER_HIDDEN }}"
					data-ajax="phpbb_collapse"
					data-overlay="true"
					data-title-alt="{{ lang('BANNER_CATEGORIES_TITLE', ((not S_BANNER_HIDDEN) * 1)) }}"
					title="{{ lang('BANNER_CATEGORIES_TITLE', (S_BANNER_HIDDEN * 1)) }}">
					<i class="icon fa-fw {% if S_BANNER_HIDDEN %}fa-plus-square{% else %}fa-minus-square{% endif %}" aria-hidden="true"></i>
				</a>
				{% endif %}
			</li>
		</ul>

		<div class="vertical-tickerb">
			<ul id="vertical-tickerb" class="topiclist forums">
				{% for banner_scroll in loops.banner_scroll %}
					<li class="row">
						<div style="text-align: center;">
							<div class="rbs-banner-wrap">
								<a href="{{ banner_scroll.U_CLICK }}">
									<img src="{{ banner_scroll.B_IMG }}" title="{{ banner_scroll.B_NAME }}" 
										alt="{{ banner_scroll.B_NAME }}" class="rbs-banner-img" />
								</a>
								<span class="rbs-clicks">{{ lang('BANNER_SCROLL_CLICKS', banner_scroll.B_CLICKS) }}</span>
							</div>
						</div>
					</li>
				{% else %}
					<li class="row" style="text-align: center; padding: 10px;">
						<span class="center-banner">{{ lang('BANNER_SCROLL_NOTHING') }}</span>
					</li>
				{% endfor %}
			</ul>
		</div>

	</div>
</div>
{% endif %}