$(document).ready(function () {

    // Open and close menu nav boxes
    $('#enhanced-menu > ul > li').hoverIntent({
        timeout: 200,
        sensitivity: 4,
        interval: 70,
        over: function () {
            $(this).children('a').addClass('active');
            $(this).children('div').children('div').stop(true, true).fadeIn('fast');
        },
        out: function () {
            $(this).children('div').children('div').stop(true, true).fadeOut(300);
            $(this).children('a').removeClass('active');
        }
    });

    // Make nav menu LI into big targets
    $("ul.main_list > li:not(.info) a").not($("ul.main_list li.noTarget a")).bigTarget({
                clickZone: 'ul.main_list>li>div' // jQuery parent selector
            });

    // localized hoverFocus for dropdown menu.  this is rebuilt as a jquery plgin in /common/js/simpleMobileGlobal.js
    // at some point, the menu hoverFocus plugin should be applied to the nav menu.  perhaps it's too complicated of a selector though.
    // see about generalizing the selectors to work with the main nav

    $("ul.main_list > li:not(.info)").css({ 'cursor': 'pointer' }).hover(function () {
        $(this).addClass('hover');
        $('li:not(.hover, .info, .info li) > div', $(this).parents('ul.main_list')).stop().animate({ opacity: .3 });
    }, function () {
        $(this).removeClass('hover');
        $('li:not(.hover, .info, .info li) > div', $(this).parents('ul.main_list')).stop().animate({ opacity: 1 });
    });



    // make fading icons in social footer

    $("div.social_fade ul li").hover(function () { //On hover...

        var thumbOver = $(this).find("img").attr("src"); //Get image url and assign it to 'thumbOver'

        //Set a background image(thumbOver) on the <a> tag - Set position to bottom
        $(this).find("a.thumb").css({ 'background': 'url(' + thumbOver + ') no-repeat center bottom' });

        //Animate the image to 0 opacity (fade it out)
        $(this).find("span").stop().fadeTo('normal', 0, function () {
            $(this).hide() //Hide the image after fade
        });
    }, function () { //on hover out...
        //Fade the image to full opacity 
        $(this).find("span").stop().fadeTo('normal', 1).show();
    });


});