body {
	background: url(../images/bg.gif) no-repeat;
	background-attachment:fixed;
	margin:0px;
	padding:0px;
	font-family:verdana, arial, helvetica, sans-serif;
	text-align:left; /*use center to center Container */}

#Container {
/*	margin: 0 auto; use for centering Container */
	width: 745px;}

#Logos {
	width: 260px;
	padding:0 245px 0 0;
	text-align:center;}

#Logos img{margin-top:5px;}
	
#Arrows{float:right;}

#Arrows img{
	margin-left:10px;
	border:0;}

#Content .required {
	list-style-image:url(../images/required.gif);}

/* ***** Styles * Styles * Styles * Styles * Styles * ***** */

h1 {
	margin:0px 0px 15px 0px;
	padding:0px;
	font-size:26px;
	line-height:26px;
	font-weight:bold;
	color:#00334E;
	text-align:left;}

h2 {
	margin:15px 0px 10px 0px;
	padding:0px;
	font-size:22px;
	line-height:22px;
	font-weight:normal;
	color:#00334E;
	text-align:left;}

h3 {
	margin:10px 0px 10px 0px;
	padding:0px;
	font-size:16px;
	line-height:16px;
	font-weight:bold;
	color:#00334E;
	text-align:left;}

h4 {
	margin:0px 0px 10px 0px;
	padding:0px;
	font-style:italic;
	font-size:14px;
	line-height:14px;
	font-weight:bold;
	color:#00334E;
	text-align:left;}

h5, h5 a, h5 a:link, h5 a:visited {
	margin:0px 0px 15px 0px;
	padding:0px;
	font-size:7pt;
	line-height:8pt;
	color:#09c;
	font-weight:normal;
	text-align:left;}

h5 {color:#00334E;}

h6 {
	font-size:14px;
	margin:15px 0 0px 0 !important;
	margin-bottom:0;
	text-align:left;}

p, label {
	font:11px/20px verdana, arial, helvetica, sans-serif;
	text-indent:30px;
	margin:5px 0 0 0;}

p.largeText {font-size:16px;}

a, a:link, a:visited  {
	color:#6493AD;
	text-decoration:none;
	font-weight:bold;
	font-family:verdana, arial, helvetica, sans-serif;}

a:hover {color:#000000;}

a.noLink {color:#999999;}

#Content ul, #Content ol {
	font-size:11px;
	text-align:left;
	margin-left:-15px;}

#Content li {
	margin:5px 0 !important;
	margin:5px 0 5px 40px;
	line-height:20px;}

a.reviewForm, a.reviewForm:link, a.reviewForm:visited {
	visibility:hidden;
	font-size:18px;
	color:#D9531E;
	position:absolute;
	top:10px;
	left:490px;
	z-index:2;}

.sideBox {
	float:right;
	width:200px;
	margin: 15px 0 10px 10px !important;
	margin: 10px 0 10px 10px;
	padding: 5px;
	border: 1px solid #000000;}	

.sideBox table, .sideBox td{
	border:0;
	vertical-align:middle;}

#Content .sideBox p.sideBoxTitle{
	font-size:14px;
	font-weight:bold;
	text-align:center;
	text-indent:0;}

img {
	border:0;
	padding-top:0px;}

/******************/
/* Global Classes */
/******************/

a.glossaryTermFirst, a.glossaryTermFirst:link, a.glossaryTermFirst:visited{color:#FF9900; cursor:help;}
a.glossaryTerm, a.glossaryTerm:link, a.glossaryTerm:visited {color:#000000; font-weight:normal; cursor:help;}
#Content .moduleLink, #Content a.moduleLink:link, #Content a.moduleLink:visited {color:#669900;}
#Content .externalLink, #Content a.externalLink:link, #Content a.externalLink:visited {color:#D9531E;}
#Content .reference, #Content a.reference:link, #Content a.reference:visited {
	vertical-align:super;
	margin-top:-3px;
	font-size:9px;
	color:#990000;}

.center, p.center, #Content .center{
	text-align:center;
	text-indent:0;}

img.center {padding:10px 0 0 0;}

.floatRight{
	float:right;
	padding:10px 0 0 10px;
	*margin:10px 0 0 10px;}
	
.floatLeft {
	float:left;
	padding:10px 10px 0 0;}

.listTitle {}

.noIndent {text-indent:0;} /* .listTitle is used in case we decide we want it to be different at a later time */

.titledList {
	text-indent:-35px;
	padding-left:35px;}

/*********************/
/* Section for Icons */
/*********************/

#Content .icon {				/*outer*/
	margin:10px 0 !important;
	margin:0;
	padding:0;
	display:table;
	height:56px;
	text-indent:0;}

#Content .icon .icon {			/*middle*/
	display:table-cell;
	margin:0;
	vertical-align:middle;}

#Content .icon .icon p {		/*inner*/
	*padding:25px 0 0;
	*height:36px;
	font-weight:bold;
	text-indent:0;}

.icon img {
	float:left;
	border:0;
	padding:5px 10px 0 0 !important;
	padding:15px 10px 0 0;}

#Content a.icon:hover{cursor:pointer;}

/**********************/
/* Section for Tables */
/**********************/

table {
	width:100%;
	margin-top:10px;}

td {
	vertical-align:text-top;
	border:1px solid #999999;
	padding:0 5px 0;}

#Content table ul {
	margin:0 0 0 -30px !important;
	margin-left:-20px;}

#Content td p {
	margin:0;
	text-align:left;
	text-indent:0;}

#Content td.tableTitle, td.tableTitle,
#Content td.tableSafetyTitle, td.tableSafetyTitle {
	padding:0;
	border:0;}

#Content td.tableTitle p, td.tableTitle p,
#Content td.tableSafetyTitle p, td.tableSafetyTitle p{
	margin:0;
	padding:0 10px;
	background-color:#00334E;
	text-align:center;
	color:#FFFFFF;
	font-size:12px;
	font-weight:bold;}
	
#Content td.tableSafetyTitle p, td.tableSafetyTitle p{
	background-color:#ffe680;
	color:#000000;}

#Content td.tableHighlightRow, td.tableHighlightRow{
	background-color:#FFFFCC;}

#Content td.tableSection {
	margin-top:5px;
	padding:0;
	border:0;
	border-bottom:1px solid #000000;}
	
#Content .tableSection p{
	margin:10px 0 0 0;
	text-align:left;
	color:#D9531E;
	font-weight:bold;}

#Content td.tableHeading1 {
	vertical-align:bottom;}

#Content .tableHeading1 {
	padding:0;
	border:0;}

#Content .tableHeading1 p {
	font-style:italic;
	margin:0 0 0 5px;
	text-align:left;
	font-weight:bold;}



/**************************************************/
/*                *Image Collage*                 */
/* Must be three pictures set to 140px wide each. */
/**************************************************/

.imageCollage{
	float:left;
	width:100%;
	margin:15px 0px!important;
	margin:15px 0 5px;
	text-align:center;}

.imageCollage .image {
	margin-left:10px;
	float:left;}

.imageCollage img {border:0px solid #000000;}

.imageCollage a {font-size:11px;}

/******************************************************/
/*                *Image Collage Two*                 */
/*   Must be two pictures set to 140px wide each.   */
/******************************************************/

.imageCollageTwo{
	margin:10px 12px;
	min-height:150px;
	height:150px;}

.imageCollageTwo .image {
	margin:0 40px;
	float:left;
	text-align:center;
	vertical-align:middle;
	margin-bottom:8px;}

.imageCollageTwo img {border:0px solid #000000;}

.imageCollageTwo a {font-size:11px;}

/******************************************************/
/*                *Image Collage One*                 */
/* Used for one picture that needs a caption under it */
/******************************************************/
	
.imageCollageOne img{border:0;}

#Content div.imageCollageOne a, #Content div.imageCollageOne a.largerImage {
	text-align:center;
	font-size:11px;
	text-indent:0;
	font-weight:bold;
	color:#000000;}
	
#Content div.imageCollageOne a.largerImage {
	font-size:14px;
	font-weight:bold;}

#Content div.imageCollageOne center{
	padding:10px 0;}

#Content div.imageCollageOne floatRight{
	padding:10px 0 0 10px;}
	
#Content div.imageCollageOne floatLeft{
	padding:10px 10px 0 0;}
	
/*********/
/* Title */
/*********/

#Title {
	background: url(../images/PDI-bar_small.gif) no-repeat;
    padding: 43px 0 0 0;
    overflow: hidden;
    height: 0px !important; /* for most browsers */
    height /**/:72px; /* for IE5.5's bad box model */}
	
#ClassTitle {
	background: url(../images/bg_training.gif) right no-repeat #eee;
	padding:18px;
	margin:2px 0 23px 0px;
	width:698px;
	text-align:left;
	font-size:16px;
	font-weight:bold;
	color:#00334E;
	filter:alpha(opacity=70); /*IE */ 
	-moz-opacity: 0.70; /* mozilla*/}
	
/* ***** Content * Content * Content * Content * Content ***** */

#Content {
	float:left;
	bottom:0;
	margin: -2px 0 0 0;
	width:470px;
	height:auto;
	border:1px solid black;
	padding:10px 10px 10px 10px;
	text-align:center;}

#Content p {text-align:justify;}

#Content>p	{margin:10px 0 0 0;}

/* #Content>p+p {text-indent:30px;} */

/* ***** Tabs * Tabs * Tabs * Tabs * Tabs * ***** */

/*Sliding Doors Affect */

#Tabs {
	position:relative;
	z-index:2;
    float:left;
    font-size:93%;
    line-height:normal;
	width:500px;
	margin: -25px 0 0 125px;}

html>body #Tabs {margin: -25px 0 0 250px;}

 #Tabs ul {
    margin:0;
	padding:10px 0 0 10px;
    list-style:none;}

 #Tabs li {
    float:left;
	display:inline;
	margin:-6px 0 0 0;
	padding:0;}

  #Tabs a, #Tabs a:link, #Tabs a:visited{
	float: left;
    display:block;
	background:url(../images/tab_l.gif) no-repeat left top;
    padding:5px 0 3px 2px;
	font-size:9px;
	color:#666666;}

  #Tabs a div {
    background: url(../images/tab_r.gif) no-repeat right top;
	padding:5px 5px 4px 3px;
	margin:-5px 0 -3px 0;}

/* Commented Backslash Hack hides rule from IE5-Mac \*/
	#Tabs a	div {padding:5px 5px 4px 3px;}
	#Tabs a	{float:none;}
/* End IE5-Mac hack */
  
  #Tabs #Current a, #Tabs #Current a:link, #Tabs #Current a:visited	{
  color:#6493AD;
  background-position: 0% -21px;}
  
  #Tabs #Current a div	{background-position: 100% -21px;}
	
  #Tabs a:hover{background-position: 0% -42px;}
	
  #Tabs a:hover div	{background-position: 100% -42px;}

/* ***** Menu * Menu * Menu * Menu * Menu *  ***** */

#Menu {
	float:left;
	padding:0 0 0 0;
	margin:-29px 10px 0 0 !important;
	margin-left:0px;
	width:230px;
	background:#eee;
	filter:alpha(opacity=70); /*IE */ 
	-moz-opacity: 0.60; /* mozilla*/
/* Again, the ugly brilliant hack */
	voice-family: "\"}\"";
	voice-family:inherit;
	width:230px;}

body>#Menu {width:230px;}	/* Be nice to Opera 5 */

#Menu a, #Menu a:link, #Menu a:visited {
	color:#6493AD;
	font-weight:normal;
	font-size: 7pt;
	line-height:10pt;
	padding-left:10px;}

#Menu a:hover {color:#000000;}

#Menu #mainMenu a.current{font-weight:bold;}

#Menu ul {
	margin-left:  23px;}
#Menu li {
	margin-left: -29px;
	padding:2px 0 2px 16px;
	text-indent: -22px;}

/* ***** Tree Menu * Tree Menu * Tree Menu * Tree Menu * Tree Menu ***** */

#menuList {
	margin: 0px;
	padding: 5px 3px 10px 15px;}

#Menu li {
	list-style:none outside;}

li.menubar {
	background: url(../images/plus.gif) no-repeat 0 0.5em;
	font-size: 12px;
	line-height: normal;
	list-style: none outside;}
	/*padding-left:14px; need for IE 5.01...find a way to use on only that browser and not the others, actuator goes
							with the text (so menu is not expandable)*/

#Menu #mainMenu li.menubar1 {
	background: url(../images/plus_gray.gif) no-repeat 0 0.5em;
	font-size: 12px;
	line-height: 1.5em;
	list-style:none outside;
	margin-left:-29px;
	padding:0 0 0 29px;}

.menuexp {
	display: none;
	margin-left: 19px;
	padding: 4px 0 0 0;}

.menuexp li {
	background: url(../images/square.gif) no-repeat 0px 0.5em;
	list-style: none outside;
	padding:0;}

#Menu .menuexp li a {
	background-color: transparent;
	color: #00334E;
	font-size: 7pt;
	padding-right:3px;
	text-decoration: none;}
	
a.actuator {
	background-color: transparent;
	color: #000;
	font-size: 12px;
	padding-left:0;
	padding-right:3px;
	text-decoration: none;
	cursor:default;}
	/*margin-left:-14px;need for IE 5.01...find a way to use on only that browser and not the others, actuator goes
							with the text (so menu is not expandable)*/