/* ---
Jacqueline Woodson Style Sheet
version:   2.5 May 2011 (v2.0 April 2007)
author:    Lydia Mann
email:     lkmweb@nyc.rr.com

Thanks to all good web-standards advocates, designers and developers who have helped along the way.
--- */


html { height: 100%; margin-bottom: 30px; }
body { min-width: 900px; margin: 0 0 30px; padding: 0; font: 76%/200% Geneva, Verdana, sans-serif; color: #000; behavior:url(csshover.htc); } /* text-align: center; */
body#home { background-color: #846244; }  /* tan */
body#ya { background-color: #8fa529; }  /* bright yellow/green */
body#mg { background-color: #c75e4b; }  /* salmony orange */
body#pb { background-color: #fc3; } /* goldenrod */
body#bio { background-color: #636; }  /* eggplant */
body#writingSpots { background-color: #b5a987; }  /* eggplant */
body#specproj { background-color: #78a9c5; }  /* light blue */
body#researchguide { background-color: #d17373; }  /* pink */
body#faq { background-color: #d17373; }  /* pink */
body#awards { background-color: #6c2724; } /* plum */
body#contact { background-color: #3166be; }  /* deep blue */
body#schedule { background-color: #798764; }  /* dune grass green */
body#readers { background-color: #57436f; }  /* purple */
body#teachers { background-color: #934437; }  /* brick */
body#parents { background-color: #365; } /* green */

p, ul { font-size: 100%; margin: 0 1em 1em; }
h1, h2, h3, h4, h5, h6 { font-weight: bold; font-family: Georgia, serif; margin: 0; padding: 0; color: #215033; }
h1 { font-size: 180%; margin: 1em 0 .5em; }
h2 { font-size: 150%; margin: 1em 0 .5em; }
h3 { font-size: 120%; margin-top: 1em; clear: both; }
h4 { font: bold 120% Geneva, Verdana, sans-serif; text-transform: uppercase; margin-top: .75em; }
h5 { font: bold 90% Geneva, Verdana, sans-serif; text-transform: uppercase; margin-top: .3em; }
h6 { font-size: 100%; }
a:link, a:visited { color: #333; text-decoration: underline; }
a:hover { color: #969; }

img, img a { border: none; margin: 0; padding: 0; }
dl { margin: 0; line-height: 1.3em; }
dt { font-size: .9em; font-weight: bold; text-transform: uppercase; margin: .25em 0 0; padding: 0; }
dd { font-size: 1em; font-weight: normal; text-transform: none; margin-left: 1em; }
.fl { float: left; margin: 5px 10px 0 0; }
.fr { float: right; margin: 5px 0 0 10px; }

blockquote { border: 1px dotted #c6c6b6; border-width: 2px 3px; margin: 1em; padding: 1em; }
blockquote p, blockquote ul { font: 1.5em Courier, "Courier New", "Andale Mono", monospace; margin-top: 0;  margin-bottom: .2em; }

#clothesline { position: absolute; width: 960px; top: 15px; left: 90px; padding: 0; } /* overflow: hidden; text-align: center; min-width: 920px; float: left; */
#clotheslineL, #clotheslineR { position: absolute; top: 15px; width: 70px; min-width: 70px; margin: 0 0 0 10px; padding: 0; }
#clotheslineL { left: 0; }
#clotheslineR { left: 1000px; }

#clothesline ul { text-align: center; margin: 0 auto; padding: 0; list-style-type: none; }
#clotheslineL ul, #clotheslineR ul { width: 100%; float: left; margin: 0 auto; padding: 0; list-style-type: none; }

#clothesline li { float: left; display: inline; width: 62px; padding: 0 10px;  margin: 0 4px; }
#clotheslineL li, #clotheslineR li { width: 100%; padding: 0 0 30px 0; margin: 0 auto; } /* background: transparent url(graphics/line215033.gif) 50% 0 repeat-y; */

#clothesline li a, #clotheslineL li a, #clotheslineR li a { display: block; width: 60px; padding: 0; margin: 0; border: 1px solid #215033; }

#mainwrap { position: relative; top: 120px; width: 900px; margin: 10px 90px 0; padding: 0; text-align: left; background: #fff url(graphics/mainbg2.jpg) 0 0 repeat-y; }
#wrap2 { position: relative; background: url(graphics/maus06.gif) 4% 93% no-repeat; }
#header { margin: 0; padding: 0; width: 100%; height: 120px; background: #030 url(graphics/hd1bg.jpg) 0 0 no-repeat; }
#header img { border: none; }
#header span { display: none; }
#header a { display: block; background: url(graphics/hd1type.gif) 0 0 no-repeat; text-decoration: none; width: 900px; height: 120px; }

#sidebar { position: absolute; top: 120px; left: 0; margin-right: 695px;  }
#content { margin: 80px 40px 20px 245px; padding: 0 0 2em; }

div.pulloutR { float: right; display: inline; width: 25%; padding: 6px; margin: 10px 0 10px 20px; border: 1px dotted #d8caa2; }
div.pulloutL { float: left; display: inline; width: 250px; padding: 2px; margin: 5px 20px 0 0; border: 1px dotted #d8caa2; }
#content div.book div.pulloutL img { border-width: 0; margin: 0; }
div.pulloutR p, div.pulloutL p { color: #333; font-size: 92%; line-height: 1.5em; margin: .25em 0 .5em; }
.bgColor { background-color: #d8caa2; }

#nav, #secnav { font-size: .9em; line-height: 1.2em; padding: 0; }
#nav { width: 203px; margin: 0 2px; border-bottom: 1px solid #ddc; }
#secnav { float: right; width: 200px; margin: 0 -40px 10px 20px; background-color: #f4f4d6; text-transform: lowercase; border: 1px solid #ddc; border-right: none; }
*html #secnav { margin-right: -20px; }
#nav ul, #secnav ul { margin: 0; padding: 0; width: 100%; }
#nav li, #secnav li { float: left; display: inline; margin: 0; padding: 0; width: 100%; list-style-type: none; }
#nav li, #secnav li { border-top: 1px solid #c6c6b6; }
#nav ul li a { text-transform: uppercase; margin: 0; padding: .5em 1em; text-decoration: none; color: #215033; background-color: #f4f4d6; display: block; }
#nav ul li ul li a { text-transform: none; padding-left: 2em; }
#secnav ul li a { color: #215033; margin: 0; padding: .5em 1em; text-decoration: none; display: block; }
/* highlight current page in nav */
#ya #nav .ya a,
#mg #nav .mg a,
#pb #nav .pb a,
#bio #nav .bio a,
#researchguide #nav .researchguide a,
#specproj #nav .specproj a,
#writingSpots #nav .bio a,
#faq #nav .faq a,
#awards #nav .awards a,
#contact #nav .contact a,
#schedule #nav .schedule a,
#mainwrap a.urhere { background-color: #eae2ba; }
#nav a:hover, #secnav a:hover { background-color: #d8caa2; }

.side { width: 45%; float: right; margin: 0 0 5px 10px; padding: 3px 2px 5px 5px; border: 1px solid #ddc; }
.note { font-size: 95%; }

#butnav { position: absolute; top: 135px; left: 350px; margin: 0; border: none; }
#butnav ul { margin: 0 auto; padding: 0; text-align: center; font-size: 1.5em; line-height: 1.75em; }
#butnav li { float: left; display: inline; margin: 0 10px; padding: 0; list-style-type: none; width: 112px; height: 40px; }
#butnav a { color: #fff; display: block; width: 112px; height: 40px; background-position: 0 0; background-repeat: no-repeat; text-decoration: none; }
#butnav #purple a { background-image: url(graphics/b-purple.gif); }
#butnav #brick a { background-image: url(graphics/b-brick.gif); }
#butnav #green a { background-image: url(graphics/b-green.gif); }
#butnav a:hover { color: #eee; background-position: 0 -50px; }

/* added 1/09 for Bella's bark */
#bark { position: relative; float: left; width: 200px; height: 224px; margin: 0; padding: 0; background: url(graphics/bella-9wks.png) 0 0 no-repeat; z-index:10; }

#content div.book, #content #cal .month { background: url(graphics/jwSwash4.gif) 0 0 no-repeat; padding: 4px 0 15px;  margin: 1em 0; }
#content div.book h4, #content #cal h4 { border-top: 1px solid #d8caa2; padding-top: 1.5em; color: #215033; }
#content div.book h5 { color: #215033; }
#content div.book img, #content div.book img a { float: right; margin: 20px 0 10px 20px; padding: 0; border: 1px solid #d8caa2; }
p.top { float: right; width: 12px; height: 12px;  }
p.top a { display: block; width: 12px; height: 12px; background: url(graphics/top.gif) 0 0 no-repeat; font-size: 1px; color: #fff; margin: 0; padding: 0; overflow: hidden; }
p.top a:hover { background-position: 0 -14px; }

div#popup { background: #d8caa2; text-align: center; display: block; width: 100% }
div#popup img { margin: 0 auto; }

#footer { font-size: .8em; margin: 0; padding: 3px 10px; color: #eee; background-color: #382635; clear: both; }
#footer a:link, #footer a:visited { color: #fff; text-decoration: underline; text-transform: uppercase; }
#footer a:hover { text-decoration: none; }

/* button hover */
#newbook, #newbook2 { width: 210px; height: 103px; z-index: 2; background: url(graphics/b-feathers.jpg) no-repeat; text-indent: -9000px; font-size: 90%; margin: 0 0 0 8px; padding: 0; }/* removed 1/10/09 - float: right; */
#newbook a, #newbook2 a { display: block; width: 210px; height: 103px; background: url(graphics/b-feathers.jpg) no-repeat; margin: 0; }
#newbook a:hover { background: url(graphics/b-feathers2.jpg) no-repeat; }
#newbook2, #newbook2 a { background-image: url(graphics/b-tupac.jpg); }
#newbook2 a:hover { background-image: url(graphics/b-tupac2.jpg); }

#images h2 a:hover, #images h2 a:focus, #images h2 a:active { background-position: 0 -40px; border-color: #fff; }
/* This is to prevent an IE bug that would make the background image stick */
h1 a:hover, #images h2 a { background-color:transparent; }

/* Alsett Clearing Method - from Charles Wyke-Smith's Stylin' With CSS */
.clearfix:after {
	content: "."; /* period is last thing before div closes */
	display: block; /* inline elements don't respond to clear property */
	height: 0; /* ensure period is not visible */
	clear: both; /* make container clear period */
	visibility: hidden; } /* further ensures period is not visibilty */
.clearfix { display: inline-block; } /* fix for IE Mac */