function slideDownPanel()
{
	var activeIndex = -1;

	
	var $slide_panel = $("div#slidedown > div");
	
	var $btns = $("div#slidedown ul.btn li");
	$btns.css({cursor:'pointer', position:'relative'});
	var defaultURL = [];
	var activeImageURL = [];
	var overImageURL = [];
	

	
	$btns.each(function(){
	 	
			var url		= $(this).children().attr("src");
		 	var fileType 	= url.substring(url.lastIndexOf('.'), url.length);
		 	var active		= url.replace(fileType, '_a' + fileType);
		 	var over		= url.replace(fileType, '_o' + fileType);
			
			
			
			defaultURL.push(url);
			activeImageURL.push(active);
			overImageURL.push(over);
			
			
			var imgA = new Image();
			imgA.src = active;
			
			
			var imgB = new Image();
			imgB.src = over;
	})	
	
	
		
	$btns.each(function(i){
		
			var $this = $(this);
			
			$this.bind('mouseenter', mouseover)
				 .bind('mouseleave', mouseout)
				 .bind('click', onClick);
		
	})
	
		
	function mouseover(e)
	{
		var index =  $btns.index(this);
		if(activeIndex == index) return;
		
		changeImage($(this).children(), "over", $btns.index(this));
	}		
	
	function mouseout(e)
	{
		var index =  $btns.index(this);
		if(activeIndex == index) return;
		
		changeImage($(this).children(), "default", $btns.index(this));
	}
	
	
	
	function onClick(e)
	{
		var index = $btns.index(this);		
		var activeButton 	= $(this);	
		var activePanel		= $slide_panel.eq(index)
		
		if(activeIndex == index)
		{
			fadeout(index);
			
			activeIndex = -1;
			active = null;
			return;
		}
		
		
		if(activeIndex != -1)
		{
			fadeout(activeIndex);	
		}
		
		
		
		activePanel.slideDown('fasta', function(){changeImage(activeButton.children(), "active", index);});
		activeButton.stop().animate({top:20 + 'px'}, 100, 'easeOutExpo');
		activeIndex = index;
	}
	
	
	

	function changeImage(img, changeID, index)
	{
		var url;
		
		if(changeID == "default")
		{
			url = defaultURL[index];
		}
		else if(changeID == "active")
		{
			url = activeImageURL[index];
		}
		else if(changeID == "over")
		{
			url = overImageURL[index];
		}
		
	
		img.attr("src", url);
		
	}
	

	
	
	
	function fadeout(index)
	{
		var $panel = $slide_panel.eq(index);
		var btn = $btns.eq(index);
		
		btn.stop().animate({top:0 + 'px'}, 80, 'easeOutExpo');
		$panel.slideUp('fast', function(){changeImage(btn.children(), "default", index);});

	}
}