/* General settings for page and layout areas */
body {
    margin: 0;
    padding: 0;
	font-family: "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
	background-color: #A62601;
	font-size: small;
}
a:link, a:visited, a:hover, a:active {
	font-weight: bold;
	color: #5F9917;
	text-decoration: none;
}
a:hover, a:active {background-color: #DDE9CF;}
blockquote {
	font-family: "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
	font-style: italic;
}
h1, h2, h3, h4 {font-size: 1em; font-weight: bold;}
h1 {padding-bottom: 10px; border-bottom: 3px solid #5F9917; font-size: 1.4em;}
h2 {font-size: 1.2em; padding-top: 12px;}
h3 {
	padding: 2px 2px 5px 0px;
	margin: 10px 0px 5px;
	border-bottom: 1px solid #5F9917;
	font-size: 1.1em;
}
img {border: none;}
table {margin: 0;padding: 0;border: none;font-size: 82%;}
td {vertical-align: top;}
ol {list-style-type:decimal}
ol ol {list-style-type:lower-alpha}
ol ol ol {list-style-type:lower-roman}
ul {list-style-type: disc}
ul ul {list-style-type:circle}
ul ul ul {list-style-type:square}

/* LAYOUT */
#container {position: absolute; left: 50%; margin-left:-385px; width: 770px;}

/* Specific settings for header area (layer) */
#header {
	z-index: 1;
	position: absolute;
	width: 735px;
	height: 250px;
	top: 10px;
	left: 10px;
	background: #E0EDFD url(../images/header.gif) top left no-repeat;
	color: #FFF;
}
#navigatortop {
	position: absolute;
	top: 4px;
	left: 48px;
	font-size: 14px;
	font-weight: bold;
	width: 687px;
}
#navigatortop a:link, #navigatortop a:visited, 
#navigatortop a:hover, #navigatortop a:active {
	margin-right: 5px;
	padding: 1px 47px;
	text-decoration: none;
	color: #FFF;
}
#navigatortop a:hover, 
#navigatortop a:active {color: #006BB7; background-color: #D1E8FC;}

 /* Specific settings for left navigation area (layer) */
#navigatorside {
	z-index: 4;
	position: absolute;
	width: 182px;
	top: 200px;
	left: 0px;
	overflow: visible;
	font-size: 14px;
	color: #FFF;
	background: #D7DDD1 url(../images/background_programs.jpg) left top no-repeat;
}
.linkarea {margin: 50px 10px 20px; width: 162px; overflow: visible;}
#navigatorside a:link, #navigatorside a:visited {
	display: block;
	width: 162px;
	padding-top: 10px;
	padding-bottom: 10px;
	border-bottom: 3px solid #E83228;
	color: #625600;
	text-decoration: none;
}
#navigatorside a:hover, #navigatorside a:active {
	display: block;
	width: 162px;
	padding-top: 10px;
	padding-bottom: 10px;
	border-bottom: 3px solid #E83228;
	color: #625600;
	text-decoration: none;
	background-color: #EADED5;
}
#navigatorside div.link {overflow: visible; position: relative;}

/* Specific settings for fly-out menus (layers) */
.flyout {
	z-index: 6;
	top: 0;
	left: 172px;
	width: 162px;
	position: absolute;
	visibility: hidden;
	overflow: visible;
	vertical-align: top;
	background-color: #D7DDD1;
}
#flyoutpreschool {top: 50px;}
#flyoutosy {top: 90px;}
#flyoutsummer {top: 130px;}
#flyouthealth {top: 170px;}
#flyoutparent {top: 210px;}
#flyouteligibility {top: 250px;}
#flyoutassess {top: 290px;}
#flyoutfiscal {top: 370px;}
.reset {
	z-index: 3;
	left: -20px;
	top: 0px;
	height: 600px;
	width: 770px;
	position: absolute;
	border: none;
	overflow: hidden;
	visibility: hidden;
}

 /* Specific settings for content area (layer) */
#contentarea {
	z-index: 2;
	position: absolute;
	top: 140px;
	left: 156px;
	width: 614px;
	background: #FFF url(../images/header_content.gif) top left no-repeat;
	border: none;
}
#breadcrumbs, #back, #next {
	position: absolute;
	top: 5px;
	font-size: .95em;
	font-weight: bold;
	color: #FFF;
}
#breadcrumbs {left: 40px;}
#back {right: 80px;}
#next {right: 10px;}
#breadcrumbs a:link, #breadcrumbs a:visited, 
#back a:link, #back a:visited, #next a:link, #next a:visited, 
table.events td.tableheadleft a:link, table.events td.tableheadleft a:visited,
table.events td.tableheadright a:link, 
table.events td.tableheadright a:visited {
	color: #FFF;
	padding: 2px 2px 3px;
	text-decoration: none;
}
#breadcrumbs a:hover, #breadcrumbs a:active, 
#back a:hover, #back a:active, #next a:hover, #next a:active, 
table.events td.tableheadleft a:hover, table.events td.tableheadleft a:active,
table.events td.tableheadright a:hover, table.events td.tableheadright a:active {
	color: #5F9917;
	padding: 2px 2px 3px;
	text-decoration: none;
	background-color: #C6D9AE;
}
#maincolumn {
	width: 332px;
	margin-top: 55px;
	margin-bottom: 20px;
	margin-left: 40px;
}
#maincolumn .date {margin-bottom: 20px; font-size: 10px; font-weight: bold;}
#maincolumn .dateleft {
	width: 39%;
	float: left;
	margin-bottom: 20px;
	font-size: 10px;
	font-weight: bold;
}
#maincolumn .contactright {
	width: 60%;
	float: right;
	margin-bottom: 20px;
	font-size: 10px;
	text-align: right;
}
#introimage {
	position: absolute;
	top: 40px;
	left: 55px;
	width: 305px;
	height: 131px;
}
#sectionimage {
	position: absolute;
	top: 24px;
	left: 392px;
	width: 222px;
	height: 157px;
}
#contentarea a.button:link, #contentarea a.button:visited {
	position: absolute;
	top: 201px;
	width: 143px;
	padding: 103px 1px 1px 1px;
	background-color: #5F9917;
	background-repeat: no-repeat;
	background-position: left top;
	color: #FFF;
}
#contentarea a.button:active, #contentarea a.button:hover {
	position: absolute;
	top: 201px;
	width: 143px;
	padding: 103px 1px 1px;
	background-color: #C6D9AE;
	background-repeat: no-repeat;
	background-position: left top;
	color: #5F9917;
}
#preschool {
	left: 28px;
	background-image: url(../images/button_img_preschool.jpg);
}
#osy {
	left: 175px;
	background-image: url(../images/button_img_osy.jpg);
}
#summer {
	left: 322px;
	background-image: url(../images/button_img_summer.jpg);
}
#health {
	left: 469px;
	background-image: url(../images/button_img_health.jpg);
}

 /* Right column of content area, containing yellow boxes for events, announcements, links or downloads */
#rightcolumn {position: absolute; left: 392px; top: 200px; width: 222px;}
#rightcolumn .container, #rightcolumnhome .container {
	width: 222px;
	background: #F5F4DF url(../images/bigstockphoto_Wildflowers_4.jpg) top left no-repeat;
	margin-bottom: 20px;
}
#rightcolumn .container .announcements {
	background: url(../images/header_announcements.gif) top left no-repeat;
	padding: 50px 10px 10px;
}
#rightcolumn .container .events {
	background: url(../images/header_events.gif) left top no-repeat;
	padding: 50px 10px 10px;
}
#rightcolumn .container .links {
	background: url(../images/header_links.gif) top left no-repeat;
	padding: 50px 10px 20px;
}
#rightcolumn .container .downloads {
	background: url(../images/header_downloads.gif) top left no-repeat;
	padding: 50px 10px 20px;
}
#rightcolumn .container h4 {
	display: block;
	width: 202px;
	padding-top: 10px;
	padding-bottom: 10px;
	background-color: #FBCC25;
}
#rightcolumn .container p, #rightcolumnhome .container p {
	display: block;
	width: 202px;
	padding-top: 10px;
	padding-bottom: 10px;
	margin: 0;
	border-bottom: 3px solid #FBCC25;
	font-weight: bold;
}
#rightcolumn .container a:link, #rightcolumn .container a:visited,
#rightcolumn .container a:hover, #rightcolumn .container a:active {
	display: block;
	width: 202px;
	padding-top: 10px;
	padding-bottom: 10px;
	border-bottom: 3px solid #FBCC25;
	color: #625600;
	text-decoration: none;
}
#rightcolumn .container a:hover, 
#rightcolumn .container a:active {background-color: #F0F1B7;}
#rightcolumn  a.more:link, #rightcolumn a.more:visited, 
#rightcolumn a.more:hover, #rightcolumn a.more:active {
	display: block;
	width: 202px;
	padding-top: 5px;
	padding-bottom: 5px;
	color: #625600;
	text-decoration: none;
	font-size: 80%;
	text-align: right;
	border: 0;
}
#rightcolumn a.more:hover, 
#rightcolumn a.more:active {background-color: #F0F1B7;}

 /* Content tables */
table.narrow {width: 332px;}
table.wide {width: 564px;}
table.mini {width: 564px;}
table.mini td {font-size: 72%;}
.tablehead, .tableheadleft, .tableheadright {
	padding: 1px;
	border-bottom: solid 2px #000;
	font-weight: bold;
	vertical-align: bottom;
	text-align: center;
}
.tableheadleft {text-align: left;}
.tableheadright {text-align: right;}
.tablecontent {text-align: center; padding: 1px 1px 1px 2px; border-bottom: solid 1px #000;}
.tablecontentleft, 
.tablecontentright {padding: 1px; border-bottom: solid 1px #000;}
.tablecontentright {text-align: right;}
.tablefoot {
	text-align: center;
	padding: 1px 1px 1px 2px;
	border-bottom: double 3px #000;
	font-weight: bold;
	border-top: solid 1px #000;
}
.tablefootleft,.tablefootright {
	padding: 1px;
	border-bottom: double 3px #000;
	font-weight: bold;
	border-top: solid 1px #000;
}
.tablefootright {text-align: right;}

 /* Event calendar table */
table.events {width: 564px;}
table.events td {padding: 2px; width: 14%; border-bottom: 1px solid #000;}
table.events td.tablehead, table.events td.tableheadleft, 
table.events td.tableheadright {
	background: #5F9917;
	padding: 1px;
	border-bottom: solid 2px #FFF;
	font-weight: bold;
	color: #FFF;
}
table.events td.tablehead {text-align: center;}
table.events td.tableheadright {text-align: right;}
table.events td.day {
	background: #5F9917;
	margin: 2px;
	padding: 2px;
	font-weight: bold;
	color: #FFF;
	border: none;
}
table.events td.weekend {
	background: #F5F8F1;
	padding: 2px;
	width: 14%;
	border-bottom: 1px solid #000;
}
table.events div {margin: 2px 0; padding: 2px;}
table.events div.datethismonth {
	background: #DDE9CF;
	margin: 2px;
	padding: 2px;
	display: inline;
	font-weight: bold;
	text-align: right;
}
table.events div.dateothermonth {
	margin: 2px;
	padding: 2px;
	display: inline;
	font-weight: bold;
	text-align: right;
	color: #CCC;
}
table.events a {display: block;}
.content-box {margin-top:110px; margin-right:20px; text-align:justify}
.small {font-size: .8em;}

 /* Footer */
#footer {
	width: 332px;
	border-top: 3px solid #5F9917;
	margin-left: 40px;
	padding-top: 15px;
	padding-bottom: 15px;
	font-size: 0.8em;
	font-weight: bold;
	margin-right: 10px;
}