var initList = initList || []; 

initList.push(function(){

	var buttons = $(".content_nav_h .buttons");
	var sections = $(".content_nav_h  .sections");
	var steps = $(".content_nav_h #steps");
    var stage = 1;
    var num_sections = sections.children().length;
    var width_sections = 485;
    console.log(sections.children().css("width"));
	var time_factor = 1.5 * width_sections;

	buttons.click(function(){
			$(".content_nav_h > .controls > span").removeClass("active");
			var variation;

			if ($(this).is(".last")){
				variation = "+=";
				stage--;
			}else{
				variation = "-=";
				stage++;		
			}

			$(this).fadeOut(50,
				function(){ 
			    	sections.animate({
			    		marginTop: variation+width_sections
			    	}, time_factor, function(){
						steps.removeClass().addClass("paso"+stage);
						if (stage > 1) {
							buttons.last().fadeIn();
						}
						if (stage < num_sections) {
							buttons.first().fadeIn();
						}
						$(".content_nav_h > .controls > span:nth-child(" + stage + ")").addClass("active");
			    	});		
			    });			

	  });


	$(".content_nav_h .controls span").click(function(){
		var index = $(this).index();
		var margin = index * width_sections *-1;

	    stage = index + 1;
		$(".content_nav_h > .controls > span").removeClass("active");
		buttons.fadeOut(50,
				function(){ 
			    	sections.animate({
			    		marginTop: margin
			    	}, time_factor, function(){
						if (stage > 1) {
							buttons.last().fadeIn();
						}
						if (stage < num_sections) {
							buttons.first().fadeIn();
						}
						$(".content_nav_h > .controls > span:nth-child(" + stage + ")").addClass("active");
						steps.removeClass().addClass("paso"+stage);
			    	});		
			    });
	})

});

