var menuSelected

function menuInit() {
	var menu = document.getElementById('menu')
	var menuItems = menu.getElementsByTagName('li')
	for (var i=0; i<menuItems.length; i++) {
		if (menuItems[i].parentNode.id != 'menu') continue
		var menuContentItems = menuItems[i].getElementsByTagName('li')
			
			// annoying bug in IE, which breaks the lines
		for (var j=0; j<menuItems[i].childNodes.length; j++)
			if (menuItems[i].childNodes[j].className == 'menuContent')
				{menuU = menuItems[i].childNodes[j]; break}
		var oldClassName = menuU.className 
		menuU.className += ' menuVisible'
		var sum = 0
		for (var j=0; j<menuContentItems.length; j++) {
			var a = menuContentItems[j].getElementsByTagName('a')[0]
			if (a.offsetHeight > 30) {
					// we add some extra width to the last item, to create a breakline
					// we do this by means of a border, which is colored as the background (i.e. white)
				 menuContentItems[j-1].style.borderRight = 'solid '+(menu.offsetWidth - sum - 50)+'px white'
				 break}
			sum += menuContentItems[j].offsetWidth}
		menuU.className = oldClassName
		
		var a = menuItems[i].getElementsByTagName('a')[0]
		if (a.parentNode.className.indexOf('menuSelected')>0) menuSelected = a.parentNode
		a.onmouseover = function() {
			var i = menuSelected.className.indexOf('menuSelected')
			menuSelected.className = menuSelected.className.substr(0,i)+menuSelected.className.substr(i+12)
			this.parentNode.className += ' menuSelected'
			menuSelected = this.parentNode
			hiderestul();
			}}}