/* Start of CMSMS style sheet 'NATHALIA MENU' */
/* Navigation
--------------------------------------------------------------------------- */
#navigation {
	width: 252px;
	float: left;
	margin: 0 1px 0 0;
	font-size: 13px;
}
#navigation a {
	display: block;
	text-align: left;
	padding: 24px 0 1px 32px; /* margin: 0 0 1px 0; works fine on all normal browsers and IE7, but incurs collapsing margin bug on hover in IE6 */
	width: 220px;
	height: 36px;
	background: url(uploads/nathalia/button.gif) no-repeat;
	text-transform: uppercase;
	text-decoration: none;
	color: #fff;
	/*margin: 0 0 1px 0;*/
}
#navigation a:hover, #navigation a:hover.expand {
	background-position: 0 -61px;
}
#navigation a.active, #navigation a.expand.active { /* TIP 2: doing a.active will disable hover state on .active links, where as .active alone will not [does not work on IE6, lol fail] */
	font-weight: bold;
	background-position: 0 -61px;
}
#navigation a.expand {
	background: url(uploads/nathalia/buttonExp.gif) no-repeat;
}
#navigation #navBot {
	display: block;
	background: url(uploads/nathalia/navBot.gif) no-repeat;
	width: 252px;
	height: 60px;
	margin: 0 0 60px 0;
}
/* MEGA-MENU!
--------------------------------------------------------------------------- */
ul#menu li.mega div ul.subList li{
	float: none;
}
ul#menu li.mega div ul.subList a {
	display: block;
	text-align: left;
	padding: 9px 0 1px 32px;
	width: 220px;
	height: 21px;
	background: url(uploads/nathalia/subButton.gif) no-repeat;
	text-transform: capitalize;
	text-decoration: none;
	color: #fff;
	font-size: 11px;
	/*margin: 0 0 1px 0;*/
}
ul#menu li.mega div ul.subList  a:hover {
	background-position: 0 -31px;
}
ul#menu li.mega div ul.subList a.active {
	font-weight: bold;
	background-position: 0 -31px;
}
ul#menu div {
	display: none;
}
ul#menu li.mega div {
	width: 252px;
	position: relative;
	top: 0;
	left: 0;
}
ul#menu li.hovering div {
	display: block;
}
/* End of 'NATHALIA MENU' */

