function motion()
{
	
	//--------------------------------------
	// INIT
	//--------------------------------------
	
	this.init = function()
	{
		
	}
	
	
	//--------------------------------------
	// MOTION INIT
	//--------------------------------------
	
	this.motionInit = function( id )
	{
		var currentID = "#"+id;
		$( currentID ).css( 'display', 'block' );
		
		// Height Home intro 
		var heightCurrent = parseInt( $( currentID ).css( 'height') );
		
		
		//menu init
		$( '#menu' ).css(  'display', 'block' );
		$( '#menu' ).css( 'opacity', '0' );
		$( '#menu' ).delay( 150 ).animate({ 'opacity': "1", filter:'' }, 900 );
		
		
		
		// Top Init 
		$( currentID ).css( 'opacity', '0' );
		$( currentID ).css( 'top', 500 );
		
		
		// Top end 
		$( currentID ).delay( 300 ).animate({ top: 0, opacity: "1" }, 
		{
		  duration: 900,
		  easing: 'easeOutCubic',
		  step: function(now, fx)
		  {
			$('body').trigger( 'changePageEvent' );
		  }
		});
		
		
		// Delays
		var delay = 500;
		$( currentID ).children('.homeintro2').animate({ 'marginTop': 450 }, 0 );
		$( currentID ).children('.homeintro2').delay( delay ).animate({ 'marginTop': 10 }, 400, 'easeOutCubic' );
		
		$( currentID ).children('.box_left').animate({ 'marginTop': 300 }, 0 );
		$( currentID ).children('.box_left').delay( delay + 200 ).animate({ 'marginTop': 40 }, 400, 'easeOutCubic' );
		
		$( currentID ).children('.box_right').animate({ 'marginTop': 300 }, 0 );
		$( currentID ).children('.box_right').delay( delay + 200 ).animate({ 'marginTop': 40 }, 400, 'easeOutCubic' );
		
		
		// Footer
		var heightHighlight1 = parseInt( $( '.homeintro1' ).css( 'marginTop') );
		var heighFooter = 60;
		if( heightCurrent < $( window ).height() - heightHighlight1 )
		{
			$( '#footer' ).css( 'top', $( window ).height() - ( heightHighlight1 + heighFooter ) + 100 );
			$( '#footer' ).css(  'opacity', '0' );
			$( '#footer' ).css(  'display', 'inline' );
			$( '#footer' ).delay( delay + 500  ).animate({ 'top': $( window ).height() - ( heightHighlight1 + heighFooter ), 'opacity': 1  }, 300, 'easeOutCubic' );
		}
		else
		{
			$( '#footer' ).css( 'top', heightCurrent - heighFooter + 60 );
			$( '#footer' ).css(  'opacity', '0' );
			$( '#footer' ).css(  'display', 'inline' );
			$( '#footer' ).delay( delay + 500 ).animate({ 'top': heightCurrent - heighFooter, 'opacity': 1  }, 300, 'easeOutCubic' );
		}
		
		
		//Scroll
		if( $( window ).scrollTop() > 0)
		{
			$("html:not(:animated),body:not(:animated)").animate({ scrollTop: 0}, 400 );
		}
		
	}
	
	//--------------------------------------
	// MOTION CURRENT
	//--------------------------------------
	
	this.motionCurrent = function()
	{
		for ( i=0;i<=CONTENT_PAGES.length;i++ )
		{	
			//// PAGES != PAGE CURRENT
			if( CONTENT_PAGES[i] != pageCurrent )
			{
				//// ONLY PAGES OLD == BLOCK
				if( $( '#' + CONTENT_PAGES[i] ).css( 'display') == "block" )
				{
					if( statusButton == true )
					{
						//// CHANGE PAGES ( OLD / NEW  )
						animateChangePages( CONTENT_PAGES[i], pageCurrent  );
						
						// disable button again.
						statusButton = false; 
					}
				}
			}
		}
	}
	
	
	//--------------------------------------
	// MOTION PAGE
	//--------------------------------------
	
	//// CHANGE ANIMATE PAGES
	function animateChangePages( _oldPage, _newPage )
	{
		// VAR PAGE
		var oldPage = _oldPage;
		var newPage = _newPage;
		
		// VAR HEIGHT PAGE
		var heightPageOld = parseInt($( '#' + oldPage ).css( 'height'));
		var heightPageNew = parseInt($( '#' + newPage ).css( 'height'));
		
		// PUT NEW PAGE 
		$( '#' + newPage ).css( 'display', 'block' );
		$( '#' + newPage ).css( 'top', heightPageOld );
		
		// FOOTER
		$( '#footer' ).animate({ 'opacity': 0 }, 200 );
		
		// ANIMATE PAGE OLD
		$( '#' + oldPage ).delay( 100 ).animate({top: -(heightPageOld) , filter:'' }, (heightPageOld)/3, 'easeOutCubic', function() 
		{
			// Animation complete.
			$( '#' + oldPage ).css( 'display', 'none' );
			$( '#' + oldPage ).css( 'top', 0 );
			
			
			// Footer
			var delay = 200;
			var heightHighlight1 = parseInt( $( '.homeintro1' ).css( 'marginTop') );
			var heighFooter = 60;
			
			if( !IPHONE )
			{
				if( heightPageNew < $( window ).height() - heightHighlight1 )
				{
					$( '#footer' ).css( 'top', $( window ).height() - ( heightHighlight1 + heighFooter ) + 100 );
					$( '#footer' ).css(  'opacity', '0' );
					$( '#footer' ).css(  'display', 'inline' );
					$( '#footer' ).delay( delay ).animate({ 'top': $( window ).height() - ( heightHighlight1 + heighFooter ), 'opacity': 1 , filter:'' }, 300, 'easeOutCubic' );
				}
				else
				{
					$( '#footer' ).css( 'top', heightPageNew - heighFooter + 60 );
					$( '#footer' ).css(  'opacity', '0' );
					$( '#footer' ).css(  'display', 'inline' );
					$( '#footer' ).delay( delay ).animate({ 'top': heightPageNew - heighFooter, 'opacity': 1 , filter:''  }, 300, 'easeOutCubic' );
				}
					
			}
			else
			{
				//IPOD
				$('body').trigger( 'footerIpodEvent' );
			}
			
		});
		
		
		// ANIMATE PAGE NEW
		$( '#' + newPage ).delay( 100 ).animate({ top: 0 , filter:'' }, 
		{
		  duration: 1000,
		  easing: 'easeOutCubic',
		  step: function(now, fx)
		  {
			$('body').trigger( 'changePageEvent' );
		  },
		  complete:function()
		  {
			
				// Active button again.
				statusButton = true; 
			
		  }
		});
		
		
		// RETURN PAGE INIT
		$("html:not(:animated),body:not(:animated)").delay( 100 ).animate({ scrollTop: 0 , filter:''}, 400 );
		
		
		/////////////////////////////////// BREAKDOWN DIV ///////////////////////////////////
		var delay = 0;

		//
		if( newPage == "home" )
		{
			if(oldPage == "artistsanddesigners") delay = 500;
			if(oldPage == "clients") delay = 500;
			if(oldPage == "contact") delay = 300;
		}
		
		if( newPage == "artistsanddesigners" )
		{
			if(oldPage == "home") delay = 300;
			if(oldPage == "clients") delay = 400;
			if(oldPage == "contact") delay = 300;
		}
		
		if( newPage == "clients" )
		{
			if(oldPage == "home") delay = 400;
			if(oldPage == "artistsanddesigners") delay = 500;
			if(oldPage == "contact") delay = 400;
		}
		
		if( newPage == "contact" )
		{
			delay = 100;
		}
		
		//
		$( '#' + newPage ).children('.homeintro2').delay( 100 ).animate({ 'marginTop': 450 }, 0 );
		$( '#' + newPage ).children('.homeintro2').delay( delay ).animate({ 'marginTop': 10 }, 400, 'easeOutCubic' );
		
		$( '#' + newPage ).children('.box_left').animate({ 'marginTop': 300 }, 0 );
		$( '#' + newPage ).children('.box_left').delay( delay + 200 ).animate({ 'marginTop': 40 }, 400, 'easeOutCubic' );
		
		$( '#' + newPage ).children('.box_right').animate({ 'marginTop': 300 }, 0 );
		$( '#' + newPage ).children('.box_right').delay( delay + 200 ).animate({ 'marginTop': 40 }, 400, 'easeOutCubic' );
		
	}
}