$(document).ready(function() {
		
		// the div that will be hidden/shown
		var panel = $("#hide");
		//the button that will toggle the panel
		var button = $("#show a");
		// do you want the panel to start off collapsed or expanded?
		var initialState = "expanded"; // "expanded" OR "collapsed"
		// the class added when the panel is hidden
		var activeClass = "hidden";
		// the text of the button when the panel's expanded
		var visibleText = "Kommentare ausblenden";
		// the text of the button when the panel's collapsed
		var hiddenText = "Kommentare einblenden";
		
		//---------------------------
		// don't    edit    below    this    line,
		// unless you really know what you're doing
		//---------------------------

		
		if($.cookie("panelState") == undefined) {
			$.cookie("panelState", initialState, { path: '/', expires: 70 });
		} 
		
		var state = $.cookie("panelState");
		
		if(state == "collapsed") {
			panel.hide();
			button.text(hiddenText);
			button.addClass(activeClass);
		}
	   
		button.click(function(){
			if($.cookie("panelState") == "expanded") {
				$.cookie("panelState", "collapsed", { path: '/', expires: 70 });
				button.text(hiddenText);
				button.addClass(activeClass);
			} else {
				$.cookie("panelState", "expanded", { path: '/', expires: 70 });
				button.text(visibleText);
				button.removeClass(activeClass);
			}
			
			panel.slideToggle("slow");
			
			return false;
		});
	});