$(document).ready(function() {
		
	//nav effects
	// TODO floating sweet title element?
	$('#hd li a').removeAttr('title');		
	$('#hd li a')
		.mouseover(function(){
			animateNav($(this).parent(), "over");
		})
		.mouseout(function(){
			animateNav($(this).parent(), "up");	
		});
	
	function animateNav(el,type){
		var up = {
			impact: '0px -75px',
			empezando: '-160px -75px',
			foro: '-320px -75px', 
			contact: '-480px -75px'
		}
		var over = {
			impact: '0px 0px',
			empezando: '-160px 0px',
			foro: '-320px 0px',
			contact: '-480px 0px'
		}
		
		//setting the background starting position needs to be in format "0px 0px"
		//but the animate position needs to be in format "(0px 0px)"
		if(!el.hasClass('active')){
			if(type == "over"){
				posStart = eval( "up." + el.attr('class') );
				posEnd = "(" + eval( "over." + el.attr('class') ) + ")";
				easing = "easeOutBounce";
			} else {
				posStart = eval( "over." + el.attr('class') );
				posEnd = "(" + eval( "up." + el.attr('class') ) + ")";
				easing = "swing";
			} 		
			el.css({backgroundPosition: posStart})
			el.stop().animate({ backgroundPosition: posEnd }, 300, easing)
		}
	}

	function placeFooter(){
		htmlHeight = $('#page').height();
		pageHeight = $(window).height();

		if (htmlHeight < pageHeight) {
			$('#ft').css({
				'position': 'absolute', 
				'bottom': '0',
				'width': '100%'
			});
		} else {
			$('#ft').css({'position': 'static'});
		}		
	};
	$(window).resize(function(){placeFooter();});
	placeFooter();
	
});