function getElementPosition(elemId)
{
    var elem = document.getElementById(elemId);
	
    var w = elem.offsetWidth;
    var h = elem.offsetHeight;
	
    var l = 0;
    var t = 0;
	
    while (elem)
    {
        l += elem.offsetLeft;
        t += elem.offsetTop;
        elem = elem.offsetParent;
    }

    return {"left":l, "top":t, "width": w, "height":h};
}

var timeout	= 700;
var closetimer	= 0;
var ddmenuitem	= 0;

// open hidden layer
function mopen(id) {	
	// cancel close timer
	mcancelclosetime();
	// close old layer
	if(ddmenuitem) ddmenuitem.style.visibility = 'hidden';
	// get new layer and show it
	ddmenuitem = document.getElementById(id);
	//ddmenuitem.style.visibility = 'visible';
	
	//var liwidth = ddmenuitem.parentNode.clientWidth;
	
var ddwidth=0;
for (var i=0; i<ddmenuitem.childNodes.length; i++) {
 ddwidth += ddmenuitem.childNodes[i].clientWidth;
}
ddmenuitem.style.width = ddwidth + 'px';

	//ddmenuitem.style.backgroundPosition =(ddmenuitem.clientWidth/2-ddmenuitem.parentNode.clientWidth/2)-35+'px 0px';	
ddmenuitem.style.left=getElementPosition(id+'g').left-((ddmenuitem.clientWidth)/2-(ddmenuitem.parentNode.clientWidth)/2) +'px';

ddmenuitem.style.backgroundPosition =ddmenuitem.clientWidth/2-5+'px 0px';	

ddmenuitem.style.visibility = 'visible';
	
}
// close showed layer
function mclose(){
	if(ddmenuitem) ddmenuitem.style.visibility = 'hidden';
}
// go close timer
function mclosetime(){
	closetimer = window.setTimeout(mclose, timeout);
}
// cancel close timer
function mcancelclosetime(){
	if(closetimer)
	{
		window.clearTimeout(closetimer);
		closetimer = null;
	}
}

// close layer when click-out
document.onclick = mclose;