(function($) {
$(document).ready(function(){
	
		$('ul').addClass('gallery');
		$('ul.gallery').children(':first-child').addClass('active');
		$('body').css('background','#fff');
		
		var _n = $('ul.gallery li').size();
		var _l = (_n > 10) ? 0 : (700 - _n*66)/2;
		$('#ul_wrapper').css('margin-left', _l);
		
		$('ul.gallery').galleria({
					history   : true,
					clickNext : true,
					insert    : '#main_image',
					onImage   : function(image,caption,thumb) { // let's add some image effects for demonstration purposes

									// fade in the image & caption
									if(! ($.browser.mozilla && navigator.appVersion.indexOf("Win")!=-1) ) { // FF/Win fades large images terribly slow
										image.css('display','none').fadeIn(1000);
									}
									caption.css('display','none').fadeIn(1000);

									// fetch the thumbnail container
									var _li = thumb.parents('li');

									// fade out inactive thumbnail
									_li.siblings().children('img.selected').fadeTo(500,0.3);

									// fade in active thumbnail
									thumb.fadeTo('fast',1).addClass('selected');

									// add a title for the clickable image
									image.attr('title','Next image >>');
								},
								onThumb : function(thumb) { // thumbnail effects goes here

									// fetch the thumbnail container
									var _li = thumb.parents('li');

									// if thumbnail is active, fade all the way.
									var _fadeTo = _li.is('.active') ? '1' : '0.3';

									// fade in the thumbnail when finnished loading
									thumb.css({display:'none',opacity:_fadeTo}).fadeIn(1500);

									// hover effects
									thumb.hover(
										function() { thumb.fadeTo('fast',1); },
										function() { _li.not('.active').children('img').fadeTo('fast',0.3); } // don't fade out if the parent is active
									)
								}
							}
					
					
		);
			
})
})(jQuery);