/*
Name: Steve Swinburne.com
Author: Jon Packman
Author URI: http://satellite7.com
*/
/* Global reset */
*, html, body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, label, legend, fieldset, input, p, blockquote, th, td { margin:0; padding:0 }
fieldset, img { border:0 }
ol, ul, li { list-style:none }
h1, h2, h3, h4, h5, h6 { font-size:100%; font-weight:normal }
strong { font-weight: bold }
em { font-style: italic }
a img { border:none } /* Gets rid of IE's blue borders */
* a { position:relative; outline:none; text-decoration: none;}
html {}
body { background: #fff; width: 100%; height: 100%; font: 100% georgia, serif}
div { position:relative }
br.clearMe{ clear:both; display:block; height:1px; margin:-1px 0 0 0 }
.alignright {float: right !important}
.alignleft {float: left !important}
.noMargin {margin: 0 !important}
.littleMargin {margin: 0 0 5px !important}

/*TYPOGRAPHY */
p {font-size: 13px;  line-height: 1.5; }
h1	{font-size: 35px; letter-spacing: -2px}
h2 	{font-size: 30px; }
h3 	{font-size: 22px; }
h4 	{font-size: 20px;}
h5	{font-size: 18px; }

a:hover {color: #000}

/* LAYOUT */
#wrapper, #footer {width: 960px; margin: 7px auto 0 auto; color: #5f5f5f}
#header{height: 220px; width: 100%; }
.section {float: right; width: 516px; }
.article {padding: 0 25px 25px 25px; border: 1px solid #ccc; border-top: 0; margin-bottom: 40px; }
body.books .article, body.no-img .article, body.teachers .article, body.links .article {border: 1px solid #ccc; padding: 25px}
body.contact .article  {border: 1px solid #ccc;}
#footer{clear: both; margin: 40px auto 0 auto; padding: 15px 0; border-top: 1px solid #ccc}

/*HEADER */
h1 a{width: 548px; position: absolute; top: 27px; left: 38px; font-size: 14px; color: #ccc; height: 94px }
h1 a span{width: 548px; position: absolute; top: 0px; left: 0px; background: url("images/ss-lizard.jpg") no-repeat 0 0; height: 94px }
body#about h1 a span{background: url("images/ss-wolf.jpg") no-repeat 0 0;  }
body.books h1 a span{background: url("images/ss-books.jpg") no-repeat 0 0;  }
body.school-visits h1 a span{background: url("images/ss-visits.jpg") no-repeat 0 0;  }
body.links h1 a span{background: url("images/ss-zebras.jpg") no-repeat 0 0;  }
body.contact h1 a span{background: url("images/ss-roo.jpg") no-repeat 0 0;  }
p#strap {font-size: 35px; letter-spacing: -1px; left: 45px; position: absolute; bottom: 23px; color: #6c6c6c; z-index: 9999}

/* NAVIGATION */
#connect {position: absolute; right: 0; top: 27px; height: 92px; width: 380px; border: 1px solid #868686; border-width: 1px 0}
#connect li{float: left; margin: -7px 5px 0 0; width: 56px; height: 56px; border: 1px solid #bcbcbc; font-size: 9px; position: relative; }
#connect li a {position: relative; display: block; color: #49839d; }
#connect li:hover {border: 1px solid #868686;}
#connect li a:hover {color: #ffffce; background: #fff; }
#connect li img {display: block; position: absolute; top: 0; left: 0; width: 40px; height: 40px;background: #FFFFE8; padding: 8px }
#connect li a:hover img {background: #ffffcd; opacity:0.7 }
#connect li.twitter img{width: 54px; height: 31px; padding: 13px 1px 12px 1px}
#connect li.contact-connect{font-size: 17px; position: absolute; right: 0; top: -1px; height: 51px; padding: 0 ; width: 233px;  border: none; float: none; margin: 0 }
#connect li.contact-connect a{width: 283px; position: absolute; right: 0; top: 62px; }
#connect li.contact-connect span{position: absolute; right: 0; top: -62px; background: url("images/steves-hat.jpg") no-repeat right 0; height: 151px; width: 107px;  border: 4px solid #a9a9a9; }
#connect li.contact-connect a:hover {color: #326277; background: none }
#connect li.contact-connect a:hover span{border: 4px solid #bcbcbc; }

.nav  {position: absolute; left: 0; top: 120px; width: 185px; background: url("images/nav-corner.png") no-repeat 0 0; padding-top: 99px; }
.nav li{border-left: 1px solid #868686; border-bottom: 1px solid #bcbcbc; background: #FFFFE8; padding-left: 35px;  }
.nav li a {padding: 15px 0 2px 5px;  background: #fff; font-size: 17px; color: #6f8188; display: block; border-left: 1px solid #9d9d9d; }
.nav li:hover{background: #d4e6ee url("images/nav-hov.pn") no-repeat 0 0;border-bottom: 1px solid #9d9d9d; }
.nav li a:hover {color: #65777e}
body#home .nav li.home, body#about .nav li.about, body.books .nav li.books, body.school-visits .nav li.visits, body.teachers .nav li.visits, body.links .nav li.links  {background: #d4e6ee url("images/nav-hov2.pn") no-repeat 0 0;}


#promo {float: right; clear: both;width: 218px; margin-bottom: 20px}
#promo li a {border: 1px solid #a5a5a5; background: #FFFFE8; display: block; width: 179px; float: right; clear: both; margin: 0 0 20px}
#promo li a:hover {background: #d4e6ee;}
#promo li a img{border: 1px solid #a5a5a5; margin: 15px}


/* MAIN CONTENT */
.section > img {text-align: center; padding: 20px; background: #ffffcd; border: 1px solid #a5a5a5; max-width: 474px; margin: 0 auto;}
.section img + .article h2 {padding: 20px 0 0px}
.section h2, .section h3, .section h4 {margin: 0 0 15px; color: #6d6c6c; }
.section h3, .section h4 { clear: left; color: #849293}
body.contact .section h3 { clear: none; font-size: 18px}
.section h3 {margin: 0 0 5px; }
body.books .section h3 {border-bottom: 1px solid #d8d8d8}
.article p + h2, .article p + h3, .article ul + h2, .article ul + h3, .article dt, .article p + h4, .article h3 + h4 {margin: 15px 0 5px}
.article p + img, .article img + img {margin-top: 10px}
img.alignleft {margin: 0 18px 15px 0; }
img.alignright {margin: 0 0 15px 18px; }
.article p {margin-bottom: 10px}
.article a{background: #FFFFE8; color: #6f8188; padding: 1px 3px 2px 3px; text-shadow: #fff 0px 1px 1px; font-size: 16px; border: 1px solid #bcbcbc;}
.article a:hover{background: #d4e6ee;}
.article a.styless {border: 0; font-size: 100%; padding: 0; text-shadow: 0; background: 0; text-decoration: underline;}
.article a.styless:hover { text-decoration: none;background: 0; }
.article a.mmbigger, body.books .article a[target="_blank"], body.teachers .article a[target="_blank"] {font-size: 20px; line-height: 1.8; padding: 4px 6px; }
.article h3 a, .article h4 a  {font-size: 100% }
.article ol, .article ul, .article dl {margin: 0 0 10px 0}
.article h3 + ul {margin: 8px 0 15px}
.article ol li, .article ul li, .article dl dd{margin: 0 0 10px 0; font-size: 13px}
.article ul li, .article ol li {margin: 0 0 7px 0; line-height: 1.7}
.article ul li a, .article ol li a{padding: 4px 6px;}
.article ul li.bio-link {float: right; width: 140px}
.article ul li.bio-link a {display: block; text-align: center; padding: 5px}
.article .columns {-moz-column-count:2; -moz-column-gap:15px; }
.article .columned li {width: 230px; }
.article ul li ul li {margin: 0; line-height: normal}
.article ul li ul li a{display: inline-block; margin: 0 0 5px 0; }
.article .columns dt {margin: 0 0 5px; color: #849293; font-size: 20px;}
.article dd + dt {padding: 10px 0 0}
.article dd { line-height: 1.35; }
.article td {width: 150px; text-align: center; vertical-align: top; border: 1px solid #a5a5a5; background: #FFFFE8;  margin: 0 6px 4px 0;}
.article td:hover{background: #d4e6ee;}
.article td img { width: 130px;  border:  1px solid #849293; margin: 6px auto 0 auto}
.article td a { border: 0; color: #385e6f; text-shadow: none;font-size: 12px !important; line-height: normal !important; background: 0; padding: 0}
.article td a + a{ font-size: 12px; display: block; padding: 3px 3px 6px 3px;}
.article blockquote  {margin: 0 0 20px; padding: 15px 15px 0 15px; border: 1px solid #ccc; background: #fff}
.article ul + blockquote, .article p + blockquote  {margin: 20px 0 20px; }
.article blockquote p {margin: 0 0 10px; font-size: 12px }
.article blockquote p cite {font-size: 12px; display: block; }
.article ol li{list-style: decimal outside; font-size: 15px; margin-left: 20px}
.article q {display: block; margin: 0 0 5px; font-size: 14px;  line-height: 1.4; }
.article blockquote q {font-size: 13px;}
.article a[href$='.jpg'], .article a[href$='.gif'], .article a[href$='.png']  {display: inline-block}
.article hr {color: #ccc; background: #ccc; height: 1px; margin: 5px auto}
.article img {border: 1px solid #999; max-width: 464px}
.article a span.desc {font-size: 11px}

/* ASIDES */


/* FOOTER */
#footer p {font-size: 12px; color: #8c8c8c}
#footer p a{color: #8c8c8c; text-decoration: underline}
#footer p a:hover{color: #767676; text-decoration: none}
#footer p span{float: right}