$(function(){
	// this is for placement of the project preview on portfolio nav
	xOffset = -3;
	yOffset = 25;
	
	$('#nav_sub li.current ul').addClass('sub');
	$('#nav_sub li.parent-current ul').addClass('sub');
	
	$('#nav_sub li.current ul li a').addClass('nohover');
	$('#nav_sub li.parent-current ul li a').addClass('nohover');
	
	
	// hover for main nav (not current)
	$('#nav li:not(.current) a')
		.css( {opacity: 0.45} )
		.mouseover(function(){
			$(this).stop().animate({opacity: 0.7}, 200)
		})
		.mouseout(function(){
			$(this).stop().animate({opacity: 0.45}, 200)
		})
	// hover for sub nav (not current)
	$('.subNav li:not(.current) a')	
		.css({backgroundColor: "#ececec", opacity: 0.5})
		.mouseover(function(e){
		
			if(!$(this).hasClass('nohover')){
		
				$(this).stop().animate({backgroundColor: "#dbdbdb", color: "#000", opacity: 0.8}, 200);
				// the following is for the image preview
				if (this.title != "" && this.title != "undefined"){
					this.t = this.title;
					$content = this.t;
					$("body").append("<div id='preview'>"+$content+"</div>");
					this.title = "";								 
					$("#preview")
						.stop()
						.css("top",(e.pageY - xOffset) + "px")
						.css("left",(e.pageX + yOffset) + "px")
						.slideDown(100);
				}
				
			}
		})
		.mouseout(function(){
		
			if(!$(this).hasClass('nohover')){
		
				$(this).stop().animate({backgroundColor: "#ececec", color: "#000", opacity: 0.5}, 200);
				// the following is for the image preview
				$content = "";
				this.title = this.t;
				$("#preview").remove();
				
			}
		})
		.mousemove(function(e){
			// the following is for the image preview
			$("#preview")
				.css("top",(e.pageY - xOffset) + "px")
				.css("left",(e.pageX + yOffset) + "px");
		});
		
	//$('.subNav li.parent-current a')	
	//	.css({backgroundColor: "#fff", opacity: 1});
		
	$('.sub li.current a')	
		.css({color: '#000'});
		
		
	$('.subNav li:not(.current) a').each(function(){
		if($(this).hasClass('nohover')){
			$(this).css({backgroundColor: "#F9F9F9", opacity: 1});
		}
	});
		
	
	
	
	// fix border on current link
	$('.subNav li.current').parent().css ({borderColor: "#fff"})
	$('.subNav li.current').parent().next().css ({borderColor: "#fff"})
	// slide effect on action links
	$('.slide')
		.css({backgroundColor: "#b60101", backgroundPosition: "24px 13px"})
		.mouseover(function(){
			$(this).stop().animate({backgroundColor: "#ad0101", paddingRight: 44, backgroundPosition: "27px 13px" }, 200);
		})
		.mouseout(function(){
			$(this).stop().animate({backgroundColor: "#b60101", paddingRight: 26, backgroundPosition: "24px 13px"  }, 200);
		})	
	// hover on services used list
	$('#servUsed li:not(.checked)')
		.css( {backgroundColor: "#333", color: "#999"} )
		.mouseover(function(){
			$(this).stop().animate({backgroundColor: "#2e2e2e", color: "#ccc"}, 200)
		})
		.mouseout(function(){
			$(this).stop().animate({backgroundColor: "#333", color: "#ccc"}, 200)
		})
	$('#servUsed li.checked')
		.css( {backgroundColor: "#333", color: "#fff"} )
		.mouseover(function(){
			$(this).stop().animate({backgroundColor: "#2e2e2e", color: "#ccc"}, 200)
		})
		.mouseout(function(){
			$(this).stop().animate({backgroundColor: "#333", color: "#fff"}, 200)
		})
});