/* Blue - #36c
	Red - #f03	*/
html {
	background-color: #999;
}


body {
	background-color: #fff;
	color: #000;
	font-family: Arial, Verdana, sans-serif;
	font-size: 10pt;
	border: 2px double #000000;
	padding: 10px;
	margin: 15px;
	}

/* Main link settings -- the defaults */
a:link {
	color: #f03;
	text-decoration: underline;
	}

a:visited {
	color: #f03;
	}

a:active {
	color: #f03;
	}

a:hover {
	text-decoration: none;
	}	


/* This is necessary for the navigation to be truly centered - the form shifts the
	available area to the left, so to compensate, I add a margin on the left that is
	the same as the width of the form on the right 
#nav {
	margin-left: 150px;
	.float: left;
	.margin-left: 50px;
	} */


/* These are for the navigation menu across the top */
table.menu {
	text-align: left;
	margin-top: 0px;
	margin-bottom: 2px;
	color: white;
	background-color: #36c;
	border: 3px outset #000;
	}

table.menu a {
	color: white;
	text-decoration: none;
	background-color: #36c;
	padding-left: 4px;
	padding-right: 4px;
	}

table.menu a:visited {
	color: white;
	}
	
table.menu a:hover {
	background-color: #fff;
	color: #000;
	}

/* This is for the login form and post-login box */
.login {
	width: 150px;
	border: 2px double #000000;
	padding: 5px;
	margin-left: 5px;
	background-color: #36c;
	color: #fff;
	font-weight: bold;
	}

.login a {
	color: #ff0;
	}

.login a:visited {
	color: #ff0;
	}

div.login ul {
	list-style-type: square;
	padding-left: 15px;
	}

form.login input {
	max-width: 130;
	}

/* For the sidebar that displays upcoming events */
.sidebar {
	width: 150px;
	border-left: 2px double #000;
	padding-left: 5px;
	padding-right: 5px;
	margin-left: 5px;
	margin-top: 5px;
	background-color: #fff;
}

.sidebar dt {
	font-weight: bold;
	margin-top: 10px;
	}

.sidebar a {
	color: #36c;
	text-decoration: underline;
	}

/* Predictably enough, this is for the footer */
#footer {
	text-align: center;
	clear: both;
	}
#footer img {
	border: none;
	}

div.news {  /* To outline the news stories */
	margin-left: 10%;
	margin-right: 200px;
	margin-bottom: 10px;
	border: 2px dashed #000;
	padding: 15px;
	padding-top: 0px;
	}

h3.headline {
	text-align: center;
	font-weight: bold;
	font-size: 20pt;
	}

div.index_news_left {  /* To outline the news stories on the index page */
	margin-left: 10px;
	margin-right: 10px;
	margin-bottom: 10px;
	border: 2px dashed #000;
	padding: 10px;
	padding-top: 0px;
	width: 35%;
	clear: left;
	float: left;
	}

div.index_news_right {  /* To outline the news stories on the index page */
	margin-left: 10px;
	margin-right: 10px;
	margin-bottom: 10px;
	border: 2px dashed #000;
	padding: 10px;
	padding-top: 0px;
	width: 35%;
	float: left;
	}

h2.calendar { 		/* For the calendar headers (months) */
	text-decoration: underline;
	color: #000;
	background-color: #acf;
	padding: 3px;
	margin-right: 200px;
	}

p.calendar {		/* For the calendar entries */
	}

#hidden_box {
	text-align: right;
	position: absolute;
	right: 180px;
	top: 170px;
	visibility: hidden;
	.width: 300px;
	}

#hidden_box table {
	border: 2px solid #000;
	}

#hidden_box td {
	background-color: #36c;
	}

#hidden_box td:hover {
	background-color: #fff;
	}

#hidden_box a {
	color: #fff;
	text-decoration: none;
	padding: 5px;
	}

#hidden_box a:hover {
	color: #000;
	.background-color: #fff; /* Because IE doesn't support hover for non 'a' elements */
	}