/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
FILE LOCATION: /2008_templates/css/main.css
DESCRIPTION: Primary presentation style sheet
CONTENTS: 
	1= undo browser's default HTML settings
	2= general styling rules for common elements 
	3= template elements
	4= assorted CLASS rules
	5= IE CSS workarounds
DATE of LAST EDIT: August 20, 2008 
CHANGE LOG: 
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	1= undo browser's default HTML settings.
	The guiding wisdom behind this action may  be found at:
	http://tantek.com/log/2004/09.html#d06t2354 
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

:link, :visited, :hover, :active {
	text-decoration: none;
}
ul, ol { list-style: none; }
h1, h2, h3, h4, h5, h6, pre, code, p, ul, ol, dl, blockquote, address, td, th {
	margin: 0;
	padding: 0;
	font-size: 1em;
	line-height: normal;
}
html, body, div, li, dt, dd, pre, form, fieldset, input { margin: 0; padding: 0; }
img, a img { border: none; margin: 0; padding: 0; }
address { font-style: normal; }
hr { display: none; }
/* undo END */

/* ~~~~~ to compensate (somewhat) for a Firefox jump bug ~~~~~ */
html { overflow-x: auto; overflow-y: scroll; } 

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	2= general styling rules for common elements
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

body {
	background: #fff;
	color: #111;
	font-family: verdana, sans-serif;
	font-size: 75% /* 12px */;
	line-height: 1.5em;
	text-align: center;
}
html>body { font-size: 12px; line-height: 18px; }

/* link defaults */

a:link { color: #00f; text-decoration: underline; }
a:visited {color: #808; text-decoration: underline;}
a:hover { color: #d21; text-decoration: underline; }

/* image defaults */
img { display: block; }
img.centre { margin: 0 auto; }

/* image variation: inline */
.inline { display: inline; margin: 0; padding: 0 2px; }

/* heading <hn> defaults */
h1, h2, h3, h4, h5 { color: #039; }

h1 { /* 16px */ font-size: 1.333em; line-height: 1.125em; margin-bottom: 1.125em; }
h2 { /* 15px */ font-size: 1.25em; line-height: 1.2em; margin-bottom: 1.2em; }
h3 { /* 14px */ font-size: 1.1667em; line-height: 1.2857em; margin-bottom: 1.2857em; }
h4 { /* 13px */ font-size: 1.0833em; line-height: 1.3846em; margin-bottom: 1.3846em; }
h5 { /* 12px */ font-size: 1em; line-height: 1.5em; margin-bottom: 1.5em; }
h6 { /* 11px */ font-size: 0.9167em; line-height: 1.6364em; margin-bottom: 1.6364em; color: #000; }

/* common text elements default settings */
p { line-height: 1.5em; margin-bottom: 1.5em; }
blockquote p { margin-bottom: 0; padding: 0 20px; }
blockquote { margin-bottom: 1.5em; }
address { line-height: 1.5em; margin-bottom: 1.5em; padding: 0 20px; }

ul, ol { line-height: 1.5em; margin: 0 0 1.5em 20px; }

dl { line-height: 1.5em; margin-bottom: 1.5em; }
dd { margin-bottom: 1.5em; padding: 0 20px; }

th, td  { line-height: 1.5em; }

/* tables: with and without visible borders */
table.border {
	margin: 0 0 8px 0;
	padding: 0;
	width: 99%;
	border-bottom: 1px solid #000;
	border-left: 1px solid #000;
}
.border th {
	margin: 0;
	padding: 3px 4px 5px 4px;
	text-align: left;
	vertical-align: middle;
	border-right: 1px solid #000;
	border-top: 1px solid #000;
	background: #eee;
	color: #000;
}
.border td {
	padding: 3px 4px 5px 4px;
	border-right: 1px solid #000;
	border-top: 1px solid #000;
	margin: 0;
	vertical-align: top;
	color: #000;
}

table.noBorder {
	margin-bottom: 1.5em;
	padding: 0;
	width: 99%;
	border: none;
}
.noBorder th {
	line-height: 1.5em;
	margin: 0;
	padding: 0;
	text-align: left;
	vertical-align: middle;
	border: none;
	background: none;
}
.noBorder td {
	padding: 0 10px 0 0;
	border: none;
	line-height: 1.5em;
	margin: 0;
	vertical-align: top;
}

/* use these class rules to set TH/TD widths */
.w10 { width: 10%; }
.w15 { width: 15%; }
.w20 { width: 20%; }
.w25 { width: 25%; }
.w30 { width: 30%; }
.w33 { width: 33%; }
.w34 { width: 34%; }
.w35 { width: 35%; }
.w40 { width: 40%; }
.w50 { width: 50%; }
.w60 { width: 60%; }
.w75 { width: 75%; }

/* common text highlights */ 
strong { font-weight: bold; }
em { font-style: italic; }

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	3= template elements [left, centre, and right column widths are set in the two layout style sheets]
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

#wrapper { margin: 0 auto; text-align: left; }

#navigationAid {
	position: absolute;
	top: -9999px;
	font-size: 1px;
	z-index: 100;
	font-size: 0;
} 

/* ~~~~~ template header: includes search box and horizontal navigation menu ~~~~~ */
#header{
	height: 86px;
	background: #fff url(../images/backgrounds/header.gif) repeat-y;
	font-size: 0.9167em;
	line-height: 1.6364em;
} 

img#logo { float: left; padding-top: 10px; }

#secondaryNavBar { height: 59px; margin-left: 165px; }
#secondaryNavOptions { float: right; margin: 10px 0 0 5px; color: #666; }

#sizer { float: right; margin: 10px 0 0 15px; font-size: 1.0833em; }
#sizer img { margin-left: 5px; display: inline; }

#search { float: left; margin: 5px 0 0 10px; display: inline; }
#search form { position: relative; }
#search fieldset { margin: 0; padding: 0; border: none; } 
#search fieldset legend { text-indent: -9999px; font-size: 1px; }
#search form .scope { position: absolute; top: 30px; left: 0; width: 580px; }
#search form .scope input { display: inline; width: auto; font-size: 1em; }
.scope label { display: inline; }
.scope label.allBC { margin-right: 10px; }
#searchText {
	color: #900;
	font-size: 1.0833em; /* upsized to compensate for smaller font size setting in parent element */
	line-height: 1.3846em;
	font-weight: bold;
	position: absolute;
	top: 7px;
	left: 0;
}
#search form img { position: absolute; top: 7px; left: 0; }
#search form input.query { position: absolute; top: 5px; left: 55px; }
#search form input.img { position: absolute; top: 4px; left: 195px; }

#horizontalNavMenu {
	margin-left: 165px;
	height: 27px;
	background: #fff url(../images/backgrounds/horizontalNavigation.gif) repeat-x;
}

#horizontalNavMenu p  {
	padding: 5px 0 5px 10px;
	font-size: 1em;
	line-height: normal;
	color: #999;
	margin: 0;
}
#horizontalNavMenu a { color: #009; text-decoration: none; font-weight: bold; }
#horizontalNavMenu a:hover { color: #d21; text-decoration: none; }
#horizontalNavMenu a.active, 
#horizontalNavMenu a.active:visited { color: #69c; }

/* left column; includes navigation menus */
#leftColumn { 
	float: left;
	width: 164px;
	background: #ccc url(../images/backgrounds/leftColumn/roundBottom.gif) no-repeat bottom left;
	padding-bottom: 10px;
	font-size: 0.9167em;
	line-height: 1.6364em;
}
#leftColumn a:link { text-decoration: none; }
#leftColumn a:visited { text-decoration: none; }
#leftColumn a:hover, #leftColumn .current { color: #fff; text-decoration: none; }

#leftColumn h3 {
	padding: 2px 0;
	font-size: 1em;
	line-height: 1.5em;
	text-transform: uppercase;
	text-align: center;
	margin-bottom: 0;
}

#leftColumn ul { margin: 0; } 

#leftColumn a#BCHomeLink {margin-bottom: 1px;}
#leftColumn a#MinistryLink {padding-bottom: 0;}

#primaryMenu { 
	padding: 4px 0 10px 0;
	background: #69c url(../images/backgrounds/leftColumn/primaryMenu.gif) no-repeat top left;
}
#primaryMenu ul li ul li {
	background: #83acd6 url(../images/icons/blueBullet.gif) no-repeat 8px 10px;
}
#primaryMenu ul li ul li ul li {
	background: #9cbede url(../images/icons/blueBullet.gif) no-repeat 8px 10px;
	padding-left: 6px;
}
#primaryMenu ul li ul li ul li ul li {
	background: #b8cfe7 url(../images/icons/blueBullet.gif) no-repeat 8px 10px;
	padding-left: 6px;
}
#primaryMenu ul li ul li ul li ul li ul li {
	background: #cde url(../images/icons/blueBullet.gif) no-repeat 8px 10px;
	padding-left: 6px;
}

#primaryMenu ul a {
	display: block;
	font-weight: bold;
	color: #021553;
	padding: 5px 5px 5px 18px;
	margin: 0;
}
#primaryMenu ul li ul a {
	font-weight: normal;
	line-height: 1em;
	}
	
#primaryMenu ul .subMenu a {
	display: block;
	background: #69c url(../images/backgrounds/leftColumn/arrowCollapsed.gif) no-repeat 6px 8px;
	padding-left: 18px;
}
#primaryMenu ul .subMenu a.current {
	background: #69c url(../images/backgrounds/leftColumn/arrowExpanded.gif) no-repeat 6px 8px;
	padding-left: 18px;
}

#primaryMenu ul li.subMenu ul li a,
#primaryMenu ul li.subMenu ul li a.current {
	display: block;
	margin: 0;
	background: #83acd6 url(../images/icons/blueBullet.gif) no-repeat 8px 10px;
	padding-left: 18px;
}
#primaryMenu ul li.subMenu ul li.subMenu a {
	display: block;
	background: #83acd6 url(../images/backgrounds/leftColumn/arrowCollapsedSubMenu.gif) no-repeat 8px 8px;
}
#primaryMenu ul li.subMenu ul li.subMenu a.current {
	display: block;
	background: #83acd6 url(../images/backgrounds/leftColumn/arrowExpandedSubMenu.gif) no-repeat 8px 10px;
}

#primaryMenu ul li.subMenu ul li.subMenu ul li a,
#primaryMenu ul li.subMenu ul li.subMenu ul li a.current {
	display: block;
	margin: 0;
	background: #9cbede url(../images/icons/blueBullet.gif) no-repeat 8px 10px;
	padding-left: 18px;
}
#primaryMenu ul li.subMenu ul li.subMenu ul li.subMenu a {
	display: block;
	background: #9cbede url(../images/backgrounds/leftColumn/arrowCollapsedSubMenu.gif) no-repeat 8px 8px;
}
#primaryMenu ul li.subMenu ul li.subMenu ul li.subMenu a.current {
	display: block;
	background: #9cbede url(../images/backgrounds/leftColumn/arrowExpandedSubMenu.gif) no-repeat 8px 10px;
}

#primaryMenu ul li.subMenu ul li.subMenu ul li.subMenu ul li a,
#primaryMenu ul li.subMenu ul li.subMenu ul li.subMenu ul li a.current {
	display: block;
	margin: 0;
	background: #b8cfe7 url(../images/icons/blueBullet.gif) no-repeat 8px 10px;
	padding-left: 18px;
}
#primaryMenu ul li.subMenu ul li.subMenu ul li.subMenu ul li.subMenu a {
	display: block;
	background: #b8cfe7 url(../images/backgrounds/leftColumn/arrowCollapsedSubMenu.gif) no-repeat 8px 8px;
}
#primaryMenu ul li.subMenu ul li.subMenu ul li.subMenu ul li.subMenu a.current {
	display: block;
	background: #b8cfe7 url(../images/backgrounds/leftColumn/arrowExpandedSubMenu.gif) no-repeat 8px 10px;
}

#primaryMenu ul li.subMenu ul li.subMenu ul li.subMenu ul li.subMenu ul li a,
#primaryMenu ul li.subMenu ul li.subMenu ul li.subMenu ul li.subMenu ul li a.current {
	display: block;
	margin: 0;
	background: #cde url(../images/icons/blueBullet.gif) no-repeat 8px 10px;
	padding-left: 18px;
}
#primaryMenu ul li.subMenu ul li.subMenu ul li.subMenu ul li.subMenu ul li.subMenu a {
	display: block;
	background: #cde url(../images/backgrounds/leftColumn/arrowCollapsedSubMenu.gif) no-repeat 8px 8px;
}
#primaryMenu ul li.subMenu ul li.subMenu ul li.subMenu ul li.subMenu ul li.subMenu a.current {
	display: block;
	background: #cde url(../images/backgrounds/leftColumn/arrowExpandedSubMenu.gif) no-repeat 8px 10px;
}


#primaryMenu ul li.subMenu a.expanded {
	background-image: url(../images/backgrounds/leftColumn/arrowExpanded.gif);
}
#primaryMenu ul li.subMenu ul li.subMenu a.expanded {
	background-image:  url(../images/backgrounds/leftColumn/arrowExpandedSubMenu.gif);
	background-position: 8px 10px;
}
#primaryMenu ul li.subMenu ul li.subMenu ul li.subMenu a.expanded {
	background-image: url(../images/backgrounds/leftColumn/arrowExpandedSubMenu.gif);
	background-position: 8px 10px;
}
#primaryMenu ul li.subMenu ul li.subMenu ul li.subMenu ul li.subMenu a.expanded {
	background-image: url(../images/backgrounds/leftColumn/arrowExpandedSubMenu.gif);
	background-position: 8px 10px;
}


/* gray menu box */

.grayMenu h3 { color: #333; border-bottom: 1px solid #eee; }
.grayMenu ul{ background-color: #ccc; padding: 10px 0; }
.grayMenu li { line-height: normal; }
.grayMenu p { margin: 0; padding: 5px 20px 0 10px; background-color: #ccc; }
.grayMenu a {
	display: block;
	color: #333;
	padding: 3px 10px 3px 22px;
	margin: 0;
	background: #ccc url(../images/icons/redArrow.gif) no-repeat 8px 6px;
	text-decoration: none;
}
.grayMenu a:hover { color: #d21!important; }

/* rounded tab corner effect for gray box menu */
.grayMenuTab { 
	background: #ccc url(../images/backgrounds/leftColumn/grayMenuTab-left.gif) no-repeat;
}
.grayMenuTab h3 { 
	background: url(../images/backgrounds/leftColumn/grayMenuTab-right.gif) no-repeat top right;
}

/* breadcrumb and print this page rules */

/* to hide the right-column vertical line at the top */
#breadcrumbs {
	background: #fff url(../images/backgrounds/breadcrumbBottomBorder.gif) repeat-x 165px 0;
	margin: 0 0 0 165px;
	padding: 0 0 10px 10px;
	font-size: 0.8333em;
	line-height: normal;
}
#wideContent #breadcrumbs {
	background: #fff url(../images/backgrounds/breadcrumbBottomBorder.gif) repeat-x left top;
	margin: 0;
	padding: 0;
}
#breadcrumbs a:visited { color: #00f; }
#breadcrumbs a:hover { color: #d21; }

#crumbs { height: 30px; padding-top: 8px; }

#print { float: right; padding: 6px 12px 9px 12px; border-left: 1px solid #9a9a9a; }
#print img { margin-left: 12px; vertical-align: middle; display: inline; }
#print a:visited { color: #00f }

/* ~~~~~ banner: ministry/organization/program banner elements  ~~~~~ */
#titleBanner  {
	float: left;
	margin: 0 0 0 15px;
	background: #fff url(../images/banners/env720.gif) no-repeat left top;
	height: 85px;
	padding: 0 0 13px 0;
	overflow: hidden;
}

/* ~~~~~ main column [primary content area ] elements ~~~~~ */
#mainColumn {
	float: left;
	margin: 0 0 0 15px;
	padding: 0;
	font-size: 1em;
	line-height: 1.5em;
}
#wideContent #mainColumn { float: none; margin: 0; }

/* main column text blocks */
#mainColumn ul { list-style: disc; }
#mainColumn ol { list-style: decimal; }
#mainColumn li { margin-left: 15px; } 

/*right column elements */
#rightColumn { width: 172px; margin: 0; float: right; } 
#rightColumn a:link { text-decoration: none; }
#rightColumn a:visited { text-decoration: none; }
#rightColumn a:hover { text-decoration: none; }

/* right column contextual text blocks */
#rightColumn h4 { margin-bottom: 0; }
#rightColumn p {
	font-size: 0.9167em;
	line-height: 1.6364em;
	margin-bottom: 1.6364em;
}
#rightColumn ul {
	font-size: 0.9167em;
	line-height: 1.6364em;
	margin: 0 0 1.6364em 12px;
}
#rightColumn ol {
	font-size: 0.9167em;
	line-height: 1.6364em;
	margin: 0 0 1.6364em 12px;
}
#rightColumn ul li { list-style: disc; margin-left: 15px; }
#rightColumn ol li { list-style: decimal; margin-left: 15px;}

/* gray italics text in Georgia font : used for the vision statement on top level pages */
#rightColumn #georgiaGray {
	color: #8d8d8d;
	font-style: italic;
	font-family: georgia, serif;
	font-size: 1.1em;
	line-height: 1.3636em;
	margin-bottom: 1.3636em;
}

/* right column link list */
#rightColumn .rightColumnLinks { margin-left: 0; }
#rightColumn .rightColumnLinks li {
	list-style: none!important;
	margin-left: 0;
}
#rightColumn .rightColumnLinks li a {
	display: block;
	font-weight: bold;
	border-top: 1px solid #639bcc;
	padding: 1px 0 0 20px;
	background: url(../images/icons/whiteArrow.gif) no-repeat top left;
	line-height: 16px;
	/*margin-bottom: 18px;*/
	margin-bottom: 10px;
}

#rightColumn .rightColumnLinks li ul {
	margin-bottom: 18px;
}

#rightColumn .rightColumnLinks li ul li a {
	display: block;
	font-weight: bold;
	border: none;
	background: url(../images/icons/blackChevron.gif) no-repeat center left;
	line-height: 10px;
	margin: 0 0 8px 0; padding: 1px 0 0 15px;
}

/* right column feature box */
#rightColumn .box {
	background: #ccc url(../images/backgrounds/rightColumn/boxBottom.gif) no-repeat bottom left;
	width: 172px;
	padding-bottom: 0.8182em;
	margin-bottom: 0.8182em;
}
#rightColumn .box a { color: #009; text-decoration: none; }
#rightColumn .box a:hover { color: #d21; }
#rightColumn .box h4 {
	background: #fff url(../images/backgrounds/rightColumn/boxTop.gif) no-repeat top left;
	padding: 4px 0;
	border-bottom: 1px solid #999;
	font-size: 1em;
	text-align: center;
}
#rightColumn .box p {
	padding: 0 10px 0 15px;
	margin: 4px 0 10px 0;
	line-height: normal;
}
#rightColumn .box ul { margin: 0 0 0 5px; list-style: none; }
#rightColumn .box ul li {
	list-style: none;
	margin: 0 0 .5em 0;
	line-height: normal;
}
#rightColumn .box ul li a {
	display: block;
	padding: 0 10px;
	background: url(../images/icons/doubleCarrot.gif) no-repeat left 6px;
}
.box li img { vertical-align: middle;}

/* ~~~~~ footer elements ~~~~~ */
#footer { clear: both; text-align: right; font-size: 0.8333em; line-height: 1.8em; }
#footerBG {background-color: #FFFFFF; height: 100%;}

/* back to top */
.backToTop {
	padding-bottom: 17px;
	padding-right: 10px;
	border-bottom: 1px solid #9a9a9a;
	text-transform: uppercase;
	font-size: 1em;
}
.backToTop img {
	vertical-align: middle;
	padding-right: 3px;
	display: inline;
}
.backToTop a:link, .backToTop a:visited {
	color: #00f;
	text-decoration: none;
}
.backToTop a:hover { color: #d21; text-decoration: none; }
.footerMessage {
	float: left; text-align: left; 
	margin-top: 6px; width: 400px;
	font-variant: small-caps; font-size: 1.1em;
	background: #fff;
}
.footerLinks {
	padding: 8px 0 18px 0;
	text-transform: uppercase;
	color: #666;
	background: #fff;
	margin-bottom: 0;
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	4= assorted class rules [sorted alphabetically] 
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

.centre { margin: 0 auto; }
.clearLeft { clear: left; }
.clearBoth { clear: both; } 
.dottedLine {
	clear: both;
	display: block;
	border-bottom: 1px dotted #ccc;
	margin-bottom: 17px;
	padding: 0;
}
.floatLeft {
	float: left;
	border: 0;
	padding: 0;
	margin: 0 12px 18px 0;
}
.floatRight {
	float: right;
	border: 0;
	padding: 0;
	margin: 0 0 18px 12px;
}

.floatLeft img, .floatRight img {
	display: block;
	border: none;
	padding: 0;
	margin: 0;
}

.initiativeButton { margin-bottom: 21px; }

.more {
	background: url(../images/icons/blackChevron.gif) no-repeat right center;
	padding: 0 12px 0 0;
	text-align: right;
	font-weight: bold;
}
.noDisplay {
	display: none;
}
.small { /* 10px */ font-size: 0.8333em; line-height: 1.8em; }

.textCenter { text-align: center; }
.textHide { position: absolute; top: -9999px; font-size: 1px; }
.textLeft { text-align: left; }
.textRight { text-align: right; }

.underline {
	padding-bottom: 2px;
	border-bottom: 1px dotted #039;
	margin-bottom: 15px;
} 

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	5= internet Explorer CSS workarounds 
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

/* Hides from IE-mac \*/
* html #primaryMenu a, 
* html .grayMenu a,
* html .subMenu a,
* html .more,
* html .rightColumnLinks li a, 
* html .box li a  { height: 1%; }
/* End hide from IE-mac */