$(document).ready(function() {      // Start of Jquery

overState();

/* 
fancySubmenu();
*/

    // Show submenu in a fancy way 
    /*
    function fancySubmenu() { 
        if ($('.menulist2 li a').hasClass('menuitem2selected')) {
            // submenuitem selected
        } else {
            // submenuitem not selected, do animation
            $(function() {
                $('.menulist2 .menuitem2, .menulist2 .menuitem2selected').hide();
                $('.menulist2 .menuitem2, .menulist2 .menuitem2selected').each(function(i) {
                    $(this).delay(i * 150).slideDown(700);
                }
                );
            });
        }
    }
    */

    // make div with class 'overstate'
    $('.menulist1 .menuitem1').append('<div class="overstate"></div>');
    // set width, opacity and position for div overstate
    $('.menulist1 .menuitem1, .menulist1 .menuitem1selected').each(function(i) {
        var default_width = $(this).width();
        $(this).find(".overstate").css({ 'width': default_width, 'opacity': '0.15', 'padding': '0 11px', 'left': '0px', 'bottom': '0' });
    }
   );

    function overState() {
        $(".menulist1 .menuitem1").hover(function() {
            $(this).find(".overstate").stop().css('top', '-72px').animate({ "top": "0px" }, 500);
        }, function() {
            $(this).find(".overstate").stop().animate({ "top": "-72px" }, 500).css('top', '0px')
        }
        );
    }

});       // End of Jquery