/* Thanks to http://www.csscreator.com, http://forum.weborum.com/index.php?showtopic=1601 */

HTML, BODY { 
	margin: 0; 
	padding: 0; 
	text-align: center; 
	background-color: #ccc;
	font-family: Verdana, Arial, sans-serif;
	line-height: 1.3em;
	font-size: x-small; /* IE5 Win */
  	voice-family: "\"}\""; 
  	voice-family: inherit;
  	font-size: small;
	} 
A 			{ color: #ccc; }
A:link 		{ color: #c00; }
A:visited 	{ color: #666; }
A:active 	{ color: #f00; }
A:hover 	{ color: #f30; }

/* Layout
----------------------  */	
#pagewidth { 
	width: 750px;  
	text-align: left; 
	min-width: 500px; 
	margin-left: auto; 
	margin-right: auto;
	padding-top: -10px;
	margin-top: 0;
	} 
#frame {
	border: 1px solid #999;
	background-color: #fff; 
	}
#header { 
	height: 80px; 
	width: 100%; 
	} 
#hp-outer { 
	border: solid white 0px; 
	/*/*/ border-right-width: 300px; /* right column width. NN4 hack to hide borders */ 
	border-right-color: #fff;  /* right column colour */ 
	border-right-style: solid; 
	background-color: #fff; /* center column colour */ 
	width: auto; 
 } 
#outer { 
	border: solid white 0px; 
	/*/*/ border-left-width: 250px ;  /* left column width. NN4 hack to hide borders */ 
	border-left-color: #fff;   /* left column colour */ 
	border-left-style: solid; 
	background-color: #fff; /* center column colour */ 
	width: auto; 
	}
#inner { 
	margin: 0; 
	width: 100%;
	}
#outer>#inner { 
	border-bottom: 1px solid #fff; 
	}
#hp-outer>#inner { 
	border-bottom: 1px solid #fff; 
	}
#hp-rightcol {
	/*/*/ width:300px; /* hack keeps NN4 right column right? */ 
 	float: right; 
	position: relative; 
	margin-right: -300px; 
	margin-left: 1px; 
	}
#hp-maincol { 
 	float: left; 
	width: 100%; 
	position: relative; 
	margin: 0 -8px 0 -2px; 
	}
#leftcol {
	width: 250px; 
	float: left; 
	position: relative; 
	margin-left: -250px; 
	margin-right: 1px; 
	padding-top: 50px;
	}
#maincol { 
	float: left; 
	width: 100%; 
	position: relative; 
	margin: 0 -8px 0 -2px; 
	}
#footer {
	width: 100%; 
	background-color: #efefef; 
	color: #999;
	border-top: 1px solid #999;
	padding-top: 5px;
	padding-bottom: 5px;
	} 
	#footer A 			{ color: #666; }
	#footer A:visited 	{ color: #666; }
	#footer A:active 	{ color: #f00; }
	#footer A:hover 	{ color: #c30; }
.clr { 
	clear: both; 
	}
.content { /*padding for content */
	padding: 10px; 
	font-size: 85%;
	}  
#header .content { /*padding bottom 0 to remove space in IE5 Mac*/ 
	padding-bottom: 0 
	} 
	
/* Utilities
----------------------  */	
#utilities {
	text-align: right;
	font-size: 85%;
	text-transform: lowercase;
	margin: 0;
	margin-bottom: 2px;
	}
#utilities SPAN {
	padding-left: 15px;
	}
#utilities SPAN A 			{ color: #333; }
#utilities SPAN A:link 		{ color: #333; }
#utilities SPAN A:visited 	{ color: #333; }
#utilities SPAN A:active 	{ color: #f00; }
#utilities SPAN A:hover 	{ color: #f30; }

#utilities SPAN B 	{ color: #c00; }

/* Nav menu
----------------------  */	
#nav {
	float: left;
	width: 100%;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 85%;
	background: #fff url(http://www.c2o.org/img/nav_bg.gif) repeat-x bottom left;
	text-transform: lowercase;
	border-top: 1px solid #999;
	border-bottom: 1px solid #999;
	}
#nav LI {
	float: left;
	margin: 0;
	padding: 0;
	list-style: none;
	border-right: 1px solid #999;
	}
#nav A {
	float: left;
	padding: 4px 15px 4px 15px;
	text-decoration: none;
	color: #666;
	}
#nav A:hover, #nav A.active {
	color: #000;
	background-color: #fff;
	}
#nav A.active {
	font-weight: bold;
	}
	
#nav-nextprev {
	border-top: 1px solid #e0e0e0; 
	margin-top: 3.5em;
	padding:2px;
	background-color: #eee;
}

#nav-admin {
	float: right;
	margin-left: 2em;
	border-top: 1px solid #e0e0e0; 
	padding:2px;
	background-color: #eee;
}
#nav-admin A, #nav-admin A:link, #nav-admin A:visited {
	color: #c00;
}

/* Forms
----------------------  */	
.contact-form {
	width: 410px;
	border: 1px solid #ccc;
	background-color: #eee;
	padding: 10px;
	font-family: Verdana, sans-serif;
	font-size: 100%;
	}
	
/* Misc text and img
----------------------  */	
IMG {
	border: 0;
	}
#footer .row {
	background-color: #efefef;
	height: 40px;
	}
#footer div.row div.left {
	float: left;
	text-align: left;
	width: 84%;
	}
#footer div.row div.right {
	float: right;
	text-align: right;
	width: 14%;
	}
#hp-rightcol H2 {
	color: #c00;
	font-family: Arial, sans-serif;
	letter-spacing: .1em;
	font-size: 110%; 
	text-transform: uppercase;
	}
#hp-rightcol H3 {
	color: #c00;
	font-size: 100%; 
	margin-bottom: 0;
	padding-bottom: 0;
	}
#maincol H1 {
	color: #666;
	font-family: 'Times New Roman', Times, serif;
	letter-spacing: .05em;
	font-size: 180%; 
	font-weight: bold;
	}
#maincol H2 {
	color: #c00;
	font-family: Arial, sans-serif;
	letter-spacing: .1em;
	font-size: 100%; 
	text-transform: uppercase;
	margin-top: 2.5em;
	}
#hp-maincol H3, #hp-maincol H3 A, #maincol H3, #maincol H3 A {
	color: #c00;
	font-size: 100%; 
	margin-bottom: 0;
	padding-bottom: 0;
	}
.date {
	font-size: 80%;
	}
.error-msg {
	width: 80%;
	color: #f30;
	background-color: #ffff00;
	padding: 5px;
	border: 1px dotted #f30;
	}
#join-list {
	margin-bottom: 3.5em;
	}
	
/* Printer styles
----------------------  */	
@media print { 
	#leftcol { 
		display: none; /* hide the left column when printing */
		} 
	#outer { 
		border-left: 0 
		} 
	}