@charset "utf-8";
/* CSS Document */
/*
	TransParentcy.css ... Paula Funatake
	Copyright (c) 2007
	
	CSS for TransParentcy.org web site
	
	Development and testing utilizes the commented out background-color
	values for the major page components.
*/

/* comment these colors out before final publishing */
/*
#pageheader { background-color: #FFFFCC; }
#pagecontent { background-color: #00CCFF; }
#horizontaltabs { background-color: #FFFFCC; }
#lft_navcolumn { background-color: #99CCFF; }
#contentcolumn { background-color: #9999FF; }
#pagefooter { background-color: #66FFCC; }
*/

/* begin style definitions */
html, table {
	font-size: 100%;
	}
/* zero out everything for predictability */
* {
	margin: 0em;
	padding: 0em;
	}
body {
/*	set a base font size at approximately 10px (medium), which
	also sets our base size value of 1em = 10px. */
	/*background-color: #FFFFFF;*/
	font-size: 0.7em; /* .................... reduce the base font size */
	margin: 1em; /* ......................... edge spacing all sides */
	}

/* basic formatting stuff */
ul, ol {
	margin-left: 2em; /* ............................... reset a standard list appearance */
	margin-bottom: 1em;
	}
p {
	text-indent: 1.5em;
	margin-bottom: 1em;
	}

/* ================= SPECIAL STYLE DEFINITIONS ======================*/
/* pageheader to hold logo and page quote*/
#pageheader {
/*	specify a height to ensure correct positioning of the
	following div elements since floating our img collapses
	this div and would create an overlap with the following div */
	height: 42px; /* ........................ height of our static logo image */
	margin: 0em 0em 2em 0em; /* ........... allow space between next container */
	padding: 0em 0em 0em 0em;
	text-align: right;
	}
#pageheader img {
	display: block;
	float: left; clear: left;
	padding: 0;
	margin: 0;
	}
#pageheader p {
	font-size: 1.2em;
	font-weight: bold;
	font-style: italic;
	line-height: 100%;
	padding-top: .6em;
	}

/* this is the wrapper container holding navigation and content containers */
#pagecontent {
	margin: 0em;
	}

/* horizontal tabs at top of page content */
#horizontaltabs {
	padding: 0em;
	margin: 0em;
	margin-left: 8em; /* ....................... vertical nav column plus 2 ems */
	}
#horizontaltabs ul {
	list-style: none;
	margin: 0em 0em 0em 2em; /* ................ move in from edge a little bit */
	padding: 0em;
	text-indent: .6em; /* ...................... eliminate the first tail when the list spans rows */
	}
#horizontaltabs li {
	background: url(../images/Tabs-Teal-lft.gif) no-repeat left top;
	display: inline;
	line-height: 1.5em;
	text-align: center;
	white-space: nowrap;
	}
#horizontaltabs a {
	background: url(../images/Tabs-Teal-rht.gif) no-repeat right top;
	padding: 0em .8em 0em .8em; /* .............. span must have same side padding */
	text-decoration: none;
	font-weight: bold;
	color: #000033;
	}
#horizontaltabs a span {
	background: url(../images/Tabs-Teal-mdl.gif) repeat-x center top;
	padding: .15em .8em .2em .8em; /* ........... side padding allows for end imgs */
	display: inline;	
	}

/* Firefox (v2) needs slightly different padding values, see also TransParentcy-IE.css */
#horizontaltabs li {
	background: url(../images/Tabs-Teal-lft.gif) no-repeat left top;
	display: inline;
	line-height: 1.5em;
	padding-top: .2em; /* ....................... Firefox needs padding for li's img to display properly */
	padding-bottom: .2em; /* .................... Firefox needs padding for li's img to display properly */
	margin-left: 0em;
	margin-right: 0em;
	text-align: center;
	white-space: nowrap;
	}
#horizontaltabs a {
	background: url(../images/Tabs-Teal-rht.gif) no-repeat right top;
	padding: .2em .7em .2em .7em; /* ............ span must have same side padding */
	text-decoration: none;
	font-weight: bold;
	color: #000033;
	}
#horizontaltabs a span {
	background: url(../images/Tabs-Teal-mdl.gif) repeat-x center top;
	padding: .2em .8em .2em .7em; /* ............ side padding allows for end imgs */
	display: inline;	
	}
/* change images when the page is the current page being viewed */
#horizontaltabs #currentpage {
	background-image: url(../images/Tabs-Grey-lft.gif);
	}
#horizontaltabs #currentpage a {
	background-image: url(../images/Tabs-Grey-rht.gif);
	}
#horizontaltabs #currentpage a:hover {
	color: #FF3300; /* .......................... be consistent with lft_navcolumn tabs currentpage color */
	}
#horizontaltabs #currentpage a span {
	background-image: url(../images/Tabs-Grey-mdl.gif);
	}
/* use a different hover image */
/* this must follow the normal and current behaviors to work as expected. */
#horizontaltabs li:hover {
	background-image: url(../images/Tabs-Blue-lft.gif);
	}
#horizontaltabs a:hover {
	background-image: url(../images/Tabs-Blue-rht.gif);
	}
#horizontaltabs a:hover span {
	background-image: url(../images/Tabs-Blue-mdl.gif);
	}

/* ============================== LEFT COLUMN, MAIN NAVIGATION ================ */
/* page navigation container, float to the left */
#lft_navcolumn {
	float: left; /* ............................ allow other content directly to the right */
	margin-top: 2.5em; /* ...................... move down a little bit */
	border-right: medium solid #DFDFDF; /* ..... blend the border with the content container */
	width: 8em; /* ............................. fixed width column */
	text-align: center; /* ..................... all text in this container s/b centered */
	}
#lft_navcolumn ul {
	list-style: none;
	margin: 0em; /*............................. set apart from generic list margins */
	}
#lft_navcolumn li {
	background: url(../images/Teal-Vertical-top.gif) no-repeat left top;
	text-align: center;
	}
#lft_navcolumn a {
	/* padding for the <a> element determines how the menu images appear */
	background: url(../images/Teal-Vertical-btm.gif) no-repeat left bottom;
	display:block;
	min-height: .1em; /* ....................... IE workaround to get full tab as clickable region */
	padding: .6em 0em .8em 0em; /* ............. top and bottom padding ensures entire area is clickable */
	text-decoration: none;
	font-weight: bold;
	color: #000033;
	}
#lft_navcolumn a span {
	background: url(../images/Teal-Vertical-mdl.gif) repeat-y left center;
	display: block;
	text-align: center;
	}
/* change images when the page is the current page being viewed */
#lft_navcolumn #currentpage  {
	background: url(../images/Grey-Vertical-top.gif) no-repeat left top;
	}
#lft_navcolumn #currentpage a {
	background: url(../images/Grey-Vertical-btm.gif) no-repeat left bottom;
	}
#lft_navcolumn #currentpage a:hover {
	color: #FF3300; /* .......................... be consistent with horizontaltabs currenttab color */
	}
#lft_navcolumn #currentpage a span {
	background: url(../images/Grey-Vertical-mdl.gif) repeat-y left center;
	}
/* use a different hover image */
/* this must follow the normal and current behaviors to work as expected. */
#lft_navcolumn li:hover {
	background-image: url(../images/Blue-Vertical-top.gif);
	}
#lft_navcolumn a:hover {
	background-image: url(../images/Blue-Vertical-btm.gif);
	}
#lft_navcolumn a:hover span {
	background-image: url(../images/Blue-Vertical-mdl.gif);
	}

/* ================== MAIN CONTENT SECTION OF PAGE ========================*/
#contentcolumn {
	margin: 0em 0em 0em 7.3em; /* ............... allow for vertical nav column */
	padding: .5em 1em .5em 1em; /* .............. white space between text and edges */
	border-top: medium solid #DFDFDF;
	border-left: medium solid #DFDFDF;
	border-right: medium solid #B2B2B2;
	border-bottom: medium solid #B2B2B2;
	}
#contentcolumn {
	font-size: 1.1em; /* ........................ if = 1, then left margin above must be 8em */
	}
#pagefooter {
	clear: left; /* ............................. always below pagecontent and left nav column */
	margin-top: 1em;
	padding-top: .5em;
	text-align: center;
	border-top: thin solid #336666;
	}
#pagefooter ul {
	list-style: none;
	}
#pagefooter li {
	display: inline;
	}

/*================== FORM STYLE DEFINITIONS ==========================*/
/* fieldset for the contact form */
fieldset {
	float: left;
	width: auto;
	margin: 0em 0em 1em .5em;
	padding: 0em;
	border: 0 none #FFF;
	background-color:#D2FFFF;
	}
fieldset ol {
	padding: 1em 1em 0 .5em;
	list-style: none;
}
fieldset li {
	width: 98%;
	padding-bottom: .5em;
}
label {
	width: 7em;
	float: left;
	margin-right: .5em;
	font-weight: bold;
	font-size: smaller;
}
label.label2 {
	float: left;
	width: 9.5em;
	margin-right: 1em;
	font-weight: bold;
	font-size: smaller;
}
/*================== GENERAL STYLE DEFINITIONS ==========================*/
/* element styling not specific to page sections */
h1{
	font-size: 1.9em;
	line-height: 100%;
	margin: .35em 0 .25em 0;
	padding: 0;
	color: #006666;
	}
h2 {
	font-size: 1.7em;
	line-height: 100%;
	margin: .35em 0 .25em 0;
	color: #006666;
	}
h3 {
	font-size: 1.5em;
	line-height: 100%;
	margin: .35em 0 .25em 0;
	color: #006666;
	}
h4 {
	font-size: 1.3em;
	line-height: 100%;
	margin: .35em 0 .25em 0;
	color: #006666;
	}

/* general links */
a {
	color: #003399;
	text-decoration: none;
	font-weight: bold;
	}
a:active {
	color: #CCCCCC;
	}
a:hover {
	color: #0099FF;
	}
/* if a listing does not have a link, give it a highlight */
/* using the site's base color scheme */
span.nolink {
	color: #cc33cc;
	}

/* img controls */
img.inline {
	margin: .2em;
	}
img.lftalign {
	float: left;
	margin: .2em .4em .2em .2em;
	}
/* lists and such */
dl, dt {
	margin: .5em 0em 0em 0em;
	}
dd {
	margin-left: 1em;
	}

/* =============== UTILITARIAN STYLES ====================== */
#noindent {
	text-indent: 0em; /* ...................... negate default <p> indent */
	}
#aligncenter {
	text-align: center;
}
#alignright {
	text-align: right;
}
#italicize {
	font-style: italic;
}
#makebold {
	font-weight: bold;
}
#trademark {
	font-size: .6em;
	text-transform: uppercase;
	vertical-align: super;
}
#footnote {
	vertical-align: super;
	font-size: 65%;
}
#footnotedetail {
	font-size: 100%;
	font-style:italic;
	text-indent: 0em;
	margin-left: 2em;
	margin-right: 2em;
	}
#attention {
	width: 85%;
	border: ridge #009999;
	margin: 0em 0em 0em 3em;
	padding: .2em;
}
#quote {
	font-style:italic;
	text-indent: 0em;
	margin-left: 2em;
	margin-right: 2em;
	}