/* --------------------------------------------------------------------- */
/* template - styles used by the header and footer
/* 
/* Structural and visual styles are defined here.
/* --------------------------------------------------------------------- */


	

/* --------------------------------------------------------------------- */
/* body
/* --------------------------------------------------------------------- */

html {
	font: normal normal normal 90%/1.7em georgia,times,serif;
	color: #333;
}

body {
	margin: 0;
	padding: 0;
	border: none;
	background: #e4fafc url(/sup/images/template/site3.jpg) repeat-x fixed;
}



/* --------------------------------------------------------------------- */
/* Structure (frame)
/* --------------------------------------------------------------------- */

.frame {
	clear: both;
	background-color: #fff;
	margin: 0 auto;
	border-left: 1px solid #999;
	border-right: 1px solid #999;
	width: 65em;
}
#header {
	background: #fff url(/sup/images/template/header_watercolor.jpg) repeat-x 0 0;
	border-bottom: 1px solid #4e1c0b;
}
#torso {
	padding-bottom: 2em;
	background: #fff7dd url(/sup/images/template/torso2.jpg) repeat-x;
}
#footer {
	background-color: #ffeecc;
	border-top: 5px solid #ffff66;
	border-bottom: 1px solid #999;
	font-family: arial, helvetica, sans-serif;
}



/* --------------------------------------------------------------------- */
/* Logo
/* --------------------------------------------------------------------- */

#logo {
	width: 33em;
	float: left;
}
#logo img {
	margin-left: .75em;
}



/* --------------------------------------------------------------------- */
/* Secondary nav (text nav in header)
/* --------------------------------------------------------------------- */

ul#secondary_nav {
	list-style: none;
	margin: 0;
	padding: 2em 0 0 .75em;
	float: left;
	font-family: arial, sans-serif;
	font-size: 1.1em;
}
ul#secondary_nav li {
	list-style: none;
	float: left;
	margin: 0;
	padding: 0;
}
	ul#secondary_nav li.first { border: none; }
	
	#secondary_nav a {
		display: block;
		padding: 0 .5em;
		margin-right: 1em;
		border: 1px solid transparent;
		color: #000;
		text-decoration: none;
	}
	#secondary_nav a:hover {
		color: #000;
		text-decoration: none;
		border: 1px solid #b71121;
	}

#header p.tagline {
	float: left;
	margin: 0;
	padding: 0 0 1em 0;
}


/* --------------------------------------------------------------------- */
/* Main nav bar
/* --------------------------------------------------------------------- */

#main_nav {
	clear: both;
	width: 100%;
	background: #ffffff url(/sup/images/template/main_nav.gif) repeat-x;
	overflow: hidden;
}
#main_nav ul {
	border-top: 1px solid #4e1c0b;
	list-style: none;
	margin: 0;
	padding: 0;
}
#main_nav li {
	display: block;
	margin: 0;
	padding: 0;
	float: left;
	line-height: 32px;
}
#main_nav li a {
	display: block;
	padding: 0 .75em 0 .75em;
	font-size: 105%;
	letter-spacing: .01em;
	border-right: 1px solid #fff;
}
/* total - 65em */
#main_nav li.about             { width: 8em; }
#main_nav li.early_childhood   { width: 11em; }
#main_nav li.elementary_school { width: 11em; }
#main_nav li.admissions        { width: 8em; }
#main_nav li.waldorf_education { width: 11em; }
#main_nav li.news              { width: 8em; }
#main_nav li.calendar          { width: 8em; }

#main_nav a {
	color: #000;
	text-decoration: none;
	border-bottom: 3px solid #e6bb3c;
}
#main_nav a:hover, 
#main_nav a.active {
	color: #4e1c0b;
	text-decoration: none;
	background: #ffffff url(/sup/images/template/main_nav_over.gif) repeat-x;
	border-bottom: 3px solid #4e1c0b;
}
#main_nav li.calendar a {
	border-right: none;
}



/* --------------------------------------------------------------------- */
/* Subnav (in column)
/* --------------------------------------------------------------------- */
		
#nav_column {
	float: right;
	width: 19em;
	padding: 2em 0;
}
#section_nav {
	font-family: arial, sans-serif;
	border-left: 1px solid #fc3;
	padding: 2em;
}
#section_nav ul {
	margin: 0;
	padding: 0;
	list-style: none;
}
#section_nav ul li {
	margin: 0;
	padding: 0;
	list-style: none;
	border-bottom: 1px solid #fff7dd; /* IE 6 bug, without this border, there's a huge margin between items */
}
#section_nav ul li a {
	color: #960;
	font-weight: bold;
	text-decoration: none;
	padding: .2em;
	margin-bottom: .2em;
	display: block;
}
#section_nav ul li a:hover {
	background-color: #fc3;
	text-decoration: none;
	color: #000;
}
#section_nav ul li.active a, 
#section_nav ul li.active a:hover {
	background-color: #ffcc33;
	background-color: #fff799;
}
	


/* --------------------------------------------------------------------- */
/* content holders
/* --------------------------------------------------------------------- */

/* most content */
#content {
}
	
/* homepage - full width, no padding */
.content_home {
}

/* full width, with padding */
.content_full {
	/*padding: 2em 1em 0 1em;*/
	padding: 2em 2em 1em 2em;
}

/* leave room for column with right margins */
.content {
	/*padding: 2em 1em 0 1em;*/
	padding: 2em 2em 1em 2em;
}
.content p, 
.content ol, 
.content ul, 
.content .section {
	margin-right: 21em;
}
/* places where we don't want that big margin */
.content blockquote p, 
.content blockquote ol, 
.content blockquote ul,  
.content .section p, 
.content .section ul, 
.content .section ol, 
#nav_column p, 
#nav_column ul, 
#nav_column ol {
	margin-right: 0;
}



/* --------------------------------------------------------------------- */
/* footer
/* --------------------------------------------------------------------- */

#footer h4 {
	font-family: georgia,times,serif;
	font-weight: 100;
	padding: 0;
	margin: .5em 0;
	font-size: 2em;
	color: #960
}
#footer .audience_links {
	width: 18em;
	float: left;
	border-left: 1px solid #FFCC33;
	padding: 0 2em;
}
	#footer #audience-enrolled.audience_links { border-left: none; }

#footer .audience_links ul {
	margin: 0;
	padding: 0;
	list-style: none;
}
#footer .audience_links ul a {
	font-size: .9em;
	margin-left: -2px;
	padding-left: 2px;
	display: block;
}
#footer .audience_links ul a:hover {
	background-color: #ffcc33;
	text-decoration: none;
	color: #000;
}
#footer #audience-donate {
	width: 17em;
}
#footer #audience-donate p {
	font-size: .9em;
	line-height: 1.4;
}


#footer .legal {
	clear: both;
	padding: 2em .75em;
	font-size: .9em;
}
#footer .credits {
	font-size: .95em;
	color: #999;
}
#footer .credits a {
	color: #999;
}
