// execute your scripts when the DOM is ready. this is mostly a good habit
$(document).ready(function() {
	// initialize scrollable
	$(".bestselling-products .scrollable").scrollable({
		circular: true,
		disabledClass: 'scrollable-disabled',
		items: '.scrollable-items',
		prev: '.scrollable-prev',
		next: '.scrollable-next'
	}).autoscroll({
		interval: 3000
	}).navigator();

	$('a.fancybox').fancybox({
		'transitionIn':'fade',
		'transitionOut':'fade',
		'width':630,
		'height':500,
		'autoDimensions':false,
		'hideOnContentClick':false,
		'overlayOpacity':0.8
	});

	$('a.imagebox').fancybox({
		'transitionIn':'fade',
		'transitionOut':'fade',
		'overlayOpacity':0.8,
		'type':'image'
	});

	$('a.videobox').fancybox({
		'transitionIn':'fade',
		'transitionOut':'fade',
		'width':500,
		'height':370,
		'autoDimensions':false,
		'overlayOpacity':0.8,
		'type':'iframe'
	});

	$('.featured-articles').cycle({
		fx: 'fade',
		timeout: 5000,
		speed: 500,
		pager: '.featured-articles-nav'
	});
});