// JavaScript Document


		// <![CDATA[
		////////////////////////////////////////////////////////////////////////////////////////////////////////////
		// accordion for the main content
			window.addEvent('domready', function(){
				var accordion = new Accordion('#content a', '#content div', {
					opacity: false, show: 0, fixedHeight: 600,
					onActive: function(toggler, element){
						toggler.setStyle('background-position', '0px -96px');
						toggler.onmouseover=function(){
							toggler.setStyle('background-position', '0px -96px');
						}
						toggler.onmouseout=function(){
							toggler.setStyle('background-position', '0px -96px');
						}
					},
					onBackground: function(toggler, element){
						toggler.setStyle('background-position', '0px 0px');
						toggler.onmouseover=function(){
							toggler.setStyle('background-position', '0px -48px');
						}
						toggler.onmouseout=function(){
							toggler.setStyle('background-position', '0px 0px');
						}
						
					}
				}, $('content'));
				
				});
				
			////////////////////////////////////////////////////////////////////////////////////////////////////////////
			// accordion for the side bar
			window.addEvent('domready', function(){
				var sbAccordion = new Accordion('#sidebar h3 a', '#sidebar div', {
					opacity: false, show: 0, fixedHeight: 320,
					onActive: function(toggler, element){
						toggler.setStyle('background-position', '0px -44px');
						toggler.onmouseover=function(){
							toggler.setStyle('background-position', '0px -44px');
						}
						toggler.onmouseout=function(){
							toggler.setStyle('background-position', '0px -44px');
						}
					},
					onBackground: function(toggler, element){
						toggler.setStyle('background-position', '0px 0px');
						toggler.onmouseover=function(){
							toggler.setStyle('background-position', '0px -22px');
						}
						toggler.onmouseout=function(){
							toggler.setStyle('background-position', '0px 0px');
						}
					}
				}, $('sidebar'));
				});
				
				////////////////////////////////////////////////////////////////////////////////////////////////////////////
				// shows and hides the main panels on rollover
				window.addEvent('domready', function(){
					
					//array of panels
					var fiBox = new Array();
					fiBox[0] = document.getElementById("fbdc");
					fiBox[1] = document.getElementById("fboa");
					fiBox[2] = document.getElementById("fbctd");
					fiBox[3] = document.getElementById("fbcpd");
					fiBox[4] = document.getElementById("fbdpm");
					fiBox[5] = document.getElementById("become_etailer")
					fiBox[6] = document.getElementById("fbstart")


					//array of buttons
					var featureItem = document.getElementById("featureBox").getElementsByTagName("li");

					//the initial selected panel
					var selectedBtn = fiBox[6];
					//holds the array position for the buttons
					var t;
					var inOut;
					var myTimer;
					var myReset;

					//set the initial opacity of the panels
					fadeOut(fiBox[0], 0);
					fadeOut(fiBox[1], 0);
					fadeOut(fiBox[2], 0);
					fadeOut(fiBox[3], 0);
					fadeOut(fiBox[4], 0);
					fadeOut(fiBox[5], 0);

					// fade the panel in
					function fadeIn(obj){
						var fx = new Fx.Style(obj, 'opacity', {duration: 300, wait: false}).start(0,.999);
					}

					//fade the panel out
					function fadeOut(obj, speed){
						var fx = new Fx.Style(obj, 'opacity', {duration: speed, wait: false}).start(1,0);
					}

					//apply the mousover function to the buttons
					for (var i=0; i<featureItem.length; i++) {
						mouseOver.apply(featureItem[i]);
	//					mouseOut.apply(featureItem[i]);
					}

					//the mouse over function
					function mouseOver() {
						this.onmouseover=function() {
							myTimer = $clear(myTimer);
							myReset = $clear(myReset);
							t = findIndex(this.id);
							inOut = "in";
							function myDelay(){
								if (selectedBtn != fiBox[t] && inOut == "in"){
									fadeOut(selectedBtn, 300);
									fadeIn(fiBox[t]);
									selectedBtn = fiBox[t];
								}
							}
							myTimer = myDelay.delay(300);
						}
					}
					//the mouseout function
				function mouseOut() {
					this.onmouseout=function() {
							inOut = "in";
							function myDelay(){
							if(selectedBtn != fiBox[6]) {
									fadeOut(selectedBtn, 300);
								fadeIn(fiBox[6]);
									selectedBtn = fiBox[6];
								}
							}
							myReset = myDelay.delay(2700);
						}
					}

					//returns the value of the buttons array position
					function findIndex(value) {
						for (var i=0; i<featureItem.length; i++) {
							if (featureItem[i].id == value) {
								return i;
							}
						}
					}
					
					});
		 // ]]>