jQuery(function(){
		// remove link background images since we're re-doing the hover interaction below 
		// (doing it this way retains the CSS default hover states for non-javascript-enabled browsers)
		// we also want to only remove the image on non-selected logo items, so this is a bit more complicated
		jQuery(".logo").children("li").each(function() {
			var current = "glogo current-" + (jQuery(this).attr("class"));
			var parentClass = jQuery(".logo").attr("class");
			if (parentClass != current) {
				jQuery(this).children("a").css({backgroundImage:"none"});
			}
		});	
		// create events for each logo item
		attachlogoEvents(".logo", "main");

		function attachlogoEvents(parent, myClass) {
			jQuery(parent + " ." + myClass).mouseover(function() {
				jQuery(this).append('<div class="logo-' + myClass + '"></div>');
				jQuery("div.logo-" + myClass).css({display:"none"}).fadeIn(300);
			}).mouseout(function() {
				jQuery("div.logo-" + myClass).fadeOut(500, function() {
					jQuery(this).remove();
				});
			}).mousedown(function() {
				jQuery("div.logo-" + myClass).attr("class", "logo-" + myClass + "-click");
			}).mouseup(function() {
				jQuery("div.logo-" + myClass + "-click").attr("class", "logo-" + myClass);
			});
		}
	});