var initialLocation;
				var map, allLayer;
				var directionsService;
				var layerID = '2109289';
				var browserSupportFlag =  new Boolean();
				
				window.center = new google.maps.LatLng(54.34214886448341, -3.18603515625);
				
				var openStreetMap;
				if (typeof google !== 'undefined') {
						openStreetMap = new google.maps.ImageMapType({
							getTileUrl: function(coord, zoom) {
								return "http://tile.openstreetmap.org/" + zoom + "/" + coord.x + "/" + coord.y + ".png";
							},
							tileSize:	new google.maps.Size(256, 256),
							isPng:		true,
							alt:		'Open Street Map layer',
							name:		'Open Street Map',
							maxZoom:	19
						});
					}
				// Google map
				function philSmithMap(zoom) {
				
				// initialize directions
				
				//var latlng = new google.maps.LatLng(52.41403570985502, -1.197509765625);
					
					var myOptions = {
					  scrollwheel: false,
					  zoom: zoom,
					  center: center,
					  mapTypeId: 'OSM',
				
						mapTypeControlOptions: {
							mapTypeIds:	['OSM', google.maps.MapTypeId.ROADMAP, google.maps.MapTypeId.SATELLITE],
							style:		google.maps.MapTypeControlStyle.DEFAULT
						}
					};
					
					var map = new google.maps.Map(document.getElementById("map"), myOptions);

					
				/*	
				if(navigator.geolocation) {
					browserSupportFlag = true;
					navigator.geolocation.getCurrentPosition(function(position) {
					  initialLocation = new google.maps.LatLng(position.coords.latitude,position.coords.longitude);
					  map.setCenter(initialLocation);
					}, function() {
					  handleNoGeolocation(browserSupportFlag);
					});
				  } else {
					browserSupportFlag = false;
					handleNoGeolocation(browserSupportFlag);
				  }
				  
				  function handleNoGeolocation(errorFlag) {
					if (errorFlag == true) {
					  initialLocation = window.center;
					} else {
					  initialLocation = window.center;
					}
					map.setCenter(initialLocation);
				  }
					
					*/
										
					window.onresize = function() {
						map.setCenter(window.center);
					}
					
				  	// Initialize the directions display
					directionsDisplay = new google.maps.DirectionsRenderer();
					directionsDisplay.setMap(map);
					directionsDisplay.setPanel(document.getElementById('results'));

				// Initialize the directions service
				directionsService = new google.maps.DirectionsService();
				  
				  
				  	
				  	var allLayer = new google.maps.FusionTablesLayer({
					  query: {
						select: 'Postcode',
						from: layerID
						},
						styles: [{
						  where: '\'Sex\' = \'m\'',
						  markerOptions: {
							iconName: "small_blue"
						  }
						},{
						  where: '\'Sex\' = \'w\'',
						  markerOptions: {
							iconName: "small_red"
						  }
						},{
						  where: '\'Sex\' = \'u\'',
						  markerOptions: {
							iconName: "small_green"
						  }
					   }],
					map: map
					});
					map.mapTypes.set('OSM', openStreetMap);
					//allLayer.setMap(map);
					
					// dimension the direction results window correctly
					var $dirResults				= $('body.contactMap #mainContainer #results'),
						$dirMap					= parseInt($('body.contactMap #mainContainer #map').width()),
						$dirContainerWidth		= parseInt($('body.contactMap #mainContainer').width()),
						$dirContainerHeight		= parseInt($('body.contactMap #mainContainer').height()),
						$resultsPadding			= parseInt($dirResults.css('paddingLeft')) + parseInt($dirResults.css('paddingRight')),
						$computedResultsWidth  	= parseInt((($dirContainerWidth - $dirMap) - 20) - $resultsPadding);
					
					$dirResults.css('width',$computedResultsWidth);
					$dirResults.css('height',$dirContainerHeight);
					if($computedResultsWidth < 245){
						$dirResults.css('fontSize','10px');
					}
					
				  // Add a click listener to the layer that creates a new infowindow
				  // with directions text input
				  google.maps.event.addListener(allLayer, 'click', function(e) {
					sainsLogo = '<img src="img/sainsburyLogo.jpg" /><br />'
					e.infoWindowHtml = sainsLogo + '<p class="mapAddress">' + e.row['Address'].value + '</p>';
					
					e.infoWindowHtml = e.infoWindowHtml +
					  "<br /><p><a style='color: #FF6600;' href='http://www.sainsburys.co.uk'>Buy online here.</a></p>" +
					  "<label><strong>Enter your postcode</strong></label>" +
					  "<br /><input type=\"text\" id=\"begin\" />" +
					  "<br /><input id='btnGetDIrections' type=\"button\" value=\"Get directions to here\" onclick=\"computeDirections(document.getElementById('begin').value, " +
						e.latLng.lat() + ", " + e.latLng.lng() + ");\" />";
				  });
				}
				
			// Get the directions
			function computeDirections(start, endlat, endlng) {
			  var request = {
				origin: start, 
				destination: new google.maps.LatLng(endlat, endlng),
				travelMode: google.maps.DirectionsTravelMode.DRIVING
			  };
			  directionsService.route(request, function(response, status) {
				if (status == google.maps.DirectionsStatus.OK) {
				  directionsDisplay.setDirections(response);
				} else {
				  alert('Error generating directions');
				}
			  });
			}


			// fix ios resize bug
			if (navigator.userAgent.match(/iPhone/i) || navigator.userAgent.match(/iPad/i)) {
			  var viewportmeta = document.querySelector('meta[name="viewport"]');
			  if (viewportmeta) {
				viewportmeta.content = 'width=device-width, minimum-scale=1.0, maximum-scale=1.0';
				document.body.addEventListener('gesturestart', function() {
				  viewportmeta.content = 'width=device-width, minimum-scale=0.25, maximum-scale=1.6';
				}, false);
			  }
			}

/*
	 --------------------------------------------------------------------------
	| Doc ready
*/
$(function(){
	var $body = $('body');
	var $js = false;
	// initialise js boolean
	if($body.hasClass('js')){
		$js = true;
	}
	// product specific
	if($body.hasClass('products')){
		// Array of images:
		var imageArray = [
			'img/products/full/blonde.jpg',
			'img/products/full/brunette.jpg',
			'img/products/full/curly.jpg',
			'img/products/full/curly-style.jpg',
			'img/products/full/dryClean.jpg',
			'img/products/full/hold.jpg',
			'img/products/full/intensive.jpg',
			'img/products/full/moisture.jpg',
			'img/products/full/shape.jpg',
			'img/products/full/shine.jpg',
			'img/products/full/shine-style.jpg',
			'img/products/full/sos.jpg',
			'img/products/full/sos-style.jpg',
			'img/products/full/straight.jpg',
			'img/products/full/straight-style.jpg',
			'img/products/full/vitality.jpg',
			'img/products/full/volume.jpg',
			'img/products/full/volume-style.jpg',
			'img/products/full/wavy.jpg'
		];
		 
		// Add hidden element
		var hidden = $('body').append('<div id="img-cache" style="display:none" />').children('#img-cache');
		 
		// Add images to hidden element.
		$.each(imageArray, function (i, val) {
		  $('<img/>').attr('src', val).appendTo(hidden);
		});	
		
		
		// add typestaches class
		$('.colWrapper').each(function(){
			var $$ = $(this); 
			if(!$$.children().siblings('.col').length-1){
				$$.children().siblings('.col:first').find('h2').css('textIndent','-99999px');
				$$.children().siblings('.col:last').find('h2').css('width','396px');
			}
		});
		
	}// has class products
		
	// masonry
	function masonry(container, element){
		$(container).masonry({
			columnWidth: 218,
			itemSelector: $(element),
			isFitWidth: true,
			isAnimated: true,
			isResizable: true,
			  animationOptions: {
				duration: 1000,
				easing: 'easeInOutExpo',
				queue: false
			  }
		});
	}
	// isotope
	function isotope(container, element){
		$(container).isotope({
			masonry: {
				columnWidth: 218
		  	},
			itemSelector: $(element),
			isFitWidth: true,
			isAnimated: true,
			animationEngine : 'best-available',
			isResizable: true,
			  animationOptions: {
				duration: 1000,
				easing: 'easeInOutExpo',
				queue: false
			  }
		});
	}
	if(!$body.hasClass('home')){
		masonry('#cols','.colWrapper');
	//isotope('#cols','.colWrapper');
	}
	$("a.stdFancybox").fancybox({
		'transitionIn'		:	'elastic',
		'transitionOut'		:	'elastic',
		'speedIn'			:	600, 
		'speedOut'			:	200,
		'overlayColor'		:	'#000000',
		'overlayOpacity'	:	0.9
	});
	$("a.stdFancyboxControls").click(function(e) {
		e.preventDefault();									  
		$.fancybox([ // manually enter all images that are to appear on the homepage gallery
			{'href'	: 'img/celebrityGallery/celeb-01.jpg','title': ''},
			{'href'	: 'img/celebrityGallery/celeb-02.jpg','title': ''},
			{'href'	: 'img/celebrityGallery/celeb-03.jpg','title': ''},
			{'href'	: 'img/celebrityGallery/celeb-04.jpg','title': ''},
			{'href'	: 'img/celebrityGallery/celeb-05.jpg','title': ''},
			{'href'	: 'img/celebrityGallery/celeb-06.jpg','title': ''},
			{'href'	: 'img/celebrityGallery/celeb-07.jpg','title': ''},
			{'href'	: 'img/celebrityGallery/celeb-08.jpg','title': ''},
			{'href'	: 'img/celebrityGallery/celeb-09.jpg','title': ''},
			{'href'	: 'img/celebrityGallery/celeb-10.jpg','title': ''},
			{'href'	: 'img/celebrityGallery/celeb-11.jpg','title': ''},
			{'href'	: 'img/celebrityGallery/celeb-12.jpg','title': ''},
			{'href'	: 'img/celebrityGallery/celeb-13.jpg','title': ''},
			{'href'	: 'img/celebrityGallery/celeb-14.jpg','title': ''},
			{'href'	: 'img/celebrityGallery/celeb-15.jpg','title': ''},
			{'href'	: 'img/celebrityGallery/celeb-16.jpg','title': ''},
			{'href'	: 'img/celebrityGallery/celeb-17.jpg','title': ''},
			{'href'	: 'img/celebrityGallery/celeb-18.jpg','title': ''},
			{'href'	: 'img/celebrityGallery/celeb-19.jpg','title': ''}
		], {
			'padding'			: 	0,
			'transitionIn'		: 	'none',
			'transitionOut'		: 	'fade',
			'type'              : 	'image',
			'changeFade'        : 	500,
			'speedIn'			:	600, 
			'speedOut'			:	200,
			'overlayColor'		:	'#000000',
			'overlayOpacity'	:	0.9
		});
	});

	$("a#mapFancybox").fancybox({
		'transitionIn'		:	'elastic',
		'transitionOut'		:	'elastic',
		'speedIn'			:	600, 
		'speedOut'			:	200,
		'overlayColor'		:	'#000000',
		'overlayOpacity'	:	0.9,
		'scrolling'			: 	'no',
		'width'				: 	'100%',
		'height'			: 	'100%',
        'autoScale'     	: 	false,
		'type'				: 	'iframe',
		'centerOnScroll'	:	true
	});
		// menu hide/show
		var $navPane = $('#nav');
		var $nav = $('#nav ul');
		var $toggle = $('#nav a#toggle');
		var $mainContainer = $('#mainContainer');
		$toggle.click(function(e){
			e.preventDefault();
			if(!$(this).hasClass('activeToggle')){
				$nav.fadeOut('slow',function(){
					$navPane.animate({
						'width'	: 47
					},1000, 'easeInOutExpo',function(){
						$mainContainer.animate({
							'paddingLeft'	: 60
						},1000, 'easeInOutExpo',function(){
							masonry('#cols','.colWrapper');
							//isotope('#cols','.colWrapper');
						});
					});
					$toggle.addClass('activeToggle');
				});
			}else{
				if($mainContainer.length > 0){ //if there is no #mainContainer, just do the side nav (i.e. homepage)
					$mainContainer.animate({
							'paddingLeft'	: 144
						},1000, 'easeInOutExpo',function(){
							$navPane.animate({
								'width'	: 144
							},1000, 'easeInOutExpo',function(){
								$nav.fadeIn('slow');
								$toggle.removeClass('activeToggle');
								masonry('#cols','.colWrapper');
								//isotope('#cols','.colWrapper');
							});		
						});
				}else{
					$navPane.animate({
						'width'	: 144
					},1000, 'easeInOutExpo',function(){
								$nav.fadeIn('slow');
								$toggle.removeClass('activeToggle');
					});
				}
			}										   
		});
		// menu hover fades
		var $navLink = $('#nav ul li a');
		$navLink.hover(
			function(){
				var $$ = $(this);
				$$.animate({
					'color'			: '#FFFFFF'
				});
			},
			function(){
				var $$ = $(this);
				$$.animate({
					'color' : '#C8B6A4'
				});
		});
		// hover opacity and other interaction fades
		$('.toFade .colWrapper .col>a').hoverIntent(
			function(){
				var $$ = $(this);
				$('.col').not($$.parent('.col')).animate({
													'opacity': 0.2
												},200);
					if($('body').hasClass('press')){
						$$.children('h3').animate({
												 	'color': '#FFFFFF'
												 });
					}	
			},
			function(){
				var $$ = $(this);
				$('.col').animate({'opacity': 1},500);
					if($('body').hasClass('press')){
						$$.children('h3').animate({
												 	'color': '#CCCCCC'
												 });
					}	
			}
		);
		// general opacity fades
		$('.toFadeStd').hover(
			function(){
				var $$ = $(this);
				$$.animate({'opacity': 0.7},500);
			},
			function(){
				var $$ = $(this);
				$$.animate({'opacity': 1},500);
		});
		// triggered on resize
		$(window).resize(function(){
			// adaptive behavioural enhancement
			// ensure wrapping nav has corresponding maincontainer padding
				if($(window).width() < 480){
					var origNavHeight	= parseInt($('#nav').height());
					var navHeight 		= parseInt($('#nav').height());
					var topPad 			= parseInt($('#nav').css('paddingTop'));
					var bottomPad 		= parseInt($('#nav').css('paddingBottom'));
					
					var navHeightPad = navHeight + (topPad + bottomPad);
			
					$('#mainContainer').css('paddingTop',navHeightPad);
				
				} else if($(window).width() > 768){
					$('#mainContainer').css('paddingTop',0);	
				} else {
					$('#mainContainer').css('paddingTop',55);	
				}
			// correct the position of the controls on window resize
			correctControls();
			correctCols();
			
			
		});
			if($('body').hasClass('contactMap')){
				//pass window width in
				var zoom;
				if($(window).width() > 640){
					zoom = 6;
				} else {
					zoom = 5;
				}	
				philSmithMap(zoom);	  	
			}
			if($('body').hasClass('fullImage')){
				// get src for the image
				var imgSrc = $('img.overlay').attr('src');	
				// remove from dom
				$('div#fullSizedBg').remove();
				// load the supersized one
					$.supersized({
						slides  :  	
							[{
								image : imgSrc
							}]
					}); 				
			}

		// correct the width of the container cols on the about page
			function correctCols(){
				$aboutPhil					= parseInt($('#aboutPhil').width());
				$windowWidth				= $(window).width();
				$aboutPhilContainer			= $('#aboutPhil .container');
				$aboutPhilMargin			= parseInt($('#aboutPhil').css('marginLeft')) / 4;
				$aboutPhilContainerMargin	= parseInt($aboutPhilContainer.css('marginRight'));
				//$('#aboutPhil').width($windowWidth);
				$aboutPhilContainer.width(($aboutPhil / 4) - ($aboutPhilMargin + $aboutPhilContainerMargin));
			}
			correctCols();

		/* ----------------------------------------------------------------------|  
		/* ----------------------------------------------------------------------| 
		/* ----------------------------------------------------------------------|
		|  product details overlay section
		

		
		|  Load in product overlay components
		*/  
	
		var $productMask 		= "<div id='productOverlayMask'></div>";
		var $productControls 	= "<div id='productOverlayControls'><a href='#' id='left' class='lr'></a><a href='#' id='right' class='lr'></a><a href='#' id='close'></a></div>";
		var $productDetail 		= "<div id='productDetail'>";
		$productDetail 			+= "<img src='' id='mainLightboxImage' />";
		// benefits
		$productDetail 			+= "<div id='benefits' class='detailPopup left lowerPopup'><a class='productExpand' href='#'>Benefits</a><div class='detailPopupContent'><p></p></div></div>";
		// usage
		$productDetail 			+= "<div id='usage' class='detailPopup left'><a class='productExpand' href='#'>Usage</a><div class='detailPopupContent'><p></p></div></div>";
		// description
		$productDetail 			+= "<div id='description' class='detailPopup right'><a class='productExpand' href='#'>Description</a><div class='detailPopupContent'><div class='inner'></div></div></div>";
		$productDetail 			+= "<div id='related' class='detailPopup right lowerPopup'><a class='productExpand' href='#'>Use with</a><div class='detailPopupContent'><p></p></div></div>";
		$productDetail 			+= "";
		$productDetail 			+= "</div>";
		
		$body.append($productDetail+$productMask+$productControls);

		/* ----------------------------------------------------------------------  
		|  Product Detail Overlay
		*/  
		var $opacity 	= $('#productOverlayMask'),
			$controls 	= $('#productOverlayControls'),
			$close		= $('#productOverlayControls a#close'),
			$lr			= $('#productOverlayControls a.lr');
		 
		// correct the position of the left and right controls [on doc load]
		function correctControls(){
			var newLrTop = ($(window).height() / 2) - ($lr.height() / 2);
			$lr.css('top', newLrTop);
		}
		correctControls(); 
		// expand / collapse popup
		// ------------------------------------------------------------------------
		// 
		$('a.productExpand').click(function(e){
			e.preventDefault();
			
			var $$	= $(this);
			if(!$$.hasClass('open')){
				$$.next('.detailPopupContent').show();
				$$.addClass('open');
			} else if($$.hasClass('open')) {
				$$.next('.detailPopupContent').fadeOut();
				$$.removeClass('open');
			}
		});
		
		// closes
		// ------------------------------------------------------------------------
		// close opaque mask on click
			$('#productOverlayMask').click(function(){
				$(this).fadeOut();
				$controls.fadeOut();
				$('#productDetail').fadeOut(function(){
					$('.detailPopupContent .productType').remove();	
					$('.detailPopupContent').hide();
					$('a.productExpand').removeClass('open');
				});
			});
			$('#productDetail').children(':not(.detailPopup)').click(function(){
				$('#productDetail').fadeOut(function(){												 
					$('.detailPopupContent .productType').remove();	
					$('.detailPopupContent').hide();
					$('a.productExpand').removeClass('open');
				});
				$controls.fadeOut();
				$opacity.fadeOut(100);
			});
			// close all
			$close.click(function(){
				$opacity.fadeOut(100);
				$controls.fadeOut(100);
				$('#productDetail').fadeOut(function(){
					$('.detailPopupContent .productType').remove();		
					$('.detailPopupContent').hide();
					$('a.productExpand').removeClass('open');
				});
			});
		
			// the function to get relevant info for the product overlay
			function switchUpOverlay($newOverlayIndex){
				
							var $siblingIndex;
							var $relatedContainer = $('#related');
							// locating and adding related items
							if(!window.currentProductIndex.parent().siblings('.col').length-1){
								
								 $relatedContainer.show();
								 $siblingIndex = window.currentProductIndex.parent().siblings().children('a.product');
								 // extract featured info
								 var	 $featuredImg		= $siblingIndex.children('.imageWrapper').html(),
								 		 $featuredTitles	= $siblingIndex.children('.productTypeContainer').html();
																				   
							} else {
								$relatedContainer.hide();
							}
							
							// assign the rest of the results
							var	 $$benefit 					= $('h4', $newOverlayIndex).text(),
								 $$description				= $('.productTypeContainer', $newOverlayIndex).html(),
								 $$usage					= $('.usage', $newOverlayIndex).html(),
								 $$imgSrc 					= $('img', $newOverlayIndex).attr('src'),
								 $fullImgSrc 				= $$imgSrc.replace('thumbs','full'),
								 $pngSwitcher				= $fullImgSrc.replace('png','jpg'),
								 $detailPopup 				= $('.detailPopup'),
								 $benefitsPopupText 		= $('#benefits p'),
								 $relatedPopupText			= $('#related .detailPopupContent');
								 $usagePopupText			= $('#usage .detailPopupContent'),
								 $descriptionPopupText		= $('#description .detailPopupContent');
								 
							// add the image
							 $('#productDetail>img').attr('src', $pngSwitcher).fadeIn('slow', function(){correctPopups()},detectFirstLast());
							 // add benefits 
							 $benefitsPopupText.text($$benefit);
							 // add usage
							 $usagePopupText.empty().append($$usage);
							 // add description
							 $descriptionPopupText.empty().append($$description);
							 // related
							 $relatedPopupText.empty().prepend($featuredImg+'<div class="inner">'+$featuredTitles+'</div>');
					
					}
		
					// correct the position of the content boxes
					function correctPopups(){
						
						var $prodImgCorr 	= $('#productDetail img#mainLightboxImage'),
							$position		= $prodImgCorr.position(),
							$prodImgWidth 	= $prodImgCorr.width(),
							$prodImgLeft	= ($(window).width() / 2) - ($prodImgWidth / 2),
							$prodImgRight	= (parseInt($prodImgLeft) + parseInt($prodImgWidth)),
							$prodImgTop		= (parseInt($position.top)) + (parseInt($prodImgCorr.css('marginTop'))),
							$leftWidth		= parseInt($('.left').width()),
							$rightWidth		= parseInt($('.right').width()),
							$usageHeight	= (parseInt($('#usage').height()) + (parseInt($('#usage').css('paddingTop')) +  parseInt($('#usage').css('paddingBottom'))));
						
						// corrections of left and rights
						$('.left').each(function(){
							$(this).css('left',$prodImgLeft - ($(this).width() - 20));
						});
						$('.right').each(function(){
							$(this).css('left',($prodImgRight - 20));
						});
					
						// manual correction of the tops
						
							// set all as default 									
							$('.detailPopup').each(function(){
								$(this).css('top',$prodImgTop);
							});
							// individuals
							$('.lowerPopup').css('top',(($prodImgTop + $usageHeight) + 120));
					}
										
			
			// fade in's
			// ------------------------------------------------------------------------
			// product click event
				
				// default a link click - pass itself in
				if($(window).width() > 620){ // constrained by resolution
					// default product link
					$('a.product').click(function(e){
						e.preventDefault();
							// disable scrolling when the overlay is active
							 $('#productDetail').mousewheel(function(e) {
								  e.preventDefault();	 
							 });
							
							var	 $$ 						= $(this);
							
							window.currentProductIndex		= $$;
							
							switchUpOverlay($$);
							 
							 // fade in mask & controls
							 $opacity.fadeIn(100, function(){
								 $controls.fadeIn(100);	
									$('#productDetail').fadeIn(function(){
																		
										
										// correction calls
										correctPopups();	
										$(window).resize(function(){
											correctPopups();
										});
									});
							 });
					
					});
					
					function detectFirstLast(){
						if(window.currentProductIndex.closest('.colWrapper').prev('.colWrapper').length-1){
							$('a#left').css('display','none');
						}else if(window.currentProductIndex.closest('.colWrapper').next('.colWrapper').length-1){
							$('a#right').css('display','none');
						}else{
							$('a#right, a#left').css('display','block');
						}
					}
					// function to reset global to previous or next
					// ----------------------------------------------------------------------------------------------------------------
					function setGlobalDirection($globalDirection){
						// previous
						// ----------------------------------------------------------------------------------------------------------------
						if($globalDirection == 'prev'){
							if(!window.currentProductIndex.closest('.colWrapper').prev('.colWrapper').length-1){ // check if it's NOT the first
							
								// check if $$ has siblings
								if(!window.currentProductIndex.parent().siblings('.col').length-1){ // up a level there are more cols i.e. has siblings
									if(!window.currentProductIndex.parent().prev('.col').length-1){ // up a level there is a col and it's before 
											window.currentProductIndex = window.currentProductIndex.closest('.col')
																									   .prev()
																									   .children('a.product');
									} else {
											if(!window.currentProductIndex.closest('.colWrapper').prev().children('.col').siblings().length-1){
												window.currentProductIndex = window.currentProductIndex.closest('.colWrapper')
																										   .prev()
																										   .children('.col:last')
																										   .children('a.product');
											} else {
												window.currentProductIndex = window.currentProductIndex.closest('.colWrapper')
																										   .prev()
																										   .children('.col')
																										   .children('a.product');
											}
									}
								} else if(window.currentProductIndex.parent().siblings('.col').length-1){ // else if there are no siblings
											if(!window.currentProductIndex.closest('.colWrapper').prev().children('.col').siblings().length-1){
												window.currentProductIndex = window.currentProductIndex.closest('.colWrapper')
																										   .prev()
																										   .children('.col:last')
																										   .children('a.product');
											} else {
												window.currentProductIndex = window.currentProductIndex.closest('.colWrapper')
																										   .prev()
																										   .children('.col')
																										   .children('a.product');
											}
								}
							//console.log(window.currentProductIndex); // the previous in the dom	
							} // check if it's the first
						// next
						// ----------------------------------------------------------------------------------------------------------------
						} else if($globalDirection == 'next'){
							if(!window.currentProductIndex.closest('.colWrapper').next('.colWrapper').length-1){ // check if it's NOT the last	
								// check if $$ has siblings
								if(!window.currentProductIndex.parent().siblings('.col').length-1){ // has siblings
									if(!window.currentProductIndex.parent().next('.col').length-1){
											window.currentProductIndex = window.currentProductIndex.closest('.col')
																							   .next()
																							   .children('a.product');
									} else {
											if(!window.currentProductIndex.closest('.colWrapper').next().children('.col').siblings().length-1){
												window.currentProductIndex = window.currentProductIndex.closest('.colWrapper')
																										   .next()
																										   .children('.col:first')
																										   .children('a.product');
											} else {
												window.currentProductIndex = window.currentProductIndex.closest('.colWrapper')
																										   .next()
																										   .children('.col')
																										   .children('a.product');
											}
									}
								} else if(window.currentProductIndex.parent().siblings('.col').length-1){ // else if there are no siblings
											if(!window.currentProductIndex.closest('.colWrapper').next().children('.col').siblings().length-1){
												window.currentProductIndex = window.currentProductIndex.closest('.colWrapper')
																										   .next()
																										   .children('.col:first')
																										   .children('a.product');
											} else {
												window.currentProductIndex = window.currentProductIndex.closest('.colWrapper')
																										   .next()
																										   .children('.col')
																										   .children('a.product');
											}
								}						
							//console.log(window.currentProductIndex); // the next in the dom	
							}
						}// direction if statement
					} // global direction function
					
					// left and right events
					// ----------------------------------------------------------------------------------------------------------------
					
					$('a#left').click(function(e){ // previous
						e.preventDefault();		
						var $$ = $('this');
						setGlobalDirection('prev');	
						$('#productDetail>img').fadeOut('slow', function(){
							switchUpOverlay(window.currentProductIndex);
						});
						
					});
					// ----------------------------------------------------------------------------------------------------------------
					$('a#right').click(function(e){ // next
						e.preventDefault();
						var $$ = $('this');
						setGlobalDirection('next');	
						$('#productDetail>img').fadeOut('slow', function(){
							switchUpOverlay(window.currentProductIndex);
						});
						
					});
				
				} // if statement for resolution
		// viewport debugger and mediaquery tester
		//------------------------------------------------------------------------
		//------------------------------------------------------------------------
		//if($('body').hasClass('mqDebug')){
/*
			$('body').append('<p id="windowDimensions"></p>');
			$(window).resize(function(){
				var height = $(window).height();
				var width = $(window).width();
				$('p#windowDimensions').html('height: '+height+' | width: '+width);				
			});	*/
		//};
}); //ready