/*
	I. Table Of Contents
	1. Reset
	2. Tables
	3. Headings
	4. Anchors
	5. Form Elements
	6. General Classes
	7. Template & Layout
	8. Print
	9. Handheld
	10. Aural
	11. CSS Diagnostics	

Sizing in EMs
[If] Body = Parent .75em [Then] Number/12px = 0.0EMs
	11px      .9em
	12px     1.0em
	13px     1.1em
	14px     1.2em
	15px     1.25em
	16px     1.3em
	19px     1.6em

CSS References
	http://www.w3.org/TR/css3-selectors/#selectors
	http://en.wikipedia.org/wiki/Comparison_of_layout_engines_(CSS)
	http://developer.mozilla.org/en/docs/Writing_Efficient_CSS
	http://www.dustindiaz.com/css-shorthand/
	http://www.tanfa.co.uk/css/examples/

Browser Hacks
	http://www.nealgrosskopf.com/tech/thread.asp?pid=20

IE Bugs
	http://css-class.com/articles/explorer/guillotine/
	http://www.satzansatz.de/cssd/onhavinglayout.html
	http://csscreator.com/node/472 - Fixes browser viewport resize and misaligned background images due to odd numbered width - !=IE6 - border-left: 1px solid transparent; 
	http://jszen.blogspot.com/2005/04/ie-bold-text-opacity-problem.html



/****************************************************************
 1. Reset  -  http://tantek.com/log/2004/undohtml.css  -  http://meyerweb.com/eric/tools/css/reset/
****************************************************************/
html, body, h1, h2, h3, h4, h5, h6, img, blockquote, q, table, thead, tbody, tfoot, caption, th, tr, td, a, form, input, textarea, fieldset, pre
{ margin: 0px; padding: 0px; }

address { font-style: normal; }
acronym, abbr { border-bottom: 1px #000000 dashed; cursor: help; }

a img, img { border: none; }
a { text-decoration: none; }
img
{
display: block; /* http://developer.mozilla.org/en/docs/Images,_Tables,_and_Mysterious_Gaps */
-ms-interpolation-mode: bicubic; /* http://css-tricks.com/ie-fix-bicubic-scaling-for-images/ */
}

ul, ol, p, blockquote
{
margin-top: 1em;
margin-bottom: 1em;
}



/****************************************************************
 2. Tables
****************************************************************/
table
{
border: 1px solid #dde1e5;
border-collapse: collapse;
border-spacing: 0px;
width: 100%;
}

td, th
{
border: 1px solid #dde1e5;
empty-cells: show;
margin: 0px;
padding: .5em;
vertical-align: top;
}

th
{
font-weight: bold;
text-align: center;
}

td { text-align: left; }

caption
{
background: #445c6e url(/files/images/template/caption_bg.png) repeat-x left top;
color: #ffffff;
font-weight: bold;
margin-left: -1px;
padding: .4em;
}

/* table tr:nth-child(even) table tr:nth-child(odd) */
.def td { background: #ffffff; }
.alt td { background: #fafbfb; }



/****************************************************************
 3. Headings
****************************************************************/
#header h1 a
{
background: url(/files/images/template/huebsch_logo.png) no-repeat left top;
cursor: pointer;
display: block;
position: absolute;
left: 0px;
top: 7px;
height: 60px;
width: 247px;
}
#header h1 span { display: none; }

#header h2
{
color: #d8402b;
font-size: .9em;
font-weight: bold;
position: absolute;
left: 118px;
top: 54px;
}

#nav h2, #subnav h2 { display: none; }

#content h2
{
color: #d8402b;
font-size: 1.5em;
line-height: 1em;
margin-bottom: 6px;
}

/*#content h3, #content h4 { margin: 12px 0em; line-height: 1em; }*/
#content h3, #content h4 { margin: 1em 0em; }

#content h3 { font-size: 1.2em; }

#content h3, #content h3 a { color: #445c6e !important; }

#content h4
{
color: #445c6e !important;
font-size: 1em;
}



/****************************************************************
 4. Anchors - Link - Visited - Hover - Focus - Active
****************************************************************/
#content a
{
color: #d8402b;
padding-bottom: 1px;
}

#content a:link { color: #d8402b; border-bottom: 1px solid #cccccc; }
#content a:visited {color: #d8402b; border-bottom: 1px solid #cccccc; }
#content a:hover { color: #d8402b; border-bottom: 1px solid #76889a; }
#content a:focus { color: #d8402b; border-bottom: 1px solid #cccccc; }
#content a:active { color: #d8402b; border-bottom: 1px solid #445c6e; }

.unstyled { border-width: 0px !important; padding-bottom: 0px !important; }

*[accesskey]:focus { outline: 1px solid #aaaaaa; }

#content a[href^="http://"], a[target="_blank"] { background: url(/files/images/icons/external.png) no-repeat right top; padding-right: 16px; }
#content a[href^="mailto:"] { background: url(/files/images/icons/email.png) no-repeat right top; padding-right: 19px; }
#content a[href$=".pdf"] { background: url(/files/images/icons/pdf.png) no-repeat right top; padding-right: 19px; }

body[class*="products"] #content a[href$="brochures.asp"]
{
background: url(/files/images/icons/download.png) no-repeat right center;
padding-right: 15px;
}

.download
{
background: url(/files/images/icons/download.png) no-repeat right center;
padding-right: 15px;
}



/****************************************************************
 5. Form Elements - http://www.456bereastreet.com/archive/200410/styling_even_more_form_controls/
****************************************************************/
fieldset { padding: 10px; border: 1px solid #cccccc; }

legend { font-weight: bold; color: #445c6e; }

label { font-weight: bold; }
input + label { font-weight: normal; }

textarea
{
height: 150px;
width: 300px;
overflow-y: auto;
resize: both;
}

button
{
line-height: 1em;
overflow: visible;
padding: 4px 5px;
width: auto; /* http://www.viget.com/inspire/comments/styling-the-button-element-in-internet-explorer/ */
}

select, textarea, input, button
{
color: #555555;
font-family: Arial, Helvetica, sans-serif;
font-size: 1em;
outline-width: 0px; /* removes mac outline */
}

textarea,
input[type="text"],
input[type="password"]
{ border: 1px solid #cccccc; padding: 4px; }

textarea:focus,
input[type="text"]:focus,
input[type="password"]:focus
{ border: 1px solid #aaaaaa; }

.textbox, .textboxfocus { border: 1px solid #cccccc; padding: 4px; }
.textboxfocus { border-color: #aaaaaa; }



/****************************************************************
 6. General Classes
****************************************************************/
.top { vertical-align: top; }
.bottom { vertical-align: bottom; }
.middle { vertical-align: middle; }
.sub { vertical-align: sub; }
.sup { vertical-align: super; }

.left { text-align: left; }
.right { text-align: right; }
.center { text-align: center; }
.justify { text-align: justify; }
.distribute { text-justify: distribute; }

.smallcaps { font-variant: small-caps; }
.b { font-weight: bold; }
.i { font-style: italic; }
.u { text-decoration: underline; }
.o { text-decoration: overline; }
.s { text-decoration: line-through; }
.su { text-decoration: line-through underline; }

.ucase { text-transform: capitalize; }
.lowercase { text-transform: lowercase; }
.uppercase { text-transform: uppercase; }

.slant { font-style: oblique; } /* http://usabletype.com/css/font/styles/ */
.indent { text-indent: 1em; }
.wrap { word-wrap: break-word; white-space: normal; }
.pre { white-space: pre; }
.clear { clear: both; }

.block { display: block; }
.inline { display: inline; }
.none { display: none; }
.visible { visibility: visible; }
.hidden { visibility: hidden; }
.collapse { visibility: collapse; }

.circle { list-style-type: circle; }
.disc { list-style-type: disc;}

.dropcap:first-letter { font-size: 1.3em; font-weight: bold; }

.semitransparent { opacity: 0.75; }

ul.collapse
{
display: inline;
list-style-type: none;
list-style-position: inside;
margin: 0em;
padding: 0em;
}
ul.collapse li { display: inline; }

.hr
{
border-bottom: 1px dotted #cccccc; /* IF IE 6 */
height: 1px;
margin: 2em 0em;
text-align: center;
width: 100%;
}
hr { display: none; }

::-moz-selection
{
background: #445c6e;
color: #ffffff;
}

::selection
{
background: #445c6e;
color: #ffffff;
}

.req
{
color: #d8402b;
font-size: 1.2em;
font-weight: bold;
margin-right: 2px;
}

.success, .notice, .error { padding: 5px 5px 5px 35px; }

.success
{
background: #f0f6f0 url(/files/images/icons/success.png) no-repeat 10px center;
border: 1px solid #d7e7d7;
color: #378737;
}

.notice
{
background: #ffffcc url(/files/images/icons/notice.png) no-repeat 10px center;
border: 1px solid #a2a282;
font-weight: bold;
}

.error
{
background: #f9f0f0 url(/files/images/icons/error.png) no-repeat 10px center;
border: 1px solid #daa2a2;
color: #660000;
font-weight: bold;
}

.frame
{
border: 1px solid #cccccc;
padding: 10px;
}

.imageleft
{
float: left;
margin: 0px 15px 15px 0px;
}

.imageright
{
float: right;
margin: 0px 0px 15px 15px;
}

/* Products Pages */
#product_locator
{
margin: 2em 0em;
width: 350px;
}
#product_locator fieldset { border: 1px solid #ccc; }
	#product_locator legend { padding: 0px 8px; }
	#product_locator div { padding: 0px; }
	#product_locator button { padding: 2px; line-height: 12px; }

#control_options
{
list-style-type: none;
margin: 0px;
padding: 0px;
height: 125px;
position: relative;
}
	#control_options li { float: left; margin-right: 5px; }

		#control_options img { width: 51px; /* @IE 8 */ vertical-align: top; display: inline; }

		#control_options li div
		{
		display: none;
		position: absolute;
		top: 55px;
		left: 0px;
		}

		#control_options li:hover div { display: block; }



/****************************************************************
 7. Template & Layout
****************************************************************/
html
{
background: url(/files/images/template/html_bg.png) repeat-x left top;
font-size: 100%; /* http://www.alistapart.com/articles/howtosizetextincss */
overflow-y: scroll; /* http://webdevel.blogspot.com/2007/05/controlling-browser-scrollbars.html */
}

body
{
background: url(/files/images/template/body_bg.jpg) repeat-x left 118px;
color: #555555;
font-family: Arial, Helvetica, sans-serif;
font-size: .75em; /* http://clagnut.com/blog/348/#c790 */
text-align: center; /* center things in <= IE6 */
vertical-align: baseline;
}

#footer_bg
{
background: url(/files/images/template/footer_bg.png) repeat-x left bottom;
position: relative; /* IF IE 6 see #logoart */
}

#container
{
margin: 0px auto;
text-align: left;
width: 740px;
/* Covers #logoart if resolution is set to 800x600 */
position: relative;
z-index: 2;
}

#accessibility { display: none; }

#header
{
height: 76px;
position: relative;
}

#locator
{
position: absolute;
top: 10px;
right: 10px;
z-index: 3;
}

	#locator, #locator ul
	{
	list-style-type: none;
	margin: 0px;
	padding: 0px;
	}

	#locator { width: 180px; /* 168px, 230px */ }

	#locator span /* IE IE6 */
	{
	background: url(/files/images/template/locator.gif) no-repeat right top;
	color: #445c6e;
	display: block;
	font-weight: bold;
	height: 29px;
	line-height: 29px;
	padding-left: 5px;
	}

	#locator:hover span /* IE IE6 */
	{
	background-color: #667a88;
	background-position: right bottom;
	color: #ffffff;
	}

	#locator li ul /* IE IE6 */
	{
	background: #ffffff;
	border: 1px solid #cccccc;
	display: none;
	width: 202px; /* 190px, 252px */
	}

	#locator li:hover ul { display: block; }

	#locator a /* IE IE6 */
	{
	color: #445c6e;
	display: block;
	padding: 5px;
	}

	#locator a:hover { background: #f1f1f1; }

#nav { }

	#nav ul
	{
	border-right: 1px solid #76889a;
	display: block;
	list-style-type: none;
	margin: 0px;
	padding: 0px;
	height: 35px;
	width: 410px;
	}

		#nav li
		{
		border-left: 1px solid #000000;
		border-right: 1px solid #76889a;
		display: block;
		float: left;
		}

		#nav li.last-child { border-right: 1px solid #000000; }

			#nav a
			{
			color: #ececec;
			display: block;
			line-height: 35px;
			height: 35px;
			width: 80px;
			text-align: center;
			}

			#nav a.selected,
			#nav a:hover
			{
			background: url(/files/images/template/nav_a_bg.png) repeat-x left top;
			color: #ffffff;
			}

#content_bg
{
background: url(/files/images/template/content_border_bg.png) repeat-y left top;
/* EDIT: overflow: auto; not needed?*/
}

#subnav
{
float: left;
width: 152px;
}

	#subnav a
	{
	border: 1px solid #cccccc;
	border-top-width: 0px; /* See: #subnav ul li:first-child a */
	display: block;
	padding: 8px 6px;
	}

	/* Persistent flyouts - default */
	#subnav a,
	#subnav a.arrow,
	#subnav li:hover li a.arrow,
	#subnav li li:hover li a.arrow,
	#subnav li li li:hover li a.arrow,
	#subnav li li li li:hover li a.arrow
	{
	background: #f1f3f4 url(/files/images/template/menu_arrow.png) no-repeat 98% 0px;
	color: #445c6e;
	}

	/* Persistent flyouts - hover */
	#subnav a:hover,
	#subnav li:hover a.arrow,
	#subnav li li:hover a.arrow,
	#subnav li li li:hover a.arrow,
	#subnav li li li li:hover a.arrow
	{ background: #fafafa url(/files/images/template/menu_arrow.png) no-repeat 98% -31px; }

	#subnav a, #subnav a:hover { background-image: none; }

	/* Gives first child flyout border type. Used to avoid 'double border effect' */
	#subnav ul li.first-child a,
	#subnav ul li.first-child li.first-child a
	{ border-top-width: 1px; }

	#subnav ul li.first-child ul a { border-top-width: 0px; }

	#subnav li { position: relative; }

	#subnav ul
	{
	list-style-type: none;
	margin: 0px;
	padding: 0px;
	}

		#subnav ul ul
		{
		padding: 50px 50px 50px 0px;
		position: absolute;
		top: -51px;
		left: 151px;
		width: 100%;
		}

		#subnav ul li.first-child ul { top: -50px; }

	#subnav ul ul,
	#subnav ul li:hover ul ul,
	#subnav ul ul li:hover ul ul
	{ display: none; }

	#subnav ul li:hover ul,
	#subnav ul ul li:hover ul,
	#subnav ul ul ul li:hover ul
	{ display: block; }

#content
{
background: #ffffff;
float: right;
line-height: 2.25em;
margin: 0px 1px;
padding: 12px 20px 0px 20px;
text-align: justify;
width: 546px;
/* http://www.dustindiaz.com/min-height-fast-hack/ */
min-height: 485px;
height: auto !important;
height: 485px;
}

	#tools { overflow: hidden; }

	#crumbs
	{
	list-style-type: none;
	margin: 0px;
	padding: 0px;
	height: 27px;
	width: 435px;
	}

	#crumbs li
	{
	color: #888888;
	float: left;
	display: block;
	margin-right: 5px;
	}

	#content #crumbs a { color: #445c6e; }

	#sitetools
	{
	float: right;
	list-style-type: none;
	margin: 0px;
	padding: 0px;
	}

		#sitetools li
		{
		float: left;
		margin-left: 7px;
		vertical-align: bottom;
		}

			#content #sitetools a { border-bottom-width: 0px; padding-bottom: 0px; }

			#content #sitetools .resize a
			{
			color: #76889a;
			line-height: 1em;
			text-decoration: none;
			}
			#content #sitetools .resize a:hover { color: #445c6e; }

			#small a { font-size: 1em; } /* IF IE 7 */
			#medium a { font-size: 1.3em; } /* IF IE 7 */
			#large a { font-size: 1.7em; } /* IF IE 7 */

			#print a, #email a
			{
			display: block;
			height: 15px;
			margin-top: 3px;
			}

			#print a
			{
			background: url(/files/images/template/print.png) no-repeat left top;
			width: 15px;
			}

			#email a
			{
			background: url(/files/images/template/email.png) no-repeat left top;
			width: 20px;
			}

			#print a:hover, #email a:hover { background-position: left bottom; }

			#print span, #email span { display: none; }

	#innercontent { clear: both; margin-top: 1em; }

#shadow { background: url(/files/images/template/shadow_bg.png); }

#shadow, #footer_shadow
{
height: 7px;
font-size: 7px;
}

#tagline
{
clear: both;
color: #bbbbbb;
font-weight: bold;
padding: 12px 20px 5px 20px;
text-align: right;
}

#footer_shadow
{
background: url(/files/images/template/footer_shadow_bg.png);
margin-bottom: -7px;
}

#logoart /* IF IE 6 */
{
position: absolute;
bottom: 90px;
right: 20px;
}

#footer
{
height: 82px;
position: relative;
}

	#footer ul, #legal
	{
	margin: 0px;
	position: absolute;
	text-align: center;
	width: 100%;
	}

	#footer ul
	{
	display: block;
	list-style-type: none;
	padding: 0px;
	top: 20px;
	}

	#footer li
	{
	border-left: 1px solid #bbbbbb;
	display: inline;
	list-style-type: none;
	padding: 0px 3px 0px 6px;
	}

	#footer li.first-child
	{
	border-left-width: 0px;
	padding-left: 0px;
	}

	#footer a
	{
	color: #76889a;
	font-size: .9em;
	text-decoration: underline;
	}

	#footer a:hover { color: #445c6e; }

	#legal
	{
	color: #999999;
	font-size: .85em;
	top: 55px;
	}

	#als
	{
	position: absolute;
	top: 15px;
	right: 25px;
	z-index: 1;
	}



/****************************************************************
 8. Print - http://www.alistapart.com/stories/goingtoprint/
****************************************************************/
@media print {
#header, #nav, #subnav, #tools, #tagline, #footer, #logoart { display: none; }
#content { border-width: 0px; color: #000000; float: none; padding: 0px; width: 100%; }
#content a { text-decoration: underline; border-bottom-width: 0px; }
}



/****************************************************************
 9. Handheld
****************************************************************/
@media handheld {
#accessibility { display: block; }
}



/****************************************************************
 10. Aural
****************************************************************/
@media aural {
#accessibility { display: block; }
}



/****************************************************************
 11. CSS Diagnostics - http://css-diagnostics.googlecode.com/files/css-diagnostics2.0.css
****************************************************************/

img[src^="http://www.speedqueen.com"], a[href^="/route/"]
{ border: 5px double #00FF00 !important; }

/*a[href$="nmc.asp"], a[href*="tumblers"]
{ border: 5px double #6600FF !important; }*/

a[href$="/stacked-dryers/"], a[href*="literature"], a[href*="nmc.asp"], a[href*="nmcm.asp"]
{ border: 5px double #6600FF !important; }

/* Empty Attributes */
img[alt=""], area[alt=""], *[class=""], a[href=""], a[href="#"], *[id=""], *[title=""]
{ border: 5px dotted yellow !important; }

/* Proposed Deprecation Due To CSS */
body[background], table[background], td[background], th[background],
input[border], table[border]
table[cellpadding],
table[cellspacing],
object[codebase],
img[height], object[height], table[height],
a[name], form[name], img[name], object[name],
a[target], area[target],
td[valign], th[valign],
img[width], object[width], table[width]
{ border: 5px dotted orange !important; }

/* W3C HTML 4 Strict Deprecated Attributes - http://www.w3.org/TR/html401/index/attributes.html */
applet[align], caption[align], div[align], h1[align], h2[align], h3[align], h4[align], h5[align], h6[align], hr[align], iframe[align], img[align], input[align], legend[align], object[align], p[align], table[align],
body[alink],
applet[alt],
applet[archive],
body[background],
body[bgcolor], td[bgcolor], tr[bgcolor], table[bgcolor],
img[border], object[border],
br[clear],
applet[code],
applet[codebase],
basefont[color], font[color],
dir[compact], dl[compact], menu[compact], ol[compact], ul[compact],
basefont[face], font[face],
applet[height], td[height], th[height],
applet[hspace], img[hspace], object[hspace],
script[language],
body[link],
applet[name],
hr[noshade],
td[nowrap], th[nowrap],
applet[object],
isindex[prompt],
hr[size], font[size], basefont[size],
ol[start],
body[text],
li[type], ol[type], ul[type],
html[version],
body[vlink],
li[value],
applet[vspace], img[vspace], object[vspace], 
hr[width], td[width], th[width], applet[width], pre[width]
{ border: 5px dotted red !important; }

/* Non W3C Proprietary HTML Attributes - http://en.wikipedia.org/wiki/Non-standard_HTML_tags#Proprietary_HTML_attributes */
body[bgproperties],
*[bordercolor], *[bordercolordark], *[bordercolorlight],
body[topmargin], body[rightmargin], body[bottommargin], body[leftmargin],
table[frame]
{ border: 5px dotted magenta !important; }



/* Empty Elements */
/*span:empty,*/ /*div:empty,*/ li:empty, /*p:empty,*/ td:empty, th:empty 
{ border: 5px solid yellow !important; }

/* Proposed Deprecated Elements */
input[type="button"], input[type="reset"], input[type="submit"], tt, big, small
{ border: 5px solid orange !important; }

/* W3C HTML 4 Strict Deprecated Elements - http://www.w3.org/TR/html401/index/elements.html */
applet, basefont, center, dir, font, isindex, menu, s, strike, u,
listing, plaintext, xmp
{ border: 5px solid red !important; }

/* Non W3C Proprietary HTML Elements - http://en.wikipedia.org/wiki/Non-standard_HTML_tags */
audioscope, bgsound, blink, bq, comment, embed, fn, ilayer, /*image,*/ keygen, layer, limittext, marquee, multicol, nobr, noembed, nolayer, nosmartquotes, rt, ruby, server, sidebar, spacer, wbr, xml, blackface, shadow
{ border: 5px solid magenta !important; }



/* XHTML -  http://www.w3.org/TR/xhtml11/doctype.html */
/* XHTML 1.0 Strict Deprecated Attributes  - http://www.w3.org/TR/xhtml1/#h-4.10 - http://www.w3.org/TR/xhtml11/changes.html#a_changes */
a[name], applet[name], form[name], frame[name], iframe[name], img[name], map[name]
{ border: 5px dotted lime !important; }

/* XHTML 1.0 Strict Prohibitions  http://www.w3.org/TR/xhtml1/#prohibitions */
a > a,
pre > img, pre > object, pre > big, pre > small, pre > sub, pre > sup,
button > input, button > select, button > textarea, button > label, button > button, button > form, button > fieldset, button > iframe, button > isindex,
label > label,
form > form
{ border: 5px solid lime !important; }