/* ---------------------------------- */ 
/*	St. Andrew's Church - Screen CSS  */ 
/*	Created by: Christian             */  
/*	Ver: 3                            */
/*	Date: 19 October 2009              */
/*  --------------------------------- */ 

/* ========== */
/* 1. General */
/* ========== */

* 
{ 
line-height: 1.4;
}

body
{
behavior:url("../css/csshover3.htc");
font: 62.5% verdana,sans-serif;
color: #333333;
}

h2
{
clear: both;
/*color: #FF9933;*/
/*color: #FF6600;*/
/*color: #993333;*/
color: #854621;
font: bold 1.7em Georgia, serif;
border-top: 1px solid #DDD;
border-bottom: 1px solid #DDD;
line-height: 30px;
margin: 0 0 10px;
padding-left: 40px;
background: transparent url("/images/sta3-header-decor.png") no-repeat left center;
}

h3
{
color: #854621;
font: bold 1.5em Georgia, serif;
line-height: 30px;
margin: 0 0 10px;
}

h4
{
color: #854621;
font: bold italic 1.2em Georgia, serif;
line-height: 30px;
}

p
{
font: normal 1.1em Verdana, sans-serif;
line-height: 1.5;
margin-bottom: 10px;
}

a
{
color: #0000CD;
text-decoration: none;
outline-style: none; /*Firefox - Removing dotted box surrounding clicked links */
}

a:hover
{
color: #FF9933;
}

ul
{
list-style: none;
margin-bottom: 10px;
}

img
{
margin-bottom: 5px;
}

/* =============== */
/* 2. Public Class */
/* =============== */

.container
{
clear: both;
width: 960px;
margin: 0 auto;
}

.anchor-nest /* required to handle white space problem in IE */
{
clear:both;
padding-top: 5px;
margin-right: 10px;
height: 15px;
}

.anchor
{
float: right;
color: #333366;
font: bold italic 1.3em Georgia, serif;
}

.vertical-img
{
float: left;
margin: 3px 10px 0 0;
}

.block
{
margin-bottom: 20px;
}

.event-date, .update-date
{
font: bold 1.2em Georgia, serif;
color: #FFF;
background-color: #333366;
text-align: center;
width: 35px;
padding: 3px 1px 5px 1px;
float:left;
}

.event, .update
{
width: 192px;
margin-left: 10px;
float:right;
}

.event-name, .update-title
{
color: #854621;
font-weight: bold;
}

.event-topic, .update-category
{
color: #FF6600;
font-weight: bold;
}

.new-list
{
clear: both;
/*margin-top:10px;*/
}

.divider
{
clear:both;
background: transparent url("/images/sta3-px.gif") repeat-x top left;
line-height: 0;
height:10px;
}

.js-only-content
{
display: none;
}

.visible-content
{
display: block;
}

.float-left-img
{
float: left;
margin-right: 20px;
}

.wide-img
{
display: block; 
margin: 0 auto;
margin-bottom: 10px;
}

.wide-img-info
{
text-align:center;
font-weight: bold;
color: #854621;
margin-bottom: 10px;
}

/* ================= */
/* 3. Body & Wrapper */
/* ================= */

body
{
background-color: #EBEBEB;
width: 100%;
/*min-width: 1120px;*/
min-width: 960px;
}

#wrapper
{
background: #EBEBEB url("/images/sta3-main-01.jpg") no-repeat center top;
width: 100%;
/*min-width: 1120px;*/
min-width: 960px;
height:550px;
}

/* ========= */
/* 4. Header */
/* ========= */

#header
{
/*min-width: 1120px;*/
min-width: 960px;
width: 100%;
background: transparent url("/images/sta3-header-bg.png");
height: 100px;
}

#logo
{
width: 296px;
height: 66px;
float:left;
background: transparent url("/images/sta3-logo.png") no-repeat left;
text-indent: -9999px;
padding-top:30px;
}

/* ============= */
/* 5. Navigation */
/* ============= */

#nav-access
{
position: absolute;
top: -9999px;
left: -9999px;
}

#navigation
{
float:right;
padding-top:40px;
}

ul#nav li
{
float: left;
padding-right: 20px;
font: bold 1.8em Georgia, serif;
}

ul#nav li a
{
color: #FFF;
display: inline-block;   /*IE - to avoid border (nav pointer) being cut  */
vertical-align: bottom;  /*IE - to avoid border (nav pointer) being cut  */
}

#nav a:hover, .home #nav #home a, .about #nav #about a, .ministries #nav #ministries a, .resources #nav #resources a, .news #nav #news a
{
color: #EBEBEB;
border-bottom: 4px solid #FF9933;
}

/* ============== */
/* 6. Breadcrumbs */
/* ============== */

#breadcrumbs
{
clear: both;
height:25px; /* Essential to cope with IE extra spacing */
}

#breadcrumbs li
{
float: left;
display: inline;
}

#breadcrumbs li a
{
color: #333366;
}

#breadcrumbs li a:hover
{
color: #FF9933;
text-decoration: underline;
}

.curr-pos
{
font-weight: bold;
}

/* ========== */
/* 7. Content */
/* ========== */

#content.home
{
clear:both;
margin-top: 430px;
}

#content
{
clear:both;
margin-top: 430px;
}

#main-content
{
/*margin: 10px 40px 0 0;*/
margin-right: 40px;
width: 600px;
float: left;
}

#main-content.home
{
width:320px;
float:left;
margin: 0 40px;
}

#portal
{
clear: both;
width: 960px;
}

#sub-content-1
{
width:320px;
float:left;
/*margin: 0 10px;*/
}

#sub-content-2
{
width:239px;
float:left;
/*margin: 0 10px;*/
}

#space
{
clear:both;
height: 25px;
}

#content strong
{
color: #854621;
}

#content img
{
border: 5px solid #FFF;
}

.map
{
border: 1px solid #000;
}

ul#statement, ul#content-list
{
list-style: disc;
}

ul#statement li, ul#content-list li
{
margin-left: 20px;
}

ul.resources a:hover
{
text-decoration: underline;
}

ul.directions
{
list-style: disc;
margin-left: 20px;
}

ul#categories
{
margin-top:25px;
}

ul#categories li
{
width: 280px;
float: left;
margin: 20px 20px 20px 10px;
}

ul#categories li h3 a
{
color: #854621;
}

ul#categories li p
{
margin-top: -10px;
font: normal 1.1em Verdana, sans-serif;
line-height: 1.4;
}

ul#categories li img
{
float: left;
display: inline;
margin-right: 10px;
}

ul#categories li h3 a:hover
{
color: #FF6600;
}

ul#categories li a img:hover 
{
border-color: #FF6600;
}

ul#note
{
margin: -7px 0 10px;
}

ul#note li
{
font: normal 1.1em Verdana, sans-serif;
list-style: disc;
line-height: 1.5;
margin-left: 20px;
}


/* =============== */
/* 8. Side Content */
/* =============== */

#side-content
{
/*margin-top: 10px;*/
width: 320px;
float: right;
}

#sub-nav li
{
display:block;
border-bottom: 1px solid #DDD;
font: normal 1.3em Georgia, serif;
line-height: 1.8;
color: #333366;
text-indent: 10px;
margin: 0 10px;
}

.belief #sub-nav #belief a, .contact #sub-nav #contact a, .history #sub-nav #history a, .location #sub-nav #location a, .contact #sub-nav #contact a,
.vision #sub-nav #vision a, .sunday-school #sub-nav #sunday-school a, .youth #sub-nav #youth a, .prayer #sub-nav #prayer a, .family #sub-nav #family a, 
.regional #sub-nav #regional a, .prayer #sub-nav #prayer a, .bible #sub-nav #bible a, .music #sub-nav #music a, .event-calendar #sub-nav #event-calendar a, 
.service-roster #sub-nav #service-roster a
{
font-weight: bold; 
}

#sub-nav li a
{
color: #333366;
}

#sub-nav li:hover a, #sub-nav li a:hover /* Safari & Chrome - Essential to handle hover problem */
{
display:block;
color: #FFF;
font-weight: bold;
background-color: #666699;
line-height: 1.8;
}

/* ========= */
/* 9. Tables */
/* ========= */

table
{
font: normal 1.1em Verdana, sans-serif;
margin-bottom: 10px;
line-height: 1.4;
border-collapse:collapse;
}

th.contact-row, th.ministry-row
{
color: #333366;
text-align: left;
width: 150px;
}

td
{
padding: 2.5px 2.5px 2.5px 10px;
line-height: 1.5;
}

.roster
{
border: 1px solid #DDD;
}

table.roster tr.odd td
{
background:#FFF;
}

table.roster tr td
{
background-color: #F7FBFF;
border-bottom:1px solid #DDD;
border-left:1px solid #DDD;
width: 200px;
}

table.roster tr th
{
background-color: #F4F9FE;
text-align: left;
padding-left: 10px;
border-bottom:1px solid #DDD;
border-left:1px solid #DDD;
}

table.roster thead th
{
background-color: #F4F9FE;
text-align: center;
padding:2.5px;
border-bottom:1px solid #DDD;
border-left:1px solid #DDD;
}

table.roster tr.odd .col-1
{
background:#F9FCFE;
}	

.col-1
{
background:#F4F9FE;
width: 190px;
}

/* ========== */
/* 10. Footer */
/* ========== */

#footer
{
clear:both;
padding-top: 25px;
background-color: #333366;
border-top: 2px outset #999;
color: #FFF;
}

#footer h3
{
clear: both;
color: #FFF;
font: bold 1.5em Georgia, serif;
line-height: 30px;
margin-left: 0 0 10px;
padding-left: 30px;
background: transparent url("/images/sta3-header-decor-wht.gif") no-repeat left center;
}

#footer a
{
color: #FFF;
}

#footer a:hover
{
color: #FF6600;
text-decoration: underline;
}

#contact-details
{
float: right;
text-align: right;
}

#base
{
clear:both;
border-top: 1px solid #DDD;
height:30px; /* to fill the background-color of div:copyright and by */
padding-top: 10px;
}

#copyright
{
float: left;
}

#credit
{
float: right;
}

#copyright p, #credit p
{
font: normal 1em Verdana, Sans-serif;
}

#credit a
{
font: bold italic 1em Georgia, serif;
}

/* ============ */
/* 11. Site Map */
/* ============ */

#site-map
{
float:left;
}

ul.site-map-links li
{
display: inline;
float: left;
width: 150px;
}

ul.site-map-links a
{
font: bold 1.2em Georgia, serif;
}

ul.sub-links
{
margin-top: 10px;
}

ul.sub-links a
{
font: normal 1em Verdana, sans-serif;
}