// JavaScript Document
    Element.implement({
	isVisible: function() {
		return this.getStyle('display') != 'none';
	},
	toggle: function() {
		return this[this.isVisible() ? 'hide' : 'show']();
	},
	hide: function() {
		var d;
		try {
			//IE fails here if the element is not in the dom
			if ('none' != this.getStyle('display')) d = this.getStyle('display');
		} catch(e){}
		this.store('originalDisplay', d||'block'); 
		this.setStyle('display','none');
		return this;
	},
	show: function(display) {
		original = this.retrieve('originalDisplay')?this.retrieve('originalDisplay'):this.get('originalDisplay');
		this.setStyle('display',(display || original || 'block'));
		return this;
	},
	swapClass: function(remove, add) {
		return this.removeClass(remove).addClass(add);
	},
	//TODO
	//DO NOT USE THIS METHOD
	//it is temporary, as Mootools 1.1 will negate its requirement
	fxOpacityOk: function(){
		return !Browser.Engine.trident4;
	}
});

$E = document.getElement.bind(document);

//returns a collection given an id or a selector
$G = function(elements) {
	return $splat($(elements)||$$(elements));
};
var Tabs = new Class({

    Implements: Options,

    options:{
        selectedTabCss:'selected',
        selectedSectionCss:'selected',
        firstShow:0,
        mouseEvent:'click'
    },

    initialize:function(tabs, sections, options){
        this.setOptions(options);
        this.current = this.options.firstShow;
        this.tabs = $$(tabs);
        this.sections = $$(sections);
        this.sectionsLength = $$(sections).length;
        this.attach();
        this.render();
    },

    render:function(){
        this.sections.each(function(section, index){
            if( index !== this.current ) {
                section.hide();
            }else{
                this.showSection(index);
            };
        }, this);
    },

    attach:function(){
        this.tabs.each(function(tab, index){
            tab.addEvent(this.options.mouseEvent,this.tabEvent.bindWithEvent(this,tab));
        }, this);
    },

    tabEvent:function(e,tab){
        e.preventDefault();
        var index = this.tabs.indexOf(tab);
        this.toggleSection(index);
    },

    toggleSection:function(index){
        if(this.current === index) return;
        this.hideSection(this.current);
        this.current = index;
        this.showSection(this.current);
    },

    showSection:function(index){
        var tab = this.tabs[index];
        var section = this.sections[index];
        tab.addClass(this.options.selectedTabCss);
        section.addClass(this.options.selectedSectionCss).show();
    },

    hideSection:function(index){
        if (index===false) return;
        var tab = this.tabs[index];
        var section = this.sections[index];
        tab.removeClass(this.options.selectedTabCss);
        section.removeClass(this.options.selectedSectionCss).hide();
    }
});