$(document).ready(function() {

	$("div.slides").scrollable({size: 1, easing: 'swing', interval: 7000, speed: 1300, clickable: false,
		//If you want the elements to be visible while scrolling through them.
		onBeforeSeek: function() {  
		var items = this.getItems();  
		items.fadeTo(10, 1); 
		},
		// get the item that is faded in next (now out of view) and fade it to 0 that it can be faded in afterwards 
		onStart: function() {  
			var first = this.getVisibleItems().eq(0);  
			var next = this.getVisibleItems().filter(":last").next();  
			first.fadeTo(1300, 0); 
			next.fadeTo(10, 1); 
		},  
		// after the scrolling, the last item is faded in 
		onSeek: function() {  
			var last = this.getVisibleItems().filter(":last");  
			last.fadeTo(1300, 1); 
		} 
	}).circular().navigator({navi: ".naviBtns"}).autoscroll({autopause: true, autoplay: true, interval: 7000}); //
	
	
	//$(".naviSlide").hide();
	$("#slideshow").hover(
	  function () {
		$(".naviSlide").fadeIn().animate({bottom: "29px"}, { duration: 500, queue: false });
	  },
	  function () {
		$(".naviSlide").fadeOut().animate({bottom: "10px"}, { duration: 500, queue: false });
	  }
);
	
});