/* Copyright 2007 - 2012, Lorelle Ann Bell */

/* =initialize
___________________________________________________________*/
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, p, blockquote, th, td {margin: 0; padding: 0;}
h1, h2, h3, h4, h5, h6 {font-size: 100%;}
li {list-style-type: none;} 
cite, th {font-style: normal; font-weight: normal;}
table {border-collapse: collapse; border-spacing: 0; }
img {border: 0;}
th {text-align: left;}
q:before, q:after {content: '';}



/* =typography
___________________________________________________________*/
body,
#content dd p:first-letter,
#dates_to_remember #content > p:first-letter,
#events_history_music #content h4 + ul + p:first-letter,
#faq #content p:first-letter,
#faq #content ul + ul > li p:first-child:first-letter,
#interval_house #content ul + p + p + ul + p:first-letter,
#mail #content p:first-letter,
#mail #content p:first-letter,
#outreach #content #ie6a h2 + ul + p:first-letter,
#pictures #content p:first-letter,
#pictures_more #content p:first-letter,
#readings #content > p:first-letter,
#dates_to_remember #content #prayer_for_the_week p.citation:first-letter
{
   font-family: "Lucida Sans Unicode", sans-serif;
}

h1, h2, h3, h4, h5, h6,
#branding h1 + h2,
blockquote,
th,
.decorate,
.note,
.temp_msg,
#advertise p:first-letter,
#content p:first-letter,
#mail #content h2 + p:first-letter,
#mail #content #email_church_office p:first-child:first-letter,
#mail #content #email_minister p:first-child:first-letter,
#mail #content #email_webmistress p:first-child:first-letter,
#content #announcements dd p:first-letter,
#content #todays_readings > p:first-letter,
#dates_to_remember #content #scripture_readings > p:first-letter,
#dates_to_remember #content #prayer_for_the_week > p:first-letter,
#faq #content ul + ul > li p:first-letter,
#ie6b > p:first-letter,
.reading_section > p:first-letter
{ font-family: Papyrus, "Comic Sans MS", garamond, serif; }

body { font-size: 81%; line-height: 1.5; }

h1 { font-size: 300%; }
h2 { font-size: 250%; }
h3 { font-size: 200%; }
.decorate, h4 { font-size: 150%; }
h5 { font-size: 125%; }
h6 { font-size: 110%; }

h1, h2, h3, h4, h5, h6,
.decorate,
.note,
.visible,
#content dt,
#content #dates > ul > li > dl > dt { font-weight: bold; }

.more_visible { color: black; }

q, .entitle { font-style: italic; }
.more_info { border-bottom: 1px dotted; }

.temp_msg,
th,
#branding h1 + h2,
#content p:first-letter,
#mail #content h2 + p:first-letter,
#mail #content #email_church_office p:first-child:first-letter,
#mail #content #email_minister p:first-child:first-letter,
#mail #content #email_webmistress p:first-child:first-letter,
#content #announcements dd p:first-letter,
#dates_to_remember #content #scripture_readings > p:first-letter,
#dates_to_remember #content #todays_readings > p:first-letter,
#dates_to_remember #content #prayer_for_the_week > p:first-letter,
#faq #content ul + ul > li p:first-letter,
#ie6b > p:first-letter,
.reading_section > p:first-letter { font-size: 120%; font-weight: bold; }

#content blockquote { font-size: 120%; font-weight: normal; }

#content blockquote p:first-letter,
#content dd p:first-letter,
#dates_to_remember #content > p:first-letter,
#events_history_music #content h4 + ul + p:first-letter,
#faq #content p:first-letter,
#faq #content ul + ul > li p:first-child:first-letter,
#interval_house #content ul + p + p + ul + p:first-letter,
#mail #content p:first-letter,
#mail #content p:first-letter,
#outreach #content #ie6a h2 + ul + p:first-letter,
#pictures #content p:first-letter,
#pictures_more #content p:first-letter,
#readings #content > p:first-letter,
#dates_to_remember #content #prayer_for_the_week p.citation:first-letter { font-size: 100%; font-weight: normal; }

#events_history_music #content h6 + ul { font-size: 90%; }

#breadcrumbs li,
#siteInfo { font-size: 85%; }

.superscript, .footnote_superscript { font-size: 80%; }

/* =skip messages
____________________________________*/
/* #branding script + p, */
#branding ul,
#subNav ul,
#siteInfo ul { font-size: 80%; }

#study_readings li,
#events_roll_of_gratitude #content ul li,
#faq #content li ul li,
#mission_and_service #content li,
#mission_and_service #content li li,
#outreach #content #ie6b li,
#site_map #content li,
#site_map #content li ul li,
#ucw #content #vision ul li { list-style-type: square; }


/* =layout
___________________________________________________________*/
body
{
   margin: 1em auto;
   border: 2px solid;
   padding: 1em 9em 1em 15em;

   position: relative;
   width: 34em;
}


table { margin-bottom: 2em; width: 38em; }
thead th { padding-bottom: .75em; }
td { border-top: 1px solid; padding: .3em; }
tbody > tr:first-child > td { border-top: none; }
td:first-child { width: 12em; }

#ie6a li { border-top: 1px solid; padding: .5em; }

#prayer_for_the_week p.citation { margin-bottom: 0; margin-top: 0; text-align: right; }
.decorate { margin: 0 auto; width: 11em; }
.superscript, .footnote_superscript { vertical-align: super; }
#mail .last { margin-bottom: 3em; }

.heightRequired {height: 20em;}


/* =advertise
____________________________________*/
#advertise
{

   margin: 3em -7em 0 4em;
   padding: 1.5em;
   border: 1px solid;
}

#advertise p { margin-top: 1em; padding-left: 2em; }
#advertise p + h4 { margin-top: 1em; }

/* =content
____________________________________*/
#content, #ie6a, #ie6b { position: relative; }
#content h2 { position: relative; left: -1em; margin-top: 1.75em; margin-bottom: .5em; }

/* The margin-left definition needs to be here for Microsoft. */
#content h2:first-child { margin-top: .5em; margin-bottom: 1.9em; margin-left: 1.8em; }

#home #content h2 { left: -2.5em; margin-top: 1.3em; margin-bottom: .8em; }
#ie6a h2 { left: -3em; }
#ie6b h2 { left: -3em; }
#content h3 { margin: 2em 0 1em; position: relative; left: -1em; }
#content h2 + h3 { margin-top: 0; }
#content h4 { margin: 2em 0 1em; position: relative; left: -1em; }

#breadcrumbs { position: absolute; top: -3.25em; left: 4em; }
#breadcrumbs li { display: inline; }

#content p { margin-top: .5em; margin-bottom: .5em; }
dl { overflow: hidden; }

#content > ul { margin: 1.9em 0 2.5em; }
#events_roll_of_gratitude #content > ul { margin: 3em 0 3em 3em; }
#study_readings { padding-left: 3em; }
#content li { margin-top: .75em; }
#events_roll_of_gratitude #content > ul li { margin-top: 1.25em; }

#content li > dl dt,
#outreach #content li > dl dt { float: left; width: 30%; }

#content li > dl dd,
#outreach #content li > dl dd { float: right; width: 70%; }

#present li > dl dt { width: 42%; }
#present li > dl dd { width: 58%; }

#outreach #content #ie6b li > dl dt { width: 47%; }
#outreach #content #ie6b li > dl dd { width: 53%; }

#interval_house #content ul + p + p + ul li > dl dt { width: 52%; }
#interval_house #content ul + p + p + ul li > dl dd { width: 48%; }

#events_history_music #content li > dl dt,
#events_history_music #content li > dl dd { width: 50%; }
#events_history_music #content h6 { display: none; }
#events_history_music #content h6 + ul { margin-top: 2em; border-top: 1px solid; }

#events_roll_of_gratitude #content blockquote { margin: 3em .5em 2em; }
#events_roll_of_gratitude #content img { margin: -3em 2em 1em 1em; border: 4px solid; padding: 3px; float: left; width: 224px; height: 161px; }
#events_roll_of_gratitude #content #last { margin: 7em 0 9em; }

#external_pages #content ul { margin: 0 0 0 180px; padding: 0; width: 42em; }
#external_pages #content li { margin-bottom: .75em; }

#external_pages #content ul + p
{
   position: absolute;
   top: 22.5em;
   left: -1em;

   width: 151px;
   height: 239px;
}

#faq h5 { margin: 1em 0 .5em -1em; }
#faq h2:first-child + ul { margin-bottom: 4em; width: 42em; }
#faq h2:first-child + ul li { margin-bottom: .75em; }
#faq #content li ul { margin: 2em 2em 2em 3em; }
#faq #content li ul li { margin-bottom: .5em; }

#home #content blockquote { margin: 1.5em auto; width: 32em; }
#home #content blockquote p { text-align: center; margin: 0; }
#home #content blockquote p + p { text-align: right; }

#jobs #content #printable { position: relative; top: -4em; left: 25em; margin-bottom: -5.5em; }
#jobs #content ol { margin-right: 2em; margin-left: 2em; }
#jobs #content ol li { margin-right: 1em; margin-left: 1.5em; list-style-type: decimal; }
#jobs #content ul { margin-top: 0; margin-right: 2em; margin-left: 2em; }
#jobs #content ul li { margin-top: 0; margin-right: 1em; margin-left: 1.5em; }

#mission_and_service #content ul, #outreach #content #ie6b ul { margin: 0 3em; }
#mission_and_service #content li ul { margin: 0 2em; }

#ie6a {margin-top: 7em; }
#ie6b {margin-top: 7em; }
#ie6a li:first-child { border-top: none; }
#ie6b h2 + ul, #ie6b ul + p { margin-bottom: 3em; }

#readings #content #links_to_readings li { line-height: 1.6; }
#readings #content .reading_section blockquote { margin-left: 1em; margin-right: 1em; }


#site_map #content ul { margin: 0 1.5em; }
#site_map #content li ul { margin: 0 3em; }

#ucw #content #vision ul { margin: 0 3em; }
#ucw #content #ucw_prayer p  { text-align: center; }
#ucw #content #ucw_prayer h3 { margin-left: 2em; text-align: center; }


#content p a[href="#top"] { position: relative; left: -12.5em }

#calling_a_new_minister #content ul ul { margin: 0 3em; }


/* =branding and #subNav and #siteInfo
__________________________________________________*/
/* Height needs to be defined for Microsoft. */
#branding { position: relative; width: 126%; height: 6.5em; }

/* So now we have to define height here, too. */
#home #branding { height: 12.5em; }

h1 { margin: 0 -4.2em .5em 0; position: relative; left: -4.6em; float: left; width: 5.5em; }

#branding h2 { display: none; }

/* since 1857 */
#branding h1 + h2 { display: block; position: absolute; top: 10.75em; left: -9em; }

#branding h4 { display: none; }

/* I can't write NOSCRIPT P because Explorer can't handle it */
#branding h2 + p { margin-top: 1em;}

#branding ol + p + p + p + p { margin-bottom: 3em; }

#branding h2 + p,
#branding h2 + p + p,
#branding h2 + p + p + p { margin-bottom: 0; }

#branding h2 + p + p + p + p + p
{
   position: relative;
   top: -3em;
   margin-right: 2em;
   margin-bottom: -3em;
   float: right;
   width: 20em;

   text-align: right;
}

#branding ol li:first-child { padding-left: 0; }
#branding ol { margin-bottom: 3em; }
#branding ol li { display: inline; border-right: solid 1px; padding: 0 1em; }

#branding ol li.noBorder,
#siteInfo ol li.noBorder { border-right-style: none; border-right-width: 0; padding-right: 0; }

#subNav { position: absolute; top: 18em; left: 2.5em; }
#subNav h4 { display: none; }
#subNav ul { margin-bottom: 2.5em; }
#subNav ol li { margin-bottom: .5em; }

#siteInfo { margin-top: 3em; border-top: solid 1px; padding-top: .75em; }
#siteInfo h4 { display: none; }
#siteInfo ol { margin: 1.25em 0 1.5em; width: 49em; }
#siteInfo ol li { display: inline; line-height: 150%; border-right: solid 1px; padding: 0em .7em; }
#siteInfo ol li.beginLine { padding-left: 0; }

/* =color
___________________________________________________________*/
html { background-color: #4C2600; background-image: url(../images/brick.jpg); }

body { background-color: rgb(254,245,194); color: rgb(76,38,0); border-color: rgb(0,255,0); }

td,
.more_info,
#siteInfo,
#announcements dt,
#announcements dl dt + dd,
#outreach #content #ie6a li,
#events_history_music #content h6 + ul { border-top-color: rgb(154,145,94); }

#events_roll_of_gratitude #content img { background-color: rgb(154,145,94); }
 #content #last { margin: 7em 0 9em; }

/* =links
____________________________________*/
a:link { color: #4C2600; text-decoration: underline; }
a:visited { color: rgb(143,188,143); text-decoration: underline; }
a:hover { background-color: #4C2600; color: #FEF5C2; text-decoration: underline; }

/* Prevent targets from picking up the link characteristics. */
#branding h1 a:hover,
#branding h2 + p a:hover,
#content h2 a:hover,
#siteInfo ol + p a:hover,
#faq h5 a:hover { background-color: #FEF5C2; color: #4C2600; text-decoration: none; }

/* Job Positon */
#home #content h2 + p + h2 { left: -1em; margin-top: 3em; margin-bottom: .7em; }
#home #content h2#job_header { position: absolute; top: -6.5em; left: 1.4em; font-size: 120%; text-transform: uppercase; }
#job { position: absolute; top: -6em; left: 14em; width: 20em;}

/* =temporary code: remove when done
___________________________________________________________*/

.tmp {height: 20em;}