/**************************************************************
	These styles affect all objects of a specific type
 **************************************************************/

/*
 Reset most styles to known values from the browser defaults
 */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p,  pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, 
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td, br {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
}

p, h1, h2 {
	margin-top: 18px;
}

h1, h2 {
	font-weight: bold;
}

h1 {
	font-size: large;
}

body {
	line-height: 1;
}

blockquote {
	quotes: '"'
}	

/* remember to define focus styles! */
:focus {
	outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* All links get this style */
a {
	color: #FF6600;
	font-weight:bold;
	text-decoration:none;
}	

/* All links get this style when the mouse is over them */
a:hover {
	color:#FFBA00;	/* Should match .logoText */
}

/**************************************************************
	These styles (with a # in front) are for specific object id's
	They say how the page is laid out
 **************************************************************/

/* The centered page */
#page {
	width:855px;
	margin-left:auto;
	margin-right:auto;
}

/* The banner running across the top of the page */
#banner {
	background-image:url('pipe_art_outline2.gif');
	background-repeat:no-repeat;
	display:table;
	width:855px;
	height:165px;
	margin-top:10px;
	margin-left:5px;
	border-right-width:0;	/* On IE6 and FF3 this is needed to avoid a
	                           horizontal scrollbar. WTF: It should have been
							   set in the body's style as border:0 */
	padding-top:22px;
	padding-bottom:22px;
}

/* Brings the tab bar down to meet the graphic */
#bannerTopSpacer
{
	height:144px;
	width:855px;

}

/* Brings the tab bar right to meet the graphic */
#bannerLeftSpacer
{
	width:200px;
}

/* The frame around the tabBar, needed for proper background fill.  */
#tabBarFrame {
	width:100%;	/* Needed by IE for proper top/bottom background fill and by FF for proper right fill */
	padding-top:154px;
	padding-left:217px;
	background-color:transparent;
}

/* The bar that holds the navigation tabs */
#tabBar {
}
	
/* The top border of the tabs */
#tab-topBorder {
	height:4px;
	font-size:0px;			/* Required by IE to avoid a 1em height */
	border-bottom-style:solid;
	border-bottom-width:1px;
}

/* The bottom border of the tabs */
#tab-bottomBorder {
	height:4px;
	font-size:0px;			/* Required by IE to avoid a 1em height */
	border-top-style:solid;
	border-top-width:1px;
}

/* One tab on the navigation bar */
#tab {
	/* 10px is the space between the text and the right separator (vertical line) */
	padding: 0px 10px;
	border-right-style:solid;
	border-right-width:1px;
}

/* The last tab on the navigation bar. Should match #tab
   but have no right border */
#lastTab {
	/* 10px is the space between the text and the right separator (vertical line) */
	padding: 0px 10px;
	border-right-width:1px;
}

/* The main width of the website below the tabs */
#lowerPanel {
	width:100%;
	height:100%;
}

/* The box to the left of the mainPage, with the logo and mission */
#sidebar {
	width:200px;			/* Add (or subtract) to the sidebar-mainFrame width any change in this value */
	vertical-align:top;
	padding-left: 10px;
}

/* The box that holds the main text of the page */
#main {
	padding-left:10px;		/* Add (or subtract) to the sidebar-mainFrame width any change in this value  */
	padding-bottom:15px;
	vertical-align:top;
	width:550px;
}

/* The title at the top of each main frame's text */
#mainHeading {
	text-align:center;
}

/* The box that holds the main text of the page */
#rightBar {
	vertical-align:top;
	padding-top:5em;
	padding-left:1em;
}
	
/* Used for the links at the bottom of the page. */
#footer {
	position:absolute;
	bottom: 0;
	padding-left: 304px;	/* Should match the width of #sidebar plus the
	                           padding-left of #main */	
	padding-bottom: 5px;
}

/* Used to position the link to the privacy policy */
#privacyLink {
	margin-left: 200px;
}

/**************************************************************
	These styles (with a . in front) are for classes of objects
	They say how the page is colored and what text looks like
 **************************************************************/
	
/* Shows below all content */
.windowBackground {
}

/* Used for banner and sidebar */
.frameBackground {
}

/* Used for the agency's name */
.logoText {
	font:24px Times New Roman, Times, serif;
	color:#0099FF;
	letter-spacing:0.3em;
	margin-left:17px;
	line-height:26px;
}
	
/* Just used for the tagline separator */
.tagline {
	color: #0000CC;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height:16px;	/* Has no effect in IE6. In FF3 it seems to move the
						   banner text up about 2 pixels, more closely
						   matching IE6. */
}

/* Use along with .tagline for the actual tagline text */	
.taglineText {
	font-size: 14px;
	font-weight: bold;
	color: #0000CC;
}

/* Used for the tab bar */
.tabBackground {
	background-color:#FFC671;		/* should match the artwork's star color */
}

/* Used for the upper and lower border of the tab bar */
.tabBorder {
	border-bottom-color:#D3DCE6;	/* Should match .tagline's color */
	border-top-color:#D3DCE6;		/* Should match .tagline's color */
}

/* Used for the normal text of a tab */
.tabText {
	color: #C6FFFF;
	letter-spacing:0.1em;
	font-size: 14px;
	line-height:16px;				/* Should be a bit larger than the font-size */
	border-right-color:#000000;		/* Makes the vertical spacer between the tabs */
	font-family: Arial, Helvetica, sans-serif;
}

/* Used when the mouse is hovering over a tab */
.tabText:hover {
	color:#000000;
	background-color: #C6FFFF;
}

/* Used when the this tab is the selected page */
.tabTextSelected {
	color:#C6FFFF;				/* Should match .tab's background-color */
	background-color:#000000;	/* Should match .tabText's color */
}

/* Used for the text in the sidebar (mission statement) */
.sidebarText {
	text-align:center;
	padding-left:12px;
	padding-right:35px;
	padding-top:15px;
	padding-bottom:10px;
	color: #0000CC;
	letter-spacing:0.1em;
	line-height:18px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}

/* Used above the main heading */
.grabLine {
	color: #0000CC;
	line-height:20px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	font-style: italic;
}

/* Used for the heading above the main content box */
.mainHeading {
	color: #0000CC;
	letter-spacing:.2em;
	line-height:32px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 24px;
}

/* Used for the main content box's background */	
.mainBackground {
	background-image:pisces_sign.gif;
}

/* Used for the main content box */
.mainText {
	line-height:22px;
	color:#26354A;
	letter-spacing:.1em;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
}

/* Used for the actual main content text*/
.mainTextFrame {
	background-color:#EFFFDF;
	border-width:2px;
	border-style:solid;
	border-bottom-color:#BBDA98;
	border-right-color:#BBDA98;
	border-top-color:#336600;
	border-left-color:#336600;
	padding:3px;
}

/* Used for lists of services */
.servicesTable tr
{
	vertical-align:top;
	border-top:solid;
	border-top-color:#336600;
	border-top-width:1px;
	border-bottom:solid;
	border-bottom-color:#336600;
	border-bottom-width:1px;
}

.servicesTable td
{
	padding-left:15px;
}

/* Used as a spacer to the right of the main content box.
   It's needed to prevent the sidebar and main content box
   filling the entire screen width */
.invisibleText {
	color:#FFFFFF; /* Should match mainBackground's background-color
	                  to make any text invisible */
}

/* Used for the footer at the bottom of the page */
.footerText {
	color:#FFFFFF;			/* Should match .mainText */
	h
}

/* All links get this style */
.footerText a {
	color: #FFFFFF;			/* Should match .mainText */
	font-weight:bold;
	text-decoration:none;
}

/* All links get this style when the mouse is over them */
a:hover {
	color:#FFBA00;	/* Should match .logoText */
}