html, body { margin: 0; padding: 0; }

.clear { height: 1px; overflow: hidden; clear: both; }
body { text-align: center; font-family: arial, sans-serif; font-size: 12px; color: #707070; }
a { color: #0066CC; }


body { background-color: white; background-image: url('images/background.jpg'); background-repeat: repeat-x; }

#container { width: 790px; margin: 0 auto; text-align: left; }

#header { width: 790px; height: 200px; position: relative; z-index: 2; background: url('images/header.gif'); }
#header a.home { position: absolute; top: 20px; left: 0; }
#header a.home img { border: 0; }
#header h2.slogan { position: absolute; top: 50px; left: 390px; font-family: times, serif; font-weight: normal; color: #fff; font-style: italic; font-size: 26px; }

#nav, #nav li { margin: 0; padding: 0; list-style: none; }
#nav { position: absolute; top: 150px; left: 10px; width: 760px; }
#nav li { float: left; position: relative; border-left: 1px solid #457CAF; border-right: 1px solid #002B56; padding: 0 12px; }
#nav li a { color: white; font-size: 13px; text-decoration: none; letter-spacing: -1px; }
#nav li.first { border-left: none; }
#nav li.last { border-right: none; }

#nav ul{ display: none; margin: 0; padding: 0; width: 150px; position: absolute; top: 1em; left: 0; z-index: 20; background: #004081; }
#nav li:hover ul{ display: block; }
#nav ul li{ float: none; border: none; padding: 0; display: block; }
#nav ul li a{ display: block; padding: 5px 10px; border-top: 1px solid #457CAF; }
#nav ul li a:hover{ color: #FFC80B; }

#footer { position: relative; background: url('images/footer.gif') repeat-x; width: 790px; height: 80px; }
#footer { color: #888; }
#footer .paidfor { position: absolute; top: 10px; left: 20px; border: 1px solid #000; padding: 5px; }
#footer .ftnav { position: absolute; right: 20px; top: 15px; font-size: 11px; }
#footer .ftnav a { color: #000; }
#footer .spark { position: absolute; display: block; width: 790px; text-align: center; top: 45px; font-size: 10px; color: #999; }
#footer .spark a { color: #888; }
#footer .spark a:hover { color: #777; }

/*////////////// Home Page ///////////////////////*/
#home-content{ position: relative; background: white; width: 790px; height: 815px; z-index: 0; }

#mainphoto { position: absolute; left: 19px; }

div.tallbox { position: absolute; z-index: 201; top: 309px; width: 250px; height: 300px; background: url('images/tallbox.gif'); }
div.tallbox h3 { position: absolute; top: 10px; left: 16px; font-size: 14px; color: #3D3D3D; margin: 0; padding: 0; }
div.tallbox ul, div.tallbox ul li { margin: 0; padding: 0; list-style: none; }
div.tallbox ul { position: absolute; top: 46px; left: 16px; width: 218px; }
div.tallbox ul li { border-bottom: 1px solid #E8E8E8; padding: 8px 2px; line-height: 16px; }
div.tallbox ul li span { display: block; font-size: 10px; color: #3D3D3D; }
div.tallbox ul li.all { border: none; }
div.news { left: 19px; }

div.events { left: 278px;}
div.events ul li a { text-decoration: none; font-weight: bold; display: block; color: #565656; }
div.events ul li a:hover { text-decoration: underline; }
div.events ul li.all a { text-decoration: underline; font-weight: normal; color: #0066CC; }
div.events ul li p { margin: 0; }

div.contact { left: 538px; width: 233px; background: url('images/tallbox-contact.gif'); }
div.contact p { position: absolute; top: 40px; left: 16px; }
div.contact .phone, div.contact .email { position: absolute; left: 18px; top: 130px; }
div.contact .email a { text-decoration: none; color: #707070; }
div.contact .email a:hover { text-decoration: underline; }
div.contact img { margin-right: 10px; }
div.contact .phone { top: 100px; font-size: 16px; color: #333; font-weight: bold; }
div.contact div { position: absolute; top: 230px; left: 73px; color: #333; font-size: 11px; width: 140px; }
div.contact div a { display: block; font-size: 12px; }

div.blog { top: 619px; left: 19px; width: 509px; height: 190px; background: url('images/tallbox-blog.gif'); }
div.blog .blogpost { margin: 55px 16px 0 16px; width: 225px; float: left; display: inline; }
div.blog .last { margin-right: 0; }
div.blog .blogpost a { font-weight: bold; margin-bottom: 10px; display: block; }
div.blog .blogpost img { float: left; border: 1px solid #6A6A6A; margin-right: 10px; }
div.blog .blogpost p { margin: 0; font-size: 12px; }

div.signup { top: 619px; left: 538px; width: 233px; height: 190px; background: url('images/tallbox-signup.gif'); }
div.signup p { position: absolute; top: 55px; left: 16px; font-size: 11px; color: #656565; margin: 0 16px 0 0; }
div.signup table { position: absolute; top: 92px; left: 16px; color: #000; }
div.signup input.text { border: 1px solid #A8A8A8; border-bottom: none; border-right: none; }
div.signup input { margin: 0 0 0 10px; }

/*////////////// Subpage  ///////////////////////*/
#content { position: relative; width: 790px; color: #444444; background: #fff; margin: 0; padding-top: 10px; z-index: 0; }
#content img.height { float: right; }

#content-txt { margin: 15px 0px 30px 30px; line-height: 20px; width: 480px; }
#content-txt h1.title { color: #1B5682; margin: 0 0 10px 0; font-weight: normal; font-size: 24px; }
#content-txt p { margin: 20px 0; }
#content-txt .mainimage { padding: 2px; border: 1px solid #ccc; }

#content div.contact { top: 310px; }
div.action { left: 538px; top: 0; height: 300px; width: 233px; background: url('images/tallbox-action.gif'); }
div.action div.ac { position: absolute; left: 16px; top: 45px; width: 100%; }
div.action div.ac p { margin: 5px 0; }
div.action div.ac a { text-decoration: none; display: block; width: 100%; height: 25px; }
div.action div.ac a span { visibility: hidden; }
div.action div.vote { top: 140px; }
div.action div.donate { top: 220px; }

#galleryList{ margin: 15px 0 0 0; padding: 0; list-style: none; }
#galleryList li{ display: inline; float: left; width: 100px; height: 100px; margin-right: 5px; }