window.addEvent('domready', function() {
		
	//create our Accordion instance
		myAccordion = new Accordion($('accordion'), 'li.tabtoggler', 'div.tabcontent', {
		opacity: false,
		onActive: function(tabtoggler, tabcontent){
			tabtoggler.setStyle('background-image', 'url(../../images/products/tab_long_selected_background.png)');
		},
		onBackground: function(tabtoggler, tabcontent){
			tabtoggler.setStyle('background-image', 'url(../../images/products/tab_long_unselected_background.png)');				
		}
	});

	// Create our Slider instances that are embedded inside the Accordion
	var list = $$('div.collapse');
	var headings = $$('p.sectiontoggler');
	var collapsibles = new Array();

	headings.each( function(heading, i) {

		var collapsible = new Fx.Slide(list[i], { 
			duration: 500, 
			transition: Fx.Transitions.linear,
			onComplete: function(request){ 
			}
		});
		
		collapsibles[i] = collapsible;
		
		heading.addEvent('click', function(){
			// Adjust the height of the outer accordion div according to what slider is opened and closed
			fixHeight(collapsible);
			if (collapsible.open)
				heading.setStyle('background-image', 'url(../../images/arrow_up.png)');
			else
				heading.setStyle('background-image', 'url(../../images/arrow_down.png)');			
			collapsible.toggle();
			return false;
		});
		
		collapsible.hide();
		
	});

	// Add or subtract to the accordion height depending on if we are opening or closing a slider embedded in it
	function fixHeight(currentNode)
	{
		var par = currentNode.element;
		while (!par.hasClass('tabcontent')) {
			par = par.getParent();
		}
		par.setStyle('height', ''); // fix the accordion height		
		
	}
	

  // See if we need to open a certain tab
	if ( String(document.location.href).indexOf('#features')>=0)
	{
		myAccordion.display(1);		
	}
	else if (String(document.location.href).indexOf('#faq')>=0)
	{
		myAccordion.display(2);		
	}
});