Hi guys im having some problems with the code below. Here is the JS:

Code:
		var Site = {
	
			start: function(){
				if($('accordion')) Site.accordion();
			},
			
			accordion: function(){
				var list = $$('#accordion li div.collapse');
				var headings = $$('#accordion li h1');
				var collapsibles = new Array();
				var spans = new Array();
				
				headings.each( function(heading, i) {

					var collapsible = new Fx.Slide(list[i], { 
						duration: 500, 
						transition: Fx.Transitions.quadIn
					});
					
					collapsibles[i] = collapsible;
					if (Cookie.get("menu_"+i)) {
					collapsible.show();
					}
					else {
					collapsible.hide();
					}
					heading.onclick = function(){
					var span = $E('span', heading);
					if(span){
					var newHTML = span.innerHTML == '+' ? '-' : '+';
					span.setHTML(newHTML);
					}
					if (Cookie.get("menu_"+i)) {
					Cookie.remove("menu_"+i);
					}
					else {
					Cookie.set("menu_"+i, true);
					}
					collapsible.toggle();
					return false;
					}
					//collapsible.hide();
					
				});
			}
		};
		window.addEvent('domready', Site.start);
You can view the live site here: http://www.zeroformat.com
If you navigate through the first two buttons of the menu you will notice that the menu items slide down as they should. However before I entered the cookie scripting there was only one item open at a time. I have lost the functionality to close the other expanding div once a seperate one is clicked.

Clarification:
Design and Photos are not selected and therefore the sub menus are not shown. Say you clicked design it would then expand with the sub menus. Then if you clicked photos this should minimize the design submenu whilst opening the photos sub menu.

My cookie code is so that the open menu at the time is remembered and automatically expanded on page reload.

Am i missing something here?

Really really appreciate any help from you guys your the real hero's of the world!