<div header></div>

<div class="container-fluid">

	<div class="bg-first general-padding" data-mipqa="category-container">

		<h1 class="h2 general-margin-t-b">{{categoryName}}</h1>

		<div class="both category {{ 'TEMPLATING_ITEM_CATEGORY_FIRST' | config }}">	
			<div ng-repeat="item in firstNews" class="repeat-item" data-mipqa="firstnews-item"> 

				<!-- BLOCK REPEAT ITEM - FIRST 4 -->
					<item content="item" class="both" callback="trackClick(item.title, $index)"></item>
				<!-- END BLOCK REPEAT ITEM -->	

			</div>
		</div>	
	</div>
	<!-- END FIRST BLOCK -->

	<!-- Infinite Scroll -->
	<div infinite-scroll infinite-callback="getNews" infinite-enable="gettingNews" infinite-offset="0">
		<scrolltotop></scrolltotop>
	  <!-- BLOCK OTHER NEWS -->
		<div class="other-news" ng-show="otherNews.length" data-mipqa="othernews-container">
			<div class="general-padding">
				<div class="both {{ 'TEMPLATING_ITEM_CATEGORY_OTHERS' | config }}">	
					<h3 class="double-general-margin-b uppercase">{{'WEBAPP_OTHER_NEWS' | dict }}</h3>
					<div ng-repeat="item in otherNews" class="item-layout" data-mipqa="othernews-item"> 

						<!-- BLOCK REPEAT ITEM - REMAIN -->

							<item content="item" class="both" callback="trackClickOther(item.title, $index)"></item>

						<!-- END BLOCK REPEAT REMAIN ITEM -->

					</div>
				</div>	
			</div>
		</div>
		<!-- END BLOCK OTHER NEWS -->
	</div>
	<div ng-show="gettingResult">
		<div class="center-block general-padding">
			<div class="loader"></div>
		</div>	
	</div>	
</div>

<footer ng-show="showFooter"></footer>
