$(document).ready(
	function(){							
		// Define something for easing
		jQuery.easing.def = 'easeOutBounce';
				
		// Create big shadow
		var sh1 = document.createElement('IMG');
		$(sh1).attr('src', '/assets/images/big_shadow.png').css({'position':'absolute','z-index':1});
		var sh4 = $(sh1).clone();
		var sh5 = $(sh1).clone();				
		
		// Create small shadow
		var sh2 = document.createElement('IMG');				
		$(sh2).attr('src', '/assets/images/small_shadow.png').css({'position':'absolute','z-index':1});
		var sh3 = $(sh2).clone();
	
		// Create the grapes
		var gr1 = document.createElement('IMG');
		$(gr1).attr('src', '/assets/images/grape_wleaf.png').css({'position':'absolute','z-index':10});
		
		var gr2 = document.createElement('IMG');
		$(gr2).attr('src', '/assets/images/small_grape_cut.png').css({'position':'absolute','z-index':10});
		
		var gr3 = document.createElement('IMG');
		$(gr3).attr('src', '/assets/images/small_grape.png').css({'position':'absolute','z-index':10});
		
		var gr4 = document.createElement('IMG');
		$(gr4).attr('src', '/assets/images/big_grape_cut.png').css({'position':'absolute','z-index':10});				
		
		var gr5 = document.createElement('IMG');
		$(gr5).attr('src', '/assets/images/big_grape.png').css({'position':'absolute','z-index':10});

		// Order first, last, 3rd, 4th, 2nd, see logo				
		var pairs = [
			{
				shadow:sh1,
				grape:gr1,
				s0:{'top':'245px','left':'130px', 'width':'10px','height':'8px'},
				s1:{'left':'111px','width':'49px','height':'13px'},
				g0:{'top':'-75px','left':'108px'},
				g1:{'top':'180px'},
				duration:1500,
				easing:'easeOutBounce'
			},
			{
				shadow:sh5,
				grape:gr5,
				s0:{'top':'245px','left':'247px', 'width':'10px','height':'8px'},
				s1:{'left':'228px','width':'49px','height':'13px'},
				g0:{'top':'-75px','left':'225px'},
				g1:{'top':'197px'},
				duration:800,
				easing:'easeOutBounce'						
			},
			{
				shadow:sh3,
				grape:gr3,
				s0:{'top':'248px','left':'186px', 'width':'8px','height':'4px'},
				s1:{'left':'176px','width':'30px','height':'9px'},
				g0:{'top':'-75px','left':'171px'},
				g1:{'top':'213px'},
				duration:1200,
				easing:'easeOutBounce'						
			},
			{
				shadow:sh4,
				grape:gr4,
				s0:{'top':'245px','left':'214px', 'width':'8px','height':'4px'},
				s1:{'left':'195px','width':'49px','height':'13px'},
				g0:{'top':'-75px','left':'191px'},
				g1:{'top':'179px'},
				duration:100,
				easing:'jswing'						
			},
			{
				shadow:sh2,
				grape:gr2,
				s0:{'top':'245px','left':'162px', 'width':'8px','height':'4px'},
				s1:{'left':'150px','width':'25px','height':'9px'},
				g0:{'top':'-75px','left':'143px'},
				g1:{'top':'194px'},
				duration:100,
				easing:'jswing'						
			}
		];
						
		function appear(){				
			var s = pairs[0].shadow;
			var g = pairs[0].grape;

			// Set starting position
			$(s).css(pairs[0].s0);
			$(g).css(pairs[0].g0);
								
			// Append to #animation
			$("#animation").append(g);
			$("#animation").append(s);
			
			// Animate to final position
			$(s).animate(pairs[0].s1, {'duration':pairs[0].duration,'easing':pairs[0].easing});
		
			$(g).animate(pairs[0].g1,{'duration':pairs[0].duration,'easing':pairs[0].easing,'complete':
				function(){ if(pairs.length){ appear(); } }}
			);
			
			pairs = pairs.slice(1);

		}				
		setTimeout(appear, 1500);				
	}
);