window.addEvent('domready', function() {

    //create our Accordion instance
    var myAccordion = new Accordion($('accordion'), 'h3.toggler', 'div.element', {
        opacity: false,
        onActive: function(toggler, element){
            toggler.setStyle('color', '#A8130B');
            toggler.setStyle('backgroundColor', '#DDC7AF');
        },
        onBackground: function(toggler, element){
            toggler.setStyle('color', '#333');
            toggler.setStyle('backgroundColor', '#DDD3C9');
        }
    });

    //add click event to the "add section" link
    $('add_section').addEvent('click', function(event) {
        event.stop();

        // create toggler
        var toggler = new Element('h3', {
            'class': 'toggler',
            'html': 'Common descent'
        });

        // create content
        var content = new Element('div', {
            'class': 'element',
            'html': '<p>Für diesen Bereich ist kein Inhalt vorhanden.</p>'
        });

        // position for the new section
        var position = 0;

        // add the section to our myAccordion using the addSection method
        myAccordion.addSection(toggler, content, position);
    });
});
