//
		//  In my case I want to load them onload, this is how you do it!
		// 
		
		
		Event.observe(window, 'load', loadAccordions, false);
	
		//
		//	Set up all accordions
		//
	

    	function loadAccordions() {
			topAccordion = new accordion('horizontal_container', {
				classNames : {
					toggle : 'horizontal_accordion_toggle',
					toggleActive : 'horizontal_accordion_toggle_active',
					content : 'horizontal_accordion_content'
				},
				defaultSize : {
					width : 700
				},
				direction : 'horizontal'
			});	
	
			

			document.getElementById("container").style.overflow = "hidden";
			document.getElementById("horizontal_container").style.height = "561px";
			horizontal_accordion_toggle_children = document.getElementsByClassName("horizontal_accordion_toggle");
			for (var i = 0; i < horizontal_accordion_toggle_children.length; i++) {
				horizontal_accordion_toggle_children[i].setStyle({
									height: "561px",
									width: "50px",
									textIndent: "-9999px"
				});	
			}
			horizontal_accordion_content_children = document.getElementsByClassName("horizontal_accordion_content");
			for (var i = 0; i < horizontal_accordion_content_children.length; i++) {
				horizontal_accordion_content_children[i].setStyle({
									height: "561px"
				});	
			}	
			fakeBG_children = document.getElementsByClassName("fakeBG");
			for (var i = 0; i < fakeBG_children.length; i++) {
				fakeBG_children[i].setStyle({
									height: "561px"
				});	
			}	
			//menus background images 
			menu1 = document.getElementsByClassName("menu1");
			menu1[0].setStyle({backgroundImage: "url(img/menu1.jpg)"});	
			menu2 = document.getElementsByClassName("menu2");
			menu2[0].setStyle({backgroundImage: "url(img/menu2.jpg)"});	
			menu3 = document.getElementsByClassName("menu3");
			menu3[0].setStyle({backgroundImage: "url(img/menu3.jpg)"});	
			menu4 = document.getElementsByClassName("menu4");
			menu4[0].setStyle({backgroundImage: "url(img/menu4.jpg)"});	
			menu5 = document.getElementsByClassName("menu5");
			menu5[0].setStyle({backgroundImage: "url(img/menu5.jpg)"});	
			document.getElementById("fakeLoader").style.display = "block";
			// Open first one
			//alert(location.hash);
			if (location.hash=="#douchka" ) topAccordion.activate($$('#horizontal_container .horizontal_accordion_toggle')[0]);
			else if (location.hash=="#el_mundo_del_te") topAccordion.activate($$('#horizontal_container .horizontal_accordion_toggle')[1]);
			else if (location.hash=="#la_carta") topAccordion.activate($$('#horizontal_container .horizontal_accordion_toggle')[2]);
			else if (location.hash=="#las_bebidas") topAccordion.activate($$('#horizontal_container .horizontal_accordion_toggle')[3]);
			else if (location.hash=="#contacto") topAccordion.activate($$('#horizontal_container .horizontal_accordion_toggle')[4]);
			else topAccordion.activate($$('#horizontal_container .horizontal_accordion_toggle')[0]);

//myDiv = $('container1');
//leftButton = $('page1');
//rightButton = $('page2');
//Event.observe(leftButton, 'click', moveLeft, false);
//Event.observe(rightButton, 'click', moveRight, false);			
//function moveLeft(e) {
//new Effect.MoveBy(myDiv, 0, 100)
//}
//function moveRight(e) {
//new Effect.MoveBy(myDiv, 0, -100)
//}		
		}

/************************************************************************************************************
CENTERED ULTIMATE TOOLTIP
************************************************************************************************************/
function fadeIn(paragraphId,couleur){ 
	if(couleur<255) { //If color is not white yet
		couleur+=11; // increase color darkness
		document.getElementById(paragraphId).style.color="rgb("+couleur+","+couleur+","+couleur+")";
		setTimeout("fadeIn(\'"+paragraphId+"\', "+couleur+")",10); 
	}
	else {
	couleur=0; //reset couleurTitre value
	}
}
function fadeOut(paragraphId,couleur){ 
	if(couleur>0) { //If color is not black yet
		couleur-=11; // increase color darkness
		document.getElementById(paragraphId).style.color="rgb("+couleur+","+couleur+","+couleur+")";
		setTimeout("fadeOut(\'"+paragraphId+"\', "+couleur+")",10); 
	}
	else {
	couleur=255; //reset couleurTitre value
	document.getElementById(paragraphId).style.top=-500+"px";
	}
}
function showAbsoluteTooltipText (DivID){
	DivIDWidth = document.getElementById(DivID).style.width.substr(0, (document.getElementById(DivID).style.width.length-2));
	DivIDHeight = document.getElementById(DivID).style.height.substr(0, (document.getElementById(DivID).style.height.length-2));
	document.getElementById(DivID).style.left=(getWindowWidth()/2)-(DivIDWidth/2)+"px";
	document.getElementById(DivID).style.top=(getWindowHeight()/2)-(DivIDHeight/2)+"px";
	fadeIn(DivID,0);
	setTimeout("fadeOut(\'"+DivID+"\', 255)",4500); 
}
/************************************************************************************************************
GET WINDOW HEIGHT & WIDTH
************************************************************************************************************/
function getWindowWidth() {
	var windowWidth=0;
	if (typeof(window.innerWidth)=="number") {
		windowWidth=window.innerWidth;
	}
	else {
		if (document.documentElement&&
		document.documentElement.clientWidth) {
			windowWidth = document.documentElement.clientWidth;
		}
		else {
			if (document.body&&document.body.clientWidth) {
				windowWidth=document.body.clientWidth;
			}
		}
	}
	return windowWidth;
}
function getWindowHeight() {
	var windowHeight=0;
	if (typeof(window.innerHeight)=="number") {
		windowHeight=window.innerHeight;
	}
	else {
		if (document.documentElement&&
		document.documentElement.clientHeight) {
			windowHeight = document.documentElement.clientHeight;
		}
		else {
			if (document.body&&document.body.clientHeight) {
				windowHeight=document.body.clientHeight;
			}
		}
	}
	return windowHeight;
}