$(document).ready(function(){	
	//set create the collapsable tree menu functionality
	//hide submenus
	$('ul.menu ul.submenu').hide();
	//set the opacity for the css!!!
	
	$('#navigation ul li ul').css({backgroundColor:'white',opacity:'0.8'});
	
	//add arrow span on hover		
	$('ul.menu a:not(.heading)').hover( function (){
		$(this).prepend("<span style='display:none;position:relative;left:-10px' class=arrow>&raquo;</span>");
		var arrow = $(this).children('span');
		arrow.animate({ left:'-2px', opacity: "show" },'fast');	
		
	}, function(){
		$(this).children('span').remove().fadeOut('fast');
	});
	
	$('ul.menu li.heading-clear').hover(function(){
		$('.flash').stop(0,1);
		$('ul').stop(1,1);
		$('.submenu').hide();
	});
	
	$('ul.menu li.heading').hover(
		//OVER		
		function(){	
			//hide all submenus
			$('.flash').stop(0,1);
			$('ul').stop(1,1);
			$('.submenu').hide();
			
			//reset the flash
			$(this).children('.flash').css({left:'0'});	
			
			//hide any visible submenus
			var flash = $(this).children('.flash');
			var submenu = $(this).find('ul');
			
			//submenu.show();
				
			flash.show().animate({left:'190px'},'fast',function() {
				submenu.slideDown('fast');
				}).hide('fast');
		},
		// OUT
		function () {
			$('.submenu').hide();
		}); 
   
    // initiate slideshow
     $('.slideshow').cycle({speed: 700});
    	
});