@charset "utf-8";
/* CSS Document - this is the stylesheet all Kids pages will link to for 
SCREEN styles */
@import url(type.css);
@import url(navigation.css);
@import url(layout.css);
@import url(screen.css);
@import url(color.css);

/* any additional styles should be added after @import statements */

/* frog cursors from http://www.christianet.com/freecursor/frog.htm */
body { cursor:url('/kids/graphics/frog_3.cur'); }
a { cursor:url('/kids/graphics/frog_1.cur'); }

#branding { background:transparent url(/kids/graphics/bg_bannerKids.jpg) center right no-repeat; }/* margin-left:163px; width:825px; padding-left:10px; */

/* #navKids { clear:both; padding-top:10px; padding-bottom:4em;  position:relative; float:left; width:163px; background:#87ab80; margin-bottom:80px; }
#navMain { background:#87ab80; padding-top:10px; margin-bottom:80px; } */

#navMain { position:relative; float:left; width:163px; padding-top:5px; padding-bottom:10px; background:#557755; }/* color1: background:#87ab80; margin-bottom:6em;*/

#lnkLibHome { display:block; width:160px; height:42px; margin:1px; background:url(/kids/graphics/bg_sidebarHome.gif) no-repeat; background-position:0 0; text-indent:-99999px; overflow:hidden; font-size:1%; }/* position:absolute;  */
a#lnkLibHome:hover { display:block; background-position:0 -46px; }

ul#kidsIcons {
	/* position:relative; removed 4/7/2009 - no effect but did not fix flicker */
	font-family:Arial,Sans-Serif;
	margin:0;
	padding:1px;
	list-style-type:none;
	/* width:163px; 
	height:200px;  */
}
ul#kidsIcons li { float:left; margin:0; padding:0; }

#kidsIcons li a { float:left; width:78px; height:78px; margin:1px; text-indent:-99999px; overflow:hidden; font-size:1%; display:inline; }
#kidsIcons li a:link, #kidsIcons li a:visited { background-position:0 0; background-repeat:no-repeat; } /* display:block;  */
#kidsIcons li a:hover, #kidsIcons li a:active { background-position:-120px 0; background-repeat:no-repeat;  } /* display:block;  */
#lnkKidZone { background-image:url(/kids/graphics/bg_sidebarKidzone.gif); }
#lnkPrograms { background-image:url(/kids/graphics/bg_sidebarPrograms.gif); }

#lnkLittleKids { background-image:url(/kids/graphics/bg_sidebarLittleKids.gif); }
#lnkBigKids { background-image:url(/kids/graphics/bg_sidebarBigKids.gif); }

#lnkFamilies { background-image:url(/kids/graphics/bg_sidebarFamilies.gif); }
#lnkTeachers { background-image:url(/kids/graphics/bg_sidebarTeachers.gif); }

#lnkBlog { background-image:url(/kids/graphics/bg_sidebarBlog.gif); }
#lnkCard { background-image:url(/kids/graphics/bg_sidebarCard.gif); }

body.kids #lnkKidZone, 
body.programs #lnkPrograms,
body.littleKids #lnkLittleKids,
body.bigKids #lnkBigKids,
body.families #lnkFamilies,
body.teachers #lnkTeachers
{ display:block; background-position:-120px 0 !important; }

h1 { margin-top:0em; font-size:1.4em; }
h1:first-letter { font-size:1.8em; font-weight:bold; } /* enlarge first letter of title */

/* =Navigation for section */
#navSection { border-top:2px dashed #314a9e; margin-top:2em; padding-top:1em; padding-left:120px; }
body.programs #navSection, body.programs ul#sectionLinks { background:url(/kids/graphics/bg_navPrograms.gif) no-repeat 0 1em; min-height:120px; }
body.littleKids #navSection, body.littleKids ul#sectionLinks { background:url(/kids/graphics/bg_navLittleKids.gif) no-repeat 0 1em; min-height:120px; }
body.bigKids #navSection, body.bigKids ul#sectionLinks { background:url(/kids/graphics/bg_navBigKids.gif) no-repeat 0 1em; min-height:120px; }
body.families #navSection, body.families ul#sectionLinks { background:url(/kids/graphics/bg_navFamilies.gif) no-repeat 0 1em; min-height:130px; }
body.teachers #navSection, body.teachers ul#sectionLinks { background:url(/kids/graphics/bg_navTeachers.gif) no-repeat 0 1em; min-height:120px; }
ul#sectionLinks { padding-top:1em; font-size:1.4em; list-style-type:circle; padding-left:160px; }

#navSection h2 { font-size:1.4em; border-bottom:2px solid #cfd8f4; }
#navSection h2 a { text-decoration:none; color:#314a9e; }
#navSection h2 a:hover, #navSection h2 a:active { color:#cc3300; }

p#subSectnNavLink { font-size:.7em; text-align:right; margin:-1em 0 0; }
<!-- <p id="subSectnNavLink"><a href="#navSection">Sub-Section Navigation</a>&nbsp;&dArr;</p> -->

/* =ExtraNav */
ul#extraNav1 { list-style-type:none; padding-left:0; margin:25px 0 0; }
ul#extraNav1 li { list-style-type:none; padding-left:0; margin-left:0; margin-bottom:1.5em; font-size:.8em; text-align:center; }
ul#extraNav1 li.blog { background:url(/kids/graphics/bg_extraNavBlog.gif) center top no-repeat; padding-top:70px; }
ul#extraNav1 li.card { background:url(/kids/graphics/bg_extraNavCard.gif) center top no-repeat; padding-top:60px; }


/* =KidZone homepage layout */
#content.kidsHome { width:795px; padding-top:5px; padding-bottom:5px; }
#kidZone { position:relative; z-index:10; width:760px; height:360px; margin:10px auto; background:transparent url(/kids/graphics/bg_kidZone.jpg) top left no-repeat; }
#kidZone img { border:none; }
#kidZone h1 { position:absolute; top:130px; left:280px; border:none; }
#kidZone h1 span { padding:.1em .3em; text-transform:uppercase; color:#fff; font-size:1em; font-weight:bold; position:absolute; top:60px; left:98px; }

#kidZone ul, #kidZone li { list-style-type:none; margin:0; padding:0; }
#lstLittleKids { position:absolute; top:10px; left:107px; }
#lstLittleKids span { position:absolute; top:80px; left:55px; width:7em; }
#lstBigKids { position:absolute; top:180px; left:65px; /* top:183px; left:95px; */}
#lstBigKids span { position:absolute; top:15px; left:65px; }

#lstFamilies { position:absolute; top:260px; left:300px; }
#lstFamilies span {position:absolute; top:35px; left:72px; }
#lstTeachers { position:absolute; top:270px; left:510px; font-size:.9em; }
#lstTeachers span { position:absolute; top:-1em; left:72px; width:8em; }

#lstPrograms { position:absolute; top:154px; left:640px; }
#lstPrograms span { position:absolute; top:10px; left:-5em; }
#lstBlog { position:absolute; top:26px; left:603px; }
#lstBlog span { position:absolute; top:55px; left:-2.8em; }

#lstCard { position:absolute; top:0px; left:368px; font-size:.9em; }
#lstCard span { position:absolute; top:75px; left:0px; }
#lstCard span.link2 { position:absolute; top:75px; left:0px; margin-top:1.4em; }

#kidZone li a span { padding:.1em .3em; font-weight:bold; text-align:center; text-transform:uppercase; text-decoration:none; }
#kidZone li a:link span, #kidZone li a:visited span { background:transparent; color:#fff; }
#kidZone li a:hover span, #kidZone li a:active span { background:#000; color:#fff; }


/* =List for online stories 
	[Note: In IE 7, can make linke underline disappear from span tag without affecting remaining text; however, in Firefox and IE 8 the link underline persists.]
*/
ul.graphicList1 { list-style-type:none; margin:1em 1em 2em; padding:0; }
ul.graphicList1 li { list-style-type:none; margin:0; padding:0; margin-bottom:1em; }
ul.graphicList1 li img { display:block; margin-bottom:5px; border:none; }
ul.graphicList1 li a { text-decoration:underline; }
ul.graphicList1 li span { text-decoration:none; font-weight:bold; font-size:1.2em; padding-right:.5em; color:#0066FF; }/* when inside a tag, cannot get rid of underline in Firefox and IE8 */

ul.bookLinkList1 { list-style-type:none; margin:1em 1em 2em; padding:0; }
ul.bookLinkList1 li { margin-bottom:.5em; }
ul.bookLinkList1 li a span { text-decoration:none; font-weight:bold; font-size:1em; padding-right:.5em; color:#21326a; }

/* =List for links with colorful lables */
ul.colorfulList1 { list-style-type:square; margin-top:1em; margin-bottom:2em; }
ul.colorfulList1 li { margin-bottom:.5em; }
ul.colorfulList1 li.alt1 span { display:block; color:#b030b0; font-weight:bold; font-size:1.2em; }
ul.colorfulList1 li.alt2 span { display:block; color:#12693d; font-weight:bold;  font-size:1.2em; }
ul.blockBG { background:url(/kids/littleKids/graphics/bgBlocks2.gif) top right no-repeat; }
ul.blockStackBG { background:url(/kids/littleKids/graphics/bgBlockStack.gif) top right no-repeat; }
ul.gameBG2 { background:url(/kids/bigKids/graphics/bgGames2a.gif) top right no-repeat; }

/* =StoryTimes schedule */
table.schedule th { padding:3px 5px; }
table.schedule td { padding:.5em 5px; }
table.schedule td h3 { margin-top:0; font-size:1.4em; }
table.schedule tr.alt2 { background:#edfdc1; }
table.schedule tr.alt1 { background:#f8fee6; }

