/* Eric Meyer Reset */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; }
/* Basic Elements */
h1, h2, h3, h4, h5, h6, ol, ul, p, form{ margin: 0 0 18px 0; }
ol, ul, dl { list-style: none; margin: 0 0 18px 18px; }
ol{ list-style: decimal; }
ul{ list-style: disc; }
dl dt{ font-weight: bold; }
dl dd{ margin-left: 18px; }
a{ }
a:link, a:visited{ text-decoration: underline; }
a:hover, a:active{ text-decoration: none; }
blockquote, q { quotes: none; }
strong, b{ font-weight: bold; }
i, em{ font-style: italic; }
del { text-decoration: line-through; }
table { border-spacing: 0; }
.clear { clear: both; height: 1px; overflow: hidden; }
/* Backgrounds */
html{ background: #0B3766 url('images/html-background.jpg') repeat-x; }
body { background: url('images/body-background.jpg') no-repeat top center; font: 12px/1.5 helvetica, arial, verdana, sans-serif; color: #333; text-align: center; }
#container { width: 984px; margin: 0 auto; text-align: left; position: relative; z-index: 1;}
#container .main { width: 984px; position: relative; }
/*
=================================== Header ================================*/
#header { height: 172px; z-index: 99; }
#header h2 { position: absolute; top: 15px; left: 35px; width: 250px; height: 100px; }
#header h2 a { display: block; width: 100%; height: 100%; text-indent: -9999em; }
#donate { display: block; position: absolute; right: 2px; top: 32px; height: 60px; width: 150px; text-indent: -9999em; }
#quicklinks { position: absolute; right: 20px; top: 95px; color: #DEC352; font-weight: bold; font-size: 14px; }
#quicklinks a { font-weight: normal; text-decoration: none; color: #7A8D99; }
#quicklinks a:hover { text-decoration: underline; }
/*
=================================== Navigation ================================*/
#nav, #nav ul, #nav li { list-style: none; margin: 0; padding: 0; }
#nav { position: absolute; width: 977px; top: 130px; left: 10px; height: 43px; font-family: georgia, serif; }
#nav li { position: relative; float: left; display: inline; text-align: center; line-height: 41px; padding: 0 16px; height: 43px; }
#nav li.hover { background: url('images/nav-hover.jpg') no-repeat top center; }
#nav li.hover a { color: white; }
#nav li.hover ul { display: block; }
#nav li a { color: #D1B642; font-size: 16px; font-weight: normal; text-decoration: none; }
#nav li ul { display: none; position: absolute; top: 43px; left: 0; width: 100%; background: #FDFDFA url('images/nav-sub.jpg') repeat-x; opacity: .9; }
#nav li ul li { float: none; display: block; font-family: arial, sans-serif; height: auto; overflow: hidden; padding: 0; line-height: 20px; }
#nav li ul li:hover { background: none; }
#nav li ul li a, #nav li:hover ul li a, #nav li.hover ul li a { display: block; margin: 0 4px; padding: 6px 0 4px; font-size: 12px; color: #1E5584; font-weight: bold; border-top: 2px dashed #EFE2B2; }
#nav li ul li:first-child a{ border: none; }
#nav li ul li a:hover { color: black; }
/*
=================================== Content ================================*/
.content { z-index: 2; color: #6E6955; }
h1, h2, h3, h4, h5, h6 { color: #1E5584; font-family: georgia, serif; font-weight: normal; margin: 10px 0 0 0; }
h1 { font-size: 28px; line-height: 32px; margin: 0 0 10px 0; }
h2 { font-size: 20px; line-height: 24px; }
h3 { font-size: 16px; line-height: 20px; }
h4 { color: #BE9B0C; font-size: 14px; font-weight: bold; font-family: arial, sans-serif; }
h5 { font-size: 12px; font-weight: bold; font-family: arial, sans-serif; }
p { margin: 0 0 10px 0; }
ul.gallery-images{
list-style: none;
margin: 18px 0;
padding: 0;
zoom: 1;
}
ul.gallery-images:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
ul.gallery-images li{
float: left;
height: 100px;
margin: 0 18px 18px 0;
width: 120px;
}
/*
=================================== Forms ================================*/
form label { display: block; margin-top: 5px; }
/*
=================================== Homepage ================================*/
#home { height: 630px; width: 940px; position: relative; margin: 20px 20px 0 20px; background: url('images/home-body.jpg') no-repeat; }
#slides { list-style: none; margin: 0; padding: 0; position: absolute; top: 21px; left: 22px; width: 577px; height: 285px; overflow: hidden; }
#slides .slide { position: absolute; top: 0px; list-style: none; width: 541px; }
#slides .slide img { position: absolute; top: 0px; left: 0px; }
#slides .slide .slidebutton { display: block; position: absolute; top: 0px; right: 0px; height: 285px; width: 21px; background: #693d5e; text-decoration: none; border-right: 1px solid white; }
#slides .active .slidebutton { background: #55354a; }
#slides .slide .slidebutton img { position: absolute; top: auto; display: block; bottom: 5px; left: 5px; }
/*
#slides .slide .slidebutton span { display: block; text-align: right; -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg);
position: absolute; bottom: 100px; left: -90px; width: 200px;
color: #f2ecd0; font-family: verdana, sans-serif; font-size: 12px;
}
*/
#slide-1 { position: absolute; top: 0; right: 44px; z-index: 3; }
#slide-2 { position: absolute; top: 0; right: 22px; z-index: 2; }
#slide-3 { position: absolute; top: 0; right: 0px; z-index: 1; }
#slidecontents { list-style: none; margin: 0; padding: 0; position: absolute; top: 340px; left: 20px; width: 570px; }
#slidecontents .slidecontent { display: none; position: absolute; }
#slidecontents .open { display: block; }
#slidecontents .slidecontent h3 { display: inline; color: #C9AB2D; font-size: 24px; line-height: 28px; font-family: georgia, serif; font-weight: normal; margin: 0; }
#slidecontents .slidecontent p { display: inline; color: #6A7C98; font-size: 14px; line-height: 24px; }
#slidecontents .slidecontent p a { color: #C9AB2D; font-size: 11px; text-decoration: none; }
#highlight { position: absolute; top: 20px; left: 655px; width: 262px; background: gray; }
/*#highlight img { position: absolute; top: 0; left: 0; width: 262px; height: 286px; }*/
#highlight img { position: absolute; top: -26px; left: -23px; }
#highlight #story_copy { position: absolute; top: 240px; left: 10px; color: white; z-index: 100; text-shadow: #000000 0px 0px 3px; ; -moz-text-shadow: #000000 0px 0px 3px; -webkit-text-shadow: #000000 0px 0px 3px; }
#highlight div { position: absolute; top: 315px; }
#highlight div h2 { color: #C9AB2D; font-size: 30px; line-height: 45px; font-family: georgia, serif; font-weight: normal; margin: 0; }
#highlight div p { color: #6A7C98; font-size: 12px; line-height: 16px; }
#highlight div p a { color: #C9AB2D; font-size: 11px; text-decoration: none; }
#bottombar { position: absolute; width: 940px; height: 140px; left: 0px; top: 470px; font-family: georgia, serif; }
#bottombar div { position: absolute; top: 0px; height: 140px; }
#bottomblog { left: 0; width: 305px; }
#bottomblog a.photo { position: absolute; top: 6px; left: 12px; }
#bottomblog h4, #bottomblog h3 { position: absolute; top: 5px; left: 135px; width: 165px; color: #1E5584; font-size: 14px; font-weight: normal; line-height: 21px; margin: 0; font-family: georgia, serif; }
#bottomblog h3 { top: 25px; font-size: 22px; line-height: 27px; }
#bottomblog a { position: absolute; top: 60px; left: 135px; font-size: 16px; width: 165px; font-style: italic; color: #A2832A; text-decoration: none; }
#bottomblog p { position: absolute; top: 84px; left: 135px; width: 170px; }
#bottomribbon{ left: 310px; width: 115px; }
#bottomribbon a { display: block; position: absolute; top: 85px; width: 100%; text-align: center; font-size: 16px; font-style: italic; color: #A2832A; text-decoration: none; line-height: 18px; }
#bottomribbon a span { color: #1E5584; }
#bottomyoutube { left: 430px; width: 200px; }
#bottomyoutube img { position: absolute; top: 6px; left: 30px; }
#bottomyoutube #latestvideo { position: absolute; left: 30px; top: 105px; color: #1E5584; font-size: 14px; font-style: italic; text-decoration: none; }
#bottomyoutube #allvideo { position: absolute; right: 30px; top: 107px; color: #6C6753; font-size: 12px; font-family: arial, sans-serif; text-decoration: none; }
#bottomsocial { left: 635px; width: 305px; }
#bottomsocial #tweet { position: absolute; display: block; width: 230px; left: 55px; top: 10px; font: bold 11px arial,sans-serif; text-decoration: none; color: #6C6753; }
#bottomsocial .socbut { position: absolute; display: block; width: 24px; height: 24px; top: 93px; left: 140px; text-indent: -999em; }
#bottomsocial #tw { left: 181px; }
#bottomsocial #fr { left: 223px; }
#bottomsocial #rss { left: 265px; }
/*
=================================== Inner ================================*/
#inner { background: url('images/sidebar-background.png') no-repeat 0px 437px; z-index: 1; margin-top: 1px; }
#sidebar { float: left; display: inline; width: 203px; padding: 0 10px 0 23px; margin: 0 0 0 0; background: url('images/sidebar-top.gif') no-repeat; z-index: 1;}
#sidenav { position: relative; text-align: center; }
#sidenav h3 { font-size: 24px; font-weight: normal; margin: 26px 0 10px 0; padding: 2px 0 5px; line-height: 36px; background: url(images/sidebar-title.gif) no-repeat center bottom; }
#sidenav ul { margin: 0; padding: 0; list-style: none; padding: 0 12px; }
#sidenav ul li { border-bottom: 1px solid white; padding: 8px 0; }
#sidenav ul li a { color: #BB9806; text-decoration: none; }
#sidenav ul li a:hover { text-decoration: underline; }
#sidenav ul li a.active { font-weight: bold; color: #997604; }
#sidebar ul.blog-tag-cloud li { border: none; padding: 0 2px; display: inline; line-height: 24px; vertical-align: middle; }
#sidebarimage { position: relative; background: url('images/sidebar-image.jpg') no-repeat; width: 183px; height: 225px; margin: 10px 0; padding: 11px 10px 10px 9px; }
#sidebarimage img { display: block; }
#content { float: left; width: 370px; padding: 30px 50px; margin-bottom: -221px; margin-bottom: -181px; min-height: 230px; }
#contentsidebar { float: left; width: 250px; padding-top: 25px; }
#contentsidebar .sidebox { margin-bottom: 20px; }
#contentsidebar .heart { position: relative; height: 200px; background: url('images/contentside-heart.png'); }
.heart h3 { color: #DEB927; font-style: italic; font-size: 24px; position: absolute; top: 20px; width: 250px; text-align: center; }
.heart p { font-family: georgia, serif; position: absolute; top: 80px; left: 20px; width: 210px; margin: 0; text-align: center; }
#contentsidebar ul{position:absolute; top:95px; list-style-type:none; left:15px; width:215px;}
#contentsidebar li{margin-bottom:16px;}
#contentsidebar li a{color:#bb9806; padding:4px 4px 4px 20px; text-decoration:none;}
#contentsidebar li a:hover{color:#D1B642;}
#subscribe-rss{background:url(images/icon-rss.png) left center no-repeat;}
#subscribe-email{background:url(images/icon-email.png) left center no-repeat;}
#contentsidebar #archives{padding:0 16px;}
#contentsidebar #archives h2{margin:0 0 5px;padding-bottom:5px;border-bottom:1px dashed #D1B642;}
#contentsidebar #archives ul{position:static;top:0;left:0;margin:0;}
#contentsidebar #archives ul li{margin-bottom:6px;}
#contentsidebar #archives ul li a{padding: 0;}
#contentsidebar .frame { position: relative; width: 250px; height: 250px; background: url('images/contentside-frame.png'); }
.frame img { position: absolute; top: 20px; left: 18px; }
/*
=================================== Board of Directors ================================*/
#section-list, #board-of-directors{ list-style: none; margin: 0; padding: 0; }
#board-of-directors li{ clear: left; padding: 0 0 18px 110px; }
#board-of-directors li a.thumbnail{ float: left; margin-left: -110px; }
#board-of-directors li h2 { font-size: 16px; }
/*
=================================== Inline Calendars ================================*/
#calendar-header{ margin: 0 0 550px 0; }
.inline-calendar table, #calendar{ position: absolute; top: 130px; border-left: 1px solid #CCC; width: 640px; margin-right: 25px; }
.inline-calendar table thead th, #calendar thead th{ background: #CCC; border-right: 1px solid #CCC; color: #000; }
.inline-calendar table tbody td, #calendar tbody td{ border-bottom: 1px solid #CCC; border-right: 1px solid #CCC; height: 75px; width: 14.28%; }
.inline-calendar table tbody td .date, #calendar tbody td .date{ color: #666; font-size: 10px; padding: 0 4px; }
.inline-calendar table tbody td .event, #calendar tbody td .event{ margin: 0 4px; font-size: 10px; line-height: 12px; }
/*
=================================== Gallery ================================*/
.hidden { display: none; }
#gallery-header{ position: relative; left: -20px; margin-bottom: 490px; }
#gallery { position: absolute; top: 80px; left: 260px; width: 696px; height: 494px; background: transparent url('images/gallery-background.jpg'); }
#gallery-intro { position: absolute; top: 8px; left: 9px; height: 268px; width: 459px; padding: 70px 110px;
font: italic 16px Georgia,serif; color: #1e5584; line-height: 32px; text-align: center; }
#gallery-intro strong { color: #bc9906; display: block; font-weight: normal; }
#startslides { width: 116px; height: 30px; display: block; margin: 20px auto; background: url('images/gallery-begin.jpg'); text-indent: -9999em; }
#gallery-slides { position: absolute; top: 8px; left: 9px; height: 408px; width: 679px; overflow: hidden; background: transparent; }
#gallery-slides ol { position: absolute; top: 0; left: 0; list-style: none; margin: 0; padding: 0; width: 679px; height: 408px; background: transparent; }
#gallery-slides ol li { width: 629px; height: 338px; padding: 25px; }
#gallery-slides .slide-content { width: 340px; padding-right: 20px; height: 338px; line-height: 18px; z-index: 2; }
#gallery-slides .scroll-content { overflow: auto; width: 320px; padding-right: 20px; height: 315px; }
#gallery-slides .slide-content p { margin: 6px 0; }
#gallery-slides .slide-content h2 { margin: 0px 0 6px 0; font: italic 25px Georgia,serif; color: #bc9906; }
#gallery-slides .slide-image { position: absolute; bottom: -25px; right: 1px; z-index: 1; }
#gallery-nav { position: absolute; top: 425px; left: 8px; width: 680px; height: 50px; }
#gallery-nav ol { position: absolute; margin: 0; padding: 0; top: 0; left: 0; width: 680px; height: 50px; background: url('images/gallery-sprites.jpg'); }
#gallery-nav ol li { list-style: none; margin: 0; padding: 0; position: absolute; top: 0; left: 100px; width: 85px; height: 50px; text-indent: -9999em; cursor: pointer; cursor: hand; }
#gallery-nav ol li.activeslide, #gallery-nav ol li.hov { background-image: url('images/gallery-sprites.jpg'); }
#gallery-nav #slide-1-nav { left: 0px; width: 100px; }
#gallery-nav #slide-1-nav.activeslide, #gallery-nav #slide-1-nav.hov{ background-position: 0px -50px; }
#gallery-nav #slide-2-nav { left: 97px; width: 100px; }
#gallery-nav #slide-2-nav.activeslide, #gallery-nav #slide-2-nav.hov { background-position: -97px -50px; }
#gallery-nav #slide-3-nav { left: 194px; width: 100px; }
#gallery-nav #slide-3-nav.activeslide, #gallery-nav #slide-3-nav.hov { background-position: -194px -50px; }
#gallery-nav #slide-4-nav { left: 291px; width: 100px; }
#gallery-nav #slide-4-nav.activeslide, #gallery-nav #slide-4-nav.hov { background-position: -291px -50px; }
#gallery-nav #slide-5-nav { left: 388px; width: 100px; }
#gallery-nav #slide-5-nav.activeslide, #gallery-nav #slide-5-nav.hov{ background-position: -388px -50px; }
#gallery-nav #slide-6-nav { left: 485px; width: 100px; }
#gallery-nav #slide-6-nav.activeslide, #gallery-nav #slide-6-nav.hov { background-position: -485px -50px; }
#gallery-nav #slide-7-nav { left: 582px; width: 100px; }
#gallery-nav #slide-7-nav.activeslide, #gallery-nav #slide-7-nav.hov { background-position: -582px -50px; }
.credit { position: absolute; top: 575px; right: 50px; font-size: 11px; text-align: right; color: #998541; }
.credit a { color: #998541; }
/*
=================================== Pagination ================================*/
#pagination-links { clear: both; margin: 20px 0; padding: 0; }
#pagination-links li { float: left; display: inline; margin: 0 2px 2px 0; padding: 2px 3px; list-style: none; border: 1px solid #ccc; text-align: center; }
#pagination-links li a.current { font-weight: bold; color: black; text-decoration: none; }
/*
=================================== Footer ================================*/
.footer { z-index: 1; height: 70px; position: relative; background: transparent url('images/footer-home.jpg') no-repeat top left; clear: both; }
.footer p { color: #666; line-height: 15px; padding-left: 32px; }
.footer #credit { text-align: right; position: absolute; right: 0; width: 400px; padding-right: 30px; }
#innerfooter p a { position: relative; text-indent: none; display: inline; }
.footer p a { color: #777; }
#homefooter { background-image: url('images/footer-home.jpg'); background-repeat: no-repeat; margin-top: -221px; padding-top: 221px; }
#innerfooter { position: relative; background-image: url('images/footer-inner.jpg'); z-index: 1; height: 271px; }
#innerfooter a { display: block; position: absolute; text-indent: -9999em; }
#innerfooter p { position: absolute; top: 225px; }
#ribbon { top: 70px; left: 30px; width: 180px; height: 80px; }
.ftsoc { width: 20px; height: 20px; top: 178px; left: 110px; }
#ftw { left: 136px; }
#ffr { left: 165px; }
#frss { left: 190px; }
.jScrollPaneContainer {
position: relative;
overflow: hidden;
z-index: 1;
}
.jScrollPaneTrack {
position: absolute;
cursor: pointer;
right: 0;
top: 0;
height: 100%;
background: #f0ebd5;
}
.jScrollPaneDrag {
position: absolute;
background: #dfd5aa;
cursor: pointer;
overflow: hidden;
}
.jScrollPaneDragTop {
position: absolute;
top: 0;
left: 0;
overflow: hidden;
}
.jScrollPaneDragBottom {
position: absolute;
bottom: 0;
left: 0;
overflow: hidden;
}
a.jScrollArrowUp {
display: block;
position: absolute;
z-index: 1;
top: 0;
right: 0;
text-indent: -2000px;
overflow: hidden;
/*background-color: #666;*/
height: 9px;
}
a.jScrollArrowUp:hover {
/*background-color: #f60;*/
}
a.jScrollArrowDown {
display: block;
position: absolute;
z-index: 1;
bottom: 0;
right: 0;
text-indent: -2000px;
overflow: hidden;
/*background-color: #666;*/
height: 9px;
}
a.jScrollArrowDown:hover {
/*background-color: #f60;*/
}
a.jScrollActiveArrowButton, a.jScrollActiveArrowButton:hover {
/*background-color: #f00;*/
}
.post {margin-bottom:32px;}
#comments input[type=text]{width:200px; font-size:12px; padding:3px;}
#comments textarea{width:100%; height:100px;}
/*
ColorBox Core Style
The following rules are the styles that are consistant between themes.
Avoid changing this area to maintain compatability with future versions of ColorBox.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative; overflow:visible;}
#cboxLoadedContent{overflow:auto;}
#cboxLoadedContent iframe{display:block; width:100%; height:100%; border:0;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
/*
ColorBox example user style
The following rules are ordered and tabbed in a way that represents the
order/nesting of the generated HTML, so that the structure easier to understand.
*/
#cboxOverlay{background:#fff;}
#colorbox{}
#cboxContent{margin-top:32px;}
#cboxContent{background:#000; padding:1px;}
#cboxLoadingGraphic{background:url(images/loading.gif) center center no-repeat;}
#cboxLoadingOverlay{background:#000;}
#cboxTitle{position:absolute; top:-22px; left:0; color:#000;}
#cboxCurrent{position:absolute; top:-22px; right:205px; text-indent:-9999px;}
#cboxSlideshow, #cboxPrevious, #cboxNext, #cboxClose{text-indent:-9999px; width:20px; height:20px; position:absolute; top:-20px; background:url(images/controls.png) 0 0 no-repeat;}
#cboxPrevious{background-position:0px 0px; right:44px;}
#cboxPrevious.hover{background-position:0px -25px;}
#cboxNext{background-position:-25px 0px; right:22px;}
#cboxNext.hover{background-position:-25px -25px;}
#cboxClose{background-position:-50px 0px; right:0;}
#cboxClose.hover{background-position:-50px -25px;}
.cboxSlideshow_on #cboxPrevious, .cboxSlideshow_off #cboxPrevious{right:66px;}
.cboxSlideshow_on #cboxSlideshow{background-position:-75px -25px; right:44px;}
.cboxSlideshow_on #cboxSlideshow.hover{background-position:-100px -25px;}
.cboxSlideshow_off #cboxSlideshow{background-position:-100px 0px; right:44px;}
.cboxSlideshow_off #cboxSlideshow.hover{background-position:-75px -25px;}