var nav = {
	
	hover: function(){
		
		
		$('#nav li a').hover(

		  function (event) {
			//hover-on
			if($(this).hasClass('active')){
				$(this).css({top: '0'})
			}else{
				$(this).css({color:'#ebe9dc', top: '0'})
			}
			$(this).stop().animate({ top: '-3px', color: '#50b948', paddingBottom: '6px' }, 300);
		  },

		  function (event) {
		    //hover-off
			if($(this).hasClass('active')){
				$(this).stop().animate({ top: '0', paddingBottom: '3px' }, 300);
			}else{
				$(this).stop().animate({ top: '0', color: '#ebe9dc',  paddingBottom: '3px' }, 300);
			}

		});
		
	}
	
};

var cloud = {
	
	container: '#animate',
	
	init: function(){
		
		//Build the clouds
		cloud.build('images/a/cloud-3.png', 'cloud-1', '10', '-330px', '20px'); //Cloud 1 - first foreground
		cloud.build('images/a/cloud-2.png', 'cloud-2', '10', '-530px', '40px'); //Cloud 2 - second foreground
		cloud.build('images/a/cloud-4.png', 'cloud-3', '10', '-220px', '5px'); //Cloud 3 - background

		//Begin the animation
		cloud.moveAllClouds();
		
	},
	
	build: function(src, id, z, left, top){
		
		var newCloud = $('<img />');
		newCloud.attr({src: src, id: id}).css({zIndex: z, left: left, top: top});
		newCloud.appendTo(cloud.container);
		
	},
	
	move: function(id, left, speed, startPos){
		
		$(id).animate({ left: left }, speed, 'linear', function(){
			$(id).css({left: startPos});
			cloud.move(id, left, speed, startPos);
		});
		
	},

	moveAllClouds: function(){
		
		//Move the clouds
		cloud.move('#cloud-1', '500px', 16000, '-330px');
		setTimeout("cloud.move('#cloud-2', '500px', 18000, '-530px')", 4000);
		cloud.move('#cloud-3', '500px', 23000, '-220px');
		
	}
	
	
}


$(document).ready(function(){
	
	nav.hover();
	
	if($('#animate').length){
		cloud.init();
	}
	
});