/* 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;
}
body {
font: 12px/1.5 georgia, "Times New Roman", serif; color: #58534c; background: #f3eee0 url(../images/background.jpg) 49.95% 0 repeat-y;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
/* remember to define focus styles! */
:focus {
outline: 0;
}
/* remember to highlight inserts somehow! */
ins {
text-decoration: none;
}
del {
text-decoration: line-through;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
border-collapse: collapse;
border-spacing: 0;
}
.red{ color: #bb2f2d !important; }
address{ display: inline; font-style: normal; }
a:link, a:hover, a:active{ color: #615a52; }
a:link, a:visited{ text-decoration: none; }
a:hover, a:active{ text-decoration: underline; }
a:visited{ color: #977a5b; }
/* Layout */
#wrapper{ width: 900px; margin: 0 auto; background: #f3eee0 url(../images/background.jpg) 0 0 repeat-y; }
#wrapper.calendar-wrapper{ background-image: url(../images/background-calendar-tile.jpg); }
/* Header */
#header{ position: relative; z-index: 1; width: 900px; height: 153px; background: transparent url(../images/background-header.jpg) top left no-repeat; }
#logo{ position: absolute; bottom: 0; left: 2px; width: 351px; height: 68px; text-indent: -9999px; }
#slogan{ position: absolute; bottom: 23px; right: 2px; margin: 0; padding: 0; line-height: 0em; }
#top-menu{ position: relative; width: 100%; height: 20px; }
#top-menu li{ position: absolute; top: 0; display: block; height: 20px; }
#top-menu li#top-menu-home{ left: 22px; width: 54px; }
#top-menu li#top-menu-donate { left: 82px; width: 120px; }
#top-menu li#top-menu-familystore{ left: 513px; width: 84px; }
#top-menu li#top-menu-communitycenter{ left: 603px; width: 119px; }
#top-menu li#top-menu-church{ left: 728px; width: 54px; }
#top-menu li#top-menu-centerofhope{ left: 788px; width: 96px; }
#top-menu li a{ display: block; width: 100%; height: 100%; text-indent: -9999px; }
#top-menu li a:hover, #top-menu li a.current{ background: transparent url(../images/background-top-menu-item.gif) bottom no-repeat; }
#top-menu li#top-menu-donate a:hover { background: none; }
#top-menu-information{ position: absolute; top: 18px; right: 11px; width: 381px; height: 74px; }
.top-menu-information-panel{ position: absolute; top: 0; left: 0; padding: 7px; display: none; background: transparent url(../images/background-global-box.png) top left no-repeat; }
.top-menu-information-panel img{ float: left; border: 1px solid #a69886; margin-right: 5px; }
.top-menu-information-panel strong, .top-menu-information-panel p{ display: block; font-family: arial, verdana, sans-serif; font-size: 10px; color: #46392b; line-height: 14px; }
#main-menu{ font-family: helvetica, arial, verdana, sans-serif; font-size: 11px; position: absolute; bottom: 0; right: 0; width: 540px; height: 48px; }
#main-menu li{ display: block; float: left; height: 21px; margin-left: -1px; }
#main-menu li a{ display: block; height: 21px; background-color: transparent; background-repeat: no-repeat; background-position: 0 0; text-indent: -9999px; }
#main-menu li a.current, #main-menu li a:hover{ background-position: 0 -21px; }
#main-menu li#main-menu-aboutus a{ width: 84px; background-image: url(../images/menu-about.jpg); }
#main-menu li#main-menu-givesupport a{ width: 109px; background-image: url(../images/menu-givesupport.jpg); }
#main-menu li#main-menu-getsupport a{ width: 104px; background-image: url(../images/menu-getsupport.jpg); }
#main-menu li#main-menu-calendar a{ width: 140px; background-image: url(../images/menu-calendar.png); }
#main-menu li#main-menu-contact a{ width: 101px; background-image: url(../images/menu-contact.png); }
#main-menu ul{ position: absolute; bottom: 0; right: 0; margin-right: 2px; width: 750px; height: 23px; text-align: right; }
#main-menu ul li{ display: inline; float: none; margin-right: 15px; }
#main-menu ul li a{ display: inline !important; width: auto !important; line-height: 23px; color: #67513c; font-weight: bold; text-indent: 0; background: none !important; text-decoration: none; }
#main-menu ul li a:hover, #main-menu ul li a.current{ color: #a72c26; }
/* Feature */
#homerotation { position: relative; width: 546px; height: 208px; overflow: hidden; float: left; }
#homeredbox { width: 354px; height: 208px; overflow: hidden; }
#feature{ width: 100%; position: relative; z-index: 2; line-height: 0; height: 126px; overflow: hidden; }
#feature.home{ margin-top: -23px; height: 208px; }
#feature img { margin: 0; float: left; display: inline; }
#feature #photo { width: 546px; height: 126px; overflow: hidden; }
#feature #redbox { width: 354px; height: 126px; overflow: hidden; }
/* Content */
#content-wrapper{ background: transparent url(../images/background-content.jpg) top left no-repeat; padding: 8px 218px 0 264px; min-height: 471px; }
#content-wrapper.calendar{ background-image: url(../images/background-content-cal.jpg); padding-right: 2px; padding-left: 2px; }
#content-wrapper:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
#center-column{ padding: 1.5em; position: relative; }
#center-column h1, #center-column h2{ color: #bb2f2d; font-size: 18px; margin-bottom: 1em; font-family: helvetica, arial, verdana, sans-serif; }
#center-column h1{ margin-top: 10px; padding: 0; color: #c32b24; font: normal 18px/20px Georgia; }
#center-column h2, #center-column h2 a{ margin: 0; font-size: 12px; color: #826e59; }
#center-column p{ margin-bottom: 1.5em; }
#center-column ul, #center-column ol{ margin: 0 0 1em 1.5em; }
#center-column ul{ list-style-type: disc; }
#center-column ol{ list-style-type: decimal; }
/* MAIN BODY LINK STYLES */
#center-column a:link { color: #c32b24; text-decoration: none;}
#center-column a:hover { color: #c32b24; text-decoration: underline; }
#center-column a:visited { color: #826e59; text-decoration: none; }
#center-column a:active { color: #c32b24; text-decoration: none; }
/* Listing Pages */
#center-column #pageList, #pageList li { list-style: none; margin: 0; padding: 0; }
#center-column #pageList li { margin: 15px 0; }
#center-column #pageList li span.date { font-size: 10px; font-family: helvetica, arial, verdana, sans-serif; }
#center-column #pageList li h2.listtitle, #center-column #pageList li h2.listtitle a { font-size: 13px; }
#center-column #paginationLinks { list-style: none; margin: 0; padding: 0; }
#center-column #paginationLinks li { display: inline; padding: 3px 5px; }
#center-column #paginationLinks li a { text-decoration: underline; }
#center-column #paginationLinks li a.current { color: #826e59; text-decoration: none; }
/* Left Sidebar */
#left-column{ position: relative; width: 260px; float: left; display: inline; margin-left: -264px; border-right: 1px dashed #a69677; }
#left-column h1{ height: 23px; line-height: 23px; margin: 0 0 4px 0; text-indent: -9999px; }
#left-column ul{ margin: 18px 10px 0 12px; }
#left-column ul li{ position: relative; margin-bottom: 1.5em; padding-left: 34px; }
#left-column ul li h2, #left-column ul li h2 a, #left-column ul li p, #left-column ul li a{ font-family: helvetica, arial, verdana, sans-serif; font-size: 0.917em; color: #826e59; }
#left-column ul li a.calendar-icon{ position: absolute; display: block; top: 0; left: 0; width: 27px; height: 27px; line-height: 1; background: transparent url(../images/background-sidebar-date.png) top left no-repeat; text-align: center; color: #FFF; }
#left-column ul li a.blue { background-image: url(../images/background-sidebar-blue.png); }
#left-column ul li a.orange { background-image: url(../images/background-sidebar-orange.png); }
#left-column ul li a.calendar-icon .calendar-icon-month{ display: block; padding-top: 3px; font-size: 9px; text-transform: uppercase; font-weight: bold; }
#left-column ul li a.calendar-icon .calendar-icon-day{ font-size: 12px; font-weight: bold; }
#left-column-calendar{ width: 100%; height: 253px; margin-top: 6px; font-family: helvetica, arial, verdana, sans-serif; }
#left-column-calendar h1{ position: relative; height: 85px; text-indent: 0; overflow: visible; }
#left-column-calendar .calendar-day-number{ display: block; position: absolute; top: 30px; right: 10px; font-size: 100px; letter-spacing: -5px; color: #FFF; }
#left-column-calendar .calendar-day-name{ display: block; position: absolute; top: 29px; left: 25px; color: #FFF; font-size: 18px; font-family: georgia, "Times New Roman", serif; font-weight: normal; }
#left-column-calendar .calendar-month-and-year{ display: block; position: absolute; top: 50px; left: 25px; color: #614c38; font-size: 14px; font-style: italic; font-family: georgia, "Times New Roman", serif; font-weight: normal; }
#left-column-calendar table{ margin: 0 10px; width: 246px; }
#left-column-calendar table td, #left-column-calendar table th{ text-align: center; color: #816d58; }
#left-column-calendar table th{ font-weight: bold; }
#left-column-calendar table td{ font-size: 0.917em; line-height: 1.636em; }
#left-column-calendar table td a{ display: block; background: transparent url(../images/background-calendar-day.png) top center no-repeat; text-align: center; text-indent: -8px; color: #FFF; line-height: 1.636em; text-decoration: none; }
#left-column-calendar ul{ margin: 7px 0 0 2px; padding: 7px 10px 0 18px; border-top: 1px dashed #a69677; }
#left-column-calendar ul li{ width: 43%; height: 18px; margin: 0; padding: 0 0 0 15px; text-indent: 0; float: left; font-size: 0.917em; cursor: pointer; cursor: hand;}
#left-column-calendar ul li#all-events{ background: transparent url(../images/swatch-red.png) top left no-repeat; }
#left-column-calendar ul li#church-events{ background: transparent url(../images/swatch-blue.png) top left no-repeat; }
#left-column-calendar ul li#community-center-events{ background: transparent url(../images/swatch-orange.png) top left no-repeat; }
/* Right Sidebar */
#right-column{ float: right; display: inline; width: 218px; margin: 0 -218px 0 0; border-left: 1px dashed #a69677; }
#right-column form{ height: 27px; margin-top: 6px; padding-top: 19px; padding-left: 10px; margin-bottom: 18px; }
#right-column form label{ display: none; }
#right-column form input{ vertical-align: middle; }
#right-column h1, #right-column ul, #right-column p{ margin: 0 12px 0 10px; color: #826e59; }
#right-column h1{ font-size: 14px; margin-bottom: 18px; line-height: 18px; }
#right-column h2{ font-size: 0.917em; font-family: helvetica, arial, verdana, sans-serif; }
#right-column p{ font-family: helvetica, arial, verdana, sans-serif; font-size: 0.917em; margin-bottom: 1.285em; }
#right-column ul li{ font-family: helvetica, arial, verdana, sans-serif; font-size: 0.917em; margin-bottom: 1.636em; }
#right-column ul p{ margin: 0; }
#right-column ul p.date{ color: #bb2f2d; }
#right-column .signup input.text { margin: 2px 2px 2px 0; font-size: 12px; color: #666; width: 190px; }
#right-column .signup input.small { width: 91px; }
/* SIDE BAR LINK STYLES */
#footer a:link, #right-column a:link { color: #333333; text-decoration: none; }
#footer a:hover, #right-column a:hover { color: #615a52; text-decoration: underline; }
#footer a:visited, #right-column a:visited { color: #977a5b; text-decoration: none; }
#footer a:active, #right-column a:active { color: #615a52; text-decoration: none; }
/* Footer */
#footer{ position: relative; clear: both; background: transparent url(../images/background-footer.jpg) top right no-repeat; padding-left: 292px; padding-right: 17px; font-family: helvetica, arial, verdana, sans-serif; font-size: .917em; }
#footer.calendar { padding-left: 155px; padding-right: 154px; background-position: top center; }
#footer form{ height: 30px; padding-top: 33px; }
#footer form .text { width: 100px; font-size: 11px; color: #666; }
#footer form input{ vertical-align: middle; }
#footer ul{ position: absolute; top: 5px; right: 0; width: 330px; }
#footer.calendar ul { right: 140px; }
#footer ul li{ float: left; width: 30%; height: 1.636em; }
#footer p{ margin: 1.5em 0; text-align: center; }
/* Calendar */
#content-wrapper.calendar #center-column h1{ position: relative; height: 29px; text-indent: 0; overflow: visible; }
#content-wrapper.calendar #center-column p{ margin-left: 30px; }
#content-wrapper.calendar #center-column #full-calendar-navigation{ position: absolute; top: 30px; right: 60px; }
#content-wrapper.calendar #center-column #full-calendar-navigation li{ display: inline; }
#content-wrapper.calendar #center-column .calendar-month-and-year{ display: block; position: absolute; top: 8px; left: 30px; color: #6f5943; font-weight: bold; font-size: 18px; font-style: italic; font-family: georgia, "Times New Roman", serif; font-weight: normal; }
#content-wrapper.calendar #center-column .calendar-full-date{ display: block; position: absolute; top: 30px; left: 30px; font-size: 12px; color: #FFF; }
#content-wrapper.calendar #center-column #full-calendar-legend{ position: absolute; top: 75px; right: 60px; }
#content-wrapper.calendar #center-column #full-calendar-legend li{ display: inline-block; float: left; padding-left: 18px; margin-left: 15px; cursor:pointer; cursor: hand; }
#content-wrapper.calendar #center-column #full-calendar-legend li#all-events{ background: transparent url(../images/swatch-red.png) 0 4px no-repeat; }
#content-wrapper.calendar #center-column #full-calendar-legend li#church-events{ background: transparent url(../images/swatch-blue.png) 0 4px no-repeat; }
#content-wrapper.calendar #center-column #full-calendar-legend li#community-center-events{ background: transparent url(../images/swatch-orange.png) 0 4px no-repeat; }
#calendar{ width: 800px; font-family: helvetica, arial, verdana, sans-serif; font-size: 0.917em; margin: 40px 30px 0 30px; }
#calendar thead tr.calendar-heading-navigation th{ font-weight: bold; font-size: 1.5em; padding: 0 0 0.5em 0; }
#calendar thead tr.calendar-heading-days th{ text-align: center; font-weight: normal; }
#calendar tbody tr td{ width: 100px; height: 80px; border-top: 1px solid #b8b096; border-right: 1px solid #b8b096; }
#calendar tbody tr td.last{ border-right: none; }
#calendar tbody tr td.today{ background: #b8b096; }
#calendar tbody tr td ul{ margin: 0 0.5em; }
#center-column #calendar tbody tr td a{ color: #fff; text-decoration: none; font-size: 10px; color: white; line-height: 11px; display: block; width: 100%; margin: 2px 0; padding: 1px 2px; }
#calendar tbody tr td a.calendar-event-blue{ colorr: blue; background: blue; }
#calendar tbody tr td a.calendar-event-red{ colorr: red; background: #bb2f2d; }
#calendar tbody tr td a.calendar-event-orange{ colorr: #d53b27; background: #FF6600; }
#calendar tbody tr td span.calendar-cell-date{ display: block; text-align: right; padding: 0.25em 0.5em; }
#calendar ul{ list-style: none; margin: 0; padding: 0; }
/* Thickbox */
body.event{ background: transparent url(../images/background-calendar-popup.png) top left no-repeat; font: 12px/1.5 helvetica, arial, verdana, sans-serif; }
body.event h1{ height: 28px; line-height: 28px; margin: 30px 0 30px 30px; padding: 0; text-transform: uppercase; font-size: 12px; color: #6f5943; }
body.event a#close{ position: absolute; top: 38px; right: 41px; }
body.event .left-column{ width: 280px; height: 347px; padding-left: 30px; float: left; display: inline; overflow: auto; }
body.event .right-column{ width: 136px; height: 347px; padding: 0 43px 0 13px; float: right; display: inline; font-size: 0.917em; line-height: 1.636em; }
body.event .right-column p{ margin-bottom: 0.75em; }
body.event .footer{ clear: both; font-size: 10px; padding: 5px 30px 0 0; text-align: center; }
/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> thickbox specific link and font settings <<<------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
#TB_window {
font: 12px Arial, Helvetica, sans-serif;
color: #333333;
}
#TB_secondLine {
font: 10px Arial, Helvetica, sans-serif;
color:#666666;
}
#TB_window a:link {color: #666666;}
#TB_window a:visited {color: #666666;}
#TB_window a:hover {color: #000;}
#TB_window a:active {color: #666666;}
#TB_window a:focus{color: #666666;}
/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> thickbox settings <<<-----------------------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
#TB_overlay {
position: fixed;
z-index:100;
top: 0px;
left: 0px;
height:100%;
width:100%;
}
.TB_overlayMacFFBGHack{background: url(/~sarmy/js/thickbox/macFFBgHack.png) repeat; }
.TB_overlayBG {
background-color:#000;
filter:alpha(opacity=75);
-moz-opacity: 0.75;
opacity: 0.75;
}
* html #TB_overlay { /* ie6 hack */
position: absolute;
height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
}
#TB_window {
position: fixed;
background: transparent;
z-index: 102;
color:#000000;
display:none;
border: 4px solid #525252;
text-align:left;
top:50%;
left:50%;
border: none;
width: 490px !important;
height: 489px !important;
}
* html #TB_window { /* ie6 hack */
position: absolute;
margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px');
}
#TB_window img#TB_Image {
display:block;
margin: 15px 0 0 15px;
border-right: 1px solid #ccc;
border-bottom: 1px solid #ccc;
border-top: 1px solid #666;
border-left: 1px solid #666;
}
#TB_caption{
height:25px;
padding:7px 30px 10px 25px;
float:left;
}
#TB_closeWindow{
height:25px;
padding:11px 25px 10px 0;
float:right;
}
#TB_closeAjaxWindow{
padding:7px 10px 5px 0;
margin-bottom:1px;
text-align:right;
float:right;
}
#TB_ajaxWindowTitle{
float:left;
padding:7px 0 5px 10px;
margin-bottom:1px;
}
#TB_title{
background-color:#e8e8e8;
height:27px;
}
#TB_ajaxContent{
clear:both;
padding:2px 15px 15px 15px;
overflow:auto;
text-align:left;
line-height:1.4em;
}
#TB_ajaxContent.TB_modal{
padding:15px;
padding: 0;
}
#TB_ajaxContent p{
padding:5px 0px 5px 0px;
}
#TB_load{
position: fixed;
display:none;
height:13px;
width:208px;
z-index:103;
top: 50%;
left: 50%;
margin: -6px 0 0 -104px; /* -height/2 0 0 -width/2 */
}
* html #TB_load { /* ie6 hack */
position: absolute;
margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px');
}
#TB_HideSelect{
z-index:99;
position:fixed;
top: 0;
left: 0;
background-color:#fff;
border:none;
filter:alpha(opacity=0);
-moz-opacity: 0;
opacity: 0;
height:100%;
width:100%;
}
* html #TB_HideSelect { /* ie6 hack */
position: absolute;
height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
}
#TB_iframeContent{
clear:both;
border:none;
margin-bottom:-1px;
margin-top:1px;
_margin-bottom:1px;
}
label.error{ display: block; font-size: 10px; color: #FF0000; }