$(document).ready(function(){
	$(".scroll").click(function(event){
		//prevent the default action for the click event
		event.preventDefault();
		
		//get the full url - like mysitecom/index.htm#home
		var full_url = this.href;
		
		//split the url by # and get the anchor target name - home in mysitecom/index.htm#home
		var parts = full_url.split("#");
		var trgt = parts[1];
		
		//get the top offset of the target anchor
		var target_offset = $("#"+trgt).offset();
		var target_top = target_offset.top - 81;
		
		
		//goto that anchor by setting the body scroll top to anchor top
		$('html, body').animate({scrollTop:target_top}, 1600);
						
	});
	
	/*
	//old funtion to add active state to top nav
	 $('.header li a').click(function()
		{
			$('.header li').removeClass('active');
			$(this).parent().addClass('active');
		});
	
	$('a.about.scroll').click(function()
		{
			$('.header li').removeClass('active');
			$('.header li.about').addClass('active');
		});
	$('a.services.scroll').click(function()
		{
			$('.header li').removeClass('active');
			$('.header li.services').addClass('active');
		});
	$('a.portfolio.scroll').click(function()
		{
			$('.header li').removeClass('active');
			$('.header li.portfolio').addClass('active');
		});
	$('a.contact.scroll').click(function()
		{
			$('.header li').removeClass('active');
			$('.header li.contact').addClass('active');
	});*/
	
	
	//adds menu active state depending on page postion
	$(window).scroll(function() {    
		// find the li with class 'active' and remove it
		$('.header li').removeClass('active');
		// get the amount the window has scrolled
		var scroll = $(window).scrollTop();
		// add the 'active' class to the correct li based on the scroll amount
		var screen_size = ($(window).width());
		if (screen_size <= 767){
			if (scroll <= 600) {
				$(".header li.about").addClass("active");
			}
			else if (scroll <= 2700) {
				$('.header li.services').addClass('active');
			}
			else if (scroll <= 3400) {
				$('.header li.portfolio').addClass('active');
			}
			else {
				$('.header li.contact').addClass('active');
			}
		} else {
			if (scroll <= 600) {
				$(".header li.about").addClass("active");
			}
			else if (scroll <= 1400) {
				$('.header li.services').addClass('active');
			}
			else if (scroll <= 2100) {
				$('.header li.portfolio').addClass('active');
			}
			else {
				$('.header li.contact').addClass('active');
			}
		}
		
	    });
	
	//on hover text on verticle page scrolling
	$("a.scroll.arrow").hover(function(){
			$("span", this).delay(200).fadeIn();
		},function(){
			$("span", this).fadeOut();
	});
			
		
	$("a.popup_trigger[rel]").overlay({top: 160});
	$('.toggler').live('click', function(e) {
		e.preventDefault();
		$(this).toggleClass('active');
		$($(this).attr('rel')).slideToggle(500);
	});
	$('.stripes tr:odd').addClass('alt'); 

		// select all desired input fields and attach tooltips to them
	$("a.has_tooltip[title]").tooltip({
		
	
		// use the built-in fadeIn/fadeOut effect
		effect: "fade",
	
		// the time before the tooltip is shown
		predelay: 200
								
	});
	
	$('.stripes tr:odd').addClass('alt');
	
	$("#about img.pic2").hover(function(){
			$(this).css('z-index','3');

		},function(){
			$(this).css('z-index','1');
	});
	
	//gallery
	//$("a.gallery").fancybox();
	
});