$(document).ready(function() {
		$("#home").css("color","#0076a3");

		$("#portfolioContainer #beauty").fadeIn("slow");
		$("#portfolioBox #beauty img:first").fadeIn("normal");
		$("#thumbContainer #beauty #01").css("opacity","1");

		$(".portfolioNavLinks").click(function() {
			var elid = $(this).attr("id");
			$(".portfolioNavLinks").css("color","#727272");
			$(this).css("color","#0076a3");
			$("#portfolioContainer .portfolio").fadeOut("slow");
			$("#portfolioContainer #"+elid).fadeIn("slow");
                        $("#portfolioBox #"+elid+" img:first").fadeIn("normal");

			$("#thumbContainer .thumbs").css("display","none");
			$("#thumbContainer #"+elid).fadeIn("slow");

			$("#thumbContainer #"+elid+" #slideContainer").animate({'left':0},10);
			$("#thumbContainer #"+elid+" img").css("opacity","0.3");
			$("#thumbContainer #"+elid+" #01").css("opacity","1");

			if ($("#thumbContainer #"+elid+" #slideContainer").attr("max") > 1) {
				$("#sliderLeftSide").css("display","none");
				$("#sliderRightSide").css("display","block");
			} else {
				$("#sliderLeftSide").css("display","none");
				$("#sliderRightSide").css("display","none");
			}
			$("#thumbContainer #"+elid+" #slideContainer").attr("current","1");
		});

		$(".thumbs img").click(function() {
			var elid = $(this).attr("id");
			var parentID = $(this).parent().parent().parent().attr("id");
			var marginTop = $(this).attr("top");

			$("#portfolioBox #"+parentID+" img").css("display","none");
                        $("#portfolioBox #"+parentID+" #"+elid).fadeIn("normal");
			$("#thumbContainer #"+parentID+" img").css("opacity","0.3");
			$("#thumbContainer #"+parentID+" #"+elid).css("opacity","1.0");
			
			var marginTop = $(this).attr("top");
			if (marginTop) {
				$("#portfolioBox #"+parentID+" #"+elid).css("margin-top",marginTop);
			}
		});

		$("#sliderRightSide").hover(function() {
			$(this).css("background-position","-20px -60px");
		}, function() {
			$(this).css("background-position","-20px 0px");
		});

		$("#sliderLeftSide").hover(function() {
                        $(this).css("background-position","0px -60px");
                }, function() {
                        $(this).css("background-position","0px 0px");
                });

		$("#sliderRightSide").click(function() {
			var parentID = $("#page").attr("page");
			var max = $("#thumbContainerWithNav #"+parentID+" #slideContainer").attr("max");
			var current = $("#thumbContainerWithNav #"+parentID+" #slideContainer").attr("current");
			if (current < max) {
				distance = -800*parseInt(current);
				$("#thumbContainer #"+parentID+" #slideContainer").animate({'left':distance},1000);
				$("#thumbContainer #"+parentID+" #slideContainer").attr("current",parseInt(current)+1);
                                if ((parseInt(current)+1) == max) {
                                        $("#sliderRightSide").css("display","none");
                                }
				$("#sliderLeftSide").css("display","block");
			}
		});

		$("#sliderLeftSide").click(function() {
                        var parentID = $("#page").attr("page");
                        var max = $("#thumbContainer #"+parentID+" #slideContainer").attr("max");
                        var current = $("#thumbContainer #"+parentID+" #slideContainer").attr("current");
                        if (current > 1) {
                                distance = -800*(parseInt(current)-2);
	                        $("#thumbContainer #"+parentID+" #slideContainer").animate({'left':distance},1000);
                                $("#thumbContainer #"+parentID+" #slideContainer").attr("current",parseInt(current)-1);
				if ((parseInt(current)-1) == 1) {
					$("#sliderLeftSide").css("display","none");
				}
				$("#sliderRightSide").css("display","block");
                        }
                }); 

		$("#submitBTN").click(function() {
			var error = false;
			$("#nameError,#emailError,#messageError").css("color","#727272");
			if ($("#name").val() == "") {
				error = true;
				$("#nameError").css("color","#d61c1c");
			}
                      	if ($("#email").val() == "") {
				error = true;
				$("#emailError").css("color","#d61c1c");
                      	}
                      	if ($("#message").val() == "") {
				error = true;
				$("#messageError").css("color","#d61c1c");
                      	}
	
			if (error == true) {
				alert("Please fill in fields in red.");
				exit;
			}

			$.ajax({
				type: 'POST',
  				url: 'mail.php',
				data: ({
					name: $("#name").val(),
					email: $("#email").val(),
					phone: $("#phone").val(),
					message: $("#message").val()
				}),
  				success: function(data) {
					$("#contactForm").css("display","none");
					$("#thanks").css("display","block");
  				}
			});	
		}); 
	});