function getElementPosition (elemID) {
	var offsetTrail = document.getElementById(elemID);
	var offsetLeft = 0;
	var offsetTop = 0;
	while ( offsetTrail ) {
		offsetLeft += offsetTrail.offsetLeft;
		offsetTop += offsetTrail.offsetTop;
		offsetTrail = offsetTrail.offsetParent;
		}
	if (navigator.userAgent.indexOf("Mac") != -1 &&
		typeof document.body.leftMargin != "undefined") {
		offsetLeft += document.body.leftMargin;
		offsetTop += document.body.topMargin;
		}
	return { left:offsetLeft, top:offsetTop };
	}


function showData (e) { 
	var topPosition = getElementPosition(e.id).top; //alert(topPosition);
	var dataElem = document.getElementById('data'); //alert(dataElem.style.top);
	var newData = nextElementAfter(e.parentNode.parentNode.firstChild); //alert(newData.nodeName);
	var copiedNode = newData.cloneNode(true);
	copiedNode.style.display = 'block';
	var removedNode = dataElem.replaceChild(copiedNode, dataElem.firstChild);
	dataElem.style.top = topPosition+'px';
	dataElem.style.left = '50px';
	}

function nextElementAfter ( node ) { 
	var newnode = node.nextSibling;
	while ( newnode.nodeType != 1 ) {
		newnode = newnode.nextSibling;
		}
	return newnode;
	}

function nextElementNamed ( nType, node ) {
	var newnode = node.nextSibling; 
	while ( newnode.nodeName != nType ) {
		newnode = newnode.nextSibling;
		}
	return newnode;
	}