Tabs = function(options)
{
	options = options || {};
	options.onHide = options.onHide || function(tab, panel){};
	options.onShow = options.onShow || function(tab, panel){};
	
	Event.observe(window, 'load', function(event)
	{
		//set functionality to all of the tabs
		$$('UL.Tabs LI A').each(function(tab)
		{
			//its only a tab if it acts as an anchor
			if(tab.readAttribute('href').startsWith("#"))
			{
				//give it some functinality
				tab.observe('click', function(event)
				{
					//was this tab previously selected?
					var selected = tab.hasClassName('Selected');
					
					//remove the selected class from other tabs in this group
					tab.up('ul').childElements().each(function(tab)
					{
						//look into this tab and see if it is selected
						if(tab.down('a').hasClassName('Selected'))
						{
							//switch the class anmes
							tab.down('a').removeClassName('Selected');
							tab.down('a').addClassName('UnSelected');
							
							//hide the panel
							$$(tab.down('a').readAttribute('href')).each(function(panel)
							{
								options.onHide(tab, panel);
							});
						}
					});
					
					//make this tab selected if it wasn't already
					if(!selected)
					{
						//switch to a visible class
						tab.removeClassName('UnSelected');
						tab.addClassName('Selected');
						
						//show this panel
						$$(tab.readAttribute('href')).each(function(panel)
						{
							options.onShow(tab, panel);
						});
					}
				});
				
				//if it is not already slected then make it unselected
				if(!tab.hasClassName('Selected'))
					tab.addClassName('UnSelected');
			}
		});
	});
}