$(function() {
		// set opacity to nill on page load
		$("a.mainselect span").css("opacity","0");
		$("a.main span").css("opacity","0");
		$("a.two span").css("opacity","0");
		$("a.twoselect span").css("opacity","0");
		$("a.three span").css("opacity","0");
		$("a.threeselect span").css("opacity","0");
		$("a.four span").css("opacity","0");
		$("a.fourselect span").css("opacity","0");
		// on mouse over
		
			$("a.main span").hover(function () { $(this).stop().animate({opacity: 1}, "slow");},
				function () { $(this).stop().animate({ opacity: 0}, "slow");});
		
		$("a.mainselect 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");
		});
		
		
		
			$("a.two span").hover(function () { $(this).stop().animate({opacity: 1}, "slow");},
				function () { $(this).stop().animate({ opacity: 0}, "slow");});
				
					$("a.twoselect span").hover(function () { $(this).stop().animate({opacity: 1}, "slow");},
				function () { $(this).stop().animate({ opacity: 0}, "slow");});
				
				$("a.three span").hover(function () { $(this).stop().animate({opacity: 1}, "slow");},
				function () { $(this).stop().animate({ opacity: 0}, "slow");});
				
					$("a.threeselect span").hover(function () { $(this).stop().animate({opacity: 1}, "slow");},
				function () { $(this).stop().animate({ opacity: 0}, "slow");});
		
		$("a.four span").hover(function () { $(this).stop().animate({opacity: 1}, "slow");},
				function () { $(this).stop().animate({ opacity: 0}, "slow");});
				
					$("a.fourselect span").hover(function () { $(this).stop().animate({opacity: 1}, "slow");},
				function () { $(this).stop().animate({ opacity: 0}, "slow");});
		
		
	});