$(document).ready(function() {
	
	// init arrow
	$('div.choices div.arrow').css('left', calculArrowPosition());

	$('div.choice').click(function(){
		var id_clicked = '#' + $(this).attr('id');
		var id_selected = '#' + $('div.choice.selected').attr('id');
		
		
		$(id_selected).removeClass('selected');
		$(id_clicked).addClass('selected');
		
		$(id_selected+'_content').fadeOut('1000', function(){
			$(id_clicked+'_content').fadeIn('1000');
		});
		
		$('div.choices div.arrow').animate({'left':calculArrowPosition()}, {duration : '1000', queue:false});
		 return false;
	});
});


function calculArrowPosition(){
	var position = $('div.choice.selected').index('div.choice');
	return 20 + position*($('div.choice').width() + parseInt($('div.choice').css('padding-left')));
}