$(document).ready(function()
{
	//slides the element with class "menu_body" when paragraph with class "menu_head" is clicked 
	$("#firstpane #nav_collections").click(function()
    {
		$(this).next("div.menu_body").slideToggle(300).siblings("div.menu_body").slideUp("slow");
		//$("#graphic").fadeOut('slow', function() {
		//clearTimeout(the_timeout); stop the setTimeOut										 
		//$("#graphic").html("");
		//$("#graphic").html("<div id=\"soli-slide\"></div>");//added 23rd sept
		$("#graphic").fadeOut('slow', function() {
		$(this).load("collections-slideshow.html").fadeIn('slow');
		});
		//function calling line
		$("#nav_solitaire").siblings("div.menu_body").slideUp("slow");		
		$("#description").fadeOut('slow');
});

	$("#firstpane #nav_diamond").click(function()
    {
		
		$(this).next("div.menu_body").slideToggle(300).siblings("div.menu_body").slideUp("slow");	
		//$(this).siblings("div.menu_body").slideUp(300);
		//$(this).next("div.menu_body").slideToggle("slow");
		$("#graphic").fadeOut('slow', function() {
		$(this).load("diamond-p2.html").fadeIn('slow');
		$("#description").fadeOut('slow');
		});		
		$("#nav_solitaire").siblings("div.menu_body").slideUp("slow");		
});
/*diamond sub nav*/
	$("#firstpane #nav_colour").click(function()
    {
		$(this).addClass("colour-selected");	
		$(this).blur(function(){
		$(this).removeClass("colour-selected");
		$(this).addClass("colour")
    	});
		$("#graphic").fadeOut('slow', function() {
		$(this).load("diamond-p3.html").fadeIn('slow');
		});																																																																												
});
	$("#firstpane #nav_clarity").click(function()
    {
		$(this).addClass("clarity-selected");	
		$(this).blur(function(){
		$(this).removeClass("clarity-selected");
		$(this).addClass("clarity")
    	});
		$("#graphic").fadeOut('slow', function() {
		$(this).load("diamond-p4.html").fadeIn('slow');
		});																																																																												
});
	$("#firstpane #nav_carat").click(function()
    {
		$(this).addClass("carat-selected");	
		$(this).blur(function(){
		$(this).removeClass("carat-selected");
		$(this).addClass("carat")
    	});
		$("#graphic").fadeOut('slow', function() {
		$(this).load("diamond-p5.html").fadeIn('slow');
		});																																																																												
});
	$("#firstpane #nav_cut").click(function()
    {
		$(this).addClass("cut-selected");	
		$(this).blur(function(){
		$(this).removeClass("cut-selected");
		$(this).addClass("cut")
    	});
		$("#graphic").fadeOut('slow', function() {
		$(this).load("diamond-p6.html").fadeIn('slow');
		});																																																																												
});
	$("#firstpane #nav_finish").click(function()
    {
		$(this).addClass("finish-selected");	
		$(this).blur(function(){
		$(this).removeClass("finish-selected");
		$(this).addClass("finish")
    	});
		$("#graphic").fadeOut('slow', function() {
		$(this).load("diamond-p7.html").fadeIn('slow');
		});																																																																												
});
	$("#firstpane #nav_fluo").click(function()
    {
		$(this).addClass("fluo-selected");	
		$(this).blur(function(){
		$(this).removeClass("fluo-selected");
		$(this).addClass("fluo")
    	});
		$("#graphic").fadeOut('slow', function() {
		$(this).load("diamond-p8.html").fadeIn('slow');
		});																																																																												
});	
	$("#firstpane #nav_conflict").click(function()
    {
		$(this).addClass("conflict-selected");	
		$(this).blur(function(){
		$(this).removeClass("conflict-selected");
		$(this).addClass("conflict")
    	});
		$("#graphic").fadeOut('slow', function() {
		$(this).load("diamond-p9.html").fadeIn('slow');
		});																																																																												
});
	
/*ABOUT nav*/	
	$("#firstpane #nav_about").click(function()
    {
		$(this).next("div.menu_body").slideToggle(300).siblings("div.menu_body").slideUp("slow");
		$("#graphic").fadeOut('slow', function() {
		$(this).load("about.html").fadeIn('slow');
		$("#description").fadeOut('slow');
		});	
		//get the collections sub nav children to slide up
		$("#nav_solitaire").siblings("div.menu_body").slideUp("slow");
});
	
$("#nav_company").click(function()
    {
		$(this).addClass("company-selected");	
		$(this).blur(function(){
		$(this).removeClass("company-selected");
		$(this).addClass("company")
    	});
		$("#graphic").fadeOut('slow', function() {
	$(this).load("about.html").fadeIn('slow');
		});																																																																												
});	
$("#nav_workshop").click(function()
    {
		$(this).addClass("workshop-selected");	
		$(this).blur(function(){
		$(this).removeClass("workshop-selected");
		$(this).addClass("workshop")
    	});
		$("#graphic").fadeOut('slow', function() {
	$(this).load("aboutp2.html").fadeIn('slow');
		});																																																																												
});	
$("#nav_design").click(function()
    {
		$(this).addClass("design-selected");	
		$(this).blur(function(){
		$(this).removeClass("design-selected");
		$(this).addClass("design")
    	});
		$("#graphic").fadeOut('slow', function() {
	$(this).load("aboutp3.html").fadeIn('slow');
		});																																																																												
});		
	
$("#diamondNavP1").click(function()
    {
		$("#graphic").fadeOut('slow', function() {
		$(this).html("<div id=\"diamond\"><div id=\"diamond-content\"><p>Our Diamonds</p><p>Here at A&S Jewellers we pride ourselves on stocking only the whitest, clearest certificated diamonds. We strive to ensure that no matter what your budget you will end up with a beautiful, high quality diamond that you will cherish for a lifetime.</p><p>All of our diamonds are certified by the Gemological Institute of America (GIA), the world's leading independent gemstone grading laboratory. GIA is renowned for its hi-tech methods and strict grading guidelines, enabling you, the customer, to buy with confidence.</p><p>Of course, diamond quality is not our only concern; we also make every effort to ensure that the diamonds used in our jewellery are conflict-free.</p><p>We buy polished diamonds only and work exclusively with a small number of carefully-selected diamond suppliers that are not involved in funding conflict and who adhere to the Kimberly Process.</p><div id=\"diamondNavP1\"><span id=\"float-right\"><span id=\"nav_diamondP2\">Next ></span></span></div></div></div>").fadeIn('slow');	
		});																																																																												
});	
	
	$("#nav_diamondP2").click(function()
    {
		$("#graphic").fadeOut('slow', function() {
		$(this).html("<div id=\"diamond\"><div id=\"diamond-content\"><p>Our Diamonds</p><p>Here at A&S Jewellers we pride ourselves on stocking only the whitest, clearest certificated diamonds. We strive to ensure that no matter what your budget you will end up with a beautiful, high quality diamond that you will cherish for a lifetime.</p><p>All of our diamonds are certified by the Gemological Institute of America (GIA), the world's leading independent gemstone grading laboratory. GIA is renowned for its hi-tech methods and strict grading guidelines, enabling you, the customer, to buy with confidence.</p><p>Of course, diamond quality is not our only concern; we also make every effort to ensure that the diamonds used in our jewellery are conflict-free.</p><p>We buy polished diamonds only and work exclusively with a small number of carefully-selected diamond suppliers that are not involved in funding conflict and who adhere to the Kimberly Process.</p><div id=\"diamondNavP1\"><span id=\"float-right\"><span id=\"nav_diamondP2\">Next ></span></span></div></div></div>").fadeIn('slow');	
		});																																																																												
});	
	



$("#firstpane #nav_contact").click(function()
    {
		$(this).siblings("div.menu_body").slideUp("slow");
		$("#graphic").fadeOut('slow', function() {
		$(this).load("contact.html").fadeIn('slow');
		$("#description").fadeOut('slow');
		});	
		$("#nav_solitaire").siblings("div.menu_body").slideUp("slow");
});


$("#firstpane #nav_appointment").click(function()
    {
		$("#graphic").fadeOut('slow', function() {
		$(this).load("contact.html").fadeIn('slow');
		$("#description").fadeOut('slow');
		});	
});
	
//sub nav

$("#firstpane #nav_solitaire").click(function()
    {	
	$("#graphic").fadeOut('slow', function() {
	$("#graphic").load("solitaire-slideshow.html").fadeIn('slow');
	});	
	$("#description").fadeOut('slow');
 $("#firstpane #nav_solitaire").next("div.menu_body").slideToggle(400).siblings("div.menu_body").slideUp("slow");	
});
	
//sub sub nav	
$("#firstpane #nav_round").click(function()
    {
	    $(this).next("div.menu_body").slideToggle(400).siblings("div.menu_body").slideUp("slow");
		$(this).addClass("sol-round");			
		//$(this).blur(function(){ the line beneath solves the loss of selected image problem
								
$("#nav_multi,#nav_collections,#nav_contact,#nav_diamond,#nav_testimonal,#nav_appointment,#nav_about,#nav_solitaire,#nav_multi,#nav_rings").click(function(){ $("#nav_round").removeClass("sol-round");	});															
								
		$(this).siblings("#firstpane a").click(function(){
		$("#nav_round").removeClass("sol-round");
		$("#nav_round").addClass("round")
    	});
		$("#graphic").fadeOut('slow', function() {
		$(this).load("round.html", function() {
		$(this).load("round.html").fadeIn('slow');
		});
	});	
	$("#description").fadeOut('slow');
});
		
$("#firstpane #nav_princess").click(function()
    {
	    $(this).next("div.menu_body").slideToggle(400).siblings("div.menu_body").slideUp("slow");
		$(this).addClass("sol-princess");
		
		$(this).siblings("#firstpane a").click(function(){
		$("#nav_princess").removeClass("sol-princess");
		$("#nav_princess").addClass("princess")
    	});
		$("#nav_multi,#nav_collections,#nav_contact,#nav_diamond,#nav_testimonal,#nav_appointment,#nav_about,#nav_solitaire,#nav_multi,#nav_rings").click(function(){ $("#nav_princess").removeClass("sol-princess");	});	
		$("#graphic").fadeOut('slow', function() {
		$(this).load("sol-princess.html", function() {
		$(this).load("sol-princess.html").fadeIn('slow');
		});									   
	});	
	$("#description").fadeOut('slow');
});

$("#firstpane #nav_fancy").click(function()
    {
	    $(this).next("div.menu_body").slideToggle(400).siblings("div.menu_body").slideUp("slow");
		$(this).addClass("sol-fancy");
		
		$(this).siblings("#firstpane a").click(function(){
		$("#nav_fancy").removeClass("sol-fancy");
		$("#nav_fancy").addClass("fancy")
    	});
		$("#nav_multi,#nav_collections,#nav_contact,#nav_diamond,#nav_testimonal,#nav_appointment,#nav_about,#nav_solitaire,#nav_multi,#nav_rings").click(function(){ $("#nav_fancy").removeClass("sol-fancy");	});		
		$("#graphic").fadeOut('slow', function() {
		$(this).load("sol-fancy.html", function() {
		$(this).load("sol-fancy.html").fadeIn('slow');
		});										   
	});
	$("#description").fadeOut('slow');	
});	

$("#firstpane #nav_multi").click(function()
    {
	//$("#graphic").html("<div id=\"soli-slide\"></div>");
	$("#graphic").fadeOut('slow', function() {
	$(this).load("multi-slideshow.html").fadeIn('slow');
	});	
	$("#description").fadeOut('slow');
 $("#firstpane #nav_multi").next("div.menu_body").slideToggle(400).siblings("div.menu_body").slideUp("slow");	
});


$("#firstpane #nav_round_multi").click(function()
    {
	    $(this).next("div.menu_body").slideToggle(400).siblings("div.menu_body").slideUp("slow");
		$(this).addClass("sol-round");	
		//$(this).blur(function(){ $(this).removeClass("sol-round");});	
		$(this).siblings("#firstpane a").click(function(){
		$("#nav_round_multi").removeClass("sol-round");
		$("#nav_round_multi").addClass("round_multi")
    	});
		
		$("#nav_multi,#nav_collections,#nav_contact,#nav_diamond,#nav_testimonal,#nav_appointment,#nav_about,#nav_solitaire,#nav_multi,#nav_rings").click(function(){ $("#nav_round_multi").removeClass("sol-round");	});	
		
		$("#graphic").fadeOut('slow', function() {
		$(this).load("multi-round.html", function() {
		$(this).load("multi-round.html").fadeIn('slow');
		});										   
	});	
	$("#description").fadeOut('slow');
});	

$("#firstpane #nav_princess_multi").click(function()
    {
	    $(this).next("div.menu_body").slideToggle(400).siblings("div.menu_body").slideUp("slow");
		$(this).addClass("sol-princess");
		
		$(this).siblings("#firstpane a").click(function(){
		$("#nav_princess_multi").removeClass("sol-princess");
		$("#nav_princess_multi").addClass("princess_multi")
    	});
		
		$("#nav_multi,#nav_collections,#nav_contact,#nav_diamond,#nav_testimonal,#nav_appointment,#nav_about,#nav_solitaire,#nav_multi,#nav_rings").click(function(){ $("#nav_princess_multi").removeClass("sol-princess");	});	
		$("#graphic").fadeOut('slow', function() {
		$(this).load("multi-princess.html", function() {
		$(this).load("multi-princess.html").fadeIn('slow');
		});									   
	});	
	$("#description").fadeOut('slow');
});	
	

$("#firstpane #nav_fancy_multi").click(function()
    {
	    $(this).next("div.menu_body").slideToggle(400).siblings("div.menu_body").slideUp("slow");
		$(this).addClass("sol-fancy");	
		
		$(this).siblings("#firstpane a").click(function(){
		$("#nav_fancy_multi").removeClass("sol-fancy");
		$("#nav_fancy_multi").addClass("fancy_multi")
    	});
		$("#nav_multi,#nav_collections,#nav_contact,#nav_diamond,#nav_testimonal,#nav_appointment,#nav_about,#nav_solitaire,#nav_multi,#nav_rings").click(function(){ $("#nav_fancy_multi").removeClass("sol-fancy");	});	
		$("#graphic").fadeOut('slow', function() {
		$(this).load("multi-fancy.html", function() {
		$(this).load("multi-fancy.html").fadeIn('slow');
		});	
	});
	$("#description").fadeOut('slow');	
});	
	
/*$("#firstpane #nav_rings").click(function()
    {
	    $(this).next("div.menu_body").slideToggle(400).siblings("div.menu_body").slideUp("slow");
		$("#graphic").fadeOut('slow', function() {
		$(this).load("weddings.html").fadeIn('slow');
	});
});
*/

$("#firstpane #nav_rings").click(function()
    {	
	$("#graphic").fadeOut('slow', function() {
	$(this).load("weddings-slideshow.html").fadeIn('slow');
	});	
	$("#description").fadeOut('slow');
 $("#firstpane #nav_rings").next("div.menu_body").slideToggle(400).siblings("div.menu_body").slideUp("slow");	
});


//diamond section nav
$("#firstpane #nav_round_wed").click(function()
    {
	    $(this).next("div.menu_body").slideToggle(400).siblings("div.menu_body").slideUp("slow");
		$(this).addClass("round-selected");	
		
		$(this).siblings("#firstpane a").click(function(){
		$("#nav_round_wed").removeClass("round-selected");
		$("#nav_round_wed").addClass("round_wed")
    	});
		$("#nav_multi,#nav_collections,#nav_contact,#nav_diamond,#nav_testimonal,#nav_appointment,#nav_about,#nav_solitaire,#nav_multi,#nav_rings").click(function(){ $("#nav_round_wed").removeClass("round-selected");	});	
		$("#graphic").fadeOut('slow', function() {
		$(this).load("weddings-classic.html", function() {
		$(this).load("weddings-classic.html").fadeIn('slow');
		});	
	});	
	$("#description").fadeOut('slow');
});	
$("#firstpane #nav_princess_wed").click(function()
    {
	    $(this).next("div.menu_body").slideToggle(400).siblings("div.menu_body").slideUp("slow");
		$(this).addClass("princess_wed-selected");
		
		$(this).siblings("#firstpane a").click(function(){
		$("#nav_princess_wed").removeClass("princess_wed-selected");
		$("#nav_princess_wed").addClass("princess_wed")
    	});
		$("#nav_multi,#nav_collections,#nav_contact,#nav_diamond,#nav_testimonal,#nav_appointment,#nav_about,#nav_solitaire,#nav_multi,#nav_rings").click(function(){ $("#nav_princess_wed").removeClass("princess_wed-selected");});	
		$("#graphic").fadeOut('slow', function() {
		$(this).load("weddings-diamond.html", function() {
		$(this).load("weddings-diamond.html").fadeIn('slow');
		});	
	});	
	$("#description").fadeOut('slow');
});
$("#firstpane #nav_fancy_wed").click(function()
    {
	    $(this).next("div.menu_body").slideToggle(400).siblings("div.menu_body").slideUp("slow");
		$(this).addClass("fancy_wed-selected");	
		
		$(this).siblings("#firstpane a").click(function(){
		$("#nav_fancy_wed").removeClass("fancy_wed-selected");
		$("#nav_fancy_wed").addClass("fancy_wed")
    	});
		$("#nav_multi,#nav_collections,#nav_contact,#nav_diamond,#nav_testimonal,#nav_appointment,#nav_about,#nav_solitaire,#nav_multi,#nav_rings").click(function(){ $("#nav_fancy_wed").removeClass("fancy_wed-selected");});	
		$("#graphic").fadeOut('slow', function() {
		$(this).load("weddings-designer.html", function() {
		$(this).load("weddings-designer.html").fadeIn('slow');
		});	
	});
	$("#description").fadeOut('slow');	
});





$("#firstpane #nav_testimonal").click(function()
    {
		$(this).siblings("div.menu_body").slideUp("slow");
		$("#graphic").fadeOut('slow', function() {
		$(this).load("testimonial.html").fadeIn('slow');
		$("#description").fadeOut('slow');
		});
		$("#nav_solitaire").siblings("div.menu_body").slideUp("slow");
});		


	
});