$(document).ready(function(){
	
	// Hide elements as soon DOM is ready


	$("#navmain").css('opacity', 0.25);
	$("#navlanguage").css('opacity', 0.25);
	$("#teaser01").css('opacity', 0);	
	$("#teaser02").css('opacity', 0);	
	$("#teaser03").css('opacity', 0);	
	$("#teaser04").css('opacity', 0);	
	$("#teaser05").css('opacity', 0);
	$("#teaser06").css('opacity', 0);	
	$("#teaser07").css('opacity', 0);	
	$("#teaser08").css('opacity', 0);	


	// FadeIn navigation on mouseover

	$("#navmain").mouseover(function() {
		  $(this).stop().animate( { opacity: 1 }, 2000);
		  $("#navlanguage").stop().animate( { opacity: 1 }, 2000);
	}).mouseout(function(){
		  $(this).stop().animate( { opacity: 0.25 }, 2000);
		  $("#navlanguage").stop().animate( { opacity: 0.25 }, 2000);		
	});
	
	
	// FadeIn teaserboxes with delay
	
	function teaserFadeIn() {
		$("#teaser08").css('opacity', 0).delay(1000).animate( { opacity: 1 }, 1000);	
		$("#teaser07").css('opacity', 0).delay(1500).animate( { opacity: 1 }, 1000);	
		$("#teaser06").css('opacity', 0).delay(2000).animate( { opacity: 1 }, 1000);	
		$("#teaser05").css('opacity', 0).delay(2500).animate( { opacity: 1 }, 1000);
		$("#teaser04").css('opacity', 0).delay(3000).animate( { opacity: 1 }, 1000);	
		$("#teaser03").css('opacity', 0).delay(3500).animate( { opacity: 1 }, 1000);	
		$("#teaser02").css('opacity', 0).delay(4000).animate( { opacity: 1 }, 1000);
		$("#teaser01").css('opacity', 0).delay(4500).animate( { opacity: 1 }, 1000);
	}
	teaserFadeIn();
	
	
	// Move teaserboxes to nav after click
	
	function moveTeaserBoxes() {
		  $("#navmain").animate( { opacity: 1 }, 1000);
		  $("#navlanguage").animate( { opacity: 1 }, 1000);
		  
	      $("#teaser01").delay(000).effect("transfer", { className: 'transferer', to: $("#nav-02")}, 1000).animate( { opacity: 0 }, 1000);
	      $("#teaser02").delay(100).effect("transfer", { className: 'transferer', to: $("#nav-03")}, 1000).animate( { opacity: 0 }, 1000);
	      $("#teaser03").delay(200).effect("transfer", { className: 'transferer', to: $("#nav-04")}, 1000).animate( { opacity: 0 }, 1000);
	      $("#teaser04").delay(300).effect("transfer", { className: 'transferer', to: $("#nav-05")}, 1000).animate( { opacity: 0 }, 1000);           		
	      $("#teaser05").delay(400).effect("transfer", { className: 'transferer', to: $("#nav-06")}, 1000).animate( { opacity: 0 }, 1000);           		
	      $("#teaser06").delay(500).effect("transfer", { className: 'transferer', to: $("#nav-07")}, 1000).animate( { opacity: 0 }, 1000);           		
	      $("#teaser07").delay(600).effect("transfer", { className: 'transferer', to: $("#nav-de")}, 1000).animate( { opacity: 0 }, 1000);           		
	      $("#teaser08").delay(700).effect("transfer", { className: 'transferer', to: $("#nav-en")}, 1000).animate( { opacity: 0 }, 1000);           		

	}
	
	// Open Page after delaytime for teaserbox transition
	
	function openPage() {
		setTimeout(function() {
			window.location = linkTarget; // window & location are java-core stuff!!!
		}, 3000);		
	}
	
	// Define link actions
	
	function linkAction() {
		$("a").click(function(event){
			// Prevent link from doing his thing
			event.preventDefault();
			// Store link target
			linkTarget = this.href;
			// Call transfer function (needs jquery-ui!!!)
			moveTeaserBoxes();	
			openPage();

		});
	}
	linkAction();	
});