window.addEvent('domready', function(){
	var box = $('timeline')
	var box2 = $('shop')
	var box3 = $('leftcorner')
	var box4 = $('timelinepart1')
	var box5 = $('timelinepart2')
	var box6 = $('more1')
	var box7 = $('arrowdown')
	var box8 = $('plusleft')
	var box9 = $('flashshop')
	var box10 = $('create')
	var box11 = $('tabcreate')
	var box12 = $('tabshop')
	
	var fx = box.effects({duration: 1000, transition: Fx.Transitions.Quad.easeOut});
	var fx2 = box2.effects({duration: 1000, transition: Fx.Transitions.Quad.easeOut});
	var fx3 = box3.effects({duration: 1000, transition: Fx.Transitions.Quad.easeOut});
	var fx4 = box4.effects({duration: 1000, transition: Fx.Transitions.Quad.easeOut});
	var fx5 = box5.effects({duration: 1000, transition: Fx.Transitions.Quad.easeOut});
	var fx6 = box6.effects({duration: 1000, transition: Fx.Transitions.Quad.easeOut});
	var fx7 = box7.effects({duration: 100, transition: Fx.Transitions.Quad.easeOut});
	var fx8 = box8.effects({duration: 100, transition: Fx.Transitions.Quad.easeOut});	
	var fx9 = box9.effects({duration: 1000, transition: Fx.Transitions.Quad.easeOut});
	var fx10 = box10.effects({duration: 1000, transition: Fx.Transitions.Quad.easeOut});
	var fx11 = box11.effects({duration: 100, transition: Fx.Transitions.Quad.easeOut});
	var fx12 = box12.effects({duration: 100, transition: Fx.Transitions.Quad.easeOut});


$('arrowdown').addEvent('click', function() {
			fx.start({
				'height':500
	 	});
	 		fx2.start({
				'width':0
	 	});
	});

//HAHA Dit wat hieronder volgt is echt 1 GROTE GRAP

$('fakearrowdown').addEvent('click', function() {
			fx.start({
				'height':500
	 	});
	 		fx2.start({
				'width':0
	 	});
		 	fx7.start({
				'background-position': '0px 0px'
	 	});
	 		 		fx9.start({
				'height':240,
				'width':240,
	 	});
	 		 		 		fx10.start({
				'width':0
	 	});
	});	

$('fakearrowdown').addEvent('mouseover', function() {
			fx7.start({
				'background-position': '0px 30px'
	 	});
	});		

$('fakearrowdown').addEvent('mouseleave', function() {
			fx7.start({
				'background-position': '0px 0px'
	 	});
	});

$('fakeinfo').addEvent('click', function() {
			fx3.start({
				'height':800,
				'width':900
	 	});
	 		 		fx.start({
				'height':0
	 	});
	 		 		fx2.start({
				'width':0
	 	});
	 		 		fx9.start({
				'height':240,
				'width':240,
	 	});
	 		 		fx10.start({
				'width':0
	 	});
	 });

//EINDE GROTE GRAP

//ANDERE DAN OOK MAAR NAAR HOVERS
$('arrowdown').addEvent('mouseover', function() {
			fx7.start({
				'background-position': '0px 30px'
	 	});
	});		

$('arrowdown').addEvent('mouseleave', function() {
			fx7.start({
				'background-position': '0px 0px'
	 	});
	});
	
$('plusleft').addEvent('mouseover', function() {
			fx8.start({
				'background-position': '30px 0px'
	 	});
	});		

$('plusleft').addEvent('mouseleave', function() {
			fx8.start({
				'background-position': '0px 0px'
	 	});
	});
	
//EINDE HOVERS
	


$('plusleft').addEvent('click', function() {
			fx2.start({
				'width':644
	 	});
	 		fx.start({
				'height':0
	 	});
	 		fx9.start({
				'height':500,
				'width':800,
	 	});
	 		 		fx10.start({
				'width':0
	 	});
	});
	

$('infolink').addEvent('click', function() {
			fx3.start({
				'height':800,
				'width':900
	 	});
	 		 		fx.start({
				'height':0
	 	});
	 		 		fx2.start({
				'width':0
	 	});
	 });
	

$('more1').addEvent('click', function() {
			fx4.start({
				'opacity':0
	 	});
	 		fx5.start({
				'opacity':1
	 	});
	 		fx6.start({
				'opacity':0
	 	});
	 		});

$$('a.close').addEvent('click', function() {
			fx.start({
				'height':0
	 	});
	 		fx2.start({
				'width':0
	 	});
			fx3.start({
				'height':240,
				'width' :240
	 	});
	 		fx9.start({
				'height':240,
				'width':240,
	 	});
	 		fx10.start({
				'width':0
	 	});

	 		});
	 		
$('tabcreate').addEvent('click', function() {
	 		fx9.start({
				'height':240,
				'width':240,
	 	});
			fx10.start({
				'width':630
	 	});
	 		});

$('tabshop').addEvent('click', function() {
	 		fx9.start({
				'height':500,
				'width':800,
	 	});
			fx10.start({
				'width':0
	 	});

	 		});
	 				
		var Tips1 = new Tips($$('.Tips1'), {
	showDelay: 10,
	hideDelay: 10
});

});