$(function(){
	fixDropDownMenus();
});
function fixDropDownMenus() {
	detectBrowser();
	initTableNav();
};
function detectBrowser(){
	var userAgent = navigator.userAgent.toLowerCase();
	var userBrowserName  = navigator.appName.toLowerCase();
	// Figure out what browser is being used
	$.browser = {
		version: (userAgent.match( /.+(?:rv|it|ra|ie)[\/: ]([\d.]+)/ ) || [0,'0'])[1],
		safari: /webkit/.test( userAgent ),
		opera: /opera/.test( userAgent ),
		msie: /msie/.test( userAgent ) && !/opera/.test( userAgent ),
		mozilla: /mozilla/.test( userAgent ) && !/(compatible|webkit)/.test( userAgent ),
		name:userBrowserName
	};
};
function initTableNav(){
    $('.table-nav').remove();
	$('.sf-menu').each(function(){
		var _this = $(this);
		var _li = _this.find('>li');
		var table = $('<table class="table-nav"><tr></tr></table>');
		_li.each(function(){
			var td = $('<td></td>');
			td.html($('<div></div>').html($(this).html()));
			td.addClass($(this).attr("class"));
			table.find('tr').append(td);
		});
		table.insertAfter(_this);
		var _height = table.find('td').outerHeight();
		table.find('td').each(function(){
			$(this).find('div>a').css({
				paddingTop:(_height - $(this).find('div>a').outerHeight())/2,
				paddingBottom:(_height - $(this).find('div>a').outerHeight())/2
			});
			$(this).mouseenter(function(){
				$(this).addClass('hover');
			}).mouseleave(function(){
				$(this).removeClass('hover');
			});
		});
		table.find('ul').css({top:_height});
		//_this.remove();
	});
}