// fancy text
Cufon.replace('h2', {
    color: '-linear-gradient(#ddd,0.1=#999,0.25=#666,0.5=#222, #000)',
    textShadow: '#999 1px 1px'
});	

Cufon.replace('#masthead div span', {
    color: '-linear-gradient(#ddd,0.1=#000,0.25=#111,0.5=#222, #000)',
    textShadow: '#999 1px 1px'
});	


Cufon.replace('h1', {
    color: '-linear-gradient(#ddd,0.1=#999,0.25=#666,0.5=#222, #000)',
    textShadow: '#999 1px 1px'
});	


$(document).ready(function(){
// this basically does this
// when the mouse enter's any div inside another elemenet with the id masthead
$("#masthead div[class!=selected]").mouseenter(function(){   
   	var image = $(this).find('img[class!=selected]')
	var text = $(this).find('span[class!=selected]')
  	image.animate({"margin-top": "-10px","opacity":1}, "fast").animate({"margin-top": "0px"}, "fast");
   	text. animate({"margin-top": "20px"             }, "fast").animate({"margin-top": "0px"}, "fast");   
});

// on mouse leave reset the opacity
$("#masthead div").mouseleave(function(){   
   var image = $(this).find('img[class!=selected]')
   image.animate({"opacity":1}, "fast");


});


});