$(function() {

	// Add a span Tag to each of the links in the menu
	$('#menu a').wrapInner('<span />');

	// Add some new CSS background positons to use different portions of the sprite.
	$('#menu a.home').css( {backgroundPosition: "0px -40px"} );
	$('#menu a.retailers').css( {backgroundPosition: "-115px -40px"} );
	$('#menu a.producers').css( {backgroundPosition: "-230px -40px"} );
	$('#menu a.markets').css( {backgroundPosition: "-345px -40px"} );
	$('#menu a.contact').css( {backgroundPosition: "-460px -40px"} );

	$('#menu a.home span').css( {backgroundPosition: "0px 0px"} );
	$('#menu a.retailers span').css( {backgroundPosition: "-115px 0px"} );
	$('#menu a.producers span').css( {backgroundPosition: "-230px 0px"} );
	$('#menu a.markets span').css( {backgroundPosition: "-345px 0px"} );
	$('#menu a.contact span').css( {backgroundPosition: "-460px 0px"} );


	// Set opacity to nill on page load (except for current item)
	$("#menu span:not(#current span)").css("opacity","0");

	// On mouse over
	$("#menu span:not(#current span)").hover(function () {
		// animate opacity to full
		$(this).animate({
			opacity: 1
		}, 75);
	},
	// On mouse out
	function () {
		// animate opacity to nill
		$(this).animate({
			opacity: 0
		}, 175);
	});
});