window.addEvent('domready', function() {

	rows = $$('#listFeatures tr.hover');
	popups = $$('.popup');
	popupSizes = [];

	// get popup sizes and hide popups
	popups.each(function(el, i) {
		el.setStyles({'display': 'block'});
		popupSizes[i] = el.getCoordinates();
		el.setStyles({'display':'none', 'position':'absolute', 'width':'250px', 'border':'1px solid #e9ab07', 'border-right':'2px solid #e9ab07'});
	});

	rows.each(function(el, i) {
		// capture mouseover
		el.addEvent('mouseover', function(ev) {
			el.setStyles({'background':'#fef0c9', 'zIndex':1000});
			rowSize = el.getCoordinates();
			x = 200 + el.getLeft();
			y = el.getTop() - (popupSizes[i].height / 2) - (rowSize.height / 2 );
			popups[i].setStyles({'display':'block', 'left':x+'px', 'top':y+'px', 'zIndex':1000});
		});

		// capture mouseout
		el.addEvent('mouseout', function(ev) {
			el.setStyles({'background':'#fff', 'zIndex':0});
			popups.each(function(popup, n) {popup.setStyles({'display':'none', 'zIndex':0})});
		});
	});

});