$(document).ready(function() {

/*
$('#mn-about-sn').hide();
$('#mn-portfolio-sn').hide();
$('#mn-services-sn').hide();
$('#mn-marketing-sn').hide();
$('#mn-news-sn').hide();
$('#mn-contact-sn').hide();
*/

var current = 'none';

$('#mn-about').click(function(){
	$(this).toggleSubnav('#mn-about');	
});
$('#mn-portfolio').click(function(){
	$(this).toggleSubnav('#mn-portfolio');	
});
$('#mn-services').click(function(){
	$(this).toggleSubnav('#mn-services');	
});
$('#mn-marketing').click(function(){
	$(this).toggleSubnav('#mn-marketing');	
});
$('#mn-news').click(function(){
	$(this).toggleSubnav('#mn-news');	
});

$('#mn-contact').click(function(){
	$(this).toggleSubnav('#mn-contact');	
});

$('img.close-subnav').click(function(){
	$('#main-nav-list div' + current).removeClass("active");
	$('#main-nav-list div' + current).stop().animate({'padding-top': '42px'}, 400);
	$('#main-subnav').stop().animate({'height': '0px'}, 600, function(){ $(current + '-sn').hide(); current = 'none';});
	
});


$.fn.toggleSubnav = function(id){


	if (current != 'none'){
		if(current == id){
			$('#main-nav-list div' + current).removeClass("active");
			$('#main-nav-list div' + id).stop().animate({'padding-top': '42px'}, 400);
			$('#main-subnav').stop().animate({'height': '0px'}, 600, function(){$(id + '-sn').hide();});
			//$(id + '-sn').hide();
			current = 'none';
		} else {
			$('#main-nav-list div' + id).addClass("active");
			$('#main-nav-list div' + current).removeClass("active");
			
			$('#main-nav-list div' + id).stop().animate({'padding-top': '28px'}, 300);
			$('#main-nav-list div' + current).stop().animate({'padding-top': '42px'}, 300);

			$(current + '-sn').stop().fadeOut(500);
			$(id + '-sn').stop().fadeIn(500);

			current = id;
		}
	} else {
		//set current to selected, slide down selected

		$('#main-nav-list div' + id).addClass("active");
		
		$('#main-nav-list div' + id).stop().animate({'padding-top': '28px'}, 400);
		
	
		$(id + '-sn').stop().fadeIn(300);
		//$(id + '-sn').show();
		
		$('#main-subnav').stop().animate({'height': '134px'}, 600);
		
		current = id;
	}
	
}

});