Event.observe(window, 'load', initNav);
function initNav(evt) {
	Event.observe($('top').down('a'), 'mouseover', rollOver);
	Event.observe($('top').down('a'), 'mouseout', rollOut);
	Event.observe($('bottom').down('a'), 'mouseover', rollOver);
	Event.observe($('bottom').down('a'), 'mouseout', rollOut);
};
function rollOver(evt) {
	var elt = Event.element(evt).up('div').down('div').down('img');
	var id = Event.element(evt).up('div').readAttribute('id');
	var queue = Effect.Queues.get(id);
	queue.each(function(eff) { 
		eff.cancel();
	});
	new Effect.Fade(elt, {
		duration: 0.5,
		to: 0.01,
		queue: {
			scope: id,
			limit: 1
		}
	});
}
function rollOut(evt) {
	var elt = Event.element(evt).up('div').down('div').down('img');
	var id = Event.element(evt).up('div').readAttribute('id');
	var queue = Effect.Queues.get(id);
	queue.each(function(eff) { 
		eff.cancel();
	});
	new Effect.Appear(elt, {
		duration: 0.5,
		queue: {
			scope: id,
			limit: 1
		}
	});
}
