/*
	Style sheet used when browser width is equal or less than 800 pixels
	Removes footer and re-centers the page within the browser window
	moving the navigation to the top of the screen and the Jeldwen logo
	into the main content area at the bottom of the panel
*/

@import "/inc/css/main.css";

#wrapper {
	top: -210px;
	height: 420px;
}
#header {
	border-bottom: 0;
}
#footer {
	display: none;
}
#contentsml,
#contentlge {
	background-image: url(/img/logo/footer_jeldwen.gif);
	background-position: center bottom;
	background-repeat: no-repeat;
}
html>body #contentsml,
html>body #contentlge {
	background-image: none;
}
p.only800 {
	display: block;
}
#menubar {
	display: none;
}
#menubartop {
	display: block;
	width: 100%;
	height: 19px;
	background-color: #C3092C;
}
html>body #menubartop {
	height: 20px;
}
#menubarmaintop {
	float: left;
	width: 330px;
}
#menubarsubtop {
	width: 435px;
	float: right;
}
/*
--------------------------------------------------------
	DROP DOWN MENU SPECIFICATIONS
--------------------------------------------------------
*/
#navtop, 
#navtop ul { /* all lists */
	padding: 0;
	margin: 0;
	list-style: none;
	float: right;
	z-index: 2;
}
#navtop a {
	display: block;
	width: auto; /* width needed or else Opera goes nuts */
	white-space: nowrap;
}
#navtop a:hover, 
#navtop a:link {
	width: auto;
}
#navtop li { /* all list items */
	float: left;
	border-bottom: 1px solid #980A24;
	width: auto;
}
#navtop li ul { /* second-level lists */
	position: absolute;
	background: #C3092C;
	border-left: 1px solid #980A24;
	border-right: 1px solid #980A24;
	left: -999em; /* using left instead of display to hide menus because display: none isn't read by screen readers */
	width: 90px;
}
#navtop li ul ul { /* third-and-above-level lists */
	margin: -1em 0 0 75px;
	border-top: 1px solid #980A24;
}
#navtop li:hover ul ul, 
#navtop li:hover ul ul ul, 
#navtop li.sfhoverTop ul ul, 
#navtop li.sfhoverTop ul ul ul {
	left: -999em;
}
#navtop li:hover ul, 
#navtop li li:hover ul, 
#navtop li li li:hover ul, 
#navtop li.sfhoverTop ul, 
#navtop li li.sfhoverTop ul, 
#navtop li li li.sfhoverTop ul { /* lists nested under hovered list items */
	left: auto;
}
#navtop li li {
	width: 100%;
}
#navmaintop, 
#navmaintop ul { /* all lists */
	padding: 0;
	margin: 0;
	list-style: none;
	float: right;
	z-index: 2;
}
#navmaintop a {
	display: block;
	width: auto; /* width needed or else Opera goes nuts */
	white-space: nowrap;
}
#navmaintop a:hover, 
#navmaintop a:link {
	width: auto;
}
#navmaintop li { /* all list items */
	float: left;
	border-bottom: 1px solid #980A24;
	width: auto;
}
#navmaintop li ul { /* second-level lists */
	position: absolute;
	background: #C3092C;
	border-left: 1px solid #980A24;
	border-right: 1px solid #980A24;
	left: -999em; /* using left instead of display to hide menus because display: none isn't read by screen readers */
	width: 90px;
}
#navmaintop li ul ul { /* third-and-above-level lists */
	margin: -1em 0 0 75px;
	border-top: 1px solid #980A24;
}
#navmaintop li:hover ul ul, 
#navmaintop li:hover ul ul ul, 
#navmaintop li.sfhoverMainTop ul ul, 
#navmaintop li.sfhoverMainTop ul ul ul {
	left: -999em;
}
#navmaintop li:hover ul, 
#navmaintop li li:hover ul, 
#navmaintop li li li:hover ul, 
#navmaintop li.sfhoverMainTop ul, 
#navmaintop li li.sfhoverMainTop ul, 
#navmaintop li li li.sfhoverMainTop ul { /* lists nested under hovered list items */
	left: auto;
}
#navmaintop li li {
	width: 100%;
}
#menubarmaintop ul,
#menubarmaintop li {
	margin: 0;
	padding: 0;
	list-style: none;
	float: left;
}
#menubarmaintop a,
#menubarsubtop a {
	display: block;
	padding: 4px 6px 4px 6px;
	white-space: nowrap;
}