var box = {
	init: function(){
		this.setBoxInterval();
		//this.setMouseEvents();
	},
	
	boxInterval: [],
	
	setBoxInterval: function(){
		this.boxInterval = setInterval('box.showNext()', 10000);
	},
	
	showNext: function(){
		$('.active_box').each(function(){			
			box.flip(this);
		});
	},
	
	flip: function(e){
		var active = $(e);
		var next = $(e).next().length? $(e).next(): $(e).parent().children(':first-child');
		
		$(active).animate({width: 0, left: '38px'}, 1000, function(){
			$(this).removeClass('active_box').css('left', '0px');
			$(next).css('left', '38px').animate({width: '76px', left: '0px'}, 1000).addClass('active_box');
		});
	},
	
	setMouseEvents: function(){
		$('.active_box').mouseover(function(){
			clearInterval(box.boxInterval);
		}).mouseout(function(){
			box.setBoxInterval();
		});
	}
};