<div id="banner">
	<div class="container">
		<div class="banner-texts">
			<ul class="texts-item">
				<li class="animated fadeInDown"><h1>principality group</h1></li>
				<li class="hidden"><h1>the complete solution for business</h1></li>
				<li class="hidden"><h1>microsoft accredited gold partners</h1></li>
				<li class="hidden"><h1>inspired ideas for education</h1></li>
				<li class="hidden"><h1>measure control manage save</h1></li>
			</ul>
			
		</div>
	</div>
</div>

<?php $__env->startSection('scripts'); ?>
	<script>
		var headerlist = $('.texts-item li');
		var currHeading = 0;
		var prevHeading = currHeading-1;

		setInterval(function(){
			showItem();
		},5000);

		function showItem()
		{

			$(".texts-item li:eq("+prevHeading+")").removeClass('animated fadeInDown').addClass('hidden');
			$(".texts-item li:eq("+currHeading+")").removeClass('hidden').addClass('animated fadeInDown');

			if (currHeading >= 5) {
				console.log(currHeading);
				currHeading = 0;
			} else {
				currHeading++;
				prevHeading = currHeading - 1;
			}
		}
		
	</script>
<?php $__env->stopSection(); ?>