/* 
** main css file for cser web site 

** page structure
** body
**   content
**     header
**       banner
**       menu  
**     main
**       subnavigation
**       mainContent
**       footer
*/ 

/* the following two rules are needed for positioning the footer at bottom */
html, body, #content {
	min-height: 100%;
	height: 100%;
	margin: 0px;
	padding: 0px;
	min-width: 400px;
	background-color: #FFFFFF;
	color: #333333;
}
/*
 * The "height" above is a hack for IE5+/Win.  Below we adjust
 * it using the child selector to hide from IE5+/Win
 */
html>body, body>#content {
	height: auto;
}
/* redefine tags -------------------------------------------------------*/


body {
	margin: 0px;
	padding: 0px;
	font: 85% Verdana, Arial, Helvetica, sans-serif;	
	background: url(../design/backgrounds/cserws_grada.gif) repeat-x left top;

}

ul {
	margin: 0px 0px 0.5em 0em;
	padding: 0px;
	color: #999999;
	list-style: url(../design/backgrounds/dotgrey_small.gif) none outside;
}
li {
	color: #333333;
	margin-left: 1em;
}
p {
	margin: 0px 0px 0.5em 0em;
	padding: 0px;
}
p.ptitle, p.ptitlefirst {
	font-weight: bold;
	padding: 0px;
	margin-top: 1.5em;
	margin-bottom: 0.5em;
	margin-right: 1em;
	display: block;
	line-height: 1.5em;
}
 p.ptitlefirst {
	margin-top: 0em;
}

#content {
	padding: 0px;
	margin: 0px;
	display: block;
	width: 100%;
    background: url(../design/leafs/leafs.gif) no-repeat fixed 350px 130px;
}
img {
	border: 0px none;
}

/* ------------------------------------------*/
/*
** content: banner 
*/
#banner {
	margin: 20px 0px 0px 30px;
	display: block;
	padding: 0px;
}
#slogan {
	margin: 0px 0px 0px 150px;
	padding: 0px;
	font-style: italic;
	color: #CC3333;
	font-size: 90%;
	display: block;
}
#sloganf {
	text-indent: 50px;
	display: block;
	margin: 4px 0px 0px;
}
#topbar {
	clear: both;
	display: block;
	margin: -2px 0px 0px;
	padding: 0px;
}
#headerbar {
	clear: both;
	display: block;
	margin: 0px 0px 2em;
}
/* 
** content header: menu 
*/
#menu {
	font-size: 85%;
	padding: 0px;
	margin: 1.5em 0px 0em 30px;
	text-align: left;
}
#menu a, #menu a:link, #menu a:visited, #menu a:active {
	color: #CC3333;
	text-decoration: none;
	padding: 0px 0px 0px 8px;
	font-weight: bold;
	margin: 0px 1em 0px 0px;
}
#menu a:hover {
	text-decoration: none;
	background: url(../design/backgrounds/dot.gif) no-repeat left bottom;

}
#subnav {
	display: block;
	margin: 1em 0px 0.5em 30px;
	padding: 0px;
}
#subnav a, #subnav a:link, #subnav a:visited, #subnav a:active {
	text-decoration: none;
	color: #CC3333;
	margin: 0px 1em 0px 0px;
	font-weight: normal;
	padding: 0px 0px 0px 8px;
}
#subnav a:hover {
 	background: url(../design/backgrounds/dot_small.gif) no-repeat left bottom;
	text-decoration: none;
}

/* content: main ----------------------------------------------------------------------*/
#ctable {
	padding: 0px;
	margin: 0px 0px 5em 30px;
	width: 90%;
}
#ctable td {
	text-align: left;
	vertical-align: top;
	margin-right: 10em;
	margin-left: 10em;
}
#ctable #lcCell {
	width: 10em;
	background: url(../design/backgrounds/cserws_gradh.gif) no-repeat right top;
		margin: 0px 0px 1em 0px;

}
#ctable #rcCell {
	width: 90%;
		margin: 0px 0px 1em 0px;

}
/* 
** content: main: subnavigation 
*/
#subnavigation {
	display: block;
	color: #333333;
	font-size: 85%;
	padding: 0px 1em 0px 0px;
	margin: 0px 0px 5em;
	width: 10em;
}
#subnavigation p.ptitlefirst {
	border-bottom: thin solid #CC3333;
	display: inline;
}
#titlefirst {
	font-size: larger;
	color: #CC3333;
}
#toc {
	margin: 0px;
	padding: 0px;
	display: block;
	color:#333333;
}
#toc a, #toc a:link, #toc a:visited, #toc a:active {
	display: block;
	text-decoration: none;
	color:#333333;
	margin: 0.5em 0px 0px;
}
#toc a:hover {
	text-decoration: underline;
}
#search {
	display: block;
	padding: 0px;
	margin: 0px;
}
#search img {
	margin: 0.5em 0px 0px;
	display: block;
}
#search form, #search input {
	margin: 0px;
	padding: 0px;
}
#w3cvalidators {
	display: block;
	padding: 0px;
	margin: 1em 0px 0px;
}

/* 
** content: main: mainContent 
*/
#mainContent {
	display: block;
	margin: 0px 0px 2em 2em;
}
#mainContent a, #mainContent a:link, #mainContent a:visited, #mainContent a:active {
	color: #333333;
	text-decoration: none;
	border-bottom: thin solid #CCCCCC;
}
#mainContent a:hover {
	background: #FFFFCC;
}

/*
style for "back to top"
*/
#mainContent .totop a,  #mainContent .totop a:link, #mainContent .totop a:visited, #mainContent .totop a:active {
	text-decoration: none;
	font-size: 70%;
	font-weight: normal;
	background: url(../design/layout/totopb.gif) no-repeat left center;
	display: block;
	border-bottom: 0px none;
	color: #666666;
	margin: 1em 0px 6px;
	padding: 6px 0px 6px 12px;
}
/*
style for 'more' link
so far only used on index.html
*/
.morelink {
	text-decoration: none;
	color: #993333;
	font-weight: bold;
	font-size: 85%;
	border-bottom: 0px none;
	margin: 1em 0px;
	padding: 0px;
	display: block;
}

#mainContent .morelink a, #mainContent .morelink a:link, #mainContent .morelink a:visited, #mainContent .morelink a:active {
	text-decoration: none;
	border-bottom: 0px none;
}
#mainContent .morelink a:hover {
	background: none;
	text-decoration: underline;
}
/* 
** content: main: footer 
*/
#footer {
	display: block;
	font-size: 80%;
	padding: 0px;
	margin: 0px;
	clear: both;
	text-align: center;
	white-space: nowrap;
	height: 7em;
}

#footer p {
	display: block;
	text-align: center;
	margin: 0px 20%;
	padding: 2px 0em 0em;
	border-top: thin dashed #CCCCCC;
}
#footer a, #footer a:link, #footer a:active, #footer a:visited {
	color: #333333;
	text-decoration: none;
	border-bottom: thin solid #CCCCCC;
}
#footer a:hover {
	background: #FFFF99;
}


/* misc -----------------------------------------------------------*/

/*
styles for page navigation
*/

.jumplinks {
	text-align: center;
	display: block;
}
/* 
an empty paragraph, if inserted after a floating element it clears both sides and the height of the surrounding box will be calculated;
http://www.complexspiral.com/publications/containing-floats/ 
*/
.clearer {
	width: 100%;
	clear: both;
	margin: 0px;
	padding: 0px;
}
.highlight {
	color: #333333;
	font-weight: bold;
}
.bulletin  {
	margin: 2em 0px 0px;
}
#newstitle, #eventstitle, #searchtitle, .contenttitle
#newstitle, .contenttitle, #subsidemenutitle  {
	font-weight: bold;
	display: inline;
}
#newstitle, .contenttitle {
	border-bottom: thin solid #339933;
}
#eventstitle {
	border-bottom: thin solid #0066CC;
}
#searchtitle {
	border-bottom: thin solid #FFCC66;
}
#subsidemenu {
	background: url(../design/layout/emark.gif) no-repeat left center;
	margin: 2em 0px 0px;
	padding: 0px 0px 0px 22px;
}
#subsidemenutitle  {
	border-bottom: thin solid #CC3333;

}
/* on page index.php ----------------*/
#cseranim {
	display: block;
	width: 262px;
	height: 224px;
}

/* on page industry.html ----------------*/

#logolist {
	margin: 0px;
	padding: 0px;
	display: block;
}
.logoi img {
	margin: 1.5em 0px 0em;
}
#mainContent a.logoi, #mainContent a:link.logoi, #mainContent a:active.logoi, #mainContent a:visited.logoi {
	text-decoration: none;
	border-bottom: 0px none;
}
#mainContent a:hover.logoi {
	background: none;
}

/* on page contuctus.html ----------------*/
.contactnoscript {
	font-size: 70%;
	width: 50%;
}
.contactname {
	font-weight: bold;
}

.contactimg {
	margin-right: 1.5em;
}
.skipnav {
font-size: 1px;
left: -1000px;
line-height: 1;
position: absolute;
width: 990px; }

/* workarounds -------------------------------------------*/

/* added for ie5 on mac, ie on windows will ignore this */
#menu {
	white-space: nowrap;
}
#banner {
	white-space: nowrap;
}

#content>#footer {
	position: fixed;
	right: 0px;
	bottom: 0px;
	background: #FFFFFF;
}

/* hack for hiding positioning from IE 5Mac and version 4 browsers */
@media all {
#content {
	position: absolute;
	top: 0px;
	left: 0em;
}
/* fix for ie6 on windows */
#footer {
	position: absolute;
	bottom: 0px;
	left: 0px;
}
#content>#footer {
position: absolute;
	bottom: 0px;
	left: 0px;
}
}