/*stylesheet2.css is used for screen display.  See print.css for printing and projection*/

/* Modifications to base objects */

body 
{
	background-color:white;
	color: #3c3c3c;
	cursor:default;
	font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
	font-size:12pt;
	font-weight:normal;
  hyphens:auto;
	line-height:1.55;
	text-align:justify;
	visibility:hidden;
	/* Browser specific properties */
  -webkit-hyphens:auto;
  -ms-hyphens:auto;
  -moz-hyphens: auto;
}

blockquote
{
	font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
	font-size: 85%;
	padding: 5px 30px 5px 30px; 
	overflow: hidden; 
	width: auto;
}

sup, sub 
{
  font-weight:lighter;
	position: relative;
  top: -0.4em;
	vertical-align: baseline;
}

sub { top: 0.4em; }

/* Tables  and table elements */
table
{
	border-collapse: collapse;
}

table
{
	font-size:1.0em;
}

table.hyphenate
{
	-webkit-hyphens: auto; 
	-moz-hyphens: auto;
	 -ms-hyphens: auto;
	hyphens: auto; 
}

/* Faucet Table Classes */
table.faucettable
{
	background-color:white;
	border-bottom: 3px solid #757c74; /* StarCraft Green */ 
	border-top: 3px solid #757c74; /* StarCraft Green */ 
	border-collapse: collapse; 
	color:black;
	font-size:12pt;
	font-weight:normal;
	left:220px;
	line-height:1.5;
	min-width:81%;
	position:absolute; 
	table-layout:fixed; 
	vertical-align:top;
}

tr.faucetheader
{
	background-color:#757c74; /* StarCraft Blue */
	color:white;
	font-size: 80%;
	vertical-align:bottom; 
}

td.faucetlogocol, 
th.faucetlogocol
{
	background-color:white;
	max-width:140px;
	min-width:100px; 
	text-align:center;
	vertical-align:middle;
	width:140px; 
}

td.faucetbrandcol, 
th.faucetbrandcol
{
	min-width:24%;
	width:30%;
}

td.faucetratingcol, 
th.faucetratingcol
{
	min-width:15%;
	text-align:center;  
	width:22%;
}

/* Remove when all warranty tables are converted to thenew form: 10/22/16 */
td.faucetwarranty, 
th.faucetwarranty 
{
	background-color:#757c74; /* StarCraft Green */
	min-width:180px;
	text-align:center;
	vertical-align:top;
	width:24%;
}
 
td.faucetwarrantycol,
th.faucetwarrantycol,
td.faucetwarranty2 /* Remove when transition completed 10/22/16 */
{
	min-width:210px;
	text-align:center;
	width:40%;
}

td.faucetwarranty2
{
	vertical-align:top;
}

td.faucetindexcol, 
th.faucetindexcol
{
	background:white;
	text-align:left; 
	max-width:120px;
	min-width:110px; 
	vertical-align:top; 
	width:115px;
}

/* End Faucet Table Classes */

table.list 
{
	font-size: 12pt;
	line-height:1.50;
}

table.warrantytable
{
	border: 0;
	font-weight:normal;
	line-height: 1.3;
	margin:auto; 
	margin-top:7px; 
	table-layout:fixed;
}

tr.sorttable
{
	background:#757c74; /* StarCraft Green Former: #6c6c6c;*/ 
	color:white; 
	cursor:default;
	font-weight:bold;
	vertical-align:bottom;
}

/* Input elements */

input[type="text"], 
input[type="tel" ],
input[type="email"],
textarea
{
	-webkit-border-radius:15px;
	border-radius:15px;
	background-color:white;
  border: 1px solid gray;
  padding: 5px;
}
 
input[type="text"]:hover, 
input[type="tel" ]:hover,
input[type="email"]:hover, 
textarea:hover
{
	border: 1px solid black;
}

input[type="text"]:focus, 
input[type="tel" ]:focus,
input[type="email"]:focus, 
textarea:focus
{
	background-color:white;
	border: 2px solid black;
}

input[type="text"]:disabled, 
input[type="tel" ]:disabled,
input[type="email"]:disabled, 
textarea:disabled
{
	background-color:lightgray;
}
	
/* *******************************************************/
/* Anchored links -- For links other than links in lists */
/* *******************************************************/

/* Normal link  - dark text, used for light backgrounds */
a,
a:active,
a:hover,
a:link,
a:visited
{
	color: #006699; /* TTip Blue */
	font-size:1.0em;
	font-weight:normal;
	text-decoration:underline;
}

a:hover 
{
	color: #757c74; /* StarCraft Green */;
	text-decoration:none;
} 

/* 
Reverse link - used on dark backgrounds
Inherits from <a...> above.  So only set changed styles 
*/
a.reverse, 
a.reverse:active,
a.reverse:hover,
a.reverse:link,
a.reverse:visited 
{ 
	border:0;
	color:white;
	font-size:1.0em;
	text-decoration:underline;
}

a.reverse:hover 
{
	color:lightgray;
	text-decoration:none;
} 
 
/* Sections that do not display on screen, but will print */
#noscreen, .pagebreak 
{
	display: none;
}

/* Style for ordered and unordered lists */
ol, ol li
{
	list-style-type:decimal;
	list-style-position:inside;
	margin: 0 0 5px 0;
	padding-left:0;	
}

.no-indent, .noindent 
{
	list-style-position:inside;
	margin-left: 0;
	padding-left: 0;		
}

/* 
Default appearance for links in lists.
---------------------------------------
Default is links on dark backgrounds.
For light backgrounds use class "reverse"
---------------------------------------
Inherits from <a...> above, so set only changed styles 
*/
li a,
li a:active,
li a:hover,
li a:link,
li a:visited  
{
	color: white;
	font-style:normal;
} 

/* Used on light backgrounds*/

/* Default list item that is an list link*/
li a.reverse,
li a.reverse:active,
li a.reverse:hover,
li a.reverse:link,
li a.reverse:visited 
{
	color: #006699; /* TTip Blue */ 
	text-decoration:underline;
}

li a.reverse:hover 
{
	text-decoration:none;
}

/* list item link THIS FORMAT IS OBSOLETE */
li.list-reverse a,
li.list-reverse-normal-text a,
li.list-reverse a:active, 
li.list-reverse-normal-text a:active,
li.list-reverse a:hover, 
li.list-reverse-normal-text a:hover,
li.list-reverse a:link, 
li.list-reverse-normal-text a:link,
li.list-reverse a:visited, 
li.list-reverse-normal-text a:visited  
{ 
	color:#006699; /* TTip Blue */
	text-decoration:none;
}

li.list-reverse a:hover, 
li.list-reverse-normal-text a:hover
{
	text-decoration:underline;
}

/* 
Default Headers - common properties of all headers are set here, individual properties of each header style are then set below 
*/
h1, h2, h3, h4, h5 
{
	color: #006699; /* TTip Blue */
	font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
	font-weight: bold;
	-webkit-hyphens: manual; 
	-moz-hyphens: manual; 
	hyphens: manual; 	 
	line-height: 1.2;
	margin: 0;
	padding: 0;
	text-align:left;
}

/* Header size */
h1 {	font-size: 230%;}
h2 {	font-size: 200%; }
h3 {	font-size: 150%; } 
h4 { 	font-size: 120%; }
h5 { 	font-size: 100%; }


/* Used to replace headers inside paragraphs */
#doctitle, .greentext, 	.green-text,
.h1,  	.h2,  		.h3,  		.h4,  		.h5, 
.h1u, 	.h2u, 		.h3u, 		.h4u, 		.h5u,
.h1du,	.h2du,		.h3du,		.h4du, 		.h5du,
.h1o,   .h2o, 		.h30,			.h4o,			.h5o,
				.h2nav, 	.h3nav, 	.h4nav, 	.h5nav,
				.h2unav,	.h3unav,	.h4unav,	.h5unav,
				.h2dunav,	.h3dunav,	.h4dunav,	.h5dunav,  
				.h2rev, 	.h3rev, 	.h4rev, 	.h5rev,
				.h2urev,	.h3urev,	.h4urev,	.h5urev,
				.h2durev,	.h3durev,	.h4durev,	.h5durev,
				.h2l,			.h3l,			.h4l,			.h5l,		.h5lb
{
	color: #006699; /* TTip Blue */
	display:block;
	font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
	font-weight:bold;
	-webkit-hyphens: manual; 
	-moz-hyphens: manual; 
	hyphens: manual; 	 
	line-height:1.5;
	margin-top: 5px;
	text-align: left;
}

/*
Used in the title of document pages to add white space at the bottom of the title 
*/
#doctitle, .doctitle
{
	color:#757c74; /* StarCraft Green */
	font-size:230%;
	padding-bottom:15px;
}

.h2nav, .h3nav, .h4nav, .h5nav 
{
	color: #3c3c3c; 
}

.h1u, 	.h2u, 	.h3u, 	.h4u, 	.h5u,
.h1du,	.h2du,	.h3du,	.h4du, 	.h5du
{
	border-bottom: 1px solid #757c74; /* StarCraft Green Former: #6c6c6c;*/
	width: auto;
}

.h1o,   .h2o, 		.h3o,			.h4o,			.h5o,
{
	border-top: 1px solid #757c74; /* StarCraft Green Former: #6c6c6c;*/
}

.h1du,	.h2du,	.h3du,	.h4du, 	.h5du 
{
	border-top: 1px solid #757c74; /* StarCraft Green Former: #6c6c6c;*/
	width: auto;
}
 
.h2l,		.h3l,		.h4l,		.h5l, 	.h5lb 
{
	display:inline;
}

.h2unav,.h3unav,.h4unav,.h5unav
.h2duvav,.h3dunav,.h4dunav,.h4dunav 
{
	border-bottom: 1px solid #757c74; /* StarCraft Green Former: #6c6c6c;*/
	width: auto;
}

.h2dunav,.h3dunav,.h4dunav,.h4dunav 
{
	border-top: 1px solid #757c74; /* StarCraft Green Former: #6c6c6c;*/
	width: auto;
}

.h2rev, .h3rev, .h4rev, .h5rev, 
.h2urev, .h3urev, .h4urev, .h5urev,
.h2durev, .h3durev, .h4durev, .h5durev 
{
	color: white;
	width: auto;
}

.h2urev, .h3urev, .h4urev, .h5urev
.h2durev, .h3durev, .h4durev, .h5durev
{
	border-bottom: 1px solid white;
	width: auto;
}

.h2durev, .h3durev, .h4durev, .h5durev
{
	border-top: 1px solid white;
	width: auto;
}

.h1, .h1u, .h1du, .h1o 
{
	font-size:230%; 
}

.h2, .h2u, .h2du, .h2o, .h2l, .h2nav, .h2unav, .h2dunav, .h2rev, .h2urev, .h2durev 
{
	font-size: 190%;
}

.h3, .h3u, .h3du, .h3o, .h3l, .h3nav, .h3unav, .h3dunav, .h3rev, .h3urev, .h3durev 
{
	font-size: 160%; 
}

.h4, .h4u, .h4du, .h4o, .h4l, .h4nav, .h4unav, .h4dunav, .h4rev, .h4urev, .h4durev 
{
	font-size: 125%;
}

.h5, .h5u, .h5du, .h5o, .h5l, .h5lb, .h5nav, .h5unav, .h5dunav, .h4rev, .h5urev, .h5durev 
{
	font-size: 100%; 
}

.h5lb { 	font-weight:bold; }
/**************** Classes ********************/

/* Flex containers */

/* 
Holy Grail Containers - Notes
1. Avoid the IE 10-11 `min-height` bug.
2. Set `flex-shrink` to `0` to prevent some browsers from
	letting these items shrink to smaller than their content's default
	 minimum size. See http://bit.ly/1Mn35US for details.
3. Use `%` instead of `vh or vw` (viewport height/width) since `vh` is buggy in older mobile Safari and shows scrollbars regardless of content in chrome.  Replate with "vh" when these bugs are fixed.
*/

/* HG Body - the Vertical center of the page which contains 3 columns: leftcol, centercol and rightcol*/
.hg-body
{
	display: flex;
  flex: 1 0 auto; /* 2 */
  flex-direction: column;
}

/* Page header and footer */
.hg-header, .hg-footer 
{
	background: pink;
 	flex: none; /* 2 */
	min-height:60px;
  width: 100%;
}

/* Center column of hg-body is variable width */
.hg-bodycentercol
{
	flex: 1 0 auto;
}

/* Right and Left columns.*/
.hg-bodyleftcol, .hg-bodyrightcol
{
 	background: yellow;
	min-width:100px;
 	padding: 1em;
}
 
.hg-bodyleftcol
{
 	order: -1;
}

@media ( max-width: 700px ) 
{
	.hg-bodycentercol 
	{
		flex-direction: column;
  }
	.hg-bodyleftcol, .hg-bodyrightcol 
  {
		width: 100%;
	}
}

/* End of Holy Grail Containers */

.flexbox 
{
  display: flex;
	flex-direction: row;
}

.flexbox > div 
{
  flex: 1; /*grow*/
}

/* Set/Remove Hyphenation */
.hyphenate
{
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  -moz-hyphens: auto;
  hyphens: auto;
}

.no-hyphenate, .nohyphenate
{
	-webkit-hyphens: manual; 
	-moz-hyphens: manual;
	 -ms-hyphens: manual;
	hyphens: manual; 
}


/********** Display Panel Classes ************/

/* Buttons */
.button, .disabledbutton
{
	border-radius:10px; 
	color:white; 
	font-size:1.00em; 
	font-weight:bold; 
	padding:3px 9px 5px 9px; 
	text-decoration:none; 
	vertical-align:middle;
}

.disabledbutton
{
	border: 1px solid gray;
	border-radius:10px; 
	color:gray; 
	font-size:1.00em; 
	font-weight:bold; 
	padding:3px 9px 5px 9px; 
	text-decoration:none; 
	vertical-align:middle;
}

/* End Bar  */
.endbar
{
	background-color:#757c74; /* Starcraft Green */
	color:lightgray;  
	display:block;
	font-size: 80%; 
	text-align:center; 
	width:100%;
}

/*Top panel containing the logo */
.toppanel 
{
	background-color:#757c74; /* StarCraft Green Former: #6c6c6c;*/
	background-image: url(images/HeadingMontage7.png);
	background-repeat:no-repeat;
	background-size: cover;
	height: 95px;
	/* Set margin for Navigator*/
	margin: -7px -8px 0 -10px; /*top right bottom left*/
	/* Set margin for IE.*/ 											
	margin: expression("-15px -10px 0 -10px"); /*top right bottom left*/
	overflow:hidden;		
	vertical-align: middle;																	
}

/*Left panel - Replaces navigation division*/ 
.leftpanel 
{
	background-color: #757c74; /* StarCraft Green */
	color:white;
	float: left; 
	font-size: 92%;
	margin: -95 10px 10px -10px;
	overflow:hidden;
	padding: 10px;
	width: 198px; /* Width for Mozilla, Opera, Chrome, etc. */
	width: expression( 220+"px"); /* Width for IE */
	z-index:85; /* Always on top - but beneath any Lightbox enlargement overlay */
}

.rightpanel, .rightpaneltopborder, .searchbar 
{
	/* These attributes should be the same for all three classes ---------------------------------------------------------*/
	/* Float: right appears to leave a 1-px margin on the right side of the screen, adjust using the margin property. */
	float: right;
	/* Mozilla width */
	width: 20%;
	/* Dynamic width expression() for IE.  Expression is ignored by Mozilla, etc.*/
	width: expression( (document.body.clientWidth *.20) +"px");
}

.rightpanel, .rightpaneltopborder 
{
	background-color:white;
	border-left:   5px solid #757c74; /* StarCraft Green Former: #6c6c6c;*/
	border-bottom: 5px solid #757c74; /* StarCraft Green Former: #6c6c6c;*/
	color:#3c3c3c;
	font-size: 13px;
	font-weight: bold;
	line-height: 19px;
	/*top right bottom left - Neg margin are ignored by Mozilla*/
	margin: 0 -10px 0 20px;
	overflow:hidden;
	/* Padding for Mozilla: top right bottom left*/
	padding: 0 0 10px 5px;
	/* Padding expression() for IE */
	padding: expression("10px 0 10px 5px");
	text-align: left;
} 

.rightpaneltopborder 
{
	border-top: 5px solid #757c74; /* StarCraft Green Former: #6c6c6c;*/
}

.searchBar 
{
	background-color:#757c74; /* StarCraft Green Former: #6c6c6c;*/
	border: 5px solid #757c74; /* StarCraft Green Former: #6c6c6c;*/
	color: white;
	font-size: .8em;
	/* Mozilla height */
	height: 100px;
	/* IE height */
	height: expression(100+"px");
	line-height: normal;
	/*top right bottom left. For Mozilla */
	margin: -7 -5px 0 0;
	/* Margin for IE */
	margin:expression("0 0 0 0");
	/* Padding for Mozilla: top right bottom left*/
	padding: 0 0 0 0;
	/* Padding expression() for IE */
	padding: expression("10px 10px 10px 10px");
	text-align: center;
}

/*Used in the Searchbar*/
.searchfield 
{
	border-radius:4px;
	font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
	height:24px;
	width:151px;
	background:transparent;
	padding-left: 5px;
	padding-right:5px;
	vertical-align:middle; 
}

/*Used in SearchText 2/2/16*/
.textfield 
{
	border: 0 ;
	font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
	font-size:80%;
	height:25px;
	width:141px;
	background:transparent;
	/*background:expression('transparent url("images/searchtext.png") no-repeat');*/
	padding-left: 5px ;
	vertical-align:middle; 
}

.offerpanel
{
	background-color:#757c74; /* StarCraft Green Former: #6c6c6c;*/
	color:white; 
	font-weight:500;
	margin: 0 -10px 0 0; 
	padding:2px 15px 15px 15px;
	z-index:1;
}

/* Default list item that is an list link*/
.offerpanel a:link, .offerpanel a:active, .offerpanel a:visited 
{
	color:white ;
	font-weight:bold;
	text-decoration: none;
}

/* Mouse is over the list item link */

.offerpanel a:hover 
{
	color:white ;
	text-decoration:underline;
}

/* Horizontal Lines */

/* Default horizontal line */
hr, hr.normal, hr.hrnormal, hr.hr-normal 
{
	background-color:transparent;
	border-top: 1px solid gray;
	height: 1px ;
	width: 100%;
}

/* Reversed Horizontal Line */
hr.reverse, hr.hrreverse, hr.hr-reverse
{
	background-color:transparent;
	border-top: 1px solid lightgray;
	height: 1px;
	width: 100%;
}

/****************************************************************************/
/* Indented text 																										*/
/****************************************************************************/

/* Hanging indents */

/* ensp hanging indent */
.hangingindentn 
{
  padding-left: 12.5px ;
  text-indent: -12.5px ;
}
 
/* emsp hanging indent */
.hangingindent, .hangingindent10, .hangingindent15  
{
  padding-left: 17px ;
  text-indent: -17px ;
}

.hangingindent10
{
	margin-bottom:10px;
}

.hangingindent15
{
	margin-bottom:15px;
}

/* Indent text blocks */
.indented40
{
	overflow: hidden; 
	width: auto;
	padding-left:40px;
	padding-right:40px;
}
/****************************************************************************/
/* Classes that center text                                        */
/****************************************************************************/

/* Centered text */
.centered 
{
	display:block;
	text-align: center;
}

/****************************************************************************/
/* Classes that align text                                        */
/****************************************************************************/

/* Justified text */
.justify, .justified 
{
	display:block;
	text-align:justify;
}

/* Left-Aligned text */
.left, .left-aligned 
{
	display:block;
	text-align:left;
}

/* Right-Aligned text */
.right, .right-aligned 
{
	display:block;
	text-align:right;
}

/****************************************************************************/
/* Classes that put a border around a block                                 */
/****************************************************************************/

.noborder 
{
	border-style: none;
	border-width: 0;
}

.noborder a:hover
{
	text-decoration: none;
}

.border  
{
	border: solid 1px darkgreen;
}

.reverse 
{
	border-bottom: 1px solid white;
	color:white;
}


/****************************************************************************/
/* Classes that rotate a block                                              */
/****************************************************************************/

/* Rotates text for emphasis */
.rotate-45
{
	display:block; 
	-moz-transform:rotate(-45deg);
	-ms-transform:rotate(-45deg);
	-o-transform:rotate(-45deg);
	-webkit-transform:rotate(-45deg);
	transform:rotate(-45deg);
	/* Internet Explorer */
	filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
}

/* Rotates text so the bottom is toward the right edge of the page */
.rotate-270
{
	display:block; 
	-moz-transform:rotate(270deg);
	-ms-transform:rotate(270deg);
	-o-transform:rotate(270deg);
	-webkit-transform:rotate(270deg);
	transform:rotate(270deg);
	/* Internet Explorer */
	filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
}

/****************************************************************************/
/* Inline Text Classes.  These classes change the appearance of inline text */
/****************************************************************************/

/* Disabled text in a list.  Used to make a list item appear disabled */
.deprecated 
{
	border-bottom: 1px solid #caccbb; /* gray */ 
	color: #3c3c3c;
	font-weight: normal;
}

/* Disabled inline text -- cannot use "disabled" which is a protected word */
.dimmed { color:#c0c0c0; }

.reversetext { color: white; }

/* Special Characteristics for Inline Text */

/* Bold Text */
.strong { font-weight:bold; }

/* Hightlighted Text */
.highlight { background-color:white; }

/* Green Text - Used for emphasis Color set with h1, h2, etc headings*/
.greentext, .green-text 
{
	text-indent:5px;
}

/* Reverse Green Text - Used for emphasis */
.reversegreentext, .reverse-green-text
{
	background-color:#757c74; /* StarCraft Green Former: #6c6c6c;*/
	color: white;
}

/****************************************************************************
Classes that float blocks left or right                                  ****************************************************************************/
.floatbox
{
	background-color:white;
	font-size: 14px;
	font-weight:bold;
	line-height:1.2;
	padding: 10px 10px 10px 10px;
	text-align:left;
	text-indent: 0; 
}

.adfloatleft,.adfloatright,
.floatleft, .floatleftinsert,  .floatleftinsertpanel, 
.floatright, .floatrightinsert, .floatrightinsertpanel,
.nofloat, .nofloatwithborder,.centerfloat
{
	background-color:white;
	border:1px solid #757c74; /* StarCraft Green Former: #6c6c6c;*/
	border-width:thin 0 thin 0;
	font-size: 14px;
	font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
	line-height:1.3;
	margin: 5px;
	padding: 10px;
	text-align:left;
	text-indent: 0; 
}

.adfloatleft,.adfloatright,
{
	overflow:hidden;
	padding:5px;
	text-align:center;
}

.floatleft:hover,  .floatleftinsert:hover,  .floatleftinsertpanel:hover, 
.floatright:hover, .floatrightinsert:hover, .floatrightinsertpanel:hover,
.nofloatwithborder:hover
{
	border-color: darkorange;
}

.nofloat, .centerfloat
{
	border: 0;
	margin:0; 
	padding: 5px;
}

.centerfloat
{
	margin:auto;
}

/* Set the common properties of left boxes */
.adfloatleft, .floatleft, .floatleftinsert, .floatleftinsertpanel
{
	float:left;
	margin: 20px 20px 20px 0;
}

/* Set the common properties of right boxes */
.adfloatright, .floatright, .floatrightinsert, .floatrightinsertpanel 
{
	float:right;
	margin: 20px 0 20px 20px;
}

.floatleftinsert, .floatrightinsert 
{
	background-color: white;
	color:black;
	font-weight:normal;
}

.floatleftinsertpanel, .floatrightinsertpanel 
{
	background-color: white;
	color: black;
	font-weight:normal;
}

/* floatright/floatleft: Used primarily to float images with captions */
.floatleft 
{
	font-size:85%;
	text-align:right;
}

.floatright 
{
	font-size:85%;
	text-align:left;
}

/* This is not actually a floating control.  It is a box that sits in the middle of the viewable screen.  Used as a pop-up search bar */
#searchBox 
{
	background-color: #6c6c6c ;
	color: white;
	display: none ;
	height: 1px; 
	padding:10px; 
	position: absolute; 
	text-align: center;
	visibility: hidden ;  
	width: 1px; 
	z-index:85;
}

/* Font sizing classes */

.t8, .t10, .t12, .t14, .t16, .t18, .t20, .t22, .t24, .t30, .t36, .t48, .comment, .footnote, 
{ 
		line-height: 1.3; 
}

/*  8 point text */
.t8, .t8b   { font-size: 50%; }

/* 10 point text */
.t10, .t10b { font-size: 70%; }

/* 12 point text */
.t12, .t12b { font-size: 80%; }

/* footnote text */
.footnote { font-size: 85%; }

/* 14 point text */
.t14, .t14b, .comment, { font-size: 90%; color:#cc3333; /* Chinese Red */ }

/* 16 point text This is the normal size text*/
.t16, .t16b { font-size: 100%; }

/* 18 point text */
.t18, .t18b { font-size: 110%; }

/* 20 point text */
.t20, .t20b { font-size: 120%; }

/* 22 point text */
.t22, .t22b { font-size: 130%; } 

/* 24 point text */
.t24, .t24b { font-size: 140%; }

/* 30 point text */
.t30, .t30b { font-size: 175%; }

/* 36 point text */
.t36, .t36b { font-size: 210%; }

/* 48 point text */
.t48, .t48b { font-size: 280%; }

/* Footnote  */
.footnote 
{ 
	font-weight:normal; 
	margin: 7px 0 7px 0;
}
/***************************************************************************
Classes that color the background of blocks                                       ***************************************************************************/

#whiteblock, .whiteblock
{
	background:white;
	padding:5px;
}

/**********************************************************************/
/* Classes for Image Management 																			*/
/**********************************************************************/

/* Flip image horizontally */
.flipimage
{
	-moz-transform: scaleX(-1);
  -o-transform: scaleX(-1);
  -webkit-transform: scaleX(-1);
  transform: scaleX(-1);
  filter: FlipH; /*IE*/
  -ms-filter: FlipH; 
}

/* Flip text horizontally */
.fliptext
{
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}

/**********************************************************************/
/*  Classes that modify text for emphasis 														*/
/**********************************************************************/

/* inset text boxes */
.inset10
{
	margin-left: 10px;
}

.inset20
{
	margin-left: 20px;
}


/* Used in document titles */

.documenttitle
{
	background:white;; 
	border-bottom:1px solid gray; 
	margin-bottom:15px;
}

/*  First Letter of the first line of the block is in a larger type */
.first-letter, .drop-cap, .drop-cap-small 
{
	color: #006699; /* TTip Blue */
	float:left;
	font-size: 75px;
	font-weight: normal;
	line-height:1.0;
	margin: -8px 7px 0 0;
	padding: 5px 5px 0 5px;
	vertical-align:top;
}

.drop-cap-small 
{
	color:#006699; /* TTip Blue */
	float:left;
	font-size: 37.5px;
	line-height: 1.0;
}

/* Headline Text */
.emphatic, .headline, .lead-paragraph, .leadparagraph 
{
	color: #6c6c6c;
	font-size: 1.5em;
	font-weight:bold;
	line-height: 1.35; 
}

.lead-paragraph, .leadparagraph
{
	color: #6c6c6c;
	font-size: 1.4em;
	line-height:1.35;
}

.emphatic
{
	color: black;
	font-size: 1.1em;
	line-height:1.35;
}

/**********************************************************************/
/*  Menu Classes													 														*/
/**********************************************************************/

/* Horizontal hTab Class  - creates normal menu tabs */

/* Used to style the <div> that contains the hTab <ul>*/
.hTab
{	background:transparent;
	display:inline-block;
	padding-left:3px;
	padding-top:15px;
}

/* Creates tab-up menu tabs -- for directory*/
.hTab ul 
{
	background:transparent;
	display:inline;
	list-style: none;
	margin: 0;
	vertical-align:text-bottom;
}

/* Define the format for the list item child of the unordered list*/
.hTab li 
{
	background-color: white;
	border: 1px solid #757c74; /* StarCraft Green Former: #6c6c6c;*/
	border-bottom-style:none; 
	display: inline-block;
	float: left;
	line-height:12px;
	margin:0;
	/* Show tabs as overlapped slightly unless the first tab */
	margin-left:-1px;
	padding: 5px 5px 5px 5px;
	position:relative;
	text-align:center;
	top:0;
}

/* Define the format for the anchor child of the list item*/
.hTab li a, 
.hTab li a:link, 
.hTab li a:active, 
.hTab li a:visited,
.hTab li a:hover

{
	border:#757c74; /* StarCraft Green Former: #6c6c6c;*/
	color:#757c74; /* StarCraft Green Former: #6c6c6c;*/
	display:block;
	font-size:.75em;
	text-decoration:none;
}

.hTab li a:hover
{
	color:black;
}

/* Define the format for the selected list item*/
.hTab .selected 
{
	background: #757c74; /* StarCraft Green Former: #6c6c6c; */
	border: #757c74; /* StarCraft Green Former: #6c6c6c; */
	border-bottom-width: 0;
	border-top-left-radius:  4px;
	border-top-right-radius: 4px;
	color: white;
	font-size:.75em;
	position:relative;
	top:0;
	top:expression( -10+'px');
}

/* Menu Text is displayed in java script in jsfunctions2.js*/
#menutext
{
	background-color: #757c74; /* StarCraft Green Former: #6c6c6c; */ 
	color:white;
	/* IE has to be displayed inline to avoid margin display error.  Very wierd, even for IE */
	display:block;
	display:expression("inline");
	font-size: 12pt;
	font-weight:bold;
	/* Top margin for Mozilla must be -5px */
	margin: 0 0 10px 0;
	padding:0 0 0 0;
	text-align:center;
	/* Required for IE to display properly */
	width:expression(99.9 +'%');
	/* Make sure it stary on top */
	z-index:100;
}

/* Horizontal hTabUp Class - creates tab-down menu tabs */
.hTabUp, .htabUpRight
{ 
	background-color:white;
	line-height:12px;
	overflow:hidden;
}

.hTabUpRight
{
	display:expression("inline-block");
	padding-bottom:12px;
	padding-bottom:expression(18 +'px');
	margin: 0 15px 0 0;
}

.hTabUp ul, .hTabUpRight ul 
{
	background-color:transparent;	
	list-style: none;
	padding:0 0 55px 0;
	margin:0;
	vertical-align:text-bottom;
}

.hTabUp ul
{
	display:inline-block;
	padding:0 0 20px 0;
}

.hTabUp li, .hTabUpRight li 
{
	background-color: white;
	border: 1px solid #757c74; /* StarCraft Green Former: #6c6c6c;*/
	border-top-width: 0;
	display: inline-block;
	float: left;
	margin:0;
	padding: 5px 5px 10px 5px;
	padding: expression( '5px 5px 10px 5px');
	text-align:center;
}

/* Anchors within hTabUp lists */

.hTabUp li a, 
.hTabUp li a:link, 
.hTabUp li a:active, 
.hTabUp li a:visited,
.hTabUp li a:hover,
.hTabUpRight li a, 
.hTabUpRight li a:link, 
.hTabUpRight li a:active, 
.hTabUpRight li a:visited,
.hTabUpRight li a:hover
{
	border:0 ;
	color:#757c74; /* StarCraft Green Former: #6c6c6c;*/
	font-size:.75em;
	font-weight:bold;
	padding: 0;
	text-decoration:none;
}

.hTabUp li a:hover, .hTabUpRight li a:hover
{
	color:black;
}

.hTabUpRight li
{
	float:right;
}

.hTabUp .selected, .hTabUpRight .selected 
{
	background: #757c74; /* StarCraft Green Former: #6c6c6c;*/
	border:white;
	color:white;
	font-size:.75em;
	font-weight:bold;
	margin-top:-1px;
	overflow:hidden;
	position:relative;
	z-index:85;
}

/*********************************************************?
/* Special Controls                                      */
/*********************************************************/

/*-----------------------------------------------------------------------------------------------*/
/* Lightbox Styles -  Display box for images that appear in the middle of the screen as a "popup"*/
/*-----------------------------------------------------------------------------------------------*/

#lightbox 
{
	background-color:white;
	padding: 10px;
	border-bottom: 5px solid #caccbb;
	border-right: 5px solid #caccbb;
	}
	
#lightboxDetails 
{
	font-size: 0.8em;
	padding-top: 0.4em;
}	
	
#lightboxCaption{ float: left; }

#keyboardMsg{ float: right; }

#closeButton{ top: 5px; right: 5px; }

#lightbox img{ border: none; clear: both;}
 
#overlay img{ border: none; }

#overlay{ background-image: url("images/overlay.png"); }

* html #overlay
{	background-color: #333;
	background-color: transparent;
	background-image: url(blank.gif);
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="images/overlay.png", sizingMethod="scale");
}
/*-----------------------------------------------------------------------------------------------*/
/* End Lightbox Styles -  Display box for images that appear in the middle of the screen as a "popup"*/
/*-----------------------------------------------------------------------------------------------*/

/*-----------------------------------------------------------------------------------------------*/
/* Filter Image Class  - Filtering Image Classes 
/*-----------------------------------------------------------------------------------------------*/

/*	These images display at less than full opaque until the mouse is clicked over the image */

img.filterimage, img.fadeimage:hover
{
	border-width: 0;
	filter:progid:DXImageTransform.Microsoft.Alpha(opacity=80);
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
	-moz-opacity: 0.5;
	opacity:0.5;
}

img.filterimage:hover, img.fadeimage
{
	border-width: 0;
	filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100);
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	-moz-opacity: 1;
	opacity:1;
}

/* Three levels of fading */
img.dimimage5
{
	border-width: 0;
	filter:progid:DXImageTransform.Microsoft.Alpha(opacity=80);
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
	-moz-opacity: 0.5;
	opacity:0.5;
}

img.dimimage10
{
	border-width: 0;
	filter:progid:DXImageTransform.Microsoft.Alpha(opacity=60);
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
	-moz-opacity: 0.3;
	opacity:0.3;
}

img.dimimage15
{
	border-width: 0;
	filter:progid:DXImageTransform.Microsoft.Alpha(opacity=40);
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
	-moz-opacity: 0.1;
	opacity:0.1;
}

/*-----------------------------------------------------------------------------------------------*/
/* End of Filter Image Class  - Filtering Image Classes 
/*-----------------------------------------------------------------------------------------------*/

/*-----------------------------------------------------------------------------------------------*/
/* Folded Corner Class
?*-----------------------------------------------------------------------------------------------*/
.foldedcorner {
  position: relative;
  padding: 1em 1.5em;
  margin: 2em auto;
  color: black;
  background: khaki;
}

.foldedcorner:before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  border-width: 0 48px 48px 0;
  border-style: solid;
  border-color: darkkhaki  #fff;
	/* Needed for Firfox 3.0 */
	display:block;
	width:0;
}
/* ----------------------------------------------------------------------------------------------
/* Pseudo Tooltip classes and id's
/* ---------------------------------------------------------------------------------------------

_tooltip ID
*/
#_tooltip
{
	background-color:lightyellow;
	border: 2px solid gray;
	-webkit-border-radius:15px;
	border-radius:15px;
	display:none;
	padding: 12px;
	position:absolute;
	z-index:1000;
}
			
/* Tooltipparent Class */
.tooltipparent
{
	color:#006699; /* TTip Blue */
	text-decoration:underline;
}