$(document).ready(function(){

	// Init ScrollMagic
	var controller = new ScrollMagic.Controller();

	// loop through each .product_details elements to animate product overview
	$('.product').each(function(){

	var tl = new TimelineLite();
	var idx = $(this).data('idx');
	var pos = $(this).data('pos');	

	if (!idx) return;
	var pdt_img =".pdt_img"+idx; 
	var pdt_title =".pdt_title"+idx; 
	var pdt_content =".pdt_content"+idx; 
	var pdt_benefits =".pdt_benefits"+idx; 

	if ( $(window).width() < 748) {      
  	tl.add(TweenMax.staggerFromTo(pdt_content, 1, {x:-30}, {className: "+=fade-in", x:0, ease:"Circ.easeOut"}));
	tl.add(TweenLite.fromTo(pdt_img, 1, {x:-30}, {className: "+=fade-in", x:0, ease:"Circ.easeOut"}));
	tl.add(TweenMax.staggerFromTo(pdt_title, 1, {x:-30}, {className: "+=fade-in", x:0, ease:"Power1.easeOut"}, 0.2)); 
	tl.add(TweenMax.staggerFromTo(pdt_benefits, 1, {x:-30}, {className: "+=fade-in", x:0, ease:"Power1.easeOut"}, 0.2)); 
	} 
	
	else {
  
	// build timeline to animate product overview
	if (pos && pos=="right") {
	tl.add(TweenMax.staggerFromTo(pdt_content, 1, {x:-100}, {className: "+=fade-in", x:0, ease:"Circ.easeOut"}));
    tl.add(TweenLite.fromTo(pdt_img, 1, {x:200}, {className: "+=fade-in", x:0, ease:"Circ.easeOut"}));
	tl.add(TweenMax.staggerFromTo(pdt_title, 1, {x:-30}, {className: "+=fade-in", x:0, ease:"Power1.easeOut"}, 0.2)); 
	tl.add(TweenMax.staggerFromTo(pdt_benefits, 1, {x:-30}, {className: "+=fade-in", x:0, ease:"Power1.easeOut"}, 0.2)); 
	}
	else {
	tl.add(TweenMax.staggerFromTo(pdt_content, 1, {x:100}, {className: "+=fade-in", x:0, ease:"Circ.easeOut"}));
	tl.add(TweenLite.fromTo(pdt_img, 1, {x:-200}, {className: "+=fade-in", x:0, ease:"Circ.easeOut"}));
	tl.add(TweenMax.staggerFromTo(pdt_title, 1, {x:-30}, {className: "+=fade-in", x:0, ease:"Power1.easeOut"}, 0.2)); 
	tl.add(TweenMax.staggerFromTo(pdt_benefits, 1, {x:-30}, {className: "+=fade-in", x:0, ease:"Power1.easeOut"}, 0.2)); 
	};

	tl.timeScale( 1.5 ); //sets timeScale to half-speed
}

	// build scene to animate product overview
	var Ourscene = new ScrollMagic.Scene({
		triggerElement: this.children[0],
		triggerHook: 0.6,
		reverse:false, 
		})
		
		.setTween(tl)
/*		.addIndicators({name: "product"}) // add indicators (requires plugin)*/
		.addTo(controller);
	});	

	// loop through each .project element
	$('.project').each(function(){

		// build a scene
		var ourScene = new ScrollMagic.Scene({
			triggerElement: this.children[0],
			triggerHook: 0.7
		})
		.setClassToggle(this, 'fade-in') // add class to project01
/*		.addIndicators({
			name: 'fade scene',
			colorTrigger: 'black',
			colorStart: '#75C695',
			colorEnd: 'pink'
		}) // this requires a plugin
*/
		.addTo(controller);

	});

//jQuery for page scrolling up from footer - requires jQuery Easing plugin

            $(function() {
                $('.sep_block_up a').bind('click',function(event){
                    var $anchor = $(this);
                    
                    $('html, body').stop().animate({
                        scrollTop: $($anchor.attr('href')).offset().top
                    }, 1500,'easeInOutExpo');
                    event.preventDefault();
                });
            });



});