$(document).ready(function() {
 // set opacity to nill on page load
    $("ul.menu span").css("opacity","0");
    // on mouse over
    $("ul.menu span").hover(function () {
      // animate opacity to full
      $(this).stop().animate({
        opacity: 1
      }, 'slow');
    },
    // on mouse out
    function () {
      // animate opacity to nill
      $(this).stop().animate({
        opacity: 0
      }, 'slow');
      });
    $("ul.menu li a").hover(function() { //When hovered
		//Following events are applied to the subnav itself (moving subnav up and down)
		$(this).parent().find("ul.dropdown").slideDown('fast').show(); //Drop down the subnav on click

		$(this).parent().hover(function() {
		}, function(){
			$(this).parent().find("ul.dropdown").slideUp('slow'); //When the mouse hovers out of the subnav, move it back up
		});

		//Following events are applied to the trigger (Hover events for the trigger)
		}).hover(function() {
			$(this).addClass("subhover"); //On hover over, add class "subhover"
		}, function(){	//On Hover Out
			$(this).removeClass("subhover"); //On hover out, remove class "subhover"
	});
	$(function() {
		$("#tabs").tabs();
	});
});