var i = 1;

function openTab(tab){
	
	var TABWIDTH = '34px';
	var section2OFF = '621px';
	var section2ON = '22px';
	var section3OFF = '647px';
	var section3ON = '48px';
	var section4OFF = '675px';
	var section4ON = '75px';
	if (tab == 1) {
		$('#section2').animate({
			left: section2OFF,
			width: TABWIDTH
		}, 500);
		
		$('#section3').animate({
			left: section3OFF,
			width: TABWIDTH
		}, 500);
		
		$('#section4').animate({
			left: section4OFF,
			width: TABWIDTH
		}, 500);
	}
	
	else if (tab == 2) {
		$('#section2').animate({
			left: section2ON,
			width: '640px'
		}, 500);
		
		$('#section3').animate({
			left: section3OFF,
			width: TABWIDTH
		}, 500);
		$('#section4').animate({
			left: section4OFF,
			width: TABWIDTH
		}, 500);
		
	}
	
	else if (tab == 3) {
	
		$('#section2').animate({
			left: section2ON,
			width: TABWIDTH
		}, 500);
		
		$('#section3').animate({
			left: section3ON,
			width: '656px'
		}, 500);
		$('#section4').animate({
			left: section4OFF,
			width: TABWIDTH
		}, 500);
		
	}
	
	
	else if (tab == 4 || tab === 0) {
	
		$('#section2').animate({
			left: section2ON,
			width: TABWIDTH
		}, 500);
		
		$('#section3').animate({
			left: section3ON,
			width: TABWIDTH
		}, 500);
		
		$('#section4').animate({
			left: section4ON,
			width: '632px'
		}, 500);
		
	}
	
	else {
		var index = '';
		i++;
		
		if (i % 4 == 0) {
			index = 3;
		}
		else {
			index = (i % 4) - 1;
		}
		openTab(i%4);
		$('.tab').removeClass('current');
		$('.tab:eq(' + index + ')').addClass('current');
	}
	
}
	
function timer() {
	var auto = setInterval('openTab()', 5000);
	
	$('.tab').click(function(){
		clearInterval(auto);
		openTab($('.tab').index(this)+1);
		$('.tab').removeClass('current');
		$(this).addClass('current');	
	});
	
	$('.pane').hover(
		function() {
			clearInterval(auto);
		},
		function() {
			clearInterval(auto);
			auto = setInterval('openTab()', 5000);
		}
	);	
}

$(document).ready(function(){
	
	// Auto-scroll accordion every 5 sec, 10 sec for the first banner on load		
	timer();
		
});