$(function() {
    // add animations to main navigation
    $('#main-nav a')
        .css({backgroundPosition: "0px -50px"})
        .mouseover(function() {
            $(this).stop().animate({backgroundPosition:"0px 0px"}, {duration: 200})
        })
        .mouseout(function() {
            $(this).stop().animate({backgroundPosition:"0px -50px"},  {duration: 200})
        })

    // disable animations on selected menu items
    $('a.selected')
        .css({backgroundPosition: "0px 0px"})
        .unbind('mouseover')
        .unbind('mouseout')
})