/*
The dropdown menu was primarily based on the code provided by Michael MacNaughton at:
	www.texaswebdevelopers.com
The specific article it was taken from can be seen as of November 19, 2009 at:
	http://www.texaswebdevelopers.com/blog/template_permalink.asp?id=129

The protip and span explinations was inspired by Eric Meyer at:
	http://meyerweb.com/
That article can be seen as of November 19, 2009 at:
	http://meyerweb.com/eric/css/edge/popups/demo.html
	
Some neccisary elements of the protip's functionality are in the n_.css file
as well as the button's mouseover effect, which is drawn from Jacob at:
	http://www.webvamp.co.uk/
That article can be seen as of November 19, 2009 at:
	http://www.webvamp.co.uk/blog/coding/css-image-rollovers/
	
Thank you all for the invaluable articles and informative websites
*/

/*[0] Mainmenu and related selectors*/
/*************************************************************************/
	.mainmenu
	{
		position:absolute;
		z-index:70;
		right:0px;
		top: 147px; /*(#header{height}) - (.n_mo{height})*/
		margin-left:-360px;
		width:720px;
	}

	ul.menu
	{
		padding:0;
		margin:0;
		list-style:none;
		width:120px;
		overflow:hidden;
		float:left;
		margin-right:0px;/*Distance between menu items*/
	}

	ul.menu li.list
	{
		float:left;
		width:240px;
		/*
		width==(ul.menu li.list a.category {width})+(ul.menu a{padding-left})*2
		(ul.menu li.list a.category {width}) == (ul.submenu li a {width})
		*/
		margin:-32767px -120px 0px 0px;
		/*
		margin: a# b# c# d#
		b#==[(ul.menu li.list a.category {width})+(ul.menu a{padding-left})]*(-1)
		(ul.menu li.list a.category {width}) == (ul.submenu li a {width})
		*/
	}

	ul.menu li.list a.category
	{
		position:relative;
		display:block;
		float:left;
		width:120px;
		margin-top:32767px;
	}

	ul.menu li.list a.category:hover,
	ul.menu li.list a.category:focus,
	ul.menu li.list a.category:active
	{
		margin-right:1px;
	}

	/*(.mainmenu{width}) - .mainmenu span{width} - {(ul.menu{width})*(The Menu's Position)]*/

	ul.submenu
	{
		float:left;
		padding:25px 0px 0px 0px;
		margin:0;
		list-style:none;
		margin:-25px 0px 0px 0px;
		z-index: 60;
	}
	 
	ul.submenu li a
	{
		float:left;
		width:120px;
		clear:left;
	}

	ul.submenu a:hover,
	ul.submenu a:focus,
	ul.submenu a:active
	{
		margin-right:1px;
	}

/*[1] Protip, Tip, and Span Explinations*/
/*************************************************************************/
	.mainmenu span
	{ /*Styling for the span explinations*/
		position: absolute;
		width: 300px; /*#topRight{width}*/
		height: 65px;
		float: left;
		top: -67px;
		right: 0px; /*[(topRight{width}) - (.mainmenu span {width})]/2*/
		text-align: center;
		display: none;
		background-color: black;
		z-index: 80;
	}

	.mainmenu span.protip
	{
		display: block;
		z-index: 70;
	}

	li.list:hover span.tip,
	li.list:focus span.tip,
	li.list:active span.tip
	{
		display: block;
	}

	.mainmenu a:hover span,
	.mainmenu a:focus span 
	{
		display: block;
	}