/*** GENERAL STYLES ***/

body {background: #351200 url(../images/bkg.gif) top center; text-align: center; margin: 0; padding: 0;}
body, th, td, h1, h2, h3, h4, h5, h6, select, input, textarea {font-family: georgia, serif; font-size: 11px; color: #630;}
body, th, td, h1, h2, h3, h4, h5, h6 {line-height: 18px;}
form, h1, h2, h3, h4, h5, h6 {margin: 0; padding: 0;}

img, table, fieldset {border: 0;}
ul, ul li {list-style: none; margin: 0; padding: 0;}
p {margin: 0 0 1.5em 0;}
a {color: #630;}
a:hover {color: #09f;}
p.backlink, p.toplink {margin-bottom: -1em; font-weight: bold; font-size: 10px; text-transform: uppercase;}
p.backlink a, p.toplink a {color: #09f;}
p.toplink {text-align: right;}

.hide {display: none;}
.alert {color: #c00;}
.small {font-size: 11px;}
.blue {color: #09f;}

.floatleft {float: left;}
.floatright {float: right;}
.imgleft {float: left; margin: 0 15px 15px 0;}
.imgright {float: right; margin: 0 0 15px 15px;}
.textcenter {text-align: center;}
.textright {text-align: right;}

.spacer {float: none; clear: both; height: 1px; overflow: hidden;}
.hr {float: none; clear: both; height: 1px; overflow: hidden; background: #ececec; margin: 1.5em 0;}
.clear {float: none; clear: both;}

.half {width: 50%;}
.third {width: 33%;}
.twothird {width: 60%;}
.quarter {width: 25%;}
.threequarter {width: 70%;}

.ir {display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
a .ir {cursor: pointer;}


/*** STRUCTURAL STYLES ***/

#outer {position: relative; width: 960px; margin: 20px auto 0; text-align: left; background: #fff; border: 10px solid #fff;}

#top {height: 100px; margin-bottom: 10px;}
#logo {position: absolute; left: 0; top: 0; width: 100px; height: 100px; text-align: center; line-height: 110px; overflow: hidden; background: #09f; color: #fff; text-decoration: none; font-size: 85px;}
#logo .ir {background: url(../images/logo.gif) no-repeat;}
#printlogo {display: none;}

#nav {position: absolute; right: 0; top: 0; width: 819px; height: 40px; padding: 32px 15px 26px; border: 1px solid #ececec; background: #f4f4f4;}
#nav li {float: left; font-size: 25px; font-weight: bold;}
#nav a {position: relative; display: block; height: 40px; line-height: 40px; color: #09f; text-decoration: none; text-align: center;}
#nav a:hover {color: #630;}
#nav .on a .ir {background-position: 0 -80px;}
#nav a:hover .ir {background-position: 0 -40px;}
#nav li#navcart {position: absolute; right: 0; top: 0; font-size: 15px; width: 95px;}
#nav li#navcart a {height: 30px; line-height: 30px;}
#nav li#navcart a .ir {background-image: url(../images/nav-viewcart.gif);}

#eyebrow h2 {float: left; height: 30px; overflow: hidden; line-height: 100px;}
#eyebrow {height: 30px; line-height: 30px; margin: 0 0 10px 0; background: #630 url(../images/nav.gif) 0 center no-repeat; text-align: right;}
#eyebrow ul {float: right; padding-right: 3px;}
#eyebrow li {float: left; font-size: 13px; font-weight: bold;}
#eyebrow a {display: block; white-space: nowrap; width: 10px; height: 30px; color: #fff; text-decoration: none; padding: 0 7px;}
	html>body #eyebrow a {width: auto;}
#eyebrow a:hover {background: #09f;}
#eyebrow .on a {background: #630; color: #09f;}

#main {margin-bottom: 9px;}
#content {float: right; width: 690px; padding: 60px 50px 50px 0;}
	body.home #content {float: none; width: auto; padding: 0;}
	#content.wide {float: none; width: 860px; padding: 50px;}
#sidebar {float: left; width: 175px; padding: 60px 0 50px 0;}
	body.home #sidebar {display: none;}

#content {font-size: 14px;}
#content h1 {font-size: 30px; font-weight: normal; margin-bottom: 20px;}
#content h2 {font-size: 24px; font-weight: normal; line-height: 26px; margin-bottom: 15px; padding-top: 15px;}
#content h3 {font-size: 17px; font-weight: normal; margin-bottom: 10px; padding-top: 15px;}
#content ul {margin: 2em 0;}
#content ul li {padding-left: 20px; background: url(../images/bullet.gif) 3px 4px no-repeat; margin-bottom: 8px;}

#contactform {float: left;}
#contactform div {clear: both; padding-top: 3px;}
#contactform label {position: relative; float: left; width: 70px; font-weight: bold; font-size: 12px; padding-right: 15px; margin-right: 5px; text-align: right;}
#contactform input, #contactform textarea, #contactform select {font-size: 13px;}
#contactform input, #contactform textarea {border: 1px solid #630; width: 290px;}
#contactform textarea {height: 80px;}
#contactform div.button {padding-left: 90px;}
#contactform div.button {margin-top: 5px;}
#contactform .req {position: absolute; right: 2px; top: 4px; font-size: 20px; color: #09f; font-family: arial, sans-serif;}
#contactform.wide label {width: 120px;}
#contactform.wide div.button {padding-left: 140px;}

#thephoto {float: right; margin: -20px -20px 30px 40px;}

.griditem {float: left; border: 1px solid #ececec; margin: 0 20px 20px 0; width: 150px; height: 150px;}
.griditem img {width: 150px; height: 150px;}

#detailphoto {float: left; width: 325px;}
#detailphoto img {width: 300px; height: 300px; border: 1px solid #ececec;}
#detailinfo {float: right; width: 365px;}
#detailinfo h2 {font-size: 19px; text-transform: lowercase;}

#content ul li.eventli {margin-bottom: 1.8em;}
.eventli form {padding-top: 5px;}

#sidenav {font-size: 17px; line-height: 20px;}
#sidenav a {display: block; width: 155px; padding: 5px 0 5px 20px; text-decoration: none;}
#sidenav a:hover {color: #09f;}
#sidenav .on a {background: url(../images/bullet.gif) 4px 11px no-repeat;}

#homesquares {position: relative; height: 474px; overflow: hidden;}
.homesquare {position: absolute; width: 150px; height: 150px; border: 1px solid #ececec; background: #09f;}
#htx {left: 0; top: 162px; width: 252px; height: 90px; padding: 30px; background: #fff url(../images/bullet.gif) 30px 39px no-repeat; font-size: 14px;}
#content #htx h2 {font-size: 24px; font-weight: normal; line-height: 26px; padding: 0 0 0 18px; margin-bottom: 10px;}
#hs1 {left: 324px; top: 0; width: 472px; height: 472px;}
#hs2 {left: 0; top: 0;}
#hs3 {left: 0; top: 324px;}
#hs4 {left: 162px; top: 0;}
#hs5 {left: 162px; top: 324px;}
#hs6 {left: 808px; top: 0;}
#hs7 {left: 808px; top: 162px;}
#hs8 {left: 808px; top: 324px;}
.homesquare img {width: 150px; height: 150px;}
#hs1 img {width: 472px; height: 472px;}

#mailinglist {height: 30px; line-height: 30px; margin: 0; background: #630 url(../images/mailinglist.gif) 10px center no-repeat; padding-left: 28px; color: #09f;}
#mailinglist a {color: #fff; font-weight: bold; text-decoration: none;}
#mailinglist a:hover {text-decoration: underline;}

#footer {width: 960px; font-weight: bold; color: #fff; text-align: left; margin: 5px auto 20px;}
#footer ul {float: right;}
#footer li {float: left; padding: 0 5px;}
#footer a {color: #fff; text-decoration: none;}
#footer a:hover {text-decoration: underline;}