$(document).ready(function(){

	// setup first.
	selected = 0; // first one needs to be selected
	
	// Add the correct selector in here.
	//$(".banner_image").hide();
	panes = $(".banner_image");
	//console.log(panes.length);
	// We hide everything but the first
	if (panes)
	for (i=1;i<=panes.length;i++)
		$(panes[i]).hide();

	// Creating the actual interval
	interval = setInterval('rotatePanes()', 7000);

});

function rotatePanes(){
	if (panes) {
		prevSelected = selected;

		for(i=0;i<= panes.length; i++) {
			 $(panes[i]).css( 'zIndex', -6 );
		 }

		selected++;
		if (selected>(panes.length-1))
			selected = 0;
		//console.log("selected:" + selected);
		//console.log(prevSelected);
		
		$(panes[selected]).css('zIndex', 1);

		$(panes[selected]).fadeIn(2000, function(){
			//console.log(prevSelected);
			$(panes[prevSelected]).hide();
		});
	}
}

