var SLIDE_TIME = "slow";
var HOVER_COLOR = "#ffffff";
var PADDING = "10px";
var BLUE_ARROW = "arrow_gray.gif";
var GRAY_ARROW = "arrow_gray.gif";

$(document).ready(function(){

	$(".expandable").click(					// when you click, it shows the next div with class hidden
		function () {  
			$(this).toggleClass("blue");
			
			$("td.imageArrow", this).show();
			if($(".imageArrow", this).attr("src") == GRAY_ARROW) {
				$(".imageArrow", this).attr("src",BLUE_ARROW);
			}
			else {
				$(".imageArrow", this).attr("src",GRAY_ARROW);
			}
				
			//$("div.hidden").css("padding-top", PADDING);
			//$("a.image").show(SLIDE_TIME);
			$("div.hidden", this).slideToggle(500);
			//$("div.hidden", this).toggle("blind", {direction: "vertical"}, SLIDE_TIME);
		}
	);
	
	$(".expand").click(							// this will expand or collapse all
		function(){  
			$(".expandable").addClass("black");
			$(".imageArrow").attr("src", BLUE_ARROW);
			$("div.hidden").css("padding-top", PADDING);
			$("a.image").slideDown(1500);
			$("div.hidden").slideDown(1500);
		}
	);
	
	$(".collapse").click(						// this will expand or collapse all
		function(){  
			$(".expandable").removeClass("black");
			$(".imageArrow").attr("src", GRAY_ARROW);
			$("a.image").slideUp(1500);
			$("div.hidden").slideUp(1500);
		}
	);
	
});