{% load thumbnail i18n paniktags %}
<div id="newsRoll">
	<div class="newsRoll center cf">
		<ul id="ticker" class="custom bigNews marged" style="height:300px;overflow:hidden;">
			{% for focus in news %}
				<li 
                    id="newsRollId-{{ focus.id }}"
                    class="">
					<a 
		    {% thumbnail focus.content_image "500x375" crop="50% 25%" as im %}
                        style="max-width:100%;height:300px;background: no-repeat 50% 50% url('{{im.url}}');"
			{% endthumbnail %}
                        class="block news relative"
			href="{{ focus|get_focus_url }}">
						{% if focus.content_category_title %}
							<div class="label labels absolute">
								<span class="item inBlock">{{ focus.content_category_title }}</span>
							</div>	
						{% endif %}

						<div class="title"><div>{{ focus.focus_title }}</div></div>
					</a>
				</li>
			{% endfor %}
		</ul>
        <div class="marged">
		    <ul class="custom distributed by3 padded" id="roller">
			    {% for focus in news %}
				    <li style="width:30%;" class="num-{{ forloop.counter }} padded">
					    <button class="inBlock" data-about="#newsRollId-{{ focus.id }}">
						    {% thumbnail focus.content_image "160x120" crop="50% 25%" as im %}
						    <img style="width:95%;" src="{{im.url}}" />
						    {% endthumbnail %}
					    </button>
				    </li>
			    {% endfor %}
		    </ul>
        </div>
	</div>
</div>