$('document').ready( function() {
    //We handle the mouseover functions of button like links (tabs, menu2 and portfolio links)
            //We do the excact same thing three times so we create a function:
            //Function expects x objects with the form: {parent: 'parentSelector', active: 'activeSelector', childSelect: 'childFilterSelector'}
        menuMouseOver = function() { 
            for(i=0, u=arguments.length; i<u; i++){
                var active = arguments[i].active;
                $(arguments[i].parent).children(arguments[i].childSelect)
                    .each( function() {
                        $(this).data('menuMouseOver', {active: active}); //will need this because of closure.
                    })
                    .css('cursor', 'pointer')
                    .click( function(){
                        document.location = $(this).find('a').attr('href');
                    })
                    .not('.'+arguments[i].active) //We don't want mousein mouseout effects on the active class.
                        .hover(function() {
                                $(this)
                                    .addClass($(this).data('menuMouseOver').active)
                                    .children()
                                        .css('text-decoration', 'underline');
                            }, function() {
                                $(this)
                                    .removeClass($(this).data('menuMouseOver').active)
                                    .children()
                                        .css('text-decoration', '');   
                            });
                //the $(parent) chain is now ended.
            }
        }
            //And we execute the function.
        menuMouseOver(  { parent: '#tabs',
                            active: 'tab_active',
                            childSelect: ':gt(0)'},
                        { parent: '#menu2',
                            active: 'menu2_item_active',
                            childSelect: ':gt(0)'},
                        { parent: '#squareFloatDivsWrapper',
                            active: '',
                            childSelect: ''});

    //We need to adjust the viewPort size:
        (function() { //closure
            window.onresize = function() {
                $('#wrapper').css('height', 109 //height of header + header margin
                                            + $('#realContentWrapper').height() 
                                            + 24 //height of marghins around real content
                                            + 40 + 'px'); //height of tabs
                if($(window).width() < 1024){
                    $('#wrapper').css('width', 1024+'px');
                }
                else{
                   $('#wrapper').css('width', ''); 
                }
            }
            window.onresize();
        })();
    //We wrap every example found in the DOM with the HTML needed for rounded corners.
    $('.examples').each( function() {
        var wrapHeight = $(this).height() + 30; //30= 2.5 times the height of a corner
        var wrapWidth = $(this).width() + 24; //24 = 2 times the width of a corner
        $(this).wrap("<div class='examplesWrap' style='height:" + wrapHeight + "px; width:" + wrapWidth + "px;'></div>");
        $(this).before("<div class='TLCornerGP'></div><div class='TRCornerGP'></div>");
        $(this).after("<div class='BLCornerGP'></div><div class='BRCornerGP'></div></div>");
    });
});