/* ====================================================================
LAYOUT
==================================================================== */
/* This layout, in combination with its associated DHTML script, creates a two or three column layout with a content-box spanning header, a content-box spanning footer, one or two fixed width side columns and a fluid main column. The main column html appears immediately after the header html in the markup. This a real plus from an accessability perspective. To create a two column layout, simply delete the undesired column's html from the markup, enter 0 for the third column's width in the DHTML scripts, set the column-one-content right margin to 0, and set the default widths as described below. The layout is based on Alex Robinson's 3 columns with Header and Footer, Ordered columns, Netscape 4 compatible layout (http://www.fu2k.org/alex/css/layouts/3Col_NN4_FMFM.mhtml). Alex's layout either has all columns fixed or all columns fluid;  I use DHTML to make the side columns fixed and the center fluid, with a fixed-width version of Alex's layout the default for those with JavaScripting turned off. */

/* --------------------------------------------------------------------
COLUMN LAYOUT
-------------------------------------------------------------------- */
/* LAYOUT WIDTH AND OPTIONAL CONTENT-BOX BORDER: The default layout total width (totalWidth) should be (20px + 2*width of optional content-box border + 2*width of optional content-box padding) less than target browser window size (which will be the set width for browsers that don't have JavaScripting enabled). If the default is to display fully with a scroll bar in all 5.0+ Windows and Mac browsers set to 600x800 and no border around the outer edge of the content, the total width should be no more than 748px (http://webmonkey.wired.com/webmonkey/99/41/index3a_page2.html?tw=design). */

#box-wrap {
	border: none; /* CSS HACK: width increased for browsers whose box model is not CSS2 compliant. */
	width: 768px;
/*/*/
	wid\th: 748px;
/* */
	}

/* COLUMN WIDTH: Choose the fixed left-hand column width (col2Width) and the fixed right-hand column width (col3Width). The box-wrap, columns-float, column-one, column-two and column-three width settings will be, respectively, totalWidth, totalWidth-col3Width, totalWidth-col2Width-col3Width, totalWidth-col2Width-col3Width and totalWidth-col3Width. If the total width is set to 748px and with one 180px fixed column, the box-wrap, columns-float, column-one, column-two and column-three width settings should be, respectively, 748px, 748px, 568px, 568px, 748px. */

#columns-float {
	float: left;
	width: 748px;
	}
	
#column-one {
	float: right;
	width: 568px;
	}
	
/* CSS HACK: Caio hide from NN4 since NN4's float model is all wrong */
/*/*/
#column-two {
	margin-right: 568px;
	}

#column-three {
	margin-left: 748px;
	}
/* */

/* IE centers the box-header table unless it is given a width, which should equal the width of the page. */
#box-header-table {
	width: 748px;
	}

/* OPTIONAL CONTENT-BOX PADDING: */
/* If spacing around outside of content area is desired, create using a margin. IE and Mozilla default is margin: 8px; Opera default is padding: 8px. If alternate amount of space between inner browser edge and content is desired, change both margin and padding setting below (which is currently set simply to put the three browser families on the same page), with one of the two values set to 0. Remember to pass the margin/padding setting to setWidth in the global js. */

body {
	margin: 8px;
	padding: 0;
	}

/* OPTIONAL OUTER COLUMN-BOX PADDING: */
/* If padding outside column-boxes is desired (making it appear headers and footers are wider than content area), place on outside margins of the two outside columns. In a three column layout, column one (the main column) will not be padded. In a two column layout, column one will be padded on the marging opposite the second column. */
#column-one-content {
	margin-right: 0;
	margin-left: 0;
	}
	
#column-two-content {
	margin-left: 0;
	}

#column-three-content {
	margin-right: 0;
	}

/* OPTIONAL GUTTERS BETWEEN COLUMNS */
#column-one-content	{
	margin-left: 20px;
	margin-right: 0;
	}

/* --------------------------------------------------------------------
FOOTER CLEARING AND OPTIONAL PADDING BETWEEN HEADER, FOOTER AND CONTENT
-------------------------------------------------------------------- */
/* Create optional space using margin-bottom (#box-header) and height (.column-padding-after). */
#box-header {
	margin: 0;
	margin-bottom: 25px;
	padding: 0;
	}

#box-footer {
	padding: 0;
	clear: both;
	border: none
	}

.column-padding-after {
	height: 10px;
	font-size: 1px;
	line-height: 0px;
	clear: both;
	}

.clear {
	clear: both;
	} /* CSS HACK: only for NN4, so now use Caio hack to cleanse palette */
/*/*/ .clear { display: none; } /* */

/* CSS HACK:  position:relative needed by IE6 otherwise the header and col 2 don't show up on initial rendering - they're there but you have to minimise the window or switch to another app and back to see the full effect. But IE5(pc) doesn't like it. And nor does NN4.
NB. The use of pos:rel has to go way beyond skin-deep - any nested element that needs a background colour appears to require to be be relatively positioned */ 
/*/*/
#box-wrap, #columns-float, #column-one, #column-two, #column-three {
	p\osition: relative;
	}
/* */

/* --------------------------------------------------------------------
COLUMN PADDING AND BORDERS
-------------------------------------------------------------------- */
#column-one-content, #column-two-content, #column-three-content {
	padding: 0;
	border: none;
	}

/* ====================================================================
STYLING
==================================================================== */
/* border:nones are for NN4 */
html { 
	margin: 0px;
	padding: 0px;
	}
	
body
	{
	background-color: #fff;
	}

div { 
	margin: 0px; 
	padding: 0px;
	}

p {
	margin: 1em 0;
	}

/* box-wrap used here to set a background color for the columns. */
#box-wrap {
	background: transparent;
	}

#box-header
	{
	background: transparent;
	border: none;
	}

#box-footer
	{
	background: transparent;
	}

#column-one-content {
	background: transparent;
	}

#column-two-content {
	background: transparent;
	}

#column-three-content {
	background: transparent;
	}


/* ====================================================================
More STYLING
==================================================================== */
.center {
  text-align: center;
	margin: 0 auto;
  }

.left {
  text-align: left;
  }

img {
	margin: 0;
	padding: 0;
  }

.caption {
	font-weight: bold;
	font-size: small;
  }

#column-one-content {
	text-align: left;
	}

.no-margin {
	margin: 0;
	}

.no-top-margin {
	margin-top: 0;
	}

.first-head {
	margin: 0;
	}

.first-paragraph {
	margin-top: 0;
	}

/* ====================================================================
Header STYLING
==================================================================== */
#box-header * {
	text-align: left;
	margin: 0;
	padding: 0;
	}
	
#box-header table { /* The next two rules force IE, Mozilla and Opera to locate the header table in the same place relative to the header box; first set the rules for IE . . . */
	margin: -3px 0 0 -3px;
	width: 100%;
	}

#box-header[id] table { /* . . . then re-set the rules for Mozilla and Opera; hack hides new rules from IE. */
	margin: -2px 0 0 -2px;
	}

#box-header td {
	vertical-align: bottom;
	}
	
#box-header img { /* The next two rules force IE, Mozilla and Opera to position the image on the text's baseline; first set the rules for IE . . . */
	margin: 0 20px .2em 0;	
	}
	
#box-header[id] img { 	/* . . . now for Mozilla and Opera. */
	margin: 0 20px 0 0;
	}
	
#box-header {
	border-bottom: 4px solid #009;
	width: 100%;
	}

.sub_title {
	display: block;
	font-size: 50%;
	font-style: italic;
	}

/* ====================================================================
Footer STYLING
==================================================================== */

#box-footer {
	text-align: left;
	border-top: 4px solid #009;
	padding-top: 10px;
	}
	
#box-copyright {
	margin-right: 295px;
	}

#box-validation {
	width: 290px;
	float: right;
	}
	
#box-footer img {
	vertical-align: bottom;
	float: right;
	margin-left: 5px;
	border: none;
	}
	
#box-footer p {
	margin: 0;
	}


/* ====================================================================
General STYLING
==================================================================== */
	
body, div, span, ul, li, h1 {
 	font-family: arial, helvetica, 'lucida grande', verdana, geneva, lucida, sans-serif;
	color: #009;
  }

.hide {
	display: none;
	}

img {
	border: none;
	}

.highlight-color {
 	color: #f33;
 	font-weight: bold;
 	}

.bold {
 	font-weight: bold;
 	}

.box {
 	border: solid 1px;
  padding: 1em;
  margin: 0 0 10px;
  }

.box-last { /* The next two rules force IE, Mozilla and Opera have the same amount of space between the last box and the footer. */
 	border: solid 1px;
  padding: 1em;
  margin: 0 0 -15px;
  }

.box-last[class] { /* . . . then re-set the rules for Mozilla and Opera. */
 	border: solid 1px;
  padding: 1em;
  margin: 0 0 -5px;
  }

.spacer{
	display: none;
	}

.flush-top {
  margin-top: 0;
  padding-top: 0;
  }

.flush-bottom {
  margin-bottom: 0;
  padding-bottom: 0;
  }

.no-margin-top {
	margin-top: 0;
}

/* ====================================================================
Abbreviation STYLING
==================================================================== */

abbr.initialism_help, abbr.truncation, acronym, .help {
  border-bottom: 1px dotted;
  cursor: help;
  }


/* ====================================================================
Aural STYLING
==================================================================== */

abbr.initialism, abbr.initialism_help {
	speak: spell-out;
	}

abbr.truncation, acronym {
	speak: normal;
	}

/* ====================================================================
List STYLING
==================================================================== */
 
ul.inline {
	margin: 0;
	padding: 0;
 }

ul.inline li { /* hack corrects rendering in NN4: evolt.org/article/Successful_inline_lists_in_Netscape_4/17/60192/ */
  display: inline;
  /*/*//*/
  display: none;
  /* */
 }

/* ====================================================================
Nested List STYLING
==================================================================== */
 
/* HIDE NESTED LIST FORMATTING FROM NN4 */

/*/*/
div.nested-list li {
  padding-left: 0;
  margin-left: -.9em;
}

div.nested-list ol ol {
  padding-left: 2.8em;
  margin-left: -.3em;
}

div.nested-list ul {
  padding-left: 0; /* For Mozilla */
  margin-left: 2em;
}
/* END */

div.nested-list ol, h2 {
 	font-weight: bold;
 	font-size: x-large;
}

div.nested-list ol, h3 {
 	font-size: large;
}

div.nested-list ol  ol, h3 {
 	font-size: large;
}

div.nested-list ol  ol, h4 {
 	font-size: medium;
}

div.nested-list ul {
	list-style-type: disc;
 	font-size: medium;
}

div.nested-list ol ol {
	list-style-type: lower-alpha;
  }

div.nested-list p {
	font-size: medium;
 	font-weight: normal;
  }

div.nested-list h2, h3, h4 {
 	margin-bottom: 0;
 	margin-top: .5em;
}
 
/* ====================================================================
Sidebar STYLING
==================================================================== */
#column-two-content h2, #column-three-content h2 {
	font-size: medium;
	margin: 20px 0 0 0;
	}
	
#column-two-content[id] h2, #column-three-content[id] h2 { /* Extra space for Mozilla and Opera */
	margin-top: 40px;
	}

#column-two-content .first-head, #column-three-content .first-head { /* A bit of insanity that makes the letter boxes line up at the tops of the columns */
	margin-top: .12em;
	}

#column-two-content[id] .first-head, #column-three-content[id] .first-head { /* The brackets around the id's create some strong ju-ju that has to be undone! */
	margin-top: .12em;
	}
 
/* ====================================================================
Navigation STYLING
==================================================================== */
#navigation {
	text-align: center;
	margin: 0 0 20px 0;
	}

#navigation ul { /* Center inline lists when displayed by NN4 */
	margin: 10px 1em 0 -3em;
	/*/*/ margin: 0;  /* END */
	padding: 0;
	}

#navigation li {
	list-style-type: none;
	color: #fff; /* Set to background color to avoid problems on NN4 for Mac */
	}

#navigation h3 {
 	font-family: arial, helvetica, 'lucida grande', verdana, geneva, lucida, sans-serif;
	color: #009;
  }

#navigation h3 {
	margin: 1em 0 0 0px;
 	padding-bottom: 0;
 	font-size: medium;
 	}
 
/* ====================================================================
Search tool STYLING
==================================================================== */ 

#search-tools {
 	font-size: small;
 	border: solid 1px;
 	/*/*/ border: none; /* Create border for sake of NN4, then eliminate for other browsers */
  }
	
#search-tools form { /* The next two rules prevent IE from putting extra space at the top of the form element; first set the rules for IE . . . */
 	margin-top: -16px;
	}
	
#search-tools[id] form { 	/* . . . now undo for Mozilla and Opera, and set wider top-margin. */
 	margin-top: auto;
	}
	
#search-tools { /* The next two rules prevent the submit element from blowing up IE; first set the rules for IE . . . */
 	width: 177px;
	}
	
#search-tools[id] { 	/* . . . now undo for Mozilla and Opera, and set wider top-margin. */
 	width: auto;
	}

#search-terms {
 	font-family: monospace; /* Limit the length of the form field set by NN4 by specifying a fixed-width font */
 	/*/*/ font-family: inherit; /* END */ /* Let other browsers use the font used in the rest of the document (check to see not a problem with NN5 and 6 too!) */
  }

div#search-tools .submit {
 	margin: 5px 0;
  }

#search-tools fieldset {
  margin: 0;
  padding: 10px;
 	border: solid 1px;  /* Force border around fieldset to align with container edge */
  }
	
#search-tools fieldset { /* The next two rules create cross-browser fieldset margin consistancy; first set the rules for IE . . . */
 	margin-top: 10px;
	}
	
#search-tools[id] fieldset { 	/* . . . now undo for Mozilla and Opera. */
 	margin-top: auto;
	}
 
/* ====================================================================
Ad STYLING
==================================================================== */
.ad {
	font-size: x-small;
	/*/*/ font-size: xx-small; /* END */
	border: solid 1px;
	padding: 10px;
	}
	
.ad { 
	margin-top: 10px;
	margin-bottom: 20px;
	}

.ad p {
  padding: 5px 5px 0 5px;
  margin: 0;
  }

#ads {
  margin-bottom: 10px;
  }
  
/* ====================================================================
Display table STYLING
==================================================================== */
.display-data {
	border: solid 1px  #009;
	}

.display-data caption {
	color: #fff;
	background-color: #009;
	padding: .3em;
	font-size: x-large;
	}

.display-data td, th {
	padding: 2px 3px;
	border: solid 1px  #009;
	}

.display-data h3 {
	display: inline;
	font-size: medium;
	}

.display-data .table-indent {
	padding-left: 1em;
	}

.display-data .col-statistic {
	width: 40%;
	text-align: left;
	vertical-align: middle;
	}

.display-data .col-value, .col-source, .col-notes {
	width: 20%;
	text-align: center;
	vertical-align: middle;
	}