$(document).ready(

function() 
{

//-----------------------------------------------------------------------
//  Handle the hover event.
//-----------------------------------------------------------------------
  function navHoverOver()
  {

//-----------------------------------------------------------------------
//  Find the item with class of "sub-nav" and fade it in.
//-----------------------------------------------------------------------
    $(this).find(".sub-nav").stop().fadeTo('fast', 1).show();  

//-----------------------------------------------------------------------
//  Find the div with id of "video" and move it lower so you don't get 
//  weird artifacts in the mouseover.
//-----------------------------------------------------------------------
//    $("#video").css('visibility','hidden');
    
  }
//  navHoverOver
//-----------------------------------------------------------------------


//-----------------------------------------------------------------------
//  Handle the hover out event.
//-----------------------------------------------------------------------
  function navHoverOut()
  {

//-----------------------------------------------------------------------
//  Restore the z-index of the div with the id "video".
//-----------------------------------------------------------------------
//    $("#video").css('visibility','visible');

//-----------------------------------------------------------------------
//  Find the element with class of "sub-nav" and fade it, then hide it.
//-----------------------------------------------------------------------
    $(this).find(".sub-nav").stop().fadeTo('fast',0,
                                                    function() 
                                                    { 
                                                      $(this).hide();  //after fading, hide it
                                                    }
                                          );

    
  }
//  navHoverOut
//-----------------------------------------------------------------------


//-----------------------------------------------------------------------
//  Configuration parameters for hoverIntent.
//-----------------------------------------------------------------------
  var config = {
                over: navHoverOver,  // onMouseOver callback
                out: navHoverOut,    // onMouseOut callback
                sensitivity: 2,      // number = sensitivity threshold (must be 1 or higher)
                interval: 100,       // number = milliseconds for onMouseOver polling interval
                timeout: 200        // millseconds to wait before firing onMouseOut event
               };

//-----------------------------------------------------------------------
//  Set sub-nav opacity to 0 by default.
//-----------------------------------------------------------------------
  $("ul#nav-menu li .sub-nav").css({'opacity':'0'}); //Fade sub nav to 0 opacity on default

//-----------------------------------------------------------------------
//  Initialize hoverIntent.
//-----------------------------------------------------------------------
  $("ul#nav-menu li").hoverIntent(config); //Trigger Hover intent with custom configurations

});