initDocument = function() {
	
		li = $$('div#nav ul li a.b');

	
		for(i=0; i<li.length; i++) {
			
			Element.setStyle(li[i], {
				marginTop: '-60px'
			});
			
			new Effect.Morph(li[i], {
				style: 'margin-top: -28px;',
				delay: 0.8,
				transition: Effect.Transitions.Elastic,
				duration: 2
			});
			
			li[i].onclick = function() { expandNav(this.id); return false; };

		}
		
		subnav = $$('ul.sub');
		
		for(i=0; i<subnav.length; i++) {
			Element.hide(subnav[i]);
		}
		
		
		subnav_b = $$('ul.sub a');
		
		for(i=0; i<subnav_b.length; i++) {
			subnav_b[i].onclick = function() { openImg(this.id); return false; };
		}
	
	}
	
	
	
	
	is_expanded = false;
	is_running = false;
	
	expandNav = function(which) {
	
		if(!is_running && is_expanded != which) {
		
			deactivateSubLinks();
		
			is_expanded = which;
			is_running = true;

			li = $$('div#nav ul li a.b');

			for(i=0; i<li.length; i++) {
				if(Element.hasClassName(li[i], 'active')) {
					new Effect.Morph(li[i], {
						style: 'margin-top: -28px; margin-bottom: 0px;',
						duration: 0.5,
						transition: Effect.Transitions.Elastic
					});
					Element.removeClassName(li[i], 'active');
					Element.hide($('sub_' + li[i].id));
				}
			}


			Element.addClassName(which, 'active');
			showSubNav(which);
			new Effect.Morph(which, { 
				style: 'margin-top: 20px; margin-bottom: 50px;',
				duration: 0.5,
				transition: Effect.Transitions.Elastic
			});
			
		}
	
	}
	
	
	
	
	
	showSubNav = function(which) {
		
		new Effect.Appear($('sub_' + which), {
			duration: 0.5,
			afterFinish: function() {
				is_running = false;
			}
		});
	
	}
	
	
	
	
	
	
	openImg = function(which) {
	
		deactivateSubLinks();
	
		ref = which.split('_');
		etage = ref[1];
		bild = ref[2];
		
		Element.addClassName(which, 'active');
	
		new Insertion.Top('container', '<div id="img_close" style="display:none;" onclick="closeImg(); return false;"><a href="#">schlie&szlig;en</a></div><div id="img_container"><img src="/imgs/loading.gif" alt="loading" id="zoomed_loading" /></div>');
		
		new Effect.Morph('img_container', { 
			style: 'height: 600px; margin-top: -300px;',
			transition: Effect.Transitions.Elastic,
			duration: 1.8,
			afterFinish: function() {
				loadImg(etage, bild);
			}
		});
	
	}
	
	
	
	
	
	
	
	loadImg = function(etage, bild) {
	
		new Insertion.Top('img_container', '<div id="handle" style="display:none;"><img src="/imgs/' + etage + '/img' + bild + '.jpg" alt="" id="zoomed_img" style="display:none;" /></div><div id="handle2" style="display:none; background-image:url(/imgs/' + etage + '/img' + bild + '.jpg); background-repeat:repeat-x;">&nbsp;</div>');
		
		loadingInterval = window.setInterval(function() { checkProgress(); }, 250);
	
	}
	
	
	
	
	
	
	checkProgress = function() {
	
		if($('zoomed_img').complete) {
			window.clearInterval(loadingInterval);
			Element.remove('zoomed_loading');
			
			finishLoading();
			
		}
	
	}
	
	
	
	
	
	
	
	
	
	finishLoading = function() {
	
		Element.show('handle');
		new Effect.Appear('img_close');
		new Effect.Appear('handle2');
		
		var distance = 0;
		var prevX = parseInt($('handle').getStyle('left'));
		var cwidth = parseInt($('img_container').getStyle('width'));

		new Draggable('handle', {

			constraint:'horizontal',
			starteffect:function() { if(this.ismoving) { this.ismoving.cancel(); } },
			endeffect:function() {
			
				var to = parseInt($('handle').getStyle('left')) + distance * 10;
				var dur = (500 + Math.abs(distance * 10))/1000;

				this.ismoving = new Effect.Morph('handle', { style:'left:'+to+'px', duration:dur, transition:Effect.Transitions.Cubic });
				this.ismoving = new Effect.Morph('handle2', { style:'background-position:'+to+'px 0px', duration:dur, transition:Effect.Transitions.Cubic });
			
			},
			change:function(blubb) {
				distance = parseInt($('handle').getStyle('left')) - prevX;
				prevX = parseInt($('handle').getStyle('left'));
				
				$('handle2').style.backgroundPosition = blubb.element.style.left+' 0px';
			}


		});

		Event.observe('handle', 'mousedown', function() { $('handle').style.cursor = '-moz-grabbing'; });
		Event.observe('handle', 'mouseup', function() { $('handle').style.cursor = '-moz-grab'; });


		imgcontentwidth = parseInt($('zoomed_img').width);
	
	}
	
	
	






	closeImg = function() {
	
		new Effect.Fade('img_close', {
			duration: 0.5
		});
		new Effect.Fade('img_container', {
			duration: 0.5,
			afterFinish: function() {
				Element.remove('img_container');
				Element.remove('img_close');
			}
		});
	
	}
	
	
	
	
	
	
	
	
	deactivateSubLinks = function() {
	
		elmts = $$('ul.sub a');
		for(i=0; i<elmts.length; i++) {
			Element.removeClassName(elmts[i], 'active');
		}
		
	}