/* Top Navigation */

/* Top navigation classes */
.topnav ul 
{
	margin: 0px;
	padding: 0px; /* Zeroed margins and padding to give us a clean slate */
	list-style: none; /* No bullet points in our menu, thanks */
	width: 100%; /* IE7 chokes without this */
	float: left; /* Fixes alignment issue in non-IE browsers caused by fixing for IE7. */
	font-size: 10px;
	font-weight: bold;
	background: url(../images/topnavbkg.jpg) repeat-x;
}

/* Handles positioning of main menu */
.topnav ul li 
{
	position: relative; /* This is really important */
	padding: 0px;
	float: left; /* IE7 also chokes without this */
	text-align: left;
	display: inline;
	height: 29px;
}

/* Handles positioning of submenus */
.topnav li ul
{
	position: absolute; /* This is also really important */
	left: 0px; /* Aligns the main menu and submenu on the left */
	top: 29px; /* Aligns the submenu beneath the button that spawns it. This should be the height of the buttons. */
	display: none; /* Hides the submenu when buttons aren't hovered over */
	z-index: 10000;
	width: 150px;
}

.topnav li:hover ul 
{ 
	display: block; /* Makes submenu visible on hover in all but IE6 */
}

/* This class hides the third level of flyouts when the class above is triggered */
.topnav li:hover ul li ul
{
	display: none;
}

/* Handles appearance of inactive, unhovered buttons in the main menu */
.topnav ul li a 
{
	display: block; /* Makes buttons occupy all available space */
	text-decoration: none; /* No underlines */
	color: #000000; /* Button text color */
	background: url(../images/topnavbkg.jpg) repeat-x; /* The background image */
	padding: 6px;
	margin: 0px;
	border-right: 1px solid #e06e59;
}

.topnav li ul li
{
	width: 150px;
	z-index: 9999;
	clear: both;
	position: relative;
	height: 29px;
}

/* Handles appearance of buttons that are hovered over in the main menu */
/* Only things that change from the element above need to be declared */
.topnav ul li a:hover
{
	color: #e06e59;
	text-decoration: none;
}

/* Handles appearance of inactive, unhovered buttons in the submenus */
.topnav li ul li a
{
	display: block;
	text-decoration: none;
	color: #000000;
	z-index: 10001;
	width: 150px;
	float: left;
	position: relative;
	border-right: none;
	height: 29px;
}

* html .topnav li ul li a
{
	height: 1px;
}

/* Handles appearance of buttons that are hovered over in the submenus */
.topnav li ul li a:hover
{
	color: #e06e59;
}

/* Classes for displaying the third level of flyouts */
.topnav li ul li ul
{
	width: 150px; /* This can be changed at will */
	left: 156px; /* For various complicated Internet Explorer-related reasons this has to be the width of the submenu that spawns the flyout plus 6 pixels */
	top: 0px; /* Controls the vertical offset of the third level of flyouts, and should be used instead of margins for fine-tuning positioning */
	display: none; /* Hides flyouts by default, works the same as the identical declaration in the .topnav li ul class */
	z-index: 10002; /* Yet another arbitrarily large z-index, this should be a higher number than the .topnav li ul li a declaration */
}

/* Class for displaying the third level of flyouts when invoked */
.topnav li ul li:hover ul
{
	display: block;
}

/* This class serves to override pretty much all the styling information that gets picked up by the third level of flyouts over the course of the page */
.topnav li ul li ul li a
{
	display: block;
	text-decoration: none;
	color: #000000;
	z-index: 10003;
	width: 150px;
	float: left;
	position: relative;
	border-right: none;
	height: 29px;
	padding: 6px;
}

/* Begin stuff that interacts with the Javascript */
#topnav li.off:hover ul, #topnav li.over ul 
{ 
	display: block; /* Makes submenu visible on hover in IE6 */
	z-index: 8000; /* Arbitrary large number to ensure that submenu takes precedence over all possible conflicting elements */
}

#topnav li.off:hover ul li ul, #topnav li.over ul li ul
{
	display: none;
}

#topnav li.off:hover ul li.off:hover ul, #topnav li.over ul li.over ul, #topnav li.off:hover ul li.over ul, #topnav li.over ul li.off:hover ul
{
	display: block;
}

#topnav li.off a:hover, #topnav li:hover a, #topnav li.over a 
{
	display: block; /* Safety declaration for IE6 and older versions.  Keeps CSS and Javascript from arguing. */
}

/* Javascript-assisted menu styling.  If this breaks the menu still works so don't freak out too much if you bork this. */
/* In cases of disagreement between CSS styling and Javascript styling IE6, IE7, and Opera will use the Javascript styling */
/* In cases of disagreement between CSS styling and Javascript styling Firefox will use the CSS styling */
/* In cases of disagreement between CSS styling and Javascript styling what Chrome and Webkit-based Safari do is a big fat question mark */
/* Browsers without Javascript support or with Javascript disabled will use the CSS styling */
#topnav li.over a
{
	color: #e06e59;
}

#topnav li.over ul li a
{
	color: #e06e59;
}

#topnav li.over ul li a:hover
{
	color: #000000;
}
/* End stuff that interacts with the Javascript */
/* End of top navigation */

li .large
{
	width: auto;
}

