jQuery.noConflict();
jQuery(document).ready(function() {
	jQuery('#step_1.item .step_link').click(function() {
		var id = jQuery(this).attr("id");
		if(id) {
			jQuery("#container").children("div").css("opacity",0);
			jQuery("#step_1").css("opacity",1);
			jQuery("#step_"+id).css("opacity",0);

			switch (id) {
				case 'moebel':
					var move_top = -1205;
					var move_left = -100;
					var zoom = 8;
					var duration = 1500;
					break;
				case 'schalter':
					var move_top = -1725;
					var move_left = -1500;
					var zoom = 8;
					var duration = 1500;
					break;
				case 'leistungsschuetze':
					var move_top = -1020;
					var move_left = -3530;
					var zoom = 8;
					var duration = 1500;
					break;
				case 'medizin':
					var move_top = -1750;
					var move_left = -3240;
					var zoom = 8;
					var duration = 1500;
					break;
				case 'metall':
					var move_top = -1000;
					var move_left = -6000;
					var zoom = 8;
					var duration = 1500;
					break;

			}
			width = jQuery('.item').width() * zoom;
			height = jQuery('.item').height() * zoom;

			jQuery("#step_1 .highlight."+id).fadeOut();

			jQuery('#step_1').find('img').stop(false,true).animate({
				'width' : width,
				'height' : height,
				'top' : move_top,
				'left' : move_left,
				'opacity' : 0
			}, duration, 'easeInQuad');

			jQuery("#step_1 a.step_link").animate({
				'opacity' : 0,
			}, 10, 'easeInQuad');



			jQuery("div.highlight."+id).animate({
				'opacity' : 1,
				'z-index' : 100
			}, 10, 'easeInQuad');

			jQuery("#step_"+id).animate({
			'opacity':1,
			'z-index':100
			},duration,'easeInQuad').addClass("active");
		}
	});
	jQuery('.item .back').click(function() {
		var id = jQuery(this).parents(".item").attr("id");
		var move = 0;
		var zoom = 1;
		var duration = 900;
		var name = id.split("_");
		name = name[1];

		jQuery("#"+id).animate({
		'opacity':0,
		'z-index':'98'
		},duration,'easeInQuad').addClass("inactive");

		jQuery("#step_1 a.step_link").animate({
			'opacity' : 1,
		}, duration, 'easeInQuad');
		width = jQuery('.item').width() * zoom;
		height = jQuery('.item').height() * zoom;

		jQuery('#step_1').find('img').stop(false,true).animate({
			'width' : width,
			'height' : height,
			'top' : move,
			'left' : move,
			'opacity' : 1,
		}, duration, 'easeInQuad');

		jQuery("#step_1 .highlight."+name).fadeIn();

		jQuery("#step_1").animate({
			'opacity' : 1,
			'z-index' : 100
		}, duration, 'easeInQuad');
	});
});