body {
	margin: 0px;
	margin-bottom: 50px; /* this doesn't seem to work, so i'm using <br>'s in the sidenav.php to help out */
	background-image: url(../images/header_bg.jpg);
	background-repeat: repeat-x;
	background-color: #FFFFFF;
}
body,td,th {
	font-family: Helvetica, Arial, sans-serif;
	font-size: 12px;
	color: #000000;
}
a:focus {
	outline: none;
}
a:link {
	color: #ff6633;
	text-decoration: underline;
	border:none;
}
a:visited {
	text-decoration: underline;
	color: #ff6633;
}
a:hover {
	text-decoration: underline;
	color: #FF0000;
}
a:active {
	text-decoration: underline;
	color: #ff6633;
}

div.floatLeft { /* a more compatible version of img padding  (replaces img.floatLeft) */
	padding: 0px;
	margin-right: 20px;
	margin-bottom: 10px;
/*	background-color:#FFFFFF;
*/	float: left; 
	clear: left; 
	border: none;
}
div.floatLeft img {display:block;} /* override display:inline */

div.floatRight { /* a more compatible version of img padding  (replaces img.floatLeft) */
	padding: 0px;
	margin-left: 20px;
	margin-bottom: 20px;
	background-color:#FFFFFF;
	float: right; 
	clear: right; 
}
div.floatRight img {display:block;} /* override display:inline */

#wrapper {
	background-image: url(../images/header.jpg);
	background-repeat:no-repeat;
	width: 875px;
	height: 218px;
}
#photo {
	position:relative;
	top: 136px;
	left: 70px;
	display: inline;
	width: 220px;
}
#calendar {
	position:absolute;
	top: 72px;
	left: 675px;
	width: 115px;
	z-index:100;
}
#sidenav {
	position:absolute;
	top: 515px;
	left: 70px;
	margin: 0px;
	padding: 0px;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 12px;
	line-height: 1.5em;
	color:#73705D;
}
#sidenav a:link, #sidenav a:active, #sidenav a:visited {
		color:#73705D;
}
#sidenav a:hover {
		color:#000000;
}
#sidenav p {
	color: #f26522;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	line-height: inherit;
	font-size: 11px;
	font-weight: bold;
	margin: 0;
	margin-bottom: 2px;
}
#sidenav ul, #sidenav li {
	margin-left: 0px;
	margin-bottom: 0px;
	margin-top: 0px;
	padding: 0;
	line-height: 2em;
}
#nav {
	position: absolute;
	left: 340px;
	top: 190px;
}
#nav ul, #nav li, #nav a:link, #nav a:visited {
	color:#FFFFFF;
	display:inline;
	text-decoration: none;
	text-align:left;
	font-size: 14px;
	font-weight:bold;
	padding:0;
	padding-right: 16px;
	margin-left:0;
}
#nav a:hover {
	color:#FFCC00;
}

#content {
	position:absolute; /* this can't be 'absolute' since it prevents collapsing margins (http://www.w3.org/TR/CSS21/box.html#collapsing-margins) */
	left: 340px; /* 340 */
	top: 245px; /* 245 */
	width: 460px;
	line-height: 1.5em;
	background-color:#FAFAF8;
	margin:0;
	padding:20px 20px 100px 20px; /* setting padding fixes the collapsing margin issue */
}
#content p { 
	margin-bottom: 30px;
}
div > p:first-child { /* see #content comment about collapsing margins */
	margin-top:0;
	padding-top:0;
}
.title {
	color:#f26522;
	font-size: 22px;
	font-weight:bold;
	display: block;
}
.smallcaps {
	color:#f26522;
	text-transform:uppercase;
	font-size: 12px;
	font-weight:bold;
}
.hilite {
	color:#f26522;
	font-weight:bold;
}
.box {
	padding: 20px;
	background-color:	#FFFFFF;
	border: 1px solid #CCCCCC;
}
form {
	padding: 20px;
	background-color:	#FFFFFF;
	border: 1px solid #CCCCCC;
}
.caption {
	font-size: 10px;
	color:#999999;
	line-height: 8px; /* this doesn't work when applied as a span */
}

ul.profile { 
/* border: 1px solid black; */
	font-size: 12px;
	_font-size: 11px; /* IE 6.0 and below */
	color:#999999;
	margin: 0 0 0 -2em;
	_margin: auto; /* IE 6.0 and below */
	_display: inline; /* IE 6.0 and below - CATCH: multiline items now don't wrap properly in IE */
}

html>body ul.profile { *margin: 0 0 0 6px; font-size: 11px;} /* IE 7.0-only hack: http://www.evotech.net/blog/2007/04/ie7-only-css-hacks/ */

ul {
	margin: .5em 4em 2.5em -.5em; /* bottom-margin is a manual override set to match the spacing before <p> (not sure why this is necessary) */
}