//tab effects

var TabbedContent = {
	init: function() {	
		$(".tab_item").click(function() {
			var background = $(this).parent().find(".moving_bg");
			var content = $('.slide_content');
			var id = $(this).attr('rel')
			var magicvar = $('#'+id).height();
			$('.tab_item').removeClass('selected');
			$(this).addClass('selected');
			$(background).stop().animate({
			  left: $(this).position()['left']
			}, {
			  duration: 650,
			  easing: 'easeOutExpo'
			});
			
			$(content).stop().animate({
			  height: magicvar
			}, {
			  duration: 650,
			  easing: 'easeInBack'
			});
			
			TabbedContent.slideContent($(this));
		});
	},
	
	slideContent: function(obj) {
		var margin = $(obj).parent().parent().find(".slide_content").width();
		margin = margin * ($(obj).prevAll().size() - 1);
		margin = margin * -1;
		
		$(obj).parent().parent().find(".tabslider").stop().animate({
			marginLeft: margin + "px"
		}, {
			duration: 650,
			easing: 'easeInBack'
		});
	}
}

$(document).ready(function() {
	TabbedContent.init();
});