$(document).ready(function() {
	
	// Fade-out all mitems, to allow fade-in during hover
	$("div.icon").fadeTo("fast",0.7);
	// Hover image icons
	$("div.icon").hover( 
	
	  // Hover in
	  function() {
		  // increase opacity of thumbnail and show border to get impression it gets bigger
		  $(this).fadeTo("fast", 1.00);
		  $(this).find("img").animate( {border:"1px solid #887799" }, { duration:"fast"});
		  // Get image information store in custom attributes within link tag
		  var src = $(this).find("a").attr("custom:path");
		  var height = $(this).find("a").attr("custom:hoehe");
		  var cap1 = $(this).find("a").attr("custom:cap1");
		  var cap2 = $(this).find("a").attr("custom:cap2");
		  // Display big image in corresponding div container
		  $(".big-image").attr("src",src);
		  $(".big-image").attr("height",height);
		  // Display caption in corresponding containers
		  $("#cap1").empty().append(cap1);
		  $("#cap2").empty().append(cap2);
	  },
	  // Hover out
	  function () {
		  // decrease opacity of thumbnail and remove border (smaller again)
		  $(this).fadeTo("fast", 0.7);
		  $(this).find("img").animate( { border:"1px solid #BdC3D8" }, { duration:"fast"});
	  }
/**
	  function() {
		$(this).fadeTo("fast", 1.00);
//		$(this).find("img").css({border:"1px solid #1D2337"});
		$(this).find("img").animate( {border:"1px solid #887799" }, { duration:"fast"});
	  },
	  function() {
		$(this).fadeTo("fast", 0.7);
//		$(this).find("img").css({border:"1px solid #BdC3D8"});
		$(this).find("img").animate( { border:"1px solid #BdC3D8" }, { duration:"fast"});
	  }
*/
	);
	
	/**
	 * Open Images with a Light-Box
	 * 
	 * We use the FancyBox framework here
	 * This is basic - uses default settings 
	 **/
	// Crrently disabled, because we show mage in left column when hovering
	//$("a.fancy").fancybox();
	
	
	
//	/* Using custom settings */
//	
//	$("a#inline").fancybox({
//		'hideOnContentClick': true
//	});
//
//	/* Apply fancybox to multiple items */
//	
//	$("a.group").fancybox({
//		'transitionIn'	:	'elastic',
//		'transitionOut'	:	'elastic',
//		'speedIn'		:	600, 
//		'speedOut'		:	200, 
//		'overlayShow'	:	false
//	});
	
});