// Initially set opacity on thumbs and add
    // additional styling for hover effect on thumbs
    var onMouseOutOpacity = 0.67;
    $('#thumbs ul.thumbs li').css('opacity', onMouseOutOpacity)
	.hover(
		function() {
		    $(this).not('.selected').fadeTo('fast', 1.0);
		},
		function() {
		    $(this).not('.selected').fadeTo('fast', onMouseOutOpacity);
		}
	);

		$(document).ready(function() {
		    var gallery = $('#gallery').galleriffic('#thumbs', {
		        delay: 3000, // in milliseconds
		        numThumbs: 20, // The number of thumbnails to show page
		        preloadAhead: -1, // Set to -1 to preload all images
		        enableTopPager: false,
		        enableBottomPager: false,
		        imageContainerSel: '#ProductGallery', // The CSS selector for the element within which the main slideshow image should be rendered
		        controlsContainerSel: '#controls', // The CSS selector for the element within which the slideshow controls should be rendered
		        captionContainerSel: '#caption', // The CSS selector for the element within which the captions should be rendered
		        loadingContainerSel: '#loading', // The CSS selector for the element within which should be shown when an image is loading
		        renderSSControls: false, // Specifies whether the slideshow's Play and Pause links should be rendered
		        renderNavControls: false, // Specifies whether the slideshow's Next and Previous links should be rendered
		        playLinkText: 'Play',
		        pauseLinkText: 'Pause',
		        prevLinkText: 'Previous',
		        nextLinkText: 'Next',
		        nextPageLinkText: 'Next ›',
		        prevPageLinkText: '‹ Prev',
		        enableHistory: false, // Specifies whether the url's hash and the browser's history cache should update when the current slideshow image changes 
		        autoStart: false, // Specifies whether the slideshow should be playing or paused when the page first loads
		        onChange: function(prevIndex, nextIndex) {
		            $('#thumbs ul.thumbs').children()
							.eq(prevIndex).fadeTo('fast', onMouseOutOpacity).end()
							.eq(nextIndex).fadeTo('fast', 1.0);
		        },
		        onTransitionOut: function(callback) {
		            $('#caption').fadeTo('fast', 0.0);
		            $('#ProductGallery').fadeTo('fast', 0.0, callback);
		        },
		        onTransitionIn: function() {
		            $('#ProductGallery').fadeTo('fast', 1.0);
		            $('#caption').fadeTo('fast', 1.0);
		        },
		        onPageTransitionOut: function(callback) {
		            $('#thumbs ul.thumbs').fadeTo('fast', 0.0, callback);
		        },
		        onPageTransitionIn: function() {
		            $('#thumbs ul.thumbs').fadeTo('fast', 1.0);
		        }
		    });
		});