window.addEvent('domready', function() {
		
		//variables for making things more simple below
		var itemsHolder = $('container');
		var numNavHolder = $('num_nav').getElement('ul');
		var myItems = $$('.item');
		var thePlayBtn = $('play_btn');
		var thePrevBtn = $('prev_btn');
		var theNextBtn = $('next_btn');
		
		
		//create an instance of the slider, and start it up
		var mySlider = new SL_Slider({
			slideTimer: 9500,
			isPaused: false,
			container: itemsHolder,
			items: myItems,
			numNavActive: true,
			numNavHolder: numNavHolder,
			playBtn: thePlayBtn,
			prevBtn: thePrevBtn,
			nextBtn: theNextBtn
		});
		mySlider.start();
		
		
		//adding a little animated rollover highlight to the play and prev/next buttons
		var origBkgdColor = thePlayBtn.getStyle('background-color');
		var newBkgdColor = "transparent";
		var btnArray = new Array(thePlayBtn, thePrevBtn, theNextBtn);
		
		btnArray.each(function(e, i){
			e.set('tween', {duration: 350, transition: 'cubic:out', link: 'cancel'});
			e.addEvents({ 
				'mouseenter' : function() {
					this.tween('background-color', newBkgdColor);
				},
				'mouseleave' : function() {
					this.tween('background-color', origBkgdColor);
				}
			});
		});
					 
	});