jQuery().ready(function(){


								/* $('.clickmeIn').click(function() {
											$('#putImageHere a').hide( 0, function() {});
								    		$('#putImageHere img').fadeTo('fast', 0.25, function() {
												$('#middlePane').fadeIn('fast', function() {});
										
								    		});// infaden voltooid
								   });*/
										
									$('.clickmeOut').click(function() {
								    		$('#middlePane').fadeOut('fast', function() {
												$('#putImageHere img').fadeTo('fast', 1 , function() {});
												$('#putImageHere a').show( 0, function() {});
								    		});// uitfaden voltooid
								      });
	
										
									  
									  
										/*********************************************************
										 * CLICK ACTION OP PINPOINTS IN DE MAP ZETTEN
										 ********************************************************/	
											 $('#boxMap a').click(function() { //start function when any link is clicked
												 $("#middlePane").fadeOut('fast').remove();
												 /********************* PROJECTEN ************************/
												 if($(this).attr("rel") == "project"){
													 $("#middlePane").fadeOut('fast').remove();
													 var navigatieid = $(this).attr("title_id"); //retrieve title_id of link so we can compare with php file
														$.ajax({
																method: "get", cache: "false", url:  webroot +"scripts/project.inc.php", data: "via=ajax_site&navigatieid="+navigatieid,
																success: function(html){ //so, if data is retrieved, store it in html
																		$("#overlayDetail").append("#middlePane").html(html);
																		$("#middlePane").fadeIn("slow"); //animation
																		 
																		//reload clickmeout becuase page is refreshed
																		jQuery().ready(function(){
																			
																				/*$('.clickmeIn').click(function() {
																					$('#putImageHere a').hide( 0, function() {});
																		    		$('#putImageHere img').fadeTo('fast', 0.25, function() {
																						$('#middlePane').fadeIn('fast', function() {});
																				
																		    		});// infaden voltooid
																		      });*/
																				
																				$('.clickmeOut').click(function() {
																		    		$('#middlePane').fadeOut('fast', function() {
																						$('#putImageHere img').fadeTo('fast', 1 , function() {});
																						$('#putImageHere a').show( 0, function() {});
																		  });// uitfaden voltooid
																		      });
											
																				 
																		// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
																		});
																		Cufon.replace("#middlePane h1");
																		Cufon.replace("#middlePane h2");
																		Cufon.replace("#middlePane h3");
															 	}
														});
												
											 }
											 
											 /*********************** ZONES ***************************/
											 else{
												 $("#middlePane").fadeOut('fast').remove();
												 var zoneid = $(this).attr("title_id"); //retrieve title_id of link so we can compare with php file
													$.ajax({
															method: "get", cache: "false", url:  webroot +"scripts/zone.inc.php", data: "via=ajax_site&zoneid="+zoneid,
															success: function(html){ //so, if data is retrieved, store it in html
																	$("#overlayDetail").append("#middlePane").html(html);
																	$("#middlePane").fadeIn("slow"); //animation
																	 
																	//reload clickmeout becuase page is refreshed
																	jQuery().ready(function(){
																		
																			
																			
																			$('.clickmeOut').click(function() {
																	    		$('#middlePane').fadeOut('fast', function() {
																					$('#putImageHere img').fadeTo('fast', 1 , function() {});
																					$('#putImageHere a').show( 0, function() {});
																	  });// uitfaden voltooid
																	      });
																	
																			$('#boxMap a').click(function() { //start function when any link is clicked
																				 $("#middlePane").fadeOut('fast').remove();
																				 /********************* PROJECTEN ************************/
																				 if($(this).attr("rel") == "project"){
																					 var navigatieid = $(this).attr("title_id"); //retrieve title_id of link so we can compare with php file
																						$.ajax({
																								method: "get", cache: "false", url:  webroot +"scripts/project.inc.php", data: "via=ajax_site&navigatieid="+navigatieid,
																								success: function(html){ //so, if data is retrieved, store it in html
																										$("#overlayDetail").append("#middlePane").html(html);
																										$("#middlePane").fadeIn("slow"); //animation
																										 
																										//reload clickmeout becuase page is refreshed
																										jQuery().ready(function(){
																											
																											
																												
																												$('.clickmeOut').click(function() {
																										    		$('#middlePane').fadeOut('fast', function() {
																														$('#putImageHere img').fadeTo('fast', 1 , function() {});
																														$('#putImageHere a').show( 0, function() {});
																										  });// uitfaden voltooid
																										      });
																			
																											  
																										
																										// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
																										});
																										Cufon.replace("#middlePane h1");
																										Cufon.replace("#middlePane h2");
																										Cufon.replace("#middlePane h3");
																							 	}
																						});
																				
																			 }	  
																			 });  
																			 $("select").change(function() { //start function when any link is clicked
																				 
																				 var selected = $("select option:selected");     
																				 var navigatieid = selected.val(); //retrieve title_id of link so we can compare with php file
																				 $("#middlePane").fadeOut('fast').remove();
																					$.ajax({
																							method: "get", cache: "false", url:  webroot +"scripts/project.inc.php", data: "via=ajax_site&navigatieid="+navigatieid,
																							success: function(html){ //so, if data is retrieved, store it in html
																								$("#overlayDetail").append("#middlePane").html(html);
																								$("#middlePane").fadeIn("slow"); //animation
																									 
																									//reload clickmeout becuase page is refreshed
																									jQuery().ready(function(){
																										
																											
																											
																											$('.clickmeOut').click(function() {
																									    		$('#middlePane').fadeOut('fast', function() {
																													$('#putImageHere img').fadeTo('fast', 1 , function() {});
																													$('#putImageHere a').show( 0, function() {});
																									  });// uitfaden voltooid
																									      });
																		
																										  
																										 
																										//$("form.jqtransform").jqTransform();
																									// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
																									});
																									Cufon.replace("#middlePane h1");
																									Cufon.replace("#middlePane h2");
																									Cufon.replace("#middlePane h3");
																						 	}
																					});
																			
																		});
																	
																		
																	// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
																	});
																	Cufon.replace("#middlePane h1");
																	Cufon.replace("#middlePane h2");
																	Cufon.replace("#middlePane h3");
														 	}
													}); 
											}
											 
											
										});
										
										 /*********************************************************
											 * CHANGE ACTION OP DE SELECT ZETTEN
											 ********************************************************/	
											 $("select").change(function() { //start function when any link is clicked
												 
												 var selected = $("select option:selected");     
												 var navigatieid = selected.val(); //retrieve title_id of link so we can compare with php file
												 $("#middlePane").fadeOut('fast').remove();
													$.ajax({
															method: "get", cache: "false", url:  webroot +"scripts/project.inc.php", data: "via=ajax_site&navigatieid="+navigatieid,
															success: function(html){ //so, if data is retrieved, store it in html
																		$("#overlayDetail").append("#middlePane").html(html);
																		$("#middlePane").fadeIn("slow"); //animation
																	 
																	//reload clickmeout becuase page is refreshed
																	jQuery().ready(function(){
																		
																		
																			$('.clickmeOut').click(function() {
																	    		$('#middlePane').fadeOut('fast', function() {
																					$('#putImageHere img').fadeTo('fast', 1 , function() {});
																					$('#putImageHere a').show( 0, function() {});
																	  });// uitfaden voltooid
																	      });
										
																		  
																		 
																		//$("form.jqtransform").jqTransform();
																	// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
																	});
																	Cufon.replace("#middlePane h1");
																	Cufon.replace("#middlePane h2");
																	Cufon.replace("#middlePane h3");
														 	}
													});
											
										});
											 /*********************************************************
												 * CLICK ACTION OP BREADCRUMB
												 ********************************************************/
												 $('#breadlink').click(function() { //start function when any link is clicked
													 $("#middlePane").fadeOut('fast').remove();
														 var zoneid = $(this).attr("title_id"); //retrieve title_id of link so we can compare with php file
													 	//alert(zoneid);
													 	$.ajax({
																method: "get", cache: "false", url:  webroot +"scripts/zone.inc.php", data: "via=ajax_site&zoneid="+zoneid,
																success: function(html){ //so, if data is retrieved, store it in html
															 			$("#overlayDetail").append("#middlePane").html(html);
																		$("#middlePane").fadeIn("slow"); //animation
																				 
																		//reload clickmeout becuase page is refreshed
																		jQuery().ready(function(){
																			
																				
																				
																				$('.clickmeOut').click(function() {
																		    		$('#middlePane').fadeOut('fast', function() {
																						$('#putImageHere img').fadeTo('fast', 1 , function() {});
																						$('#putImageHere a').show( 0, function() {});
																		    			});// uitfaden voltooid
																				});
																		
																				
																			
																		// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
																		});
																		Cufon.replace("#middlePane h1");
																		Cufon.replace("#middlePane h2");
																		Cufon.replace("#middlePane h3");
															 	}
														
														});
													 
													 
													 });
												 
												 
												 $('#breadlink_terug').click(function() { //start function when any link is clicked
													 $("#middlePane").fadeOut('fast').remove();
														 var zoneid = $(this).attr("title_id"); //retrieve title_id of link so we can compare with php file
													 	//alert(zoneid);
													 	$.ajax({
																method: "get", cache: "false", url:  webroot +"scripts/zone.inc.php", data: "via=ajax_site&zoneid="+zoneid,
																success: function(html){ //so, if data is retrieved, store it in html
															 			$("#overlayDetail").append("#middlePane").html(html);
																		$("#middlePane").fadeIn("slow"); //animation
																				 
																		//reload clickmeout becuase page is refreshed
																		jQuery().ready(function(){
																			
																				
																				
																				$('.clickmeOut').click(function() {
																		    		$('#middlePane').fadeOut('fast', function() {
																						$('#putImageHere img').fadeTo('fast', 1 , function() {});
																						$('#putImageHere a').show( 0, function() {});
																		    			});// uitfaden voltooid
																				});
																		
																				
																			
																		// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
																		});
																		Cufon.replace("#middlePane h1");
																		Cufon.replace("#middlePane h2");
																		Cufon.replace("#middlePane h3");
															 	}
														
														});
													 
													 
													 });
												 
													// TABS CLICKS ZETTEN
												 $('#tabs a').click(function() { //start function when any link is clicked
													 	$("#middlePane").fadeOut('fast').remove();
													 	var navigatieid = $(this).attr("title_id"); //retrieve title_id of link so we can compare with php file
														var e = $(this).attr("rel"); //retrieve title_id of link so we can compare with php file
														$.ajax({
																		method: "get", cache: "false", url:  webroot +"scripts/project.inc.php", data: "via=ajax_site&navigatieid="+navigatieid+"&e=" + e,
																		success: function(html){ //so, if data is retrieved, store it in html
																				$("#overlayDetail").append("#middlePane").html(html);
																				$("#middlePane").fadeIn("slow"); //animation
																				 
																				//reload clickmeout becuase page is refreshed
																				jQuery().ready(function(){
																					
																						
																						$('.clickmeOut').click(function() {
																							$('#middlePane').fadeOut('fast', function() {
																								$('#putImageHere img').fadeTo('fast', 1 , function() {});
																								$('#putImageHere a').show( 0, function() {});
																				  });// uitfaden voltooid
																					  });
													
																					  
																					  // select ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
																					  $(".jqTransformSelectWrapper ul li a").click(function(){
																						$("#boxPhotoFrame").animate({
																						"opacity": "toggle"
																					}, { "duration": 1000, "easing": "easeInOutExpo", queue: true });//Toon boxOverview
																					});	
																					//$("form.jqtransform").jqTransform();
																				// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
																				});
																				Cufon.replace("#middlePane h1");
																				Cufon.replace("#middlePane h2");
																				Cufon.replace("#middlePane h3");
																		}
																});
														
																
												 }); 		
											  
											  
									
								// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
											
								});