$(document).ready(

  function(){
	
	var aboutLi = "#main-nav li.about";
	var aboutLink = "#about-nav-link";
	var aboutDropDown = "#main-nav-about";
	var aboutSpan = ".about-span";
	var aboutDropLi = "#main-nav-about li";
	
	var folioLi = "#main-nav li.folio";
	var folioLink = "#folio-nav-link";
	var folioDropDown = "#main-nav-folio";
	var folioSpan = ".folio-span";
	var folioDropLi = "#main-nav-folio li";
	
	var spanMarginReset = '24px';
	var spanMarginActive = '-43px';
	
	var easingTimeVer = 200;
	var easingTimeHor = 100;
	
	//Hover aboutLi
	$(aboutLi)
	.mouseenter(function(){
		$(aboutDropDown)
		.stop()
		.show()
		.animate({height:'220px'}, {duration:easingTimeVer, easing: 'easeInOutSine'});

		$(aboutSpan)
		.stop()
		.css('display','block')
		.animate({height: 66, top: 0}, {duration:easingTimeVer, easing: 'easeInOutSine'});

		$(aboutLink)
		.css('color','black');
	})
	.mouseleave(function(){
		$(aboutLink)
		.css('color','white');
		
		$(aboutDropDown)
		.stop()
		.hide()
		.css('height','0px');
		//.animate({height:'0px',display:'none'}, 1, 'easeOutBounce', function () {$(folioDropDown).hide()})
		
		$(aboutSpan)
		.stop()
		.hide()
		.css('height','0px')
		.css('top','66px');
		//.animate({height:'0px'}, 1, 'easeOutBounce', function () {$(".testing").hide()})		
	});	
	
	//Hover folioLi
	$(folioLi)
	.mouseenter(function(){
		$(folioDropDown)
		.show()
		.animate({height:'305px'}, {duration:easingTimeVer, easing: 'easeInOutSine'});
		
		$(folioSpan)
		.stop()
		.css('display','block')
		.animate({height: 66, top: 0}, {duration:easingTimeVer, easing: 'easeInOutSine'});
		
		$(folioLink)
		.css('color','black');
	})
	.mouseleave(function(){
		$(folioLink)
		.css('color','white');
		
		$(folioDropDown)
		.hide()
		.css('height','0px');
		//.animate({height:'0px',display:'none'}, 1, 'easeOutBounce', function () {$(folioDropDown).hide()})
		
		$(folioSpan)
		.stop()
		.hide()
		.css('height','0px')
		.css('top','66px');
		//.animate({height:'0px'}, 1, 'easeOutBounce', function () {$(".testing").hide()})
	})	;

  	if ((navigator.userAgent.indexOf('iPhone') != -1) || (navigator.userAgent.indexOf('iPod') != -1) || (navigator.userAgent.indexOf('iPad') != -1)) {
		$("#post #post-info").attr('id','ipad-post-info');
	}

	//Hover aboutDropLi & folioDropLi
	$(aboutDropLi)
	.mouseenter(function() {
		$(this)
		.children("span.hover")
		.animate({width: '182px'}, {duration:easingTimeHor, easing: 'easeInOutSine'})
		.parent()
		.css('color','#000');
	})
	.mouseleave(function() {
		$(this)
		.children("span.hover")
		.animate({width: '0px'}, {duration:easingTimeHor, easing: 'easeInOutSine'})
		.parent()
		.css('color','#999999');
	});
	
	$(folioDropLi)
	.mouseenter(function() {
		$(this)
		.children("span.hover")
		.animate({width: '182px'}, {duration:easingTimeHor, easing: 'easeInOutSine'})
		.parent()
		.css('color','#000');
	})
	.mouseleave(function() {
		$(this)
		.children("span.hover")
		.animate({width: '0px'}, {duration:easingTimeHor, easing: 'easeInOutSine'})
		.parent()
		.css('color','#999999');
	});
	
	$("ul.subnav li")
	.mouseenter(function() {
		$(this)
		.children("span.hover")
		.animate({width: '182px'}, {duration:easingTimeHor, easing: 'easeInOutSine'})
		.parent()
		.css('color','#000');
	})
	.mouseleave(function() {
		$(this)
		.children("span.hover")
		.animate({width: '0px'}, {duration:easingTimeHor, easing: 'easeInOutSine'})
		.parent()
		.css('color','#999999');
	});
	
});