$(document).ready(function(){ 
					// this determins the active page
					function activePage() {
						var path = location.pathname.substring(1);
						if (path == '')$('li.who').css({'background' : 'url(../images/site/who_active.png) top center no-repeat'});
						if (path == 'index.php')$('li.who').css({'background' : 'url(../images/site/who_active.png) top center no-repeat'});
						if (path == 'services.php')$('li.services').css({'background' : 'url(../images/site/services_active.png) top center no-repeat'});
						if (path == 'where.php')$('li.where').css({'background' : 'url(../images/site/where_active.png) top center no-repeat'});
						if (path == 'what.php')$('li.what').css({'background' : 'url(../images/site/what_active.png) top center no-repeat'});
						if (path == 'contact.php')$('li.contact').css({'background' : 'url(../images/site/contact_active.png) top center no-repeat'});
					}
					activePage();
					
					// color fades (reuires plugin)
					$('a:not(h1 a, h2 a, h3 a)').mouseover(function() {
						$(this).stop().animate({'color' : '#d50237'}, 500);	
						}).mouseout(function () {
							$('.contactHeader a, #footerWrapper a').stop().animate({'color' : '#BAC4D1'}, 300);			
							$('.columnPrimary a:not(h1 a, h2 a, h3 a), .columnSecondary a:not(h1 a, h2 a, h3 a)').stop().animate({'color' : '#4A515B'}, 300);
					});

					// animate the services list
					$('#services li').mouseover(function() {
						$(this).stop().animate({
							'marginLeft' : '20px',
							'paddingLeft' : '20px'
							}, 400);
						}).mouseout(function() {
							$(this).stop().animate({
							'marginLeft' : '0px',
							'paddingLeft' : '15px'
							}, 600);
						})	;
					
			    }); 
				
				// TESTING THE WHO WE'VE WORKED WITH SO ON MOUSEOVER THE NAME (IN SPAN) FADES IN AND ANIMATES ACROSS
								//	$('.textScroll').css({ 'marginLeft' : '2000px' });
					
				   
	/*				$('ul#customerList li').hover(function() {
						$(this).find('.textScroll').stop().animate({
							'marginLeft' : '-5000px'
							}, 10000);
						});
	*/
/*	
					$('ul#customerList li').mouseover(function() {
						$(this).find('.textScroll').stop().animate({
							'opacity' : '1',
							'marginLeft' : '-5000px'
							}, 10000);
						
						
						
						}).mouseout(function() {
						$(this).find('.textScroll').stop().fadeOut("slow");
					});
					
					------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
					// navigation, trying the glow hover
					//	THIS ANIMATES A SECOND LI ELEMENT (ON PHP PAGE) THAT HAS IT'S OWN STLYING
					
					/ animate the glow				
					$('li.who').mouseover(function () {
						$('li.who_hover').stop().animate({
							'opacity' : '1'
					}, 500);
					}).mouseout(function () {
						$('li.who_hover').stop().animate({
							'opacity' : '0'
					}, 750)
					});		

					html code:
					-------------
						<ul id="mainNav">
							<li class="who"><a href="index.php"><span class="noDisplay">Home</span></a></li>
								<li class="who_hover"><a href="index.php"><span class="noDisplay">Home</span></a></li>
							<li class="services"><a href="services.php"><span class="noDisplay">Services</span></a></li>
							<li class="where"><a href="where.php"><span class="noDisplay">Where</span></a></li>
							<li class="what"><a href="what.php"><span class="noDisplay">What</span></a></li>
							<li class="contact"><a href="contact.php"><span class="noDisplay">Contact</span></a></li>																
						</ul>

						css code:
						-------------
						ul#mainNav li.who { 
							background: url(../images/site/who.png) top center no-repeat;
							height: 50px;
							width: 68px;
						}
							ul#mainNav li.who a:hover { 
								background: url(../images/site/who_hover.png) top center no-repeat;	
															display: none;
								height: 50px;
								width: 68px;
							}
							
														ul#mainNav li.who_hover { 
															background: url(../images/site/who_hover.png) top center no-repeat;	
															opacity: 0;
															height: 50px;
															margin-left: -78px;		
															width: 68px;
														}			

					
					
					*/