/*
	Author: Caple Davis
*/

/* RESET & BASIC PAGE SETUP */

* { margin: 0;padding: 0; } 
html { overflow-y: scroll; }
body {
	font-family: Verandana, Helvetica, Arial, sans-serif;
	font-size: 62.5%;
	background: url(../images/page-background.jpg) top center no-repeat;
	background-color: white; /*background image covers color until image ends - good for vertical graident*/
}
ul { list-style: none } /* remove bullet and  */
a { 
	outline: none;
	text-decoration: none;
}
a:hover { text-decoration: underline; }
img { border: none; }

/* TOOLBOX */
.floatleft { float: left; }
.floatright { float: right; }
.clear { clear: both; }
.txtcenter {text-align:center; }
.imgcenter { 
	text-align:center;
    margin-top:0px;
    margin-bottom:0px;
    padding:0px;
}

/* END TOOLBOX */

.image-left { 
	float: left;
	/*margin-left: -0px; /*CDD add to the (-##px) to pull it to the left */
}
.image-right { 
	float: right;
	/*margin-right: -0px; /*CDD add to the (-##px) to pull it to the right */
}

p {	
	font-size:1.2em; 
	color: #555;
	font-size:1.2em;
	font-size-adjust: none;
	font-stretch: normal;
	font-variant: normal;
	font-weight: normal;
	line-height: 150%;
	margin-bottom: 1.2em;
}
p.metadata { 
	font-style: italic;
	margin-bottom: 1.2em;
}
.warning {
	color:#F00;
	/*font-size:12px;*/
}

.scripture {
	font-size:12px;
	font-style:italic;
	color:brown;
}
h1, h2, h3, h4, h5, h6 {
	margin-bottom: 0.2em;
}


/*h1,h2,h3 { 
  font-family: "Franklin Gothic Demi", Verdana, Arial, sans-serif; 
}
*/

/*h1 {
	font-family: Georgia, serif;
	font-size: 2.4em;
	font-weight: normal;
	color: #a69028;
	}
*/

.firstcharacter { float: left; color: #903; font-size: 75px; line-height: 60px;
	padding-top: 4px; padding-right: 8px; padding-left: 3px; font-family: Georgia; 
}

.announce {
	color: #373737;
	font-size:12px;
	font-weight:bold;
}

h1 { font-size: 2.5em; font-weight: bold; }
h2 { font-size: 1.2em; font-weight: bold;}
h3 { font-size: 0.8em; font-weight: normal; }
h4 { font-size: 0.9em; font-weight: bold; }

/* END RESET */
.emailpop {
	color: brown;
}

/* STRUCTURE */
#page-wrap {
	width: 852px;
	margin: 0 auto;
}

/*-------------------------------------------------------------------------------------------------*/
/*--------------------------------------------- HEADING ------------------------------------------ */
#header {
	background-color: white; /* background-image willcover this color */
	background-image: url(../images/header-bg-120px.gif);
	background-repeat: repeat-x;
	background-position: bottom;
	color: #000;
	height: 120px;
	position: relative;
	/*border-left: 1px solid silver; /* can be used to border the left-side of the header only */
}

#header h1,
#header h2,
#header h3 {
	position: absolute;
}

#header h1 { /*position logo */
	top: 30px;
	left: 20px;
}
	
#header h2 { /*position slogan */
	top: 74px;
	left: 126px;
}

#header h3 { /*position church */
	top: 0px;
	left: 675px;
}

#headerlinks { /*position and style header links */
	position: absolute;
	font-size: 1em;
	top: 0em;
	left: 450px;	
}

#headersearch { /* position and style header search */
	position: absolute;
	top: 2em;
	left: 450px;
}

#headersearch form input { /* align search form input in header */
	vertical-align: middle;	
	width: auto;
}

#txtSearch { /* style text input box */
	height: 17px;
	width: 125px;
	border: 1px solid gray;
}
/*---------------------------------------- END HEADING ------------------------------------------ */
/*------------------------------------------------------------------------------------------------*/

/**************************** THREE CONTENT LAYOUT ****************************/

blockquote {
	font: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style:italic;
	color: brown;
	margin: 20px 50px 20px 50px;
}

.content-wrap {	/*NEW- Entire space below main menu entire space to the right of the Secondary Navigation Menu */
	width: 852px;
	display: inline;
	float: left;
	padding: 0px 0px 7px 0px; /*style entire content area - can be padded to create space between header & footer */
}

.content-wrap .side-nav {  /* Secondary Navigation Menu and content area */
	width: 200px;
	/*padding-right: 5px;*/
	float: left;
	display: inline;
	padding-top: 7px; /*use to push down (create whitespace) secondary navigation & content area from main menu */
}
.content-wrap .content-area { /*all content to the right of secondary navigation */
	width: 647px;
	float:right;
	display: inline;
	padding-top: 7px; /*use to push down (create whitespace) main content area from main menu */
}

.content-wrap .content-area-left { /*all content to the Left of Sidebar */
	width: 647px;
	float:left;
	display: inline;
	padding-top: 5px; /*use to push down (create whitespace) main content area from main menu */
}

.content-wrap .sidebar { /*Sidebar of the Main content area */
	width: 200px;
	float: right;
	display: inline;
	padding-top: 4px; /*use to push down (create whitespace) secondary content area from main menu */
	/*padding-left: 5px;*/
}

.content-wrap .content-area .midcontent {
	width: 442px;
	float: left;
	display: inline;
	padding-top: 0px; /*use to push down (create whitespace) main content area from main menu */	
}
.content-wrap .content-area .sidebar { /*Sidebar of the Main content area */
	width: 200px;
	float: right;
	display: inline;
	padding-top: 0px; /*use to push down (create whitespace) secondary content area from main menu */
	/*padding-left: 5px;*/
}

h1.img-heading {
	margin-bottom: 5px; /*CDD makek space below content heading when images are used as page content heading */
}

.article {		/*this entire width is 442 = 440px + 2px (border) */
	/*width: 440px;*/
	 /*IE6 fix */
	border: 1px solid silver; 
	padding: 10px 10px 40px 10px;
	overflow: hidden; /*CDD - another way to clear float. Allow images to stay inside container on Awana Page */
}
.article img {
	float: left; 
	padding-right: 15px;
	padding-left: 10px;
}
.article h2 {
	font-size: 16px;
	font-weight: bold;
}

.events { 
	width: 420px;
	border: 1px solid silver;
	padding: 10px;
	float: left;
}
.events img { padding: 0 10px 0 0;}
.events h2 { 
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 13px;
	font-weight: bold;
	color: #222;
	/*color:#F6F6F6;*/
	/*background-color: #434343;*/
	text-align: center;
	margin-bottom: 15px;
}
.events h3 {
	font-size: 12px;
	font-weight: bold;
}

.events hr, .article hr  { 
	height: 1px; 
	width: 325px; 
	margin: auto; 
	margin-top:13px;
	margin-bottom: 15px;
}
/*hr { height: 1px; width: 55%; margin: auto; } */

.divider 
{
	border-bottom:1px solid silver;
	width:300px;
	margin: 0 auto;
	margin-top:25px;
	margin-bottom:30px;
}

.min {
	list-style:outside square; /* BULLETS */
	font-size:12px;
	line-height: 150%;
	margin-left: 25px;
}
.child li{
	list-style: none;
	background:url(../images/bullet-pin-yellow.gif) left center no-repeat;
	padding-left:20px;
	line-height: 215%;
	font-size:12px;
	margin-left: 15px;	
}
ul.min ul li{
	list-style:inside circle;
	text-indent: 30px;
}
ul.wom {				/*Women Ministries style <UL> */
	font-size:12px;
	line-height: 150%;
	margin-left: 20px;
}
.wom li {
	background:url(../images/bullet-diamond-small.gif) left center no-repeat;
	padding-left: 15px;
}
.wom a {color: #555; }

.counsel li{ 
	list-style:outside; 
	color:#555; 
	line-height:199%;
}

.article h4 a:hover {text-decoration:underline;}

ul.friends { /*CDD- Style Friends link list */
	padding: 10px;
	font-size:1.2em;
	line-height: 150%;
}

ul.friends h4 { 
	color: #222;
	background-color: #BBB;
	padding: 2px 0 1px 5px;
}

/*************** Style SUBNAV ***************/
ul#subnav {
	padding-top: 5px; /*space above subnav menu */
	padding-bottom: 5px; /*space below sub navigaton */
}
ul#subnav li {
	display: inline; /* make some version of IE happy */
}
ul#subnav li a {
	display: block;
	width: 200px;
	height: 30px;
	text-indent: -9999px; /*this removes the text off the page- no text on top of images */
}
ul#subnav li.listen a {
		background: url(../images/but-weekly-sermon.jpg) top center no-repeat;
}
ul#subnav li.shop a {
		background: url(../images/but-shop-online.jpg) top center no-repeat;
}
ul#subnav li.donate a {
		background: url(../images/but-donate.jpg) top center no-repeat;
}
ul#subnav li.min-spotlight a {
		background: url(../images/but-ministry-spotlight.jpg) top center no-repeat;
}
ul#subnav li.gallery a {
		background: url(../images/but-photo-gallery.jpg) top center no-repeat;
}
ul#subnav li.fgroup a {
		background: url(../images/but-fellowship-groups.jpg) top center no-repeat;
}
ul#subnav li a:hover {
	background-position: center center;
}

.round-box {
	width: 200px;
	background: url(../images/box-middle-light-gray-200w.jpg) repeat-y; /*Sidebar Middle */
	margin-bottom: 4px;
}
.round-box h2 {
	background: url(../images/box-top-cyan-200w.jpg) no-repeat; /*Sidebar box Header */
	padding: 5px 0 5px 0;
	text-align: center;
	color:#fff;
}
.round-box p { 
	font-size:1.1em;
	background: url(../images/box-bottom-light-gray-200w.jpg) no-repeat bottom; /*Sidebar Bottom */
	padding: 5px 10px 15px 15px;
	margin-bottom: 0px;
}
.mens-box {
	width: 200px;
	background-color:#EBEBEB;
}
.mens-box h2 {
	background-color:brown;
	color:#FFF;
	font-size:12px;
	padding: 3px;
	text-align:center;
}
.mens-box p	{
	font-size: 1.1em;
	padding: 10px;
}

.women-box {
	width: 200px;
	background: url(../images/box-middle-light-gray-200w.jpg) repeat-y; /*Sidebar Middle */
	margin-bottom: 4px;
}
.women-box h2 {
	background: url(../images/box-top-women-200w.jpg) no-repeat; /*Sidebar box Header */
	padding: 5px 0 5px 0;
	text-align: center;
	color:#F5F5F5;
}
.women-box p { 
	font-size:1.1em;
	background: url(../images/box-bottom-light-gray-200w.jpg) no-repeat bottom; /*Sidebar Bottom */
	padding: 5px 10px 15px 15px;
	margin-bottom: 0px;
}
.child-box {
	width: 200px;
	background: url(../images/box-middle-light-gray-200w.jpg) repeat-y; /*Sidebar Middle */
	margin-bottom: 4px;
}
.child-box h2 {
	background: url(../images/box-top-child-200w.jpg) no-repeat; /*Sidebar box Header */
	padding: 5px 0 5px 0;
	text-align: center;
	color:#F5F5F5;
}
.child-box p { 
	font-size:1.1em;
	background: url(../images/box-bottom-light-gray-200w.jpg) no-repeat bottom; /*Sidebar Bottom */
	padding: 5px 10px 15px 15px;
	margin-bottom: 0px;
}


/*****************************************************************************************/
/****************************** SERMON PAGE **********************************************/
/*****************************************************************************************/
.sermon-content-wrap {	/*NEW- Entire space below main menu entire space to the right of the Secondary Navigation Menu */
	width: 852px;
	display: inline;
	float: left;
	background-color: #F6F6F6; 
	/*background-color:#EEE;*/
	border: 1px solid silver;
	padding: 0px 0px 0px 0px; /*style entire content area - can be padded to create space between header & footer */
}

.pagination {
	background-color:#ccc;
	padding:10px;
	/*border-top: 1px solid silver;*/
}

#pagination-bottom {
	width: 852px;
	text-align:right;
	background-color:#676767;
	color:white;
	border: 1px solid silver;
}

#pagination-num a {
	color: #000;
	padding:0px 4px 0px 4px;
	/*margin: 2px;*/
	background-color:#CCC;
	font-weight:bold;
}

#page-summary {
	padding-right:10px;
	padding-left: 5px;
	color: #C0C0C0;
}

.sermon-col {
	font-size:12px;
	color: #555;
	padding:10px 80px 10px 80px;
	line-height:150%;	
}
.sermon-col ul {
	list-style: square;
	/*background:url(../images/bullet-small-diamond.gif) left center no-repeat;*/
	padding-left: 15px;	
}

.scrip-col {	/* used to setup two colums for scripture listing on sermon page */
	font-size:12px;
	color: #555;
	padding:10px 80px 10px 80px;
	line-height:150%;	
}

.sermon-sidebar {
	float: left;
	width:180px;
	/*border-right: 1px solid silver;*/
	border-bottom: 1px solid silver;
	background-color:#EAEAEA;
}
.sermon-maingrid {
	float: left;
	width: 672;
}

.sermon-sidebar h2 {
	text-align: left;
	padding: 10px 0 5px 10px;
	border-top: 1px dotted silver;
}

.sermon-sidebar h2#first-heading {
	border-top: none;
}

.sermon-sidebar img {
	padding:0;
	margin: 0;
	border-top: 1px dotted silver;
	/*border-bottom: 1px dotted silver;	*/
	/*border-right: 1px solid silver;*/
}

ul.sermon {				/*Sermon style <UL> */
	font-size:12px;
	line-height: 150%;
	margin-left: 15px;
	padding-bottom:10px;
}
.sermon li {
	background:url(../images/arrow5.gif) left center no-repeat;
	padding-left: 15px;
}
.sermon a {color: #555; }

.sermon-heading {
	padding-top:10px;
	text-align:center;
}

#this-week {
	margin:0 auto;
	padding: 0 15px 10px 15px;
	text-align:center;
	font-style:italic; 
	text-decoration: none;
	color:brown;
}

#keysearch_form {
	margin:0;
	padding:0;
}

#key-search-box{ /*outer background*/
	background:url(../images/keysearch-bg.jpg) no-repeat top left;
	/*background-image:url(../images/search-box.jpg);*/
	height: 120px;
	padding: 0px 0 0 00px;
	width: 180px;
}

input#keysearch { /*keyword search input field */
	float: left;
	border:0;
	margin:0;
	margin-top:30px;
	margin-left: 12px;
	font-family:tahoma;
	font-size: 12px;
	padding: 3px 0px 0px 4px;
	height:18px;
	width: 123px;
	background: #ffffff url(../images/search-form.png) no-repeat top left;
}
input#gokeysearch {	/*search icon */
	float:left;
	border:0;
	margin:0;
	padding:0;
	margin-top:30px;
	margin-left: 5px;
	height: 21px;
	width: 21px;
	cursor: pointer;
	background: url(../images/search-icon.png) top left;
}
input#gokeysearch:hover{ /*search icon hover "Does Not work in ie6" */
	margin-top:30px;
	background:url(../images/search-icon.png) no-repeat bottom left;
}

/*****************************************************************************************/
/************************** END SERMON PAGE STYLING ***************************************/
/*****************************************************************************************/





/*****************************************************************************************/
/************************** MEDIA PLAYER STYLING ***************************************/
/*****************************************************************************************/
#media-player {
	/*margin:0 auto;*/
	background: white;
	width: 835px;
	font-size:12px;
}

#player-area {
	float: left;
	width: 445px;
	color: #666;
	/*background-color: white;*/
	/*background:url(../images/mediaplayer-bg.jpg) top left repeat-x;*/
}
#player-area h2 {
	color: #CCC;
}

#player-sidebar {
	float: right;
	width: 350px;
	color: #333;
	border: 1px solid silver;
	/*background:url(../images/planet-earth-in-space.jpg) top left repeat-x;*/
}

#player-sidebar a {
	color: #00F;
}

#player-sidebar table {
	margin: 0;
	padding: 0;
	list-style: none outside;
}

#player-metadata {
	margin:0;
	text-align:left;
	/*font-style:italic; */
	text-decoration: none;
	color:#333;
}

#player-sidebar table td {
	padding: 3px 0 3px 5px;
	/*color: white;*/
}

#player-sidebar table li {
	padding-right: 10px;
	/*color: white;*/
}

#player-sidebar table tr:hover {
	background-color: #DDD;
	/*color: white;*/
}


/*****************************************************************************************/
/************************** END MEDIA PLAYER STYLING ***************************************/
/*****************************************************************************************/





/*-----------------------------------------------------------------------------------------*/
/*------------------------------------ FORMS ----------------------------------------------*/
form {
	font-size: 1.2em;
}
form div {
	clear: both;
	padding: 0.4em 0;
}
fieldset {
	margin: 1em 0; /*  space out the fieldsets a little*/
	padding: 1em;
	border : 1px solid #ccc;
	background-color:#F5F5F5
}
legend {
	font-weight: bold;
}
label {
	float: left;
	clear: left;
	width: 13em;
	cursor: pointer;
}
input {
	width: 20em;
}
input.date-size { 
	width: 6em
}
input#gobutton {
	width:30px
}
input.submit, input.reset { width: auto }
input.radio, input.checkbox {
	width: auto;
	margin-right: 1em;
	margin-left: 1em;
}

input.paypal-donate {
	height:auto;
	width:auto;
}

div.column {
	width: 33em;
	float: left;
	clear: none;
	background: #E7E7E7;
	margin: 0.3em;
	padding: 0.4em;
}
div.column label {
	float: none;
}

fieldset#mailgroup {
	margin: 0;
	padding: 0;
	border: none;
	background: transparent;
}
#mailgroup h2{
	width: 15em;
	float: left;
	font-size: 1em;
	font-weight: normal;
	color: #060;
}
/*----------------------------------------------------------------------------------------*/
/*----------------------------------END FORMS --------------------------------------------*/
/*----------------------------------------------------------------------------------------*/

/*****************************************************************************************/
/************************** SERMON TABLE STYLING ************************************************/
/*****************************************************************************************/
table.sermons {
	line-height:1.5em;
	font-size:1.2em;
}

table.sermons td {
	padding:1em 0.8em;
	border-left:1px dotted silver;
	vertical-align: top;
}

.subtitle { font-style: italic; }
/*****************************************************************************************/
/************************** END SERMON TABLE STYLING ********************************************/
/*****************************************************************************************/

/*--------------- FOOTER ---------------*/
#footer {
	clear: both; /*clear float */
	margin-top:10px;
	background: url(../images/footer-bg.jpg) no-repeat;
}

#footer p {
	font-size: 11px;
	text-align: center;
	padding: 15px 15px 15px 15px;
}

.footmenu {
	float: left;
	margin-left: 50px;
	padding-top: 20px;
}
.footmenu a {
	color:#444;
}


/******************** IMGBROWZ0R STYLING ******************/

/* This is some example CSS. You can change this to your own liking. */
#gallery-page { /*CDD */
	background-color: #999;
}
#gallery-wrap {
	width: 852px;
	border: 1px solid white;
}
.img-description, .imgbrowz0r-navigation, #imgbrowz0r { margin: 0 auto;width: 852px;text-align: left }
.imgbrowz0r-navigation { padding: 1.5em 0 0.5em }
.imgbrowz0r-navigation .img-statistics { margin-top: 1.5em }

.img-description { margin: 1.5em auto 0 }

#imgbrowz0r .img-row { padding: 0 1em }

#imgbrowz0r .img-directory span.img-dir-name,
#imgbrowz0r .img-directory span.img-thumb-date { display: block }
#imgbrowz0r .img-directory span.img-dir-name { font-weight: bold;font-size: 1.2em }

#imgbrowz0r .img-column-1 { clear: left }

#imgbrowz0r .img-thumbnail,
#imgbrowz0r .img-directory { float: left;padding: 1.5em 0;width: 25%;text-align: center }

#imgbrowz0r .img-thumbnail a,
#imgbrowz0r .img-directory a {
	display: block;margin: 0 auto;
    width: 200px;height: 160px;line-height: 150px;
    background-repeat: no-repeat;background-position: 50% 50%; }

#imgbrowz0r .img-directory a:link, #imgbrowz0r .img-directory a:visited, #imgbrowz0r .img-thumbnail a:link,
#imgbrowz0r .img-thumbnail a:visited
	{ background-color: #000;border: 1px solid #000;font-size: 1.5em;color: #ccc;text-decoration: none }
#imgbrowz0r .img-directory a:active, #imgbrowz0r .img-directory a:hover, #imgbrowz0r .img-thumbnail a:active,
#imgbrowz0r .img-thumbnail a:hover { border-color: #F52542;color: #F52542 }

/* http://sonspring.com/journal/clearing-floats */
html body div.clear,
html body span.clear { 
	background: none;border: 0;clear: both;display: block;float: none;font-size: 0;list-style: none;
	margin: 0;padding: 0;overflow: hidden;visibility: hidden;width: 0;height: 0;
}
/******************** END IMGBROWZ0R STYLING ******************/