$(document).ready(function () {

    // the commented code lines here were left in in the event that we would like to add
    // the directional arrows back into the display for the menus
    // 
    //slides the element with class "menuBody" when class "menuHead" is clicked
    $("#DropDownPaneForms p.menuHeadForms").click(function () {
        if ($(this).next("div.menuBodyForms").is(':visible')) {
            //$(this).css({ backgroundImage: "url(../Images/leftArrow.png)" });
        }
        else {
            //$(this).css({ backgroundImage: "url(../Images/downArrow.png)" });
        }
        $(this).next("div.menuBodyForms").toggle();
        //$(this).css({ backgroundImage: "url(../Images/downArrow.png)" }).next("div.menuBody").slideDown(300).siblings("div.menuBody").slideUp("slow");
        $(this).next("div.menuBodyForms").siblings("div.menuBodyForms").slideUp("slow");
        //$(this).siblings().css({ backgroundImage: "url(../Images/leftArrow.png)" });
    });
    //slides the element with class "menuBody" on mouseover
    $("#SlidingPane p.menuHeadForms").mouseover(function () {
        // this displays images in menu
        //$(this).css({ backgroundImage: "url(../Images/downArrow2.png)" }).next("div.menuBody").slideDown(10).siblings("div.menuBody").slideUp(10);
        //$(this).siblings().css({ backgroundImage: "url(../Images/leftArrow.png)" });

        // do not display images in menu
        $(this).css({ backgroundImage: "" }).next("div.menuBodyForms").slideDown(10).siblings("div.menuBodyForms").slideUp(10);
    });
});