// ********** rotating images ********** //
$(document).ready(function() {
    $("#slideshow").css("overflow", "hidden");
   
        $("ul#slides")
        .before('<div id="nav2">')
        .cycle({
	        fx: 'fade',
	        delay: 3000,  // additional delay (in ms) for first transition (hint: can be negative)
	        pause: 0,
	        prev: '#prev',
	        next: '#next',
            pager: '#nav2',  //instructs the plugin to create navigation elements, one for each slide, and add them to the container identified by the value of the pager option
            pagerAnchorBuilder: function(index, slide) {
                return '<a href="#" class="box"></a>';  // whatever markup you want
            }
        });

        // ---------------------------------------------------------------------------------
        // uncomment these lines if you want the prev/next buttons to fade in/out when you
        // mouseover the image
        // ---------------------------------------------------------------------------------
        $("#slideshow").hover(function() {
	        $("ul#nav").fadeIn();
        },
		    function() {
	        $("ul#nav").fadeOut();

        // ---------------------------------------------------------------------------------
        // eliminating the fadeIn() and fadeOut() allows us to always show the prev/next buttons
        // ---------------------------------------------------------------------------------
        // $("#slideshow").hover(function() {
	    //     $("ul#nav");
        // },
		//     function() {
	    //     $("ul#nav");

	});
});



// ********** jscrollPane ********** //	
$(document).ready(function() {
	$('.scroll-pane').jScrollPane();
	$('.scroll-pane-arrows').jScrollPane(
		{
			showArrows: true,
			horizontalGutter: 10
		}
	);

});