// JavaScript Document

$(document).ready(function() {

var originalBG = $(".widget ul li").css("background-color");
var fadeColor = "#e8e8e2, opacity: 0.8"; 



$(".container ul.gallery li").hover( function () {
    $(this).animate( { backgroundColor:fadeColor}, 450 )
  },
  function () {
    $(this).animate( {backgroundColor:"#FFF", opacity: 1.0}, 200 )
  }
  );


$(".container ul.gallery li").hover(function() { //On hover...

		var thumbOver = $(this).find("img").attr("src"); //Get image url and assign it to 'thumbOver'

		//Set a background image(thumbOver) on the <a> tag - Set position to bottom
		$(this).find("a.thumb").css({'background' : 'url(' + thumbOver + ') no-repeat center bottom', opacity: 1.0});

		//Animate the image to 0 opacity (fade it out)
		$(this).find("span.imagefade").stop().fadeTo('slow', 0 , function() {
			$(this).hide() //Hide the image after fade
		});
	} , function() { //on hover out...
		//Fade the image to full opacity 
		$(this).find("span.imagefade").stop().fadeTo('normal', 1).show();
	});







});