window.addEvent('domready', function() {
		
		var path = 'fileadmin/template/'; // css path
		//var path = '';
		/* -----------------------------
			TEASER
		-------------------------------- */
		//slider variables for making things easier below
		var itemsHolder = $('teasertop');
		var myItems = $$(itemsHolder.getElements('.item'));
		
		//controls for slider
		var theControls = $('teaser_nav');
		var nummers		= $('teaser_num');
		var numNavHolder = $(nummers.getElement('ul'));
		var thePlayBtn = itemsHolder; //$(theControls.getElement('.play_btn'));
		var thePrevBtn = $(theControls.getElement('.prev_btn'));
		var theNextBtn = $(theControls.getElement('.next_btn'));
		
		// pas breedte rode achtergrond nummers aan
		numNavHolder.setStyle('width',(myItems.length * 20)+'px');
		
		//create instance of the slider, and start it up		
		var mySlider = new SL_Slider({
			slideTimer: 7000,
			orientation: 'horizontal',      //vertical, horizontal, or none: None will create a fading in/out transition.
			fade: true,                    //if true will fade the outgoing slide - only used if orientation is != None
			isPaused: false,
			container: itemsHolder,
			items: myItems,
			numNavActive: true,
			numNavHolder: numNavHolder,
			playBtn: thePlayBtn,
			prevBtn: thePrevBtn,
			nextBtn: theNextBtn
		});
		mySlider.start();
		
		/* -----------------------------
			TEASER 2
		-------------------------------- */
		//slider variables for making things easier below
		var itemsHolder2 = $('teaserbottom');
		var myItems2 = $$(itemsHolder2.getElements('.item'));
		
		//controls for slider
		var theControls2 = $('teaser_nav');
		var nummers2		= $('teaser_num');
		var numNavHolder2 = $(nummers2.getElement('ul'));
		var thePlayBtn2 = itemsHolder2; //$(theControls.getElement('.play_btn'));
		var thePrevBtn2 = $(theControls2.getElement('.prev_btn'));
		var theNextBtn2 = $(theControls2.getElement('.next_btn'));
		
		// pas breedte rode achtergrond nummers aan
		numNavHolder2.setStyle('width',(myItems2.length * 20)+'px');
		
		//create instance of the slider, and start it up		
		var mySlider2 = new SL_Slider({
			slideTimer: 7000,
			orientation: 'horizontal',      //vertical, horizontal, or none: None will create a fading in/out transition.
			fade: true,                    //if true will fade the outgoing slide - only used if orientation is != None
			isPaused: false,
			container: itemsHolder2,
			items: myItems2,
			numNavActive: true,
			numNavHolder: numNavHolder2,
			playBtn: thePlayBtn2,
			prevBtn: thePrevBtn2,
			nextBtn: theNextBtn2
		});
		mySlider2.start();
		
		/* ----------------------------------
			mouseover bg image
		------------------------------------- */
		$$('.hoofdmenu.top').addEvents({
			
			'mouseenter' : function() {
				$('menutitel').setStyle('background-image','url('+path+'img/menutitel_btn_top.gif)');
			},
			'mouseleave' : function() {
				$('menutitel').setStyle('background-image','url('+path+'img/menutitel_btn.gif)');
			}
		});
		$$('.hoofdmenu.bottom').addEvents({
			
			'mouseenter' : function() {
				$('menutitel').setStyle('background-image','url('+path+'img/menutitel_btn_bottom.gif)');
			},
			'mouseleave' : function() {
				$('menutitel').setStyle('background-image','url('+path+'img/menutitel_btn.gif)');
			}
		});
});