jQuery(function( $ ){

			

			$('#screen').serialScroll({

				target:'#sections',

				items:'li', //selector to the items ( relative to the matched elements, '#sections' in this case )

				prev:'img.prev',//selector to the 'prev' button (absolute!, meaning it's relative to the document)

				next:'img.next',//selector to the 'next' button (absolute too)

				axis:'xy',//the default is 'y'

				queue:false,//we scroll on both axes, scroll both at the same time.

				event:'click',//on which event to react (click is the default, you probably won't need to specify it)

				stop:false,//each click will stop any previous animations of the target. (false by default)

				lock:true, //ignore events if already animating (true by default)

				duration:700,//length of the animation (if you scroll 2 axes and use queue, then each axis take half this time)

				start: 0, //on which element (index) to begin ( 0 is the default, redundant in this case )

				force:true, //force a scroll to the element specified by 'start' (some browsers don't reset on refreshes)

				cycle:true,//cycle endlessly ( constant velocity, true is the default )

				step:1, //how many items to scroll each time ( 1 is the default, no need to specify )

				jump:false, //if true, items become clickable (or w/e 'event' is, and when activated, the pane scrolls to them)

				lazy:false,//(default) if true, the plugin looks for the items on each event(allows AJAX or JS content, or reordering)

				interval:4000, //it's the number of milliseconds to automatically go to the next

				navigation:'#navigation li',

				constant:true,

				onBefore:function( e, elem, $pane, $items, pos ){

				

					e.preventDefault();

					if( this.blur )

						this.blur();

				},

				onAfter:function( elem ){

				

				}

			});

			

			

			$('#slideshow').serialScroll({

				items:'li',

				prev:'#carousel a.prev',

				next:'#carousel a.next',

				axis:'x',

				offset:-180, //when scrolling to photo, stop 230 before reaching it (from the left)

				start:2, //as we are centering it, start at the 2nd

				duration:600,

				interval:6000,

				force:true,

				stop:false,

				lock:false,

				cycle:true, //don't pull back once you reach the end

				easing:'backout', //use this easing equation for a funny effect

				jump: false //click on the images to scroll to them

			});			

		});

//easing equation, borrowed from jQuery easing plugin
		//http://gsgd.co.uk/sandbox/jquery/easing/
		$.easing.easeOutQuart = function (x, t, b, c, d) {
			return -c * ((t=t/d-1)*t*t*t - 1) + b;
		};

		
		$.easing.backout = function(x, t, b, c, d){
			var s=1.70158;
			return c*((t=t/d-1)*t*((s+1)*t + s) + 1) + b;
		};
		
		$(function () {
        // find the div.fade elements and hook the hover event
        $('div.fade').hover(function() {
            // on hovering over find the element we want to fade *up*
            var fade = $('> div', this);

            // if the element is currently being animated (to fadeOut)...
            if (fade.is(':animated')) {
                // ...stop the current animation, and fade it to 1 from current position
                fade.stop().fadeTo(250, 1);
            } else {
                fade.fadeIn(250);
            }
        }, function () {
            var fade = $('> div', this);
            if (fade.is(':animated')) {
                fade.stop().fadeTo(3000, 0);
            } else {
                fade.fadeOut(3000);
            }
        });
    });
