window.addEvent('domready', function() {
	//send the toggle and content arrays to vars
	var toggles = $$('h4.togglers');
	var content = $$('div.mostrar');
	
	
	var toggles2 = $$('h5.anioAc');
	var content2 = $$('div.mostrarAc');
	//set up your object var
	//create a "new" Accordian object
	//set the toggle array
	//set the content array
	//set your objects and events 
	var AccordionObject = new Accordion(toggles, content, {
	//var myAccordion = new Accordion($('acordeon'), 'h4.togglers', 'div.mostrar', {
		//when you load the page
		//will "show" the content (by index)
		//with NO transition, it will just be open
		//also note: if you use "fixedHeight," 
		//show will not work when the page first loads
		//"show" will override "display"
		//show: 0, 
	
	
		//when you load the page
		//this will "display" the content (by index)
		//and the content will transition open
		//if both display and show are set, 
		//show will override display
		display: 0,
		
		//defaults to true
		//this creates a vertical accordian
		height : true,
		
		//this is for horizontal accordians
		//tricky to use due to the css involved
		//maybe a tutorial for another day?
		width : false,
		
		//defaults to true
		//will give the content an opacity transition
		opacity: true,
		
		//defaults to false, can be integar - 
		//will fix height of all content containters
		//would need an overflow css rule
		//wont work on page load if you use "show"
		fixedHeight: false, 
		
		//can be false or an integer
		//similiar to fixedHeight above, 
		//but for horizontal accordians
		fixedWidth: false,
		
		//lets you toggle an open item closed
		alwaysHide: true,
	
		//standard onComplete event
		//passes a variable containing the element for each content element		
		/*
		onComplete: function(one, two, three, four, five){
			one.highlight('#5D80C8'); //blue
			two.highlight('#5D80C8');
			three.highlight('#5D80C8');
			four.highlight('#5D80C8'); 
			five.highlight('#5D80C8'); //the added section
			$('complete').highlight('#5D80C8');
		},
		*/
		
		//this will fire when you toggle open an element
		//will pass the toggle control element
		//and the content element that is opening
		onActive: function(toggler, element) {
			
			toggler.setStyle('color', '#FFF');
		},
		
		//this will fire when an element starts to hide
		//will pass all other elements
		//the one closing or not opening
		onBackground: function(toggler, element) {
			
			toggler.setStyle('color', '#F6F8FA');
		}
	});
	
	
	
	
	
	var AccordionObject2 = new Accordion(toggles2, content2, {
	//var myAccordion = new Accordion($('acordeon'), 'h4.togglers', 'div.mostrar', {
		//when you load the page
		//will "show" the content (by index)
		//with NO transition, it will just be open
		//also note: if you use "fixedHeight," 
		//show will not work when the page first loads
		//"show" will override "display"
		//show: 0, 
	
	
		//when you load the page
		//this will "display" the content (by index)
		//and the content will transition open
		//if both display and show are set, 
		//show will override display
		display: 0,
		
		//defaults to true
		//this creates a vertical accordian
		height : true,
		
		//this is for horizontal accordians
		//tricky to use due to the css involved
		//maybe a tutorial for another day?
		width : false,
		
		//defaults to true
		//will give the content an opacity transition
		opacity: true,
		
		//defaults to false, can be integar - 
		//will fix height of all content containters
		//would need an overflow css rule
		//wont work on page load if you use "show"
		fixedHeight: false, 
		
		//can be false or an integer
		//similiar to fixedHeight above, 
		//but for horizontal accordians
		fixedWidth: false,
		
		//lets you toggle an open item closed
		alwaysHide: true,
	
		//standard onComplete event
		//passes a variable containing the element for each content element		
		/*
		onComplete: function(one, two, three, four, five){
			
			one.highlight('#5D80C8'); //blue
			two.highlight('#5D80C8');
			three.highlight('#5D80C8');
			four.highlight('#5D80C8'); 
			five.highlight('#5D80C8'); //the added section
			
			$('complete').highlight('#5D80C8');
		},
		*/
		//this will fire when you toggle open an element
		//will pass the toggle control element
		//and the content element that is opening
		onActive: function(toggler, element) {
			
			toggler.setStyle('color', '#5D6870');
		},
		
		//this will fire when an element starts to hide
		//will pass all other elements
		//the one closing or not opening
		onBackground: function(toggler, element) {
			
			toggler.setStyle('color', '#5D6870');
		}
	});
	
});