$(function() {
	
	function heroSlide() {
		
		$('.heroslide').find('li').css({opacity: 0});

		var $heroslide = $('.heroslide'),
			heroArray = [6, 12, 11, 5, 4, 10, 9, 3, 2, 8, 7, 1],
			revArray = heroArray.reverse(),
			total = $heroslide.find('li').length,
			i = 0;

		function animGrid() {
			if (i <= total) {
				$('li.sq' + heroArray[i]).animate({opacity: 1});
				i++;
				timer = setTimeout(animGrid, 500);
			} else if (i >= total) {
				clearTimeout(timer);
				$heroslide.find('ul').css({background: 'none'});	
				revanimGrid();
			}
		}
		
		function revanimGrid() {
			if (i >= 0) {
				$('li.sq' + heroArray[i]).animate({opacity: 0});
				i--;
				revTimer = setTimeout(revanimGrid, 500);			
			} else {
				clearTimeout(revTimer);
				$heroslide.find('ul').remove();
			}
		}

		animGrid();
		
	}
	
	heroSlide();

});