$(document).ready(function() {
$(".image_thumb ul li:first").addClass('active'); //Add the active class (highlights the very first list item by default)

$(".image_thumb ul li").hover(function(){
	$(this).addClass('hover'); //Add class "hover" on hover 
	//Set Variables
	var imgAlt = $(this).find('img').attr("alt"); //Get Alt Tag of Image
	var imgTitle = $(this).find('a').attr("rel"); //Get Main Image URL
	//var imgDesc = $(this).find('.block').html();  //Get HTML of the "block" container
	//var imgDescHeight = $(".main_image").find('.block').height(); //Find the height of the "block"

	if ($(this).is(".active")) {  //If the list item is active/selected, then...
		return false; // Don't click through - Prevents repetitive animations on active/selected list-item
	} else { //If not active then...
		//Animate the Description
		$(".main_image").animate({ opacity: 0 }, 250 , function() { //Pull the block down (negative bottom margin of its own height)
			$(".main_image img").attr({ src: imgTitle , alt: imgAlt}); //Switch the main image (URL + alt tag)
		}).animate({ opacity: 1 }, 250);
	}
	//Show active list-item
	$(".image_thumb ul li").removeClass('active'); //Remove class of 'active' on all list-items
	$(this).addClass('active');  //Add class of 'active' on the selected list
	return false; 

}, function() {
	$(this).removeClass('hover'); //Remove class "hover" on hover out
});

$("#image_thumb1 ul li:first").addClass('active'); //Add the active class (highlights the very first list item by default)

$("#image_thumb1 ul li").hover(function(){
	$(this).addClass('hover'); //Add class "hover" on hover 
	//Set Variables
	var imgAlt1 = $(this).find('img').attr("alt"); //Get Alt Tag of Image
	var imgTitle1 = $(this).find('a').attr("rel"); //Get Main Image URL
	//var imgDesc = $(this).find('.block').html();  //Get HTML of the "block" container
	//var imgDescHeight = $(".main_image").find('.block').height(); //Find the height of the "block"

	if ($(this).is(".active")) {  //If the list item is active/selected, then...
		return false; // Don't click through - Prevents repetitive animations on active/selected list-item
	} else { //If not active then...
		//Animate the Description
		$("#main_image1").animate({ opacity: 0 }, 250 , function() { //Pull the block down (negative bottom margin of its own height)
			$("#main_image1 img").attr({ src: imgTitle1 , alt: imgAlt1}); //Switch the main image (URL + alt tag)
		}).animate({ opacity: 1 }, 250);
	}
	//Show active list-item
	$("#image_thumb1 ul li").removeClass('active'); //Remove class of 'active' on all list-items
	$(this).addClass('active');  //Add class of 'active' on the selected list
	return false; 

}, function() {
	$(this).removeClass('hover'); //Remove class "hover" on hover out
});
})