/*
	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

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
{
margin-top: 1em;
margin-bottom: 1em;
}



/****************************************************************
 2. Tables
****************************************************************/
table
{
border: 1px solid #dddddd;
border-collapse: collapse;
border-spacing: 0px;
width: 100%;
}

caption, .caption, th, td
{
border: 1px solid #dddddd;
padding: .5em;
}

th, td
{
empty-cells: show;
margin: 0px;
vertical-align: top;
}

caption, .caption, th
{
background: #dae6f1 url(/files/images/products/home/caption.png) repeat-x left top;
font-size: 1.1em;
font-weight: bold;
text-align: center;
}

caption { margin-left: -1px; }

.subcategory th
{
background: #f4f7fb url(/files/images/products/home/white.png) repeat-x left 0px;
border: 1px solid #e1e1e1;
border-bottom-color: #dddddd;
font-size: 1em;
}

td { background: url(/files/images/template/bg.png) repeat-x left bottom; }

td.label { font-weight: bold; text-align: left; }

/* table tr:nth-child(even) table tr:nth-child(odd) */
.odd td { background: #ffffff; }
.even td { background: #f1f1f1; }

table.unstyled, table.unstyled th, table.unstyled td { border: 0px; }
table.unstyled th, table.unstyled td { background-image: none; padding: .3em; }



/****************************************************************
 3. Headings
****************************************************************/
h1 a
{
background: url(/files/images/template/logo.png) no-repeat left top;
height: 60px;
width: 251px;
position: absolute;
top: 15px;
left: 15px;
}

h1 a:hover { background-position: left bottom; }

h1 span { display: none; }

#header h2
{
color: #4d83bc;
font-family: Arial, Helvetica, sans-serif;
font-size: .9em;
font-weight: bold;
position: absolute;
top: 62px;
left: 131px;
}

#nav h2, #subnav h2 { display: none; }

#content h2
{
color: #4074c2;
font-size: 1.7em;
margin-bottom: 5px;
}

#content h3, #content h4 { margin: 1em 0em; }

#content h3 { font-size: 1.3em; }

#content h4 { font-size: 1em; }



/****************************************************************
 4. Anchors - Link - Visited - Hover - Focus - Active
****************************************************************/
#content a { text-decoration: underline; }
a:link { color: #4074c2; }
a:visited {color: #7097d1; }
a:hover { color: #345F9f; }
a:focus { color: #4074c2; }
a:active { color: #4074c2; }
*[accesskey]:focus { outline: 1px solid #aaaaaa; }

#content #innercontent a.unstyled
{
background-image: none;
color: #666666;
padding-right: 0px;
text-decoration: underline;
}

*[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: 15px; }
#content a[href^="mailto:"] { background: url(/files/images/icons/email.png) no-repeat right top; padding-right: 20px; }
#content a[href$=".pdf"] { background: url(/files/images/icons/pdf.png) no-repeat right top; padding-right: 17px; }



/****************************************************************
 5. Form Elements - http://www.456bereastreet.com/archive/200410/styling_even_more_form_controls/
****************************************************************/
fieldset
{
background: url(/files/images/template/fieldset_bg.png) repeat-x left bottom;
border: 1px solid #c8d9ea;
border-radius: 5px;
	-o-border-radius: 5px;
	-icab-border-radius: 5px;
	-khtml-border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
padding: 10px;
}

legend
{
color: #4d83bc;
font-size: 1.2em;
font-weight: bold;
padding: 0px 5px;
}

select, textarea, input, button
{
color: #666666;
font-family: Arial, Helvetica, sans-serif;
font-size: 1em;
outline-width: 0px; /* removes mac outline */
}

textarea { overflow-y: auto; resize: both; }

button, input[type="submit"], input[type="button"], input[type="reset"] /* IF IE 6,7 */
{
background: #ececec url(/files/images/template/button_bg.png) repeat-x left top;
border: 1px solid #bbbbbb;
border-radius: 1px;
	-o-border-radius: 1px;
	-icab-border-radius: 1px;
	-khtml-border-radius: 1px;
	-moz-border-radius: 1px;
	-webkit-border-radius: 1px;
	-moz-border-radius: 1px;
color: #555555;
height: 35px;
line-height: 1em;
margin-right: 3px;
overflow: visible;
padding: 4px 5px;
width: auto; /* http://www.viget.com/inspire/comments/styling-the-button-element-in-internet-explorer/ */
}

.button
{
background: #ececec url(/files/images/template/button_bg.png) repeat-x left top;
border: 1px solid #bbbbbb;
color: #555555;
height: 35px;
line-height: 1em;
margin-right: 3px;
padding: 4px 5px;
}

@media screen and (-webkit-min-device-pixel-ratio:0)
{
button, input[type="submit"], input[type="button"], input[type="reset"] { padding: 4px 8px; }
}

button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
button:active,
input[type="submit"]:active,
input[type="button"]:active,
input[type="reset"]:active
{ border: 1px solid #999999; color: #333333; }

textarea,
input[type="text"],
input[type="password"]
{
background: #ffffff url(/files/images/template/textbox_bg.png) repeat-x left bottom;
border: 1px solid #c7c7c7;
padding: 4px;
}

textarea:focus,
input[type="text"]:focus,
input[type="password"]:focus { border: 1px solid #999999; }

.textbox, .textboxfocus
{
background: #ffffff url(/files/images/template/textbox_bg.png) repeat-x left bottom;
border: 1px solid #c7c7c7;
padding: 4px;
}

.textboxfocus { border: 1px solid #999999; }



/****************************************************************
 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 solid #cccccc;
height: 1px;
margin: 1em 0em;
text-align: center;
width: 100%;
}
hr { display: none; }

::-moz-selection
{
background: #4074c2;
color: #ffffff;
}

::selection
{
background: #4074c2;
color: #ffffff;
}

.req
{
color: #990000;
font-size: 1.2em;
font-weight: bold;
}

.articleimage, .pageimage
{
border: 1px solid #cccccc;
float: right;
margin: 7px 0px 15px 15px;
padding: 10px;
}

.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;
}

.validation
{
color: #990000 !important;
font-weight: bold;
}

/* Pageination */
#pages
{
list-style-type: none;
margin: 1em 0em 0em 0em;
overflow: auto;
padding: 0px;
}

#pages li { float: left; }

	#content #pages a
	{
	background: #fbfbfb;
	border: 1px solid #e1e1e1;
	color: #666666;
	display: block;
	height: 25px;
	width: 25px;
	line-height: 25px;
	margin-right: 5px;
	text-align: center;
	text-decoration: none;
	}

	#content #pages .selected a, #content  #pages a:hover
	{
	border: 1px solid #bbbbbb;
	color: #444444;
	}

#content #pages .previous,
#content #pages .next
{ background: url(/home/files/images/template/previous_next_bg.png) no-repeat left top; }

#content #pages .previous { background-position: left top; }
#content #pages .previous:hover { background-position: left bottom; }
#content #pages .next { background-position: right top; }
#content #pages .next:hover { background-position: right bottom; }

#content #pages .previous span,
#content #pages .next span
{ display: none; }



/****************************************************************
 7. Template & Layout
****************************************************************/
html
{
background: #ffffff url(/files/images/template/html_bg.png) repeat-y center top;
font-size: 100%; /* http://www.alistapart.com/articles/howtosizetextincss */
overflow-y: scroll; /* http://webdevel.blogspot.com/2007/05/controlling-browser-scrollbars.html */
}

body
{
color: #666666;
font-family: "Trebuchet MS", sans-serif, Arial, Helvetica;
font-size: .75em; /* http://clagnut.com/blog/348/#c794 */
text-align: center; /* center things in <= IE6 */
vertical-align: baseline;
}

#stripe_bg { background: url(/files/images/template/stripe_bg.png) repeat-x center 85px; }
#shadow_bg { background: url(/files/images/template/wrapper_bg.png) repeat-y center top; margin: auto; width: 766px; }
#stipe_shadow_bg { background: url(/files/images/template/stripe_shadow_bg.png) no-repeat center 85px; }
#foot_bg { background: url(/files/images/template/foot_bg.png) no-repeat center bottom; }

#container
{
margin: 0px auto;
text-align: left;
width: 740px;
}

#accessibility { display: none; }

#header
{
background: #f0f4fa;
height: 85px;
position: relative;
}

	#locator
	{
	position: absolute;
	top: 10px;
	right: 10px;
	}

		#locator, #locator ul
		{
		list-style-type: none;
		margin: 0px;
		padding: 0px;
		}

		#locator { width: 128px; }

		#locator span /* IE IE6 */
		{
		background: url(/files/images/template/locator.gif) no-repeat right top;
		color: #4074c2;
		display: block;
		font-weight: bold;
		height: 29px;
		line-height: 29px;
		padding-left: 5px;
		}

		#locator:hover span /* IE IE6 */
		{
		background-color: #7097d1;
		background-position: right bottom;
		color: #ffffff;
		}

		#locator li ul /* IE IE6 */
		{
		background: #ffffff;
		border: 1px solid #cccccc;
		display: none;
		width: 150px;
		}

		#locator li:hover ul { display: block; }

		#locator a /* IE IE6 */
		{
		display: block;
		padding: 3px 5px;
		}

		#locator a:hover { background: #f1f1f1; }

#nav
{
background: #7097d1;
height: 40px;
width: 100%;
}

		/* Top Level */
		#nav a.tln
		{
		background-color: #7097d1;
		border-left: 1px solid #4074c2;
		border-right: 1px solid #c1d0e7;
		color: #ffffff;
		display: block;
		font-size: 1.2em;
		font-weight: bold;
		height: 40px;
		line-height: 40px;
		text-align: center;
		}

		#nav li.first-child a { border-left-width: 0px; }
		#nav li.last-child { border-right: 1px solid #4074c2; }

		#nav a.tln:hover { background-color: #5684c9; }

			/* Dropdown Levels */
			#nav ul ul a
			{
			background-color: #f0f4fa;
			border-width: 0px 1px 1px 0px;
			border-color: #c1d0e7;
			border-style: solid;
			color: #638dcd;	
			display: block;
			padding: 9px 10px;
			}

			#nav ul ul a:hover
			{
			background-color: #ffffff;
			color: #4074c2;
			}

			#nav a.arrow
			{
			background-image: url(/files/images/template/arrow.gif);
			background-position: 97% 60%;
			background-repeat: no-repeat;
			cursor: default;
			}

		/* Exceptions */
		#nav ul ul li.first-child,
		#nav ul ul ul li.first-child
		{ border-top: 1px solid #c1d0e7; }

		#nav ul ul li { border-left: 1px solid #c1d0e7; }

		#nav li { position: relative; }

		#nav ul
		{
		float: left;
		list-style-type: none;
		margin: 0px;
		padding: 0px;
		width: 95px;
		}

			#nav ul ul
			{
			background: url(/files/images/template/transparent.gif) repeat left top; /* I have no idea but this fixes an IE6 bug */
			padding: 0px 50px 50px 0px;
			position: absolute;
			left: 0px;
			width: 150px; /* IF IE 7 */
			z-index: 2;
			}

				#nav ul ul ul
				{
				margin-top: 0px;
				position: absolute;
				top: -1px;
				left: 148px; /* IF IE 7 */
				}

		#nav ul ul,
		#nav ul li:hover ul ul,
		#nav ul ul li:hover ul ul
		{ display: none; }

		#nav ul li:hover ul,
		#nav ul ul li:hover ul,
		#nav ul ul ul li:hover ul
		{ display: block; }

#content
{
background: #ffffff url(/files/images/template/content_shadow.png) repeat-x left 0px;
line-height: 2em;
text-align: justify;
padding: 20px;
/* EDIT position: relative;  See #sitetools */
width: 700px;
/* http://www.dustindiaz.com/min-height-fast-hack/ */
min-height: 400px;
height: auto !important;
height: 400px;
}

#tools { overflow: auto; /* IF IE 7 */ }

	#crumbs { float: left; }

		#crumbs span a { display: none; }
		#crumbs span span a { display: inline; }

	#sitetools
	{
	float: right;
	list-style-type: none;
	margin: 0px;
	padding: 0px;
	}

		#sitetools li
		{
		float: left;
		margin-left: 7px;
		vertical-align: bottom;
		}

			#content .resize a
			{
			color: #7097d1;
			line-height: 1em;
			text-decoration: none;
			}
			#content .resize a:hover { color: #4074c2; }

			#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
			{
			background: url(/files/images/template/site_tools.png) no-repeat left top;
			display: block;
			height: 15px;
			margin-top: 3px;
			outline: none; /* Firefox overflow: auto; fix */
			}

			#print a
			{
			background-position: left top;
			width: 15px;
			}

			#print a:hover { background-position: left bottom; }

			#email a
			{
			background-position: right top;
			width: 20px;
			}

			#email a:hover { background-position: right bottom; }

				#print span, #email span { display: none; }

	#innercontent{ clear: both; margin-top: 5px; }

#footer 
{
clear: both;
height: 168px;
position: relative;
text-align: center;
}

	#tagline
	{
	position: absolute;
	top: 3px;
	right: 10px;
	}

	#als
	{
	position: absolute;
	top: 48px;
	left: 10px;
	}

	#tln
	{
	top: 62px;
	left: 0px;
	}

	#ancillary
	{
	bottom: 30px;
	left: 0px;
	}

	#tln, #ancillary
	{
	display: block;
	list-style-type: none;
	margin: 0px;
	padding: 0px;
	position: absolute;
	text-align: center;
	width: 100%;
	}

		#tln li, #ancillary li
		{
		display: inline;
		list-style-type: none;
		}

		#tln li { padding-left: 20px; }

		#ancillary li { padding-left: 5px; }

		#tln li.first-child, #ancillary li.first-child { padding-left: 0px; }

		#tln a
		{
		font-size: 1.2em;
		font-weight: bold;
		}

		#ancillary a
		{
		font-size: .9em;
		text-decoration: underline;
		}

		#footer a { color: #638dcd; }

		#footer a:hover	{ color: #4074c2; }

	#extranet
	{
	position: absolute;
	top: 50px;
	right: 10px;
	}

	#legal
	{
	color: #638dcd;
	font-size: .9em;
	position: absolute;
	bottom: 5px;
	left: 0px;
	text-align: center;
	width: 100%;
	}



/****************************************************************
 8. Print - http://www.alistapart.com/stories/goingtoprint/
****************************************************************/
@media print {
#header, #nav, #crumbs, #sitetools, #footer { display: none; }
#content { border-width: 0px; color: #000000; width: 100%; float: none; }
#content, #innercontent { padding: 0px; }
#content * { color: #000000 !important; }
}



/****************************************************************
 9. Handheld
****************************************************************/
@media handheld {
#accessibility { display: block; }
}



/****************************************************************
 10. Aural
****************************************************************/
@media aural {
#accessibility { display: block; }
}