$(document).ready(
	function() {
		
		$('#slideshow').css("height","473px");
		$('#slideshow') 
		.before('<div id="nav_slide">') 
		.cycle({ 
		    fx:     'fade', 
		    speed:  'slow', 
		    timeout: 4000, 
		    pager:  '#nav_slide'
		});
		$('#nav_slide').after('<span id="control_slide"><input type="button" id="pause" value="Pause" /><input type="button" id="play" value="Play" /></span>');
		$("#control_slide input").hover(
		      function () {
		        $(this).css('color','#f1f0f0');
		      }, 
		      function () {
		        $(this).css('color','#fed90f');
		      }
		);
		$('#control_slide input[id="play"]').hide();
		$('#control_slide input[id="pause"]').click(function() { 
			$('#slideshow').cycle('pause');
			$('#control_slide input[id="play"]').show();
			$(this).hide();
		});
		$('#control_slide input[id="play"]').click(function() { 
			$('#slideshow').cycle('resume', true);
			$('#control_slide input[id="pause"]').show();
			$(this).hide();
		});
		
		$("#credits").fadeTo(1, 0.50);
		//$(this).fadeTo("slow", 0.33);
		$("#credits").hover( function(){
				$(this).fadeTo("slow", .99);
				$(this).queue([]);
			}, function () {
				$(this).fadeTo("slow", 0.50);
				$(this).queue([]);
			});
		
		$('.scroll-pane').jScrollPane({scrollbarWidth:5, scrollbarMargin:10, showArrows:false});
	}
);