$(document).ready( function() {
	var ad_div = $('#patio_covers');
	var height = ad_div.height();
	var opened = false;
 	ad_div.hide().css({ height : 1 });
	
	function changePic(el, pic1, pic2) {
		var pic=((el.src.match(pic1)!=null)? pic2 : pic1);
		el.src="images/"+pic+".jpg";
	}
	
	var pic = $('#patio-colors-change');
	pic.click( function(){
		if(opened == false)
			changePic(this,'little-colors-open','little-colors');
	});
	
	pic.hover( function(){
		if(opened == false)
			changePic(this,'little-colors-hover','little-colors');
	});
	

	$('#patio_covers_link').click(function () {
			if( opened === false ) {
				ad_div.show().animate({ height : height }, { duration: 700 });
				opened = true;
			}
			return false;
	});
	
	$('#patio_covers_hide_link').click(function() {
		opened = false;		
		ad_div.animate({ height: 1 }, { duration: 700, complete: function () { ad_div.hide();} });	
		var pic=document.getElementById('patio-colors-change');
		{changePic(pic,'little-colors-open','little-colors');}
		return false;
	});
});