/* Base HTML Elements */

body {
	font-family: Calibri, Sans-Serif;
	
	font-size: 13.2pt;							/* can be set via bodyCommon.inc */
	line-height: 1.4em;							/* can be set via bodyCommon.inc */
	
	padding: 0px;
	margin: 0px;
	
	text-align: center;		/* IE 6 to center entire page */
}

#bodyNotPrint
{
	background-color: #D0D0D0;
}

h1 
{
	color: #555;

	font-size: 1.6em;
	font-weight: lighter;
	
	letter-spacing: -1pt;
	text-align: center;
	
	margin-top: 0px;
	padding: 10px 0px 5px 0px;
}

h2 
{
	color: #555;
	
	font-size: 1.2em;
	font-weight: normal;
	font-style: italic;
	
	text-align: center;

	margin-top: 0px;	/* also FF hack: div gap */
	padding-bottom: 20px;
}

h3 
{
	color: #ffffff;
	background-color: #7da2c3;
	
	font-size: 1.2em;
	font-style: italic;
	
	text-align: left;
	
	padding: 0px 5px;
	
	margin: 20px 0px 10px 0px;
	
	background-image: url(../images/h3Fade.png);
	background-repeat: repeat-y;
	background-position: right top;
}

h4 
{
	color: #555;
	
	font-style: italic;
	font-weight: bold;
	font-size: 1.2em;
	
	border-top: solid 1px #999;

	margin: 25px 8px 0px 0px;
	padding: 0px 0px 5px 0px;
	
	text-align: left;
}

h5
{
	color: #000000;

	font-size: 1.1em;
	font-weight: normal;
	font-style: italic;
	
	margin: 0px;
	padding: 0px;
	
	text-align: left;
}

p 
{
	margin: 0px 0px 15px 0px; /* IE and FF different, (p) inside div top, separate from other div. */
}

/* Form fields inside a table inside form didn't inherit font size in IE6 */
table { font-size: 1em; }

a:link, a:visited, a:active 
{
	color: #326cb3;
	
	text-decoration: none; 
}

a:hover
{
	color: #FFCC00;
	
	text-decoration: none; 
}


/* Formatting Common */

.center
{
	text-align: center;
}

.centerTight
{
	text-align: center;
	padding: 0px;
	margin: 0px;	
}

.noPaddingMargin
{
	margin: 0px;
	padding: 0px;
}

.noPaddingMarginTop
{
	padding-top: 0px;
	margin-top: 0px;
}

.centerPieceImage 
{
	margin: 15px 0px 25px 0px;
	
	text-align: center;
}

.clear
{
	clear: both;
}

.alignRight
{
	text-align: right;	
}

.graphicButton
{
	margin: 10px 20px 0px 20px;	/* not padding for IE6 */
	
	border: 0px;
}


/* Containers - page layout */

.entireContainer
{
	text-align: left;		/* counteract text-align in body section */
	
	width: 850px;

	padding: 0px 17px;
	margin: 0px auto 0px auto;	/* center page */
	
	background-color: #ffffff;
	
	background-image: url(../images/surround_faux_columns.png);
	background-repeat: repeat-y;
	background-position: left top;
}

#entireContainerPrint
{
	background-image: none;
}

.mainContainer 
{
	width: 850px;

	padding: 0px;
	margin: 0px;

	background-image: url(../images/fauxColumn.gif);
	background-repeat: repeat-y;
	background-position: left top;
}

#mainContainerPrint
{
	background-image: none;
}

.mainHeader
{
	width: 850px;
}

.mainCenter 
{
	width: 700px;
	
	padding: 1px 0px 0px 0px;	/* FF hack: top gap mainContainer when h3 first element */
	margin: 0px 75px 10px 75px;
}

.mainLeft
{
	width: 400px;

	padding: 0px;
	margin: 0px;
	
	float: left;
}

.mainRight
{
	width: 419px;		/* 419 caused issue for IE8 on Windows 7, otherwise one less for border of 1px to fit width wise */
	
	padding: 0px 15px;
	
	border: 0px;
	border-left: solid 1px #CCC;
	
	float: left;
}


/* Menu Bar */

.menuBar 
{
	width: 850px;
}

#menuBarPrint 
{
	border-bottom: solid 1px #000000;
}

.menuBarLeft
{
	padding: 10px 0px 8px 10px;
	
	float: left;
}

.menuBarRight
{
	margin-top: 11px;
	padding-right: 5px;
	
	float: right;
}

.menuBarGraphics img 
{
	display: block;		/* Otherwise FF puts space at end of each image, that apparent has something to do with the page using doctype XHTML... */
}


/* Sub Menu Bar */

.subMenuBarLeft
{
	width: 100px;
	
	float: left;
}
.subMenuBarCenter
{
	width: 650px;
	
	float: left;
}

.subMenuBarRight
{
	width: 100px;

	float: left;
}

/* optical illusion different spacing because of assoicated icons */
.subMenuBarRight #printer
{
	margin-left: 0px;
	margin-right: 3px;
}

.subMenuBarRight div
{
	float: left;
	
	width: 15px;
	margin-left: 12px;
	
	text-align: center;
}

.subMenuBarRight img
{
	border: 0px;
	
	vertical-align: bottom;
}


/* Search Form - page common */

.searchForm
{
	padding: 0px;
	margin: 0px;
	border: 0px;
}

#searchBoxContainer
{
	height: 15px;
	width: 140px;
	
	padding: 0px;
	margin: 0px 2px 0px 0px;
	border: solid 1px #000000;
	
	float: left;
}

#searchBox
{
	height: 14px;
	width: 130px;
	
	font-size: 6.5pt;

	padding: 0px 0px 0px 3px;
	margin: 0px;
	border: 0px;

	float: left;
}

#searchBoxButtonContainer
{
	height: 15px;
	width: 15px;
	
	padding: 0px;
	margin: 0px;
	border: solid 1px #660066;

	float: left;

	background-color: #660066;
}

#searchBoxButton
{
	height: 12px;
	width: 12px;

	padding: 0px;
	margin: 2px 1px 0px 1px;
	
	float: left;
}


/* Form - common */

.form 
{
	background-color: #ececec;
	
	width: 650px;
	
	padding: 0px;
	margin: 0px;
}

.form td
{
	vertical-align: top;
	
	/* Safari different defaults */
	padding: 0px 10px;
	margin: 0px 0px;
}

.form h4
{
	margin-right: 0px;
}

.formLarge
{
	width: 700px;	
}


/* Form - navigation common */

.formNav
{
	width: 650px;
	height: 24px;
	
	margin-top: 30px;

	background-color: #CCC;
}

.formNav #back
{
	float: left;	
}

.formNav #reset
{
	float: right;
	
	margin-right: 105px;	
}

.formNav #next
{
	float: right;
}

.formNav #center
{
	float: right;
	
	margin-right: 260px;
}

.formNav #quote
{
	float: right;
	
	margin-right: 180px;	
}

.formNav input
{
	margin: 0px 25px;
}

.formNav p
{
	font-size: 11pt;
	line-height: normal; /* otherwise changed with font increase */
	
	padding: 2px 0px 0px 0px; 
	margin: 0px;
	
	float: right;
}

.formNavLarge
{
	width: 700px;
}


/* Form - textarea only */

.formTextarea
{
	text-align: center;
}

.formTextarea textarea
{
	width: 500px; 
	height: 100px; 
	
	margin: 15px 0px 0px 0px;
}


/* Form - elements */

.form .inputText
{
	background-color: #FFFFFF;
	border: 1px solid #A7B39F;
	width: 190px;
	
	height: 20px;
	line-height: 18px;	/* center text on the y axis without padding for IE6 */
	
	padding: 0px;
	margin: 0px;
}

.form #inputTextDoubleLength
{
	width: 350px;
}

.form .inputSelect
{
	background-color: #FFFFFF;
	border: 1px solid #A7B39F;
	width: 190px;
	
	height: 22px;
	
	padding: 0px;
	margin: 0px 2px 6px 0px;
}

.form .inputRadio
{
	margin: 15px 5px 0px 0px;
}

.form .moreInfo p
{
	padding: 0px;
	margin: 0px;
	
	float: left;
}

.form .moreInfo img
{
	padding: 0px;
	margin: 1px 0px 0px 3px;
	
	border: 0px;
	
	float: left;	
}

.form #formWarningID
{
	color: #FF0000;

	margin: 15px 0px 0px 0px;
	
	text-align: center;
	
	display: none;
}

.form .formWarningDeep {
	color: #FFFFFF;
	background-color: #FF0000;

	text-align: center;
	
	margin: 15px 0px 0px 0px;
}


/* Footer */

.footer 
{
	width: 850px;

	padding: 10px 0px 0px 0px;
	margin: 0px;
}

/* this id also explicitly used by help file */
.footer p
{
	padding-top: 2px;

	font-family: Arial, Sans-Serif;
	font-size: 7pt;
	text-align: center;
	
	padding: 0px;
	margin: 0px;
}

#printedOn
{
	padding: 0px 0px 10px 0px;
	margin: 0px;
	
	text-align: center;
}


/* Product Manual - navigation */

#breadcrumbs 
{
	font-size: 9pt;
}

#manualNav
{
	padding: 0px;
	margin: 30px 0px 0px 0px;
	
	text-align: center;
}


/* Download Table */

.download
{
	width: 700px;
}

.download th
{
	text-align: left;

	background-color: #BBB;
}

.download td, th
{
	padding: 5px 10px;
}

.download .lightFill td
{
	background-color: #ECECEC;	
}

.download input
{
	height: 22px;
	width: 95px;	
}