/* CSS Document */
* {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family:Verdana,Tahoma, Geneva, Arial, Verdana, Helevetica, sans-serif;
	vertical-align: baseline;
	font-size:small;
}
/* remember to define focus styles! */
:focus {
	outline: 0;
}
html
{
height:100%;
}

body {
	line-height: 1;
	color: black;
	/*cccc66    #99cccc   */
	background:#99cccc url(images/background.gif) no-repeat center;
	height:100%;
	width:100%;
	margin:auto;
	background-attachment:fixed;

}

h1
{
width:100%;
text-indent:-99999em;
background:url(images/header.gif) no-repeat center;
height:200px;
z-index:5;
}
ol, ul {
	list-style: none;
}
ol#how-it-works
{
padding-left:200px;
background:url(images/dancer.gif) no-repeat left;
}


/* tables still need 'cellspacing="0"' in the markup */
p
{

line-height:1.5em;
margin:2em;
font-size:105%;
/*
*/

}
p a, li, li a
{
font-size:105%;
}
.toggled
{
width:200px;
}
em
{
font-size:110%;
font-style:normal;
font-weight:bold;
color:#0066FF;
display:block;
margin-top:1em;
}
.block
{
display:block;
padding:2px;
margin:5px;
clear:both;
}
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}


#wrapper
{
width:635px;
margin:auto;
}
#top-decoration
{
clear:both;
position:absolute;
background:url(images/transparent-png.png) repeat;
height:100px;
left:0;
top:225px;
width:100%;
z-index:-1;
}
#header
{
width:100%;
height:200px;
}
#navigation
{

/*
border:1px solid black;
*/

margin:auto;
text-align:center;
margin-top:-65px;
}
#navigation ul#top-navigation
{
/*position:absolute;*/
height:202px;



margin:auto;
text-align:center;
}
#navigation ul#top-navigation li
{
display:inline;

}
#navigation ul#top-navigation li a
{
display:block;
float:left;
text-indent:-9999px;
height:202px;
}


#navigation ul#top-navigation li a.home
{
width:100px;
background-image:url(images/home.gif);
background-repeat:no-repeat;
background-position:bottom;
}

#navigation ul#top-navigation li a.home:hover
{
background-position:top;
}

#navigation ul#top-navigation li a.story-times
{

width:105px;
height:202px;
background-image:url(images/story-times.gif);
background-repeat:no-repeat;
background-position:bottom;
}
#navigation ul#top-navigation li a.story-times:hover
{
background-position:top;
}

#navigation ul#top-navigation li a.libraries
{

width:136px;
height:202px;
background-image:url(images/libraries.gif);
background-repeat:no-repeat;
background-position:bottom;
}
#navigation ul#top-navigation li a.libraries:hover
{
background-position:top;
}

#navigation ul#top-navigation li a.fun-books
{
width:133px;
height:202px;
background-image:url(images/books.gif);
background-repeat:no-repeat;
background-position:bottom;
}

#navigation ul#top-navigation li a.fun-books:hover
{
background-position:top;
}
#navigation ul#top-navigation li a.events
{
width:130px;
height:202px;
background-image:url(images/events.gif);
background-repeat:no-repeat;
background-position:bottom;
}
#navigation ul#top-navigation li a.events:hover
{
background-position:top;
}

a#teen-link
{
position:absolute;
text-indent:-9999em;
width:218px;
height:160px;
background-image:url(images/teen-button.png);
background-repeat:no-repeat;
margin-left:450px;
margin-top:-80px;
background-position:bottom;
}
a#teen-link:hover
{
background-position:0 -16px;
}
#utilities
{
width:100%;
}
#utilities li
{
display:inline;
}
#utilities li a
{
display:block;
float:left;
text-indent:-9999px;
height:30px;
margin:1em;
}
#utilities li a#how-it-works
{

background:url(images/how-it-works.gif) no-repeat bottom;
width:84px;
height:20px;
}
#utilities a#how-it-works:hover
{
background-position:top;
}

#utilities li a#sign-up-now
{
background:url(images/sign-up.gif) no-repeat bottom;
width:84px;
height:20px;
}
#utilities a#sign-up-now:hover
{
background-position:top;
}


#utilities li a#get-reading-log
{
background:url(images/reading-log.gif) no-repeat bottom;
width:130px;
height:20px;
}
#utilities li a#get-reading-log:hover
{
background-position:top;
}
/*

a#sign-me-up
{
	width:146px;
	height:143px;
	position:absolute;
	background-image:url(images/sign-me-up.gif);
	background-repeat:no-repeat;
	margin-left:-33px;
	margin-top:-200px;
	text-indent:-9999px;
	display:block;
	z-index:3;
}
a#reading-log
{
	width:139px;
	height:78px;
	position:absolute;
	background-image:url(images/reading-log.gif);
	background-repeat:no-repeat;
	margin-left:120px;
	margin-top:-136px;
	text-indent:-9999px;
	display:block;
	z-index:3;
}
*/
#content
{
/*
width:100%;
padding:3em;
background-color:
#FFFFFF;clear:both;
*/
margin-top:2em;
padding:2em;
width:100%;
background-color:#fff;
clear:both;
float:left;
}


#jump-menu
{
border:1px solid #0099FF;
border-style:inset;
}
#menu2, #menu3
{
width:150px;
}

#content p
{
line-height:1.5em;
}
/*
#content h3
{
margin-top:1em;
color:#0099CC;
text-transform:uppercase;
font-weight:bold;
}
#content h4
{
margin-top:1em;
color:#006699;
font-size:125%;
text-transform:uppercase;
font-weight:bold;
}
*/
.reading-suggestions
{
line-height:1.5em;
text-indent:.5em;
margin:1.5em;
}

#libraries, #thanks
{
float:left;
clear:both;
width:100%;
margin-top:3em;
padding:2em;
background-color:#FFFFFF;

}
h4.lib-click
{
clear:both;
display:block;
font-weight:bold;
color:#0066FF;
text-decoration:underline;
}
h4.lib-click-single
{
clear:both;
display:block;
font-weight:bold;
color:#0066FF;
text-decoration:underline;
margin:1em;
}
h4.lib-click-single:hover, h4.lib-click:hover
{
color:#FF9900;
}


h4
{
color:#0066FF;
font-size:105%;
font-weight:bold;
}

#libraries h2
{
margin-top:1em;
clear:both;
display:block;
font-weight:bold;
}
.libraries-list
{
margin:1em;

}
.libraries-list li
{
display:inline;
}
.libraries-list li a
{
margin:.5em;
display:block;
float:left;
width:30%;
color:#993300;
}
.libraries-list li a:hover
{
color:#FF3300;
}

img#spl 
{
margin-left:30px;
border:none;
float:left;
}
img#scl
{
margin-left:80px;
border:none;
}
h2, h3
{
margin:1em;
clear:both;
font-size:150%;
color:#993300;
font-family:Arial Narrow, Tahoma, Verdana, Helvetica, sans-serif;
font-weight:bold;
}
/*
h3
{
margin-top:1em;
margin-bottom:1em;
clear:both;
font-size:150%;
color:#993300;
font-family:Arial Narrow, Tahoma, Verdana, Helvetica, sans-serif;
font-weight:normal;
}
*/
h3.highlight
{
color:#0066FF;
text-decoration:underline;
font-weight:bold;
}
h3.highlight:hover
{
color:#FF9900;
}
.msg
{
color:#0099FF;
font-weight:normal;
display:block;
position:absolute;
margin:0;
margin-top:-1em;
}
h2#welcome
{
/*
text-indent:-9999em;
background:url(images/welcome.gif) no-repeat;
height:30px;
width:100%;
margin:1em;
clear:both;
*/
}


.float-left-libraries
{
width:30%;
float:left;
display:block;
}
/*
h3
{
clear:both;
display:block;
color:#0066CC;
font-weight:normal;
font-size:150%;

}
*/
.float-left
{
display:block;
float:left;
padding:3px;
border:none;
}
.drop-box
{
margin:1.5em;
}
.rp
{
color:#50A6B8;
text-align:right;
font-size:11px;
padding-right:32px;
padding-bottom:10px;
margin-top:10px;
}
.rp a
{
color:#3366CC;
}
.rp a:hover
{
color:#FF6600;
}
hr
{
width:500px;
border:thin dashed #009999;
margin:auto;
display:none;
}

.text-navigation
{
margin-left:35px;
font-size:10px;
color:#006600;
line-height:2em;
}
.text-navigation a, a
{
color:#0000CC;
text-align:left;
}
.text-navigation a:hover, a:hover
{
color:#FF3300;
}
input
{
float:right;
border:1px solid #0099FF;
border-style:inset;
}
select
{

}
hr
{
border:none;

display:block;
width:320px;
margin:auto;
margin-top:1em;
margin-bottom:1em;
}



/*
form#signup
{

padding:2em;

}

input
{
border:1px inset #0033CC;
display:block;
margin:2em;
}
*/
td
{

}
ol#program-participation
{
margin-top:1.5em;
line-height:1.5em;
}
li.one
{

width:70%;
height:102px;
background-image:url(images/ol-1.gif);
background-repeat:no-repeat;
padding-left:105px;
padding-top:1em;
}
li.two
{
vertical-align:middle;
width:70%;
height:102px;
background-image:url(images/ol-two.gif);
background-repeat:no-repeat;
padding-left:105px;
padding-top:1em;
}
li.three
{

width:70%;
height:102px;
background-image:url(images/ol-three.gif);
background-repeat:no-repeat;
padding-left:105px;
padding-top:1em;
}

p.description
{
line-height:2em;
margin:1em;

}
table.events-table 
{
width:90%;
margin:1em;
}
.events-table td
{

/*background-color:#009900;*/
padding:.5em;
width:30%;
}
.events-table td.wide
{
width:60%;
}
.single-event
{

}
.events-table
{

/*background-color: #00CC00;*/


}
th
{
font-size:125%;
color:#0066FF;
}

div.summer-events
{


padding:3px;
margin:1em;
}
/*
.active
{
color:#FF0000;

}
.menu-active
{
background-color:#003300;
color:#FFF;
}
.dropdown-menu
{
float:left;
display:inline;
}
#i-want-box
{
width:190px;
height:250px;
background-image:url(images/i-want--box.gif);
background-repeat:no-repeat;
z-index:5;
border:1px solid #FFF;
}

ul#side-navigation li
{
margin-top:55px;
width:180px;

}
ul#side-navigation li span
{
margin:5px;
text-indent:3px;
background-color:#006600;
width:170px;
display:block;
padding:3px;
border:1px solid #FFCC00;
color:#FFFF00;
}
ul#side-navigation ul
{
display:block;
height:140px;
margin-top:0px;
margin-left:3px;
background-color:#FFFF99;
width:175px;
display:block;
padding:3px;
}
ul#side-navigation ul li
{
margin:auto;
display:block;
padding:3px;
width:95%;
border-bottom:1px dotted #FFCC00;
}
ul#side-navigation ul li:hover
{
display:block;
background-color:#FFCC00;
color:#00CC00;
}
ul#side-navigation ul li a
{
color:#3366CC;
text-decoration:none;
}
ul#side-navigation ul li a:hover
{
color:#FF6600;
text-decoration:none;
}


*/


.stripe
{
background-color:#efefef;
}
.whactive
{
background-color:#FFF;
color:black;
}

/*
#t-y-top
{
width:190px;
height:51px;
background-image:url(images/thanks-top.gif);
background-repeat:no-repeat;
background-position:-2px 0px;
}
#t-y-middle
{
width:190px;
background-image:url(images/thanks-middle.gif);
background-repeat:repeat-y;
background-position:-2px 0px;
}
#t-y-middle img
{
margin-left:10px;
}
#t-y-bottom
{
width:190px;
height:21px;
background-position:-2px 0px;
background-image:url(images/thanks-bottom.gif);
background-repeat:no-repeat;
}


*/
form#signup
{
background:url(images/stilt-decoration.png) no-repeat bottom right;
}
#signup span
{
float:left;
text-align:right;
width:200px;
}
#signup div
{
display:block;
clear:both;
margin:1em;
padding:1em;
width:70%;
}
#signup input, #signup select, select
{

text-align:left;
margin:auto;
border:1px solid #0099FF;
border-style:inset;
}

input#btnSubmit, input#reset
{
text-align:center;
float:left;
width:100px;
margin:.5em;
padding:.5em;
border-style:outset;
color:#0000CC;
background-color:#FFCC33;
}

#stilt
{
background:url(images/stilt-decoration.png) no-repeat;
width:106px;
height:200px;
position:fixed;
bottom:0;
right:0;

}