/***************************/
//@Author: Adrian "yEnS" Mato Gondelle & Ivan Guardado Castro
//@website: www.yensdesign.com
//@email: yensamg@gmail.com
//@license: Feel free to use it, but keep this credits please!					
/***************************/

$(document).ready(function(){
	$(".menu > li").click(function(e){
		switch(e.target.id){
			case "service1":
				//change status & style menu
				$("#service1").addClass("active");
				$("#service2").removeClass("active");
				$("#service3").removeClass("active");
				$("#service4").removeClass("active");
				$("#service5").removeClass("active");
				$("#service6").removeClass("active");
				$("#service7").removeClass("active");
				$("#service8").removeClass("active");
				$("#service9").removeClass("active");
				$("#service10").removeClass("active");
				//display selected division, hide others
				$("div.service1").fadeIn();
				$("div.service2").css("display", "none");
				$("div.service3").css("display", "none");
				$("div.service4").css("display", "none");
				$("div.service5").css("display", "none");
				$("div.service6").css("display", "none");
				$("div.service7").css("display", "none");
				$("div.service8").css("display", "none");
				$("div.service9").css("display", "none");
				$("div.service10").css("display", "none");
			break;
			case "service2":
				//change status & style menu
				$("#service1").removeClass("active");
				$("#service2").addClass("active");
				$("#service3").removeClass("active");
				$("#service4").removeClass("active");
				$("#service5").removeClass("active");
				$("#service6").removeClass("active");
				$("#service7").removeClass("active");
				$("#service8").removeClass("active");
				$("#service9").removeClass("active");
				$("#service10").removeClass("active");
				//display selected division, hide others
				$("div.service2").fadeIn();
				$("div.service1").css("display", "none");
				$("div.service3").css("display", "none");
				$("div.service4").css("display", "none");
				$("div.service5").css("display", "none");
				$("div.service6").css("display", "none");
				$("div.service7").css("display", "none");
				$("div.service8").css("display", "none");
				$("div.service9").css("display", "none");
				$("div.service10").css("display", "none");
			break;
			case "service3":
				//change status & style menu
				$("#service1").removeClass("active");
				$("#service2").removeClass("active");
				$("#service3").addClass("active");
				$("#service4").removeClass("active");
				$("#service5").removeClass("active");
				$("#service6").removeClass("active");
				$("#service7").removeClass("active");
				$("#service8").removeClass("active");
				$("#service9").removeClass("active");
				$("#service10").removeClass("active");
				//display selected division, hide others
				$("div.service3").fadeIn();
				$("div.service1").css("display", "none");
				$("div.service2").css("display", "none");
				$("div.service4").css("display", "none");
				$("div.service5").css("display", "none");
				$("div.service6").css("display", "none");
				$("div.service7").css("display", "none");
				$("div.service8").css("display", "none");
				$("div.service9").css("display", "none");
				$("div.service10").css("display", "none");
			break;
			case "service4":
				//change status & style menu
				$("#service1").removeClass("active");
				$("#service2").removeClass("active");
				$("#service3").removeClass("active");
				$("#service4").addClass("active");
				$("#service5").removeClass("active");
				$("#service6").removeClass("active");
				$("#service7").removeClass("active");
				$("#service8").removeClass("active");
				$("#service9").removeClass("active");
				$("#service10").removeClass("active");
				//display selected division, hide others
				$("div.service4").fadeIn();
				$("div.service1").css("display", "none");
				$("div.service2").css("display", "none");
				$("div.service3").css("display", "none");
				$("div.service5").css("display", "none");
				$("div.service6").css("display", "none");
				$("div.service7").css("display", "none");
				$("div.service8").css("display", "none");
				$("div.service9").css("display", "none");
				$("div.service10").css("display", "none");
			break;
			case "service5":
				//change status & style menu
				$("#service1").removeClass("active");
				$("#service2").removeClass("active");
				$("#service3").removeClass("active");
				$("#service4").removeClass("active");
				$("#service5").addClass("active");
				$("#service6").removeClass("active");
				$("#service7").removeClass("active");
				$("#service8").removeClass("active");
				$("#service9").removeClass("active");
				$("#service10").removeClass("active");
				//display selected division, hide others
				$("div.service5").fadeIn();
				$("div.service1").css("display", "none");
				$("div.service2").css("display", "none");
				$("div.service3").css("display", "none");
				$("div.service4").css("display", "none");
				$("div.service6").css("display", "none");
				$("div.service7").css("display", "none");
				$("div.service8").css("display", "none");
				$("div.service9").css("display", "none");
				$("div.service10").css("display", "none");
			break;
			case "service6":
				//change status & style menu
				$("#service1").removeClass("active");
				$("#service2").removeClass("active");
				$("#service3").removeClass("active");
				$("#service4").removeClass("active");
				$("#service5").removeClass("active");
				$("#service6").addClass("active");
				$("#service7").removeClass("active");
				$("#service8").removeClass("active");
				$("#service9").removeClass("active");
				$("#service10").removeClass("active");
				//display selected division, hide others
				$("div.service6").fadeIn();
				$("div.service1").css("display", "none");
				$("div.service2").css("display", "none");
				$("div.service3").css("display", "none");
				$("div.service4").css("display", "none");
				$("div.service5").css("display", "none");
				$("div.service7").css("display", "none");
				$("div.service8").css("display", "none");
				$("div.service9").css("display", "none");
				$("div.service10").css("display", "none");
			break;
			case "service7":
				//change status & style menu
				$("#service1").removeClass("active");
				$("#service2").removeClass("active");
				$("#service3").removeClass("active");
				$("#service4").removeClass("active");
				$("#service5").removeClass("active");
				$("#service6").removeClass("active");
				$("#service7").addClass("active");
				$("#service8").removeClass("active");
				$("#service9").removeClass("active");
				$("#service10").removeClass("active");
				//display selected division, hide others
				$("div.service7").fadeIn();
				$("div.service1").css("display", "none");
				$("div.service2").css("display", "none");
				$("div.service3").css("display", "none");
				$("div.service4").css("display", "none");
				$("div.service5").css("display", "none");
				$("div.service6").css("display", "none");
				$("div.service8").css("display", "none");
				$("div.service9").css("display", "none");
				$("div.service10").css("display", "none");
			break;
			case "service8":
				//change status & style menu
				$("#service1").removeClass("active");
				$("#service2").removeClass("active");
				$("#service3").removeClass("active");
				$("#service4").removeClass("active");
				$("#service5").removeClass("active");
				$("#service6").removeClass("active");
				$("#service7").removeClass("active");
				$("#service8").addClass("active");
				$("#service9").removeClass("active");
				$("#service10").removeClass("active");
				//display selected division, hide others
				$("div.service8").fadeIn();
				$("div.service1").css("display", "none");
				$("div.service2").css("display", "none");
				$("div.service3").css("display", "none");
				$("div.service4").css("display", "none");
				$("div.service5").css("display", "none");
				$("div.service6").css("display", "none");
				$("div.service7").css("display", "none");
				$("div.service9").css("display", "none");
				$("div.service10").css("display", "none");
			break;
			case "service9":
				//change status & style menu
				$("#service1").removeClass("active");
				$("#service2").removeClass("active");
				$("#service3").removeClass("active");
				$("#service4").removeClass("active");
				$("#service5").removeClass("active");
				$("#service6").removeClass("active");
				$("#service7").removeClass("active");
				$("#service8").removeClass("active");
				$("#service9").addClass("active");
				$("#service10").removeClass("active");
				//display selected division, hide others
				$("div.service9").fadeIn();
				$("div.service1").css("display", "none");
				$("div.service2").css("display", "none");
				$("div.service3").css("display", "none");
				$("div.service4").css("display", "none");
				$("div.service5").css("display", "none");
				$("div.service6").css("display", "none");
				$("div.service7").css("display", "none");
				$("div.service8").css("display", "none");
				$("div.service10").css("display", "none");
			break;
			case "service10":
				//change status & style menu
				$("#service1").removeClass("active");
				$("#service2").removeClass("active");
				$("#service3").removeClass("active");
				$("#service4").removeClass("active");
				$("#service5").removeClass("active");
				$("#service6").removeClass("active");
				$("#service7").removeClass("active");
				$("#service8").removeClass("active");
				$("#service9").removeClass("active");
				$("#service10").addClass("active");
				//display selected division, hide others
				$("div.service10").fadeIn();
				$("div.service1").css("display", "none");
				$("div.service2").css("display", "none");
				$("div.service3").css("display", "none");
				$("div.service4").css("display", "none");
				$("div.service5").css("display", "none");
				$("div.service6").css("display", "none");
				$("div.service7").css("display", "none");
				$("div.service8").css("display", "none");
				$("div.service9").css("display", "none");
			break;
		}
		//alert(e.target.id);
		return false;
	});
});