@charset "UTF-8";
/***********************************************
Main CSS Document for Sunnyside Child Day Care

version:	a.031308
author:		Tim Toffoli
email:		tim@slateroofstudio.com
website:	http://www.slateroofstudio.com

***********************************************/

/*** =Structural
----------------------------------------------------------------***/

body {
	font: 100% Verdana, Arial, Helvetica, sans-serif;
	margin: 0 auto; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	color: #444;
	background: #DFDFDF url(/imgs/bg_main.gif) repeat-y center; }
#container {
	width: 775px;  /* this will create a container 80% of the browser width */
	margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
	text-align: left; /* this overrides the text-align: center on the body element. */
	background: #fff url(/imgs/bk_content.gif) repeat-y left }
#header {
	padding: 0;
	height: 124px }

/* Tips for sidebar1:
1. since we are working in percentages, it's best not to use padding on the sidebar. It will be added to the width for standards compliant browsers creating an unknown actual width. 
2. Space between the side of the div and the elements within it can be created by placing a left and right margin on those elements as seen in the "#sidebar p" rule.
3. Since Explorer calculates widths after the parent element is rendered, you may occasionally run into unexplained bugs with percentage-based columns. If you need more predictable results, you may choose to change to pixel sized columns.
*/
#sidebar {
	float: left;
	width: 150px; /* since this element is floated, a width must be given */
	background: #699; /* the background color will be displayed for the length of the content in the column, but no further */
	margin: 12px 0 36px 0; /* top and bottom padding create visual space within this div  */
}

/* Tips for mainContent:
1. the space between the mainContent and sidebar1 is created with the left margin on the mainContent div.  No matter how much content the sidebar1 div contains, the column space will remain. You can remove this left margin if you want the #mainContent div's text to fill the #sidebar space when the content in #sidebar ends.
2. to avoid float drop at a supported minimum 800 x 600 resolution, elements within the mainContent div should be 430px or smaller (this includes images).
3. in the Internet Explorer Conditional Comment below, the zoom property is used to give the mainContent "hasLayout." This avoids several IE-specific bugs.
*/
#mainContent {
	float:left;
	width: 425px;
	margin-right: 12px; /* the right margin can be given in percentages or pixels. It creates the space down the right side of the page. */
	padding: 0 12px 0 32px;
	font: 13px/20px Georgia, "Times New Roman", Times, serif;
	color:#555;
}
#mainContent h1 {font: 25px/25px Georgia, "Times New Roman", Times, serif; color:#555 }
#mainContent h2 { font: bold 15px/15px Tahoma, Helvetica, Arial, sans-serif; color:#C60;padding-bottom:6px }
#mainContent h3 { font: bold 13px/13px Tahoma, Helvetica, Arial, sans-serif }
#mainContent p { margin-top: 3px;margin-bottom: 24px }
#mainContent .wrapper { width: 430px; border-right: 1px dotted #bbb;padding-right: 12px }
#mainContent .smallcaps { font: 20px/36px Tahoma, Helvetica, Arial, sans-serif; color:#999; letter-spacing: 2px; text-transform: uppercase }
/* Drop Caps ----------------------------------------------- */
#mainContent .smcap { font: bold .85em "Times New Roman", Times, Georgia, serif; letter-spacing: 1px; text-transform: uppercase }
#highlight {
	float: right;
	width: 100px;
	margin: 32px 30px 24px 0;
	padding-left: 12px }
#footer {
	padding: 0 10px; /* this padding matches the left alignment of the elements in the divs that appear above it. */
	background:#CC3300 }
#endcap {
	padding: 0 10px 120px 10px; /* this padding matches the left alignment of the elements in the divs that appear above it. */
	background: #ddd url(/imgs/endcap.gif) no-repeat top center;
	height:900px }
.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
	clear:both;
	height:0;
	font-size: 1px;
	line-height: 0 }

/*** =Backgrounds
----------------------------------------------------------------***/

body#home { background: #ddd url(/imgs/bg_main_Grey.gif) repeat-y center }
body#about { background: #ddd url(/imgs/bg_main_Grey.gif) repeat-y center }
body#enroll { background: #ddd url(/imgs/bg_main_Grey.gif) repeat-y center }
body#parents { background: #ddd url(/imgs/bg_main_Grey.gif) repeat-y center }
body#resources { background: #ddd url(/imgs/bg_main_Grey.gif) repeat-y center }
body#policies { background: #ddd url(/imgs/bg_main_Grey.gif) repeat-y center }
body#partners { background: #ddd url(/imgs/bg_main_Grey.gif) repeat-y center }
body#support { background: #ddd url(/imgs/bg_main_Grey.gif) repeat-y center }
body#tour { background: #ddd url(/imgs/bg_main_Grey.gif) repeat-y center }

body#home #header { background: #C90 url(/imgs/navbannerC90.gif) no-repeat left top }
body#about #header { background: #C90 url(/imgs/navbannerC90.gif) no-repeat left top }
body#enroll #header { background: #517CA8 url(/imgs/navbanner517CA8.gif) no-repeat right top  }
body#parents #header { background: #C60 url(/imgs/navbannerC60.gif) no-repeat left top }
body#resources #header { background: #990 url(/imgs/navbanner990.gif) no-repeat left top }
body#policies #header { background: #8484AD url(/imgs/navbanner8484AD.gif) no-repeat left top }
body#partners #header { background: #575757 url(/imgs/navbanner575757.gif) no-repeat left top }
body#support #header { background: #999 url(/imgs/navbanner999.gif) no-repeat left top }
body#tour #header { background: #C90 url(/imgs/navbannerC90.gif) no-repeat left top }

/*** =Highlight Text Color
----------------------------------------------------------------***/

#highlight .about { color:#C90 }
#highlight .enroll { color:#369 }
#highlight .parents { color:#C60 }
#highlight .resources { color:#575757 }
#highlight .policies { color:#8484AD }
#highlight .partners { color:#990 }
#highlight .support { color:#999 }
#highlight .tour { color:#C90 }


/*** =Header :: Top Navigation
----------------------------------------------------------------***/

#header h1 {
	margin: 0; /* zeroing the margin of the last element in the #header div will avoid margin collapse - an unexplainable space between divs. If the div has a border around it, this is not necessary as that also avoids the margin collapse */
	position: relative;
	width: 230px;
	height: 78px;
	z-index: 3;
	top: 10px;
	left: 30px;
	text-indent: -9000px }
#header h1 a {
	display: block;
	height: 78px;
	clear: both }
/* Still trying to make this work! */
#header p {
	margin: -10px 0px 0 0;
	float: right;
	width: 178px;
	font: bold 11px/13px Tahoma, Helvetica, Arial, sans-serif; color:#BBBBD2;text-decoration: none;
	display: none }


#header #nav { float: left; width: 775px; height: auto; padding: 0; margin: 23px 0 0 0; list-style: none; background: #669 }
#header #nav a { float: left; display: block; margin: 0; padding: 0 6px; font: bold 70% Tahoma, Helvetica, Arial, sans-serif; color:#BBBBD2; text-decoration: none; list-style: none }
#header #nav #o-giv { background-color: #666; padding: 7px 8px }
#header #nav #o-hom { position: relative; background: #F60 url(/imgs/btn_home.gif) no-repeat center; width: 32px; height: 28px; color: #F60; padding: 0;text-indent: -9000px }
#header #nav #o-hom a { background: #F60 url(/imgs/btn_home.gif) no-repeat center; display: block; width: 32px; height: 28px; padding: 0; clear: both }
#header #nav #o-hom a:hover { background: #F93 url(/imgs/btn_home.gif) no-repeat center; display: block; width: 32px; height: 28px; padding: 0; clear: both }
#header #nav #o-con,
#header #nav #o-emp,
#header #nav #o-cal { background-color: #669; padding: 7px 4px }
#header #nav #o-con a { padding-right: 12px }
#header #nav #o-blank { font: bold 70% Tahoma, Helvetica, Arial, sans-serif; color:#BBBBD2; background-color: #669; padding: 7px 1px }
#header #nav li { float: right; margin: 0; padding: 0; list-style: none }
#nav a:hover, body.aboutBody, #o-cal a { color: #333; text-decoration: none }
#header #nav a:link,
#header #nav a:visited,
#header #nav a:active {font: bold 11px/13px Tahoma, Helvetica, Arial, sans-serif; color:#BBBBD2;text-decoration: none }
#header #nav a:hover {font: bold 11px/13px Tahoma, Helvetica, Arial, sans-serif; color:#ffffff;text-decoration: none }
#info { float: right; width: 50px; margin: 45px 24px 0 0; font: 15px/15px Georgia, "Times New Roman", Times, serif; color:#ff }
#info a { font: 15px/15px Georgia, "Times New Roman", Times, serif; color:#fff; text-decoration: none }
#info a:link,
#info a:visited,
#info a:active { text-decoration: none }
#info a:hover { text-decoration: underline }

/*** =Home
----------------------------------------------------- (color#C30) ***/

/* Navigation */
#home #sidebar .about,
#home #sidebar .enroll,
#home #sidebar .parents,
#home #sidebar .resources,
#home #sidebar .policies,
#home #sidebar .partners,
#home #sidebar .support {display: none}

/* Layout */
#home #mainContent {
	float:right;
	width: 622px;
	margin-right: 0px; /* the right margin can be given in percentages or pixels. It creates the space down the right side of the page. */
	padding: 0;
	}
#home #mainContent .initialcap {
	font: normal 132px/130px "Times New Roman", Times, Georgia, serif ; color:#999;
	float: left;
	padding: 0;
	margin: -10px 0 -14px 0 }
#home #mainContent .pushtext {
	float: right;
	width: 345px;
	padding-bottom: 12px }
#home #mainContent .hm_bwimg {
	margin: 0px -36px -12px 2px }
#home #mainContent h1 {
	font: normal 38px/39px Georgia, "Times New Roman", Times, serif ; color:#777;
	letter-spacing:-1pt;
	margin: 6px 0 12px 0;
	padding-top: 6px }
#home #mainContent #chalk {
	width: 186px;
	height: 113px;
	padding-top: 14px }
#home #header h1 { background: #C90 url(/imgs/logoC90.gif) no-repeat }
#home #header h1 a { background: #C90 url(/imgs/logoC90.gif) no-repeat }
#home #container { background: #fff url(/imgs/bk_content.gif) repeat-y left }


/*** =About Us
----------------------------------------------------- (color#C90) ***/

/* Navigation */
#about.home #sidebar .about,
#about.mission #sidebar .about,
#about.credit #sidebar .about,
#about.facility #sidebar .about,
#about.age #sidebar .about,
#about.contacts #sidebar .about  {display: block}

#about.home #sidebar li a.aboutA,
#about.mission #sidebar li a.aboutA,
#about.mission #sidebar ul li ul li a.aboutB,
#about.credit #sidebar li a.aboutA,
#about.credit #sidebar ul li ul li a.aboutC,
#about.facility #sidebar li a.aboutA,
#about.facility #sidebar ul li ul li a.aboutD,
#about.age #sidebar li a.aboutA,
#about.age #sidebar ul li ul li a.aboutE,
#about.contacts #sidebar li a.aboutA,
#about.contacts #sidebar ul li ul li a.aboutF {color: #fff}

#about #sidebar .about,
#about #sidebar .enroll,
#about #sidebar .parents,
#about #sidebar .resources,
#about #sidebar .policies,
#about #sidebar .partners,
#about #sidebar .support {display: none}

#about #header h1 {background: #C90 url(/imgs/logoC90.gif) no-repeat }
#about #header h1 a {background: #C90 url(/imgs/logoC90.gif) no-repeat }
#about #mainContent h2,
#about #mainContent h3
 { color:#C90 }
#about #highlight h2 {
	font: bold 13px/16px Tahoma, Helvetica, Arial, sans-serif; color:#C90; border-bottom: 1px solid #bbb;padding: 3px 0 6px 0 }

#about #mainContent .about li { font-size: 95%; line-height: 18px; list-style-type: square;list-style-position: outside; padding-bottom: 6px }
#about #mainContent a:active,
#about #mainContent a:visited,
#about #mainContent a:link { color:#C90; text-decoration: none }
#about #mainContent a:hover { color:#C90; text-decoration: underline }

#about #highlight p { padding-top: 3px; font: bold .7em/1.75em Tahoma, Helvetica, Arial, sans-serif; color:#C90 }
#about #highlight img { padding-top: 8px }
#about.contacts #highlight a:link,
#about.contacts #highlight a:visited,
#about.contacts #highlight a:active {
	color:#C90;text-decoration: none }
#about.contacts #highlight a:hover {
	color:#C90;text-decoration: underline }
#about.contacts #highlight h3.parents {
	font: bold 11px/13px Tahoma, Helvetica, Arial, sans-serif; color:#C90 }


/* =How To Apply 
----------------------------------------------------- (color#517CA8) ***/

/* Navigation */
#enroll.home #sidebar .enroll,
#enroll.tuition #sidebar .enroll,
#enroll.enrollment #sidebar .enroll,
#enroll.health #sidebar .enroll {display: block}

#enroll.home #sidebar li a.enrollA,
#enroll.tuition #sidebar li a.enrollA,
#enroll.tuition #sidebar ul li ul li a.enrollB,
#enroll.enrollment #sidebar li a.enrollA,
#enroll.enrollment #sidebar ul li ul li a.enrollC,
#enroll.health #sidebar li a.enrollA,
#enroll.health #sidebar ul li ul li a.enrollD {color: #fff}

#enroll #sidebar .about,
#enroll #sidebar .parents,
#enroll #sidebar .resources,
#enroll #sidebar .policies,
#enroll #sidebar .partners,
#enroll #sidebar .support {display: none}

#enroll #mainContent h3 { color:#517CA8 }
#enroll #mainContent a:link,
#enroll #mainContent a:visited,
#enroll #mainContent a:active  { color:#517CA8; text-decoration: none }
#enroll #mainContent a:hover   { color:#517CA8; text-decoration: underline }

#enroll #header h1 { background: url(/imgs/logo517CA8.gif) no-repeat }
#enroll #header h1 a { background: url(/imgs/logo517CA8.gif) no-repeat }
	
#enroll #highlight p { padding-top: 3px; font: bold .7em/1.75em Tahoma, Helvetica, Arial, sans-serif; color:#517CA8 }
#enroll #highlight img { padding-top: 8px }
body.tuition #mainContent { float:left;
	width: 500px;
	margin-right: 0; /* the right margin can be given in percentages or pixels. It creates the space down the right side of the page. */
	padding: 15px 36px 0 34px;
	font: 15px/21px Georgia, "Times New Roman", Times, serif; color:#555;
	}
body.tuition #mainContent .wrapper {border-right: none; }
body.tuition #mainContent .wrapper p {width: 500px; }
	
/*** =For Parents
----------------------------------------------------- (color#C30) ***/

/* Navigation */
#parents.home #sidebar .parents,
#parents.contacts #sidebar .parents,
#parents.jobsfaq #sidebar .parents,
#parents.jobdescription #sidebar .parents,
#parents.cleaning #sidebar .parents,
#parents.reading #sidebar .parents,
#parents.forms #sidebar .parents,
#parents.links #sidebar .parents {display: block}

#parents.home #sidebar li a.parentsA,
#parents.contacts #sidebar li a.parentsA,
#parents.contacts #sidebar ul li ul li a.parentsB,
#parents.jobsfaq #sidebar li a.parentsA,
#parents.jobsfaq #sidebar li a.parentsC,
#parents.jobsfaq #sidebar ul li ul li a.parentsD,
#parents.jobdescription #sidebar li a.parentsA,
#parents.jobdescription #sidebar li a.parentsC,
#parents.jobdescription #sidebar ul li ul li a.parentsE,
#parents.cleaning #sidebar li a.parentsA,
#parents.cleaning #sidebar li a.parentsC,
#parents.cleaning #sidebar ul li ul li a.parentsF,
#parents.reading #sidebar li a.parentsA,
#parents.reading #sidebar ul li ul li a.parentsG,
#parents.forms #sidebar li a.parentsA,
#parents.forms #sidebar ul li ul li a.parentsH,
#parents.links #sidebar li a.parentsA,
#parents.links #sidebar ul li ul li a.parentsI {color: #fff}

#parents #sidebar .about,
#parents #sidebar .enroll,
#parents #sidebar .resources,
#parents #sidebar .policies,
#parents #sidebar .partners,
#parents #sidebar .support {display: none}

#parents #mainContent h3 { color:#C60 }
#parents #mainContent a:link,
#parents #mainContent a:visited,
#parents #mainContent a:active  { color:#C60; text-decoration: none }
#parents #mainContent a:hover   { color:#C60; text-decoration: underline }

#parents #header h1 { background: url(/imgs/logoC30.gif) no-repeat }
#parents #header h1 a { background: url(/imgs/logoC30.gif) no-repeat }

body.contacts #mainContent {
	float:left;
	width: 360px;
	margin-right: 12px; /* the right margin can be given in percentages or pixels. It creates the space down the right side of the page. */
	padding: 24px 0 0 25px;
	font: 15px/21px Georgia, "Times New Roman", Times, serif; color:#555;
}
body.contacts #mainContent .wrapper {border-right: none; }
body.contacts #highlight {
	font: 12px/18px Georgia, "Times New Roman", Times, serif; color:#555;
	float: right;
	width: 160px;
	padding-right: 20px; }
#parents #mainContent .wrapper ul li {
	margin: 0; /* the right margin can be given in percentages or pixels. It creates the space down the right side of the page. */
	padding: 0;
	font: 13px/20px Georgia, "Times New Roman", Times, serif; color: #C60;
	list-style:outside; list-style-type:none; list-style:none;
}
#parents #mainContent .wrapper ul li a {
	color: #C60;
	list-style:outside; list-style-type:none; list-style:none;
}

#mainContent h3.parents {
	font: bold 12px/12px Tahoma, Helvetica, Arial, sans-serif; color:#C30 }
#parents #mainContent h2 {
	font: bold 13px/15px Tahoma, Helvetica, Arial, sans-serif;
	color:#C60;
	border-bottom: none;
	margin-bottom: 0 }
	
#parents #highlight p {
	padding-top: 3px; }
#parents #highlight img {
	padding-top: 8px }
#parents #highlight h2 {
	font: bold 13px/16px Tahoma, Helvetica, Arial, sans-serif; color:#C60; border-bottom: 1px solid #bbb;padding: 3px 0 6px 0 }
#parents #highlight a {
	font: 12px/18px Georgia, "Times New Roman", Times, serif; color:#555;text-decoration: none }
#parents.contacts #highlight a:link,
#parents.contacts #highlight a:visited,
#parents.contacts #highlight a:active {
	color:#555;text-decoration: none }
#parents.contacts #highlight a:hover {
	color:#555;text-decoration: underline }
#parents.contacts #highlight h3.parents {
	font: bold 11px/13px Tahoma, Helvetica, Arial, sans-serif; color:#DB944C }
#parents #highlight p {
	padding-top: 3px;
	font: bold .7em/1.75em Tahoma, Helvetica, Arial, sans-serif; color:#C60 }
#parents #highlight img {
	padding-top: 8px }
#parents .breadcrumb {
	width: 400px;
	color: #699;}

#parents .breadcrumb a:link,
#parents .breadcrumb a:visited,
#parents .breadcrumb a:active {
	color: #C60;
	text-decoration: underline }
#parents .breadcrumb a:hover {
	color: #C60;
	text-decoration: underline }
body.reading #parents #mainContent { float:left;
	width: 525px;
	margin-left: 0;
	padding: 15px 0 42px;
	font: 15px/21px Georgia, "Times New Roman", Times, serif; color:#555;
	}
body.reading #mainContent .wrapper {border-right: none; }

#booklist {
	font: 10px/12px Verdana, Arial, Helvetica, sans-serif;
	color: #333333;
	width: 500px;
	margin-left: 0px;
}
#mainContent .intro {
	font: 15px/21px Georgia, "Times New Roman", Times, serif;
	color: #555;
}
#mainContent #booklist table {
	font: 10px/12px Verdana, Arial, Helvetica, sans-serif;
	color: #333333;
	margin-left: 0px;
	}

#mainContent #booklist table h5 {
	font: bold 12px/12px Verdana, Arial, Helvetica, sans-serif;
	color: #660;
	margin-bottom: 0px;
	margin-top:6px;
}
.sm {
	font-size: 9px;
	font-style: italic;
	text-align: right;
}

.rev {
	font: 10px/12px Verdana, Arial, Helvetica, sans-serif;
	background-color:#333333;
	color: #fff;
	}
.rule {
	border-bottom: 1px solid #999999;
	height: 6px;
	margin-bottom: 6px;
}

/*** =Resources & Forms
----------------------------------------------------- (color#C30) ***/

/* Navigation */
#resources.home #sidebar .resources,
#resources.contacts #sidebar .resources,
#resources.jobsfaq #sidebar .resources,
#resources.jobdescription #sidebar .resources,
#resources.cleaning #sidebar .resources,
#resources.reading #sidebar .resources,
#resources.forms #sidebar .resources,
#resources.links #sidebar .resources {display: block}

#resources.home #sidebar li a.resourcesA,
#resources.home #sidebar ul li ul li a.resourcesH,
#resources.contacts #sidebar li a.resourcesA,
#resources.contacts #sidebar ul li ul li a.resourcesB,
#resources.jobsfaq #sidebar li a.resourcesA,
#resources.jobsfaq #sidebar li a.resourcesC,
#resources.jobsfaq #sidebar ul li ul li a.resourcesD,
#resources.jobdescription #sidebar li a.resourcesA,
#resources.jobdescription #sidebar li a.resourcesC,
#resources.jobdescription #sidebar ul li ul li a.resourcesE,
#resources.cleaning #sidebar li a.resourcesA,
#resources.cleaning #sidebar li a.resourcesC,
#resources.cleaning #sidebar ul li ul li a.resourcesF,
#resources.reading #sidebar li a.resourcesA,
#resources.reading #sidebar ul li ul li a.resourcesG,
#resources.forms #sidebar li a.resourcesA,
#resources.forms #sidebar ul li ul li a.resourcesH,
#resources.links #sidebar li a.resourcesA,
#resources.links #sidebar ul li ul li a.resourcesI {color: #fff}

#resources #sidebar .about,
#resources #sidebar .enroll,
#resources #sidebar .parents,
#resources #sidebar .policies,
#resources #sidebar .partners,
#resources #sidebar .support {display: none}

#resources #mainContent h3 { color:#990 }
#resources #mainContent a:link,
#resources #mainContent a:visited,
#resources #mainContent a:active  { color:#990; text-decoration: none }
#resources #mainContent a:hover   { color:#990; text-decoration: underline }

#resources #header h1 { background: url(/imgs/logo990.gif) no-repeat }
#resources #header h1 a { background: url(/imgs/logo990.gif) no-repeat }

#resources #mainContent .wrapper ul li {
	margin: 0; /* the right margin can be given in percentages or pixels. It creates the space down the right side of the page. */
	padding: 0;
	font: 13px/20px Georgia, "Times New Roman", Times, serif; color: #990;
	list-style:outside; list-style-type:none; list-style:none;
}
#resources #mainContent .wrapper ul li a {
	color: #990
	list-style:outside; list-style-type:none; list-style:none;
}

#mainContent h3.resources {
	font: bold 12px/12px Tahoma, Helvetica, Arial, sans-serif; color:#990 }
#resources #mainContent h2 {
	font: bold 13px/15px Tahoma, Helvetica, Arial, sans-serif;
	color:#990;
	border-bottom: none;
	margin-bottom: 0 }
	
#resources #highlight p {
	padding-top: 3px; }
#resources #highlight img {
	padding-top: 8px }
#resources #highlight h2 {
	font: bold 13px/16px Tahoma, Helvetica, Arial, sans-serif; color:#990; border-bottom: 1px solid #bbb;padding: 3px 0 6px 0 }
#resources #highlight a {
	font: 12px/18px Georgia, "Times New Roman", Times, serif; color:#555;text-decoration: none }
#resources.contacts #highlight a:link,
#resources.contacts #highlight a:visited,
#resources.contacts #highlight a:active {
	color:#555;text-decoration: none }
#resources.contacts #highlight a:hover {
	color:#555;text-decoration: underline }
#resources.contacts #highlight h3.resources {
	font: bold 11px/13px Tahoma, Helvetica, Arial, sans-serif; color:#990 }
#resources #highlight p {
	padding-top: 3px;
	font: bold .7em/1.75em Tahoma, Helvetica, Arial, sans-serif; color:#990 }
#resources #highlight img {
	padding-top: 8px }
#resources .breadcrumb {
	width: 400px;
	color: #990;}

#resources .breadcrumb a:link,
#resources .breadcrumb a:visited,
#resources .breadcrumb a:active {
	color: #990;
	text-decoration: underline }
#resources .breadcrumb a:hover {
	color: #990;
	text-decoration: underline }




/*** =For Children
----------------------------------------------------- (color#575757) ***/

/* Navigation */
#children.home #sidebar .children,
#children.books #sidebar .children,
#children.media #sidebar .children,
#children.artistscorner #sidebar .children,
#children.whatkidssay #sidebar .children {display: block}

#children.home #sidebar li a.childrenA,
#children.books #sidebar li a.childrenA,
#children.books #sidebar ul li ul li a.childrenB,
#children.media #sidebar li a.childrenA,
#children.media #sidebar ul li ul li a.childrenC,
#children.artistscorner #sidebar li a.childrenA,
#children.artistscorner #sidebar ul li ul li a.childrenD,
#children.whatkidssay #sidebar li a.childrenA,
#children.whatkidssay #sidebar ul li ul li a.childrenE {color: #fff}

#children #sidebar .about,
#children #sidebar .enroll,
#children #sidebar .parents,
#children #sidebar .policies,
#children #sidebar .partners,
#children #sidebar .support {display: none}

#children #header h1 { background: url(/imgs/logo575757.gif) no-repeat }
#children #header h1 a { background: url(/imgs/logo575757.gif) no-repeat }

#children #highlight p { padding-top: 3px; font: bold .7em/1.75em Tahoma, Helvetica, Arial, sans-serif; color:#575757 }
#children #highlight img { padding-top: 8px }

#children #mainContent h3 { color:#575757 }
#children #mainContent a:link,
#children #mainContent a:visited,
#children #mainContent a:active  { color:#575757; text-decoration: none }
#children #mainContent a:hover   { color:#575757; text-decoration: underline }



/*** =Our Policies
----------------------------------------------------- (color#8484AD) ***/

/* Navigation */
#policies.home #sidebar .policies,
#policies.books #sidebar .policies,
#policies.media #sidebar .policies,
#policies.artistscorner #sidebar .policies,
#policies.whatkidssay #sidebar .policies {display: block}

#policies.home #sidebar li a.policiesA,
#policies.books #sidebar li a.policiesA,
#policies.books #sidebar ul li ul li a.policiesB,
#policies.media #sidebar li a.policiesA,
#policies.media #sidebar ul li ul li a.policiesC,
#policies.artistscorner #sidebar li a.policiesA,
#policies.artistscorner #sidebar ul li ul li a.policiesD,
#policies.whatkidssay #sidebar li a.policiesA,
#policies.whatkidssay #sidebar ul li ul li a.policiesF {color: #fff}

#policies #sidebar .about,
#policies #sidebar .enroll,
#policies #sidebar .parents,
#policies #sidebar .resources,
#policies #sidebar .partners,
#policies #sidebar .support {display: none}

#policies #header h1 { background: url(/imgs/logo8484AD.gif) no-repeat }
#policies #header h1 a { background: url(/imgs/logo8484AD.gif) no-repeat }

#policies #mainContent h3 { color:#8484AD }
#policies #mainContent a:link,
#policies #mainContent a:visited,
#policies #mainContent a:active  { color:#8484AD; text-decoration: none }
#policies #mainContent a:hover   { color:#8484AD; text-decoration: underline }

#policies #header h1 { background: url(/imgs/logo8484AD.gif) no-repeat }
#policies #header h1 a { background: url(/imgs/logo8484AD.gif) no-repeat }
	
#policies #highlight p {
	padding-top: 3px;
	font: bold .7em/1.75em Tahoma, Helvetica, Arial, sans-serif; color:#8484AD }
#policies #highlight img {
	padding-top: 8px }


/*** =Our Partners
----------------------------------------------------- (color#990) ***/

/* Navigation */
#partners.home #sidebar .partners {display: block}

#partners.home #sidebar li a.partnersA,
#partners.books #sidebar li a.partnersA,
#partners.books #sidebar ul li ul li a.partnersB,
#partners.media #sidebar li a.partnersA,
#partners.media #sidebar ul li ul li a.partnersC {color: #fff}

#partners #sidebar .about,
#partners #sidebar .enroll,
#partners #sidebar .parents,
#partners #sidebar .resources,
#partners #sidebar .policies,
#partners #sidebar .support {display: none}

#partners #header h1 { background: url(/imgs/logo575757.gif) no-repeat }
#partners #header h1 a { background: url(/imgs/logo575757.gif) no-repeat }

#partners #mainContent h3 { color:#575757 }
#partners #mainContent a:link,
#partners #mainContent a:visited,
#partners #mainContent a:active  { color:#575757; text-decoration: none }
#partners #mainContent a:hover   { color:#575757; text-decoration: underline }

#partners #header h1 { background: url(/imgs/logo575757.gif) no-repeat }
#partners #header h1 a { background: url(/imgs/logo575757.gif) no-repeat }
	
#partners #highlight p {
	padding-top: 3px;
	font: bold .7em/1.75em Tahoma, Helvetica, Arial, sans-serif; color:#575757 }
#partners #highlight img {
	padding-top: 8px }


/*** =Supporting Sunnyside
----------------------------------------------------- (color#999) ***/

/* Navigation */
#support.home #sidebar .support {display: block}

#support.home #sidebar li a.supportA,
#support.appeal #sidebar li a.supportA,
#support.appeal #sidebar ul li ul li a.supportB,
#support.waystogive #sidebar li a.supportA,
#support.waystogive #sidebar ul li ul li a.supportC,
#support.wishlist #sidebar li a.supportA,
#support.wishlist #sidebar ul li ul li a.supportD {color: #fff}

#support #sidebar .about,
#support #sidebar .enroll,
#support #sidebar .parents,
#support #sidebar .resources,
#support #sidebar .policies,
#support #sidebar .partners {display: none}

#support #header h1 { background: url(/imgs/logo999.gif) no-repeat }
#support #header h1 a { background: url(/imgs/logo999.gif) no-repeat }

#support #mainContent h3 { color:#999 }
#support #mainContent a:link,
#support #mainContent a:visited,
#support #mainContent a:active { color:#999; text-decoration: none }
#support #mainContent a:hover { color:#999; text-decoration: underline }

#support #header h1 { background: url(/imgs/logo999.gif) no-repeat }
#support #header h1 a { background: url(/imgs/logo999.gif) no-repeat }
	
#support #highlight p {
	padding-top: 3px;
	font: bold .7em/1.75em Tahoma, Helvetica, Arial, sans-serif; color:#999 }
#support #highlight img {
	padding-top: 8px }
#support ul.promo { list-style:none;margin-left: 0;padding-left: 0 }
#support ul.promo li { list-style:none; margin-left: 0;padding: 6px 0; border-top: 1px solid #ccc; font-size: 12px;  }

/*** =Sunnyside Tour
----------------------------------------------------- (color#999) ***/

/* Navigation */
.tour #sidebar li a.stourA {color: #fff}

#tour #sidebar .about,
#tour #sidebar .enroll,
#tour #sidebar .parents,
#tour #sidebar .resources,
#tour #sidebar .policies,
#tour #sidebar .partners,
#tour #sidebar .support
 {display: none}

#tour #header h1 { background: url(/imgs/logoC30.gif) no-repeat }
#tour #header h1 a { background: url(/imgs/logoC30.gif) no-repeat }

#footer p {
	font: bold 10px/12px Tahoma, Verdana, Arial, Helvetica, sans-serif;
	letter-spacing: 1px;
	color:#EAAD98;
	text-align:center;
	margin: 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
	padding: 10px 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
}
/* Miscellaneous classes for reuse */
.fltrt { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
	float: right;
	margin-left: 8px }
.fltlft { /* this class can be used to float an element left in your page */
	float: left;
	margin-right: 8px }



#sidebar h3, #sidebar p {
	margin: 18px 3px 0 22px; /* the left and right margin should be given to every element that will be placed in the side columns */
}

[if IE]>
/* place css fixes for all versions of IE in this conditional comment */
#sidebar { padding-top: 10px }
#mainContent { zoom: 1; padding-top: 15px }
/* the above proprietary zoom property gives IE the hasLayout it needs to avoid several bugs */
[endif]

a:link,
a:visited,
a:active { color:#699; text-decoration: none }
a:hover { color:#699; text-decoration: underline }

/* Left navigation; top level with dotted lines */
#sidebar a  { color: #699 }
#sidebar ul li {
	font: bold 11px/13px Tahoma, Helvetica, Arial, sans-serif;color: #CAD8D8;
	margin: 3px 2px 3px -2px;
	list-style-image: url(/imgs/li_ding.gif);list-style-type: none } 
/* the left and right margin should be given to every element that will be placed in the side columns */

#sidebar .sidenav { margin-top: 18px;margin-left: -3px }
#sidebar li a:link,
#sidebar li a:visited,
#sidebar li a:active { color: #CAD8D8;text-decoration: none }
#sidebar li a:hover { color: #ffffff;text-decoration: none }
#sidebar ul li ul { margin-top: 12px }

/*    lower levels; anything deeper inherits correct settings */
#sidebar ul li ul li { font: bold 10px/13px Tahoma, Helvetica, Arial, sans-serif;color: #CAD8D8; padding: 5px 0 8px 0; margin: 0 0 0 -40px;list-style-image: none; list-style-type: none; border-top: 1px solid #9ABBBB;width:102px }
#sidebar ul li ul li ul li { font: bold 9px/1em Tahoma, Helvetica, Arial, sans-serif;color: #CAD8D8; padding: 5px 0 5px 0; margin: 0 0 0 -40px;list-style-image: none;list-style-type: none;width:110px; border: none }

#sidebar li ul li ul { margin-top: 6px }
#sidebar ul li { border: none }
#sidebar ul li ul li a:link,
#sidebar ul li ul li a:visited,
#sidebar ul li ul li a:active { color: #CAD8D8;text-decoration: none }
#sidebar ul li ul li a:hover { color: #fff;text-decoration: none }
#sidebar p {font: 10px/17px Tahoma, Helvetica, Arial, sans-serif;color: #CAD8D8;display: block;padding:1px;background: url(/imgs/nayec_logo.gif) no-repeat center; text-indent: -9000px}
#sidebar p a:link,
#sidebar p a:visited,
#sidebar p a:active {text-decoration: none }
#sidebar p a:hover {text-decoration: underline }
#sidebar h4 {position:relative;left:28px;margin: 0;width:103px; height:53px;background: #699 url(/imgs/nayec_logo.gif) no-repeat; text-indent: -9000px; z-index: 23 }
#sidebar h4 a {padding-left: 36px;height:53px;display: block;background: #699 url(/imgs/nayec_logo.gif) no-repeat; clear: both}

/*** =Miscellaneous
----------------------------------------------------------------***/

/* Images ----------------------------------------------- */
#mainContent .imgLft { float:left;padding-left: 24px }
#mainContent .imgRt { float:right;padding: 6px; border: 1px dotted #888; margin: 0 12px 0 24px }
img {border: 0 }



/* Breadcrumbs ----------------------------------------------- */


.breadcrumb {
	width: 400px;
	font: normal 9px/10px Geneva, Verdana, Arial, Helvetica, sans-serif;
	color: #699;
	text-align: left;
	z-index: 50 }

.breadcrumb a:link,
.breadcrumb a:visited,
.breadcrumb a:active {
	font: normal 9px/10px Geneva, Verdana, Arial, Helvetica, sans-serif;
	color: #699;
	text-decoration: underline }
.breadcrumb a:hover {
	font: normal 9px/10px Geneva, Verdana, Arial, Helvetica, sans-serif;
	color: #AAC4C4;
	text-decoration: underline }
#header li#date { float: left; margin: 8px 0 0 14px; font: bold 10px/1em Tahoma, Helvetica, Arial, sans-serif; color:#9D9DBD }
* html #header li#date { margin: 4px 0 0 14px }
