/*******************************************************************************
*  screen.css : 2004-06-28 : Ruthsarian Layouts
* ------------------------------------------------------------------------------
*  This stylesheet defines the layout as it appears on screen by importing 
*  those stylesheets which should be used to render the layout on screen.
*
*******************************************************************************/

/*******************************************************************************
*  base.css : 2004-07-26 : Ruthsarian Layouts
* ------------------------------------------------------------------------------
*  base set of stylesheet rules needed to form the layout, and layout only.
*  color and fonts and such are not handled here.
*  side column widths are defined in EMs. see base_pixels.css for a pixel
*  version instead.
*******************************************************************************/

#pageWrapper {
	margin: 0;
	width: auto;
	min-width: 500px;
}
#outerColumnContainer {
	z-index: 1;
	border-color: #fff;
	border-style: solid;
	border-width: 0 15em;
}
#innerColumnContainer {
	z-index: 2;
	width: 100%;
}
* html #innerColumnContainer {
	position: relative;
}
#contentColumn {
	margin: 0 -1px;
	width: 100%;
}
#leftColumn, #rightColumn, #contentColumn {
	float: left;
	position: relative;
	z-index: 10;
	overflow: visible;
}
#rightColumn {
	float: right;		
	width: 15em;
	margin: 0 -15em 0 1px;
}
#leftColumn {
	width: 15em;
	margin: 0 1px 0 -15em;
}
#footer {
	position: relative;
}
#masthead h1 {
	display: inline;
}
.clear  {
	clear: both;
}
.hide, #oldBrowserNotice, .ieSixCharDupBug {
	display: none;
}
html>body .mozclear {
	border-bottom: 1px solid;
	margin-bottom: -1px;
}
#contentColumn {
	border-width: 0;	
}

/*******************************************************************************
*  hnav.css : 2004-06-30 : Ruthsarian Layouts
* ------------------------------------------------------------------------------
*  responsible for the horizontal navigation elements, one of which is usually
*  placed below the masthead but on top of the columns.
*******************************************************************************/

.hnav {
	white-space: nowrap;
	margin: 0;
	padding: 3px 0 4px 0;
}
.hnav ul span.divider {
	display: none;
}
* html .hnav {
	height: 1%;
}
* html .HNAV {
	height: auto;	
	padding: 0;	
}
.hnav ul {
	text-align: center;
	list-style-type: none;
	line-height: normal;
	margin: 0;
	padding: 0;
}
.hnav ul li {
	display: inline;
	white-space: nowrap;
	margin: 0;
}
.hnav ul li a {
	text-decoration: none;
	margin: 0 -1px 0 0;
	padding: 3px 10px 4px 10px;
	border-left: solid 1px #000;
	border-right: solid 1px #000;
}
* html .HNAV ul li a {
	width: 1%;	
}
.hnav ul li a:hover {
	text-decoration: none;
}

/*******************************************************************************
*  vnav.css : 2004-07-21 : Ruthsarian Layouts
* ------------------------------------------------------------------------------
*  responsible for the vertical navigation elements commonly found in the left
*  and / or right columns.
*******************************************************************************/

.vnav ul, .vnav ul li {
	margin: 0;
	padding: 0;
	list-style-type: none;
	display: block;
}
.vnav ul {
	border: solid 1px #000;
	border-bottom-width: 0;
}
.vnav ul li {
	border-bottom: solid 1px #000;
}
.vnav ul li a {
	display: block;
	text-decoration: none;
	padding: 2px 10px;
}
* html .vnav ul li a {
	height: 1%;
}
* html .vnav ul {
	position: relative;
}
.vnav h3 {
	margin-bottom: 0;
	padding-bottom: 0;
	font-size: 126%;
}

/*******************************************************************************
*  gutters.css : 2004-07-06 : Ruthsarian Layouts
* ------------------------------------------------------------------------------
*  handles the whitespace between and within elements; such as margins and 
*  padding.
*******************************************************************************/

body {
	margin: 0;
	padding: 2em;
}
p, h1, h2, h3, h4, h5, h6 {
	margin: 1em 0;
}
.inside {
	padding: 0 1.5em
}
#leftColumn, #centerColumn, #rightColumn, #masthead {
	padding-top: 0.5em;
	padding-bottom: 0.5em;
}
#masthead, #footer {
	padding: 1em;
}
.vnav {
	margin: 1em 0;
}
html>body #footer {
	padding-bottom: 1.01em;	
}

/*******************************************************************************
*  borders.css : 2004-07-29 : Ruthsarian Layouts
* ------------------------------------------------------------------------------
*  this stylesheet defines any and all borders that are rendered on the layou.
*  this includes the left and right-hand borders of the #outerColumnContainer
*  element which are used as the backgrounds for the left and right columns.
*******************************************************************************/

#pageWrapper {
	border-style: solid;
	border-width: 0 1px;	
}
#innerColumnContainer {
	border-style: solid;
	border-width: 0 1px;
	margin: 0 -1px;	
}
* html #outercolumncontainer {
	margin-top: -1px;
	border-top: solid 1px #000;
}
#masthead {
	border-style: solid;
	border-width: 1px 0;
}
.hnav {
	border-style: solid;
	border-width: 0 0 1px 0;
}
#footer {
	border-style: solid;
	border-width: 1px 0;
}

/*******************************************************************************
*  fonts.css : 2004-06-28 : Ruthsarian Layouts
* ------------------------------------------------------------------------------
*  handles the font type (family), sizes, line-height, alignment, and any other
*  properties relating to fonts - with the exception of color.
*
*  Perhaps font color declarations should be in this file as well. 
*  However, certain CSS validators (hello w3!) will complain if colors
*  and background colors are not declared in the same selector or
*  at least within the same stylesheet. So font colors, including links,
*  are defined in colors.css.
*******************************************************************************/

body {
	font-family: arial, helvetica, sans-serif;
	font-size: 100.1%;
}
#pageWrapper {
	font-size: 80%;
}
#footer {
	text-align: center;
}
h1 {
	font-size: 210%;
}
h2 {
	font-size: 180%;
}
h3 {
	font-size: 140%;
}
h4 {
	font-size: 126%;
}
h5 {
	font-size: 110%;
}
h6 {
	font-size: 100%;
}

/*******************************************************************************
*  colors.css : 2004-06-28 : Ruthsarian Layouts
* ------------------------------------------------------------------------------
*  defines background and foreground colors of elements within the layout.
*  sites that want to use different color schemes for different sub-sections
*  of a website need only make different versions of this stylesheet and link
*  or import them as need. The other stylesheets can be shared across the
*  entire site.
*******************************************************************************/

body {
	background-color: #666655;
	color: #FFFFFF;
}
#outerColumnContainer {
	border-left-color: #EEEECC;
	border-right-color: #BBBB88;
}
#masthead {
	background-color: #D7D9B7;
	color: #000000;
}
#footer {
	background-color: #D7D9B7;
	color: #000000;
}
#outerColumnContainer, #contentcolumn {
	background-color: #FFFFFF;
	color: #000000;
}
#leftColumn, #rightColumn, #contentColumn {
	color: #000000;
}
.vnav ul li a {
	color: #333366;
	background-color: #CCCC99;
}
#rightColumn .vnav ul li a:hover, .vnav ul li a:hover {
	background-color: #333366;
	color: #FFFFFF;
}
#rightColumn .vnav ul li a {
	color: #333366;
	background-color: #DDDDBB;
}
.hnav, .hnav ul li a {
	background-color: #CCCC99;
	color: #333366;
}
.hnav ul li a:hover {
	background-color: #333366;
	color: #FFFFFF;
}
#pageWrapper, #innerColumnContainer, #masthead, #footer, .hnav {
	border-color: #000000;
}
/******************************************************************************/