﻿/* CSS
Author: My Community Circle
Client: COGIC
Created: 10-04-08 */

/* GLOBAL ELEMENTS
==========================================================================*/

html { 
	overflow-x: auto;
	height:100%;}

body {
	font-family: arial;
	font-size: 12px;}

body#index
{
    background-position: left top;
    background: url('../images/container_bg copy.png') repeat-x left top;
    background-color: #9f1701;
}
	
body#secondary {
	background: url(../images/container_bg.gif) top left repeat-x;
	background-color: #e0d5a6;}

body#local {
	background: url(../images/bg-local.jpg) 50% 0px scroll repeat-x;
	background-color: #dcd4a7;}
	
body * {
}


body,div,dl,dt,dd,ul,li,h1,h2,h3,h4,h5,h6,address,cite,pre,form,fieldset,input,p,blockquote,table,tr,th,td,embed,object {
	margin: 0;
	padding: 0;
	table-layout: auto;
}

img { border: 0;}

a {
	text-decoration: underline;
	font-weight: bold;
	color: #9F1701;
}
a:visited { text-decoration: none;}
a:hover {
	text-decoration: none;
	color: #000;}
a:active { text-decoration: none;}

a.smalllink {
	font-size: 10px;
	font-family:tahoma;
	color: #CC0000;}

	
/* TYPOGRAPHY
==========================================================================*/

h1, h2, h3, h4, h5 {
	font-family: georgia;}

/* GENERAL H1 TAG */
h1,h2,h3,h4,h5,p,dl {
	font-weight: normal;
}

h1 {
	font-size: 30px;
	letter-spacing: -1px;}
	
	h1 a {
	letter-spacing: -1px;
	color: #000;}
	

h2 {
	font-size: 22px;
	letter-spacing: -1px;
	font-weight: bold;
}

h3 {
	font-size: 18px;
	letter-spacing: -0.5px;}

p {
	line-height: 16px;
}

li { list-style:none;}


/* LAYOUT ELEMENTS
=====================================================================*/

div#container-index {
	padding: 0;
	width: 100%;
	background: url(../images/body_bg.jpg) top left no-repeat;}
	
div#container-secondary {
	padding: 0;
	width: 100%;
	background: url(../images/bodysecondary_bg.jpg) top left no-repeat;}

div#header {
	position: relative;
	width: 100%;
	height: 190px;
	background: url(../images/header_bg.jpg) top left no-repeat;}

div#body-index {
	margin: 0 auto;
	width: 990px;
	clear: both;
	background: #fff url(../images/body-index_bg.jpg) top left repeat-y;}

div#body-secondary {
	margin: 0 auto;
	width: 990px;
	clear: both;
	background: #fff;}

div#body-middlearticle {
	margin: 0 auto;
	width: 750px;
	clear: both;
	background: #fff;
	border: 1px solid #d6d6d6;
	margin-bottom: 15px;
}
	
div#banner728 {
	margin: 0 auto;
	width: 100%;
	padding: 10px 0;
	text-align: center;}
	
div.banner160 {
	text-align: center;
	padding: 0 0 15px 0;}

div#contentleft {
	float: left;
	width: 180px;}

div#content {
	float: left;
	width: 800px;}

div#contentmiddle {
	float: left;
	width: 510px;
	background: #fff;
    height: 1750px;
}
	
div.contentrow {}

	.contentrow div.column {
		width: 50%;
		float: left;
		background: #fff;}
		.contentrow h1 {
	padding: 10px 15px;
	text-transform: uppercase;
	font-size: 12px;
	color: #333333;
	background: #efefef;
	font-weight: bold;
}

		.contentrow h3 {
	padding: 10px 15px;
	text-transform: uppercase;
	font-size: medium;
	color: #FFFFFF;
	background: #9f1701;
	font-weight: bold;
}
			
	.contentrow div h2 {
		padding: 20px 15px 0;
		font-size: 18px;}
		.contentrow div h2 span {
			letter-spacing: 0;}
		.contentrow div p {
    padding: 10px 15px;
    font-size: medium;
}

div#contentright {
	float: left;
	width: 300px;
	background: #E7E2BC;}

div#article {
	float: left;
	width: 560px;
}
	#article h2 {
		padding: 15px 0px 5px;
		margin: 0 10px 5px;
		font-size: 16px;
		border-bottom: 1px solid #ccc;}
	#article h3 {
		padding: 5px 10px;
		font-size: 14px;}
	#article a { text-decoration: none;}
	#article p {
		padding: 10px;
		font-size: 12px;
		line-height: 18px;}

	#article ul.list {
		list-style: none;
		margin: 0;
		padding: 10px 0;}
		#article ul.list li {
			margin: 0 20px 0 40px;
			padding: 5px 15px;
			font-size: 12px;
			line-height: 18px;
			background: url(../images/bullet.gif) left center no-repeat;}
			
	#article ol.list {
	
	list-style-type:square;
	}	
	
	#article ol.list li {	
	margin: 0 20px 0 20px;
	list-style-type: decimal;
	line-height:22px;
	
	}
			
	
			
			/* ================ START DIV ARTICLE MIDDLE ===============*/
			
			
			
div#articlemiddle {
	float: left;
	width: 650px;
}
	#articlemiddle h2 {
		padding: 15px 0px 5px;
		margin: 0 10px 5px;
		font-size: 16px;
		border-bottom: 1px solid #ccc;}
	#articlemiddle h3 {
		padding: 5px 10px;
		font-size: 14px;}
	#articlemiddle a { text-decoration: none;}
	#articlemiddle p {
		padding: 10px;
		font-size: 12px;
		line-height: 18px;}

	#articlemiddle ul.list {
		list-style: none;
		margin: 0;
		padding: 10px 0;}
		#articlemiddle ul.list li {
			margin: 0 20px 0 40px;
			padding: 5px 15px;
			font-size: 12px;
			line-height: 18px;
			background: url(../images/bullet.gif) left center no-repeat;}
						
						
			
			/* ================ STOP DIV ARTICLE MIDDLE ===============*/




div#contentarticletitle{}

	#contentarticletitle h1 {
		padding: 15px 10px 10px;
		font-size: 24px;
		letter-spacing: -1px;}
		#contentarticletitle h1 span {
			letter-spacing: 0;}
			
			
div#contentarticletitleburg{}

	#contentarticletitleburg h1 {
		padding: 15px 10px 10px;
		font-size: 24px;
		letter-spacing: -1px;
		color:#5F0801;
		}
		#contentarticletitleburg h1 span {
			letter-spacing: 0;}
			
		
div#articleside {
	float: left;
	width: 250px;
}
	
/* SLIDESHOW 
=====================================================================*/

div#slide-index {
	width: 510px;
	height: 250px;
	background: #333;}


/* PRESIDIUM
=====================================================================*/

div.presidium {}

	div.presidiumimg {
		float: left;
		width: 260px;
		text-align: center;
		padding: 25px 0;}
		.presidiumimg img {
			border: 1px solid #333;}

	div.presidiumdesc {
		float: left;
		width: 300px;
		padding: 25px 0;}
		.presidiumdesc h3 {
			font-size: 16px;
			letter-spacing: 0;}


div.officers {}
	.officers div {
		float: left;
		width: 50%;}

/* FLAT NAV
=====================================================================*/

div#signin {
	position: absolute;
	top: 0px;
	right: 10px;
	padding: 10px 0;
	width: 364px;
	text-align: right;
	color: #fff;
	z-index: 1000;
}
	#signin a {
		color: #fff;
		font-size: 9px;
		font-weight: normal;
		text-transform: uppercase;}
	
	div#bishopbg {
	position: absolute;
	top: 24px;
	right: 1px;
	width: 205px;
	text-align: right;
	color: #fff;
	height: 166px;
}

/* INDEX NEWS
=====================================================================*/

div#indexnews {
	background: #e6e2c5;}
	#indexnews div {
		padding: 0 0 10px;}
	#indexnews h1 {
		font-size: 18px;
		padding: 10px;
		margin: 0;
		background: #b8b38d;
		color: #222;}
	#indexnews h2 {
		font-size: 12px;
		font-family: arial;
		letter-spacing: 0px;
		padding: 10px 10px 5px;}
	#indexnews a {
		color: #900;}
	#indexnews p {
		padding: 0 10px 10px;
		font-size: 11px;}
	a.articlelink {
		display: block;
		background: url(../images/bullet.gif) left center no-repeat;
		font-size: 10px;
		text-transform: uppercase;
		text-indent: 15px;
		padding: 5px 0;
		margin: 0 10px;}
	
/* INDEX NEWS
=====================================================================*/

div#indexevent {
	background: #fff;}
	#indexevent h1 {
		font-size: 18px;
		padding: 10px;
		margin: 0;
		background: #efefef;
		color: #900;}
	#indexevent h2 {
		font-size: 12px;
		font-family: arial;
		letter-spacing: 0px;
		padding: 10px 10px 5px;}
	#indexevent a {
		color: #900;}
	#indexevent p {
		padding: 0 10px 10px;
		font-size: 11px;}


/* FOOTER
=====================================================================*/

div#footer-index {
	clear: both;
	width: 100%;
	font-size: 10px;
	background: #ba1000 url(../images/footer-index_bg.jpg) 50% 0px no-repeat;}

div#footer-local {
	clear: both;
	width: 100%;
	height: 300px;
	font-size: 10px;
	background: #dcd4a7 url(../images/footer-local_bg.jpg) 50% 0px no-repeat;}

div#footer-width {
	position: relative;
	width: 990px;
	margin: 0 auto;
	padding: 30px 0;}

	/* DIV UTILITY NAV */
	div#utilnav {
		/*margin-left: 150px;*/
		font-size: 10px;
		padding: 0 40px;
		color: #fff;
		font-family: tahoma;}
		#utilnav ul {
			float: left;
			width: 250px;}
			#utilnav ul ul {
				float: none;}
		#utilnav ul li {
			margin: 0;}
		#utilnav ul ul li {
			margin: 0 20px;}
		#utilnav li a {
			display: block;
			padding: 3px 0;
			color: #ff9;
			font-family: tahoma;
			font-size: 9px;
			text-decoration: none;
			text-transform: uppercase;}
		#utilnav ul ul li a {
			display: block;
			padding: 3px 0;
			color: #fff;
			text-decoration: none;
			text-transform: capitalize;}
	
	/* DIV COPYRIGHT */
	div#copyright {
	position: absolute;
	background: #8a0400;
	top: 30px;
	left: 670px;
	width: 320px;
	height: 95px;
	border: 1px solid #eb3006;
	/*margin-left: 150px;*/
		font-size: 9px;
	color: #333;
	font-family: tahoma;
}
		#copyright address {
			font-style: normal;
		font-size: 10px;
			padding: 15px;
			color: #fff;}

/* FLOAT CLASSES
==========================================================================*/
.left {
	float: left;}
	
.left-paddingrt {
	float: left;
	margin-right: 10px;
	}
	
	
.right {
	float: right;}
.center {
	text-align: center;}
.clear {
	clear: both;}

/* SEARCHBOX
==========================================================================*/
div#searchbox {
	position: absolute;
	top: 45px;
	left: 714px;
	width: 271px;
	height: 40px;
}
	#searchbox div {
		padding: 10px 0 0;}
	#searchbox input#searchtext {
		background: #fff;
		width: 200px;
		border: 1px solid #222;
		margin: 0 5px 0 0;
		font-size: 11px;
		padding: 3px;}
	#searchbox input#searchbtn {
		margin: 0 0 0 5px;}


/* MAIN NAVIGATION
==========================================================================*/

div#nav {
	position: absolute;
	top: 163px;
	left: 0px;
	width: 980px;
	height: 50px;
	z-index: 10;
}

ul#navlist li a#current, ul#navlist li a#current:hover{
	background: #600 url(../images/nav_current.gif) top left no-repeat;
	color: #ff9;}

/* UL TAG */
ul#navlist {
	margin:0;
	padding:0;
	font-size:9px;
	text-transform:uppercase;
	font-family: tahoma;} 

ul#navlist li {
	list-style: none;
	float:left;
	position: relative;
	margin: 0 2px 0 0;
	padding:0;
	line-height:normal;
	text-indent:0;}

ul#navlist li a {
	display:block;
	padding: 8px 10px;
	/*width: 130px;*/
	color:#fff;
	text-decoration:none;
	text-align: center;
	background: #9f1701 url(../images/nav_off.gif) top right no-repeat;
	font-weight: bold;
	font-size:9px;
	font-family: tahoma;}

/**/* html #nav a {
	width: 1%;}

ul#navlist li a:hover {
	background: #900 url(../images/nav_on.gif)  top right no-repeat;
	color: #ff9;}


/* MAIN NAVIGATION DROPDOWN
==========================================================================*/
	
	
ul#navlist li ul { /* second-level lists */
	display: none;
	position: absolute;
	top: 25px;
	left: 0;
	list-style: none;
	margin: 0 0 0 0;
	padding: 0 0 0;
	background:#4f0600;
}

ul#navlist li>ul { /* to override top and left in browsers other than IE, which will position to the top right of the containing li, rather than bottom left */
	top: auto;
	left: auto;
}

ul#navlist li:hover ul, ul#navlist li.over ul { /* lists nested under hovered list items */
	display: block;
}

ul#navlist li ul li {
	float: none;
	margin: 0 0 0 0;
	text-transform: capitalize;
	background:#4f0600;}
	
ul#navlist li ul li a {
	background: #4f0600 url(../images/subnav_off.gif) top left no-repeat;
	width: 190px;
	padding: 10px 15px;
	text-align: left;
	color: #fff;}

ul#navlist li ul li a:hover {
	background: #fc0 url(../images/subnav_on.gif) top left no-repeat;
	color: #900;}


/* ------------------------------------------- */
/* ---------------- COMMENTS ----------------- */
/* ------------------------------------------- */

div#comments {
	padding: 0;
	width: 480px;}
	#comments h1 {
		padding: 15px 10px 10px;
		background: url(../images/box_h1.jpg) top left repeat-x;
		font-size: 18px;
		color: #fc0;}

div.commentbox {
	clear: both;
	padding: 10px 0 0;
	border-bottom: 1px solid #ccc;}
div.commentdate {
	float: left;
	width: 125px;
	text-align: right;}
	.commentdate p {
		font-size: 11px;}
	.commentdate a {
		font-size: 11px;}
div.commentavatar {
	float: left;
	width: 50px;
	padding: 10px 0;
	text-align: center;}
div.commentinfo {
	float: left;
	width: 303px;}
div.commentinfo dl {
	margin: 0;
	padding: 0 10px;}
	div.commentinfo dl dt {
		padding: 10px 0 0;
		margin: 0;
		font-size: 12px;
		font-weight: bold;}
	div.commentinfo dl dd {
		padding: 10px 0;
		margin: 0;
		font-size: 11px;}

div#commentform {
	padding: 20px 20px;}
	

#commentform label{
	font-weight: bold;
	color:#222;
}
#commentform label span{
	font-weight: normal;
}
#commentform input{
	width: 153px;
	background:#efefef;
	border: 1px solid #ccc;
	padding: 3px;
	margin-top: 3px;
}
#commentform textarea{
	width: 375px;
	height: 135px;
	background:#efefef;
	border: 1px solid #ccc;
	padding: 2px;
	margin-top: 3px;
}
#commentform .submitbutton {
	width: auto;
	padding: 4px 12px;
	font: bold 12px Arial, Helvetica, sans-serif;
	color: #FFFFFF;
	background: #666;
	border: none;
}
#commentform .submitbutton:hover {
	background: #fc0;
	color: #600;
}
#commentform textarea:focus, #commentform input[type="text"]:focus {
	background: #fff;}


/*--Secondary navigation for --*/
#mainnav{
	margin-left: 0px;
		
	}	
	
	#mainnav ul{
	height: 25px;
	width: 877px;
	
		}
		
		#mainnav ul li{
		display: inline;
		}
		
		
		#mainnav ul li a{
		font-family: Arial, Helvetica, sans-serif;
		font-size: 120%;
		float: left;
		color: #000;
		font-weight: bold;
		padding: 5px 10px 5px 10px;
		text-decoration: none;
		background: #dfd7ad;
		}
		
		#mainnav ul li a:visited{
			}
	
		
		#mainnav ul li a:hover{ 
		background: #fc0;
		color: #600;
		}
		
		#mainnav ul li .current{
		background: #fff;
		color: #333;
		}
		


div#banner170 {
	text-align: center;}
	
	
		
		table#tableform {
			margin: 20px 0;
			border: 0;
			font-family: Arial, Helvetica, sans-serif;
			font-size: 12px;}
			
		table#tableform td{
			padding: 10px 15px;}

/* FORM STYLE
==========================================================================*/

div.form {
	width: 450px;
	margin: 0 auto;
	padding-top: 20px;
	padding-right: 0;
	padding-bottom: 20px;
	padding-left: 0;
}

h1 {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 22px;
	font-weight: normal;
	letter-spacing:0px;
	padding: 25px 0 0;
}
		
		table.tableform {
			margin: 20px 0;
			width: 480px;
			border: 0;
			font-family: Arial, Helvetica, sans-serif;
			font-size: 12px;}
			
		table.tableform td{
			padding: 5px 5px;}	
		


/* ARTICLE DIV
=====================================================================*/

div#contentarticle {
	float: left;
	width: 810px;
	background: #fff;}
	
div#contentarticlecenter {
	margin: 0 auto;
	width: 650px;
	background: #fff;
}

img.specialarticleright {
float: right;
margin: 0px 0px 10px 10px;

}
	
div.indexnews {}
	.indexnews h3 {
		font-size: 12px;
		font-family: arial;
		font-weight: bold;
		letter-spacing: 0;
		padding: 10px 15px 0;}
		.indexnews h3 span {
			font-weight: normal;}
	.indexnews p {
		padding: 0 10px 5px;}
		
	.indexnews ul {
		padding: 5px 15px 10px;}
	.indexnews ul li {
		background: url(../images/bullet.gif) left center no-repeat;
		font-size: 10px;
		text-transform: uppercase;
		padding: 0 15px;}
	
div#indexevents {
	background: #c6c19a;
	padding: 0 0 15px;}
div#indexevents h1 {
		padding: 10px 15px;
		text-transform: uppercase;
		font-size: 14px;
		color: #000;
		background: #9f9b7b;}
	#indexevents h1 a {
		font-weight: normal;
		text-decoration: none;}
	#indexevents h3 {
		font-size: 12px;
		font-family: arial;
		font-weight: bold;
		letter-spacing: 0;
		padding: 10px;}
		.indexevents h3 span {
			font-weight: normal;}
		
	#indexevents ul {
		padding: 5px 15px;}
	#indexevents ul li {
		background: url(../images/bullet.gif) left center no-repeat;
		font-size: 10px;
		text-transform: uppercase;
		padding: 0 15px;}
		
div.indexside {
	background: #c6c19a;}
div.indexside h1 {
		padding: 10px 15px;
		text-transform: uppercase;
		font-size: 14px;
		color: #000;
		background: #9f9b7b;}
	.indexside h1 a {
		font-weight: normal;}
		
	.indexside p {
		padding: 10px 15px 0;}
		
	.indexside ul {
		padding: 15px 15px;}
	.indexside ul li {
		background: url(../images/bullet.gif) left center no-repeat;
		padding: 3px 15px;}


/* ABOUT > JURSIDICTIONS
==========================================================================*/

div.jurisdictions {
	width: 560px;}		
div.jurisdictions h3 {
	font-size: 13px;
	font-family: georgia;
	font-weight: normal;
	margin: 0;
	padding: 10px 0;
	text-align: center;}
	div.jurisdictions h3 span {
		font-weight: normal;
		font-size: 12px;
		letter-spacing: 0;}
	.jurisdictions .jurisdiction {
		float: left;
		width: 33%;
		padding: 10px 0;
		text-align: center;}


/* CALENDAR OF EVENTS
==========================================================================*/

h2.eventyear {
	font-size: 24px;
	border: 0px;}

h4.eventtitle {
	position: relative;
	padding: 15px 0px 5px;
	margin: 0 0px 5px 10px;
		border-bottom: 1px solid #ccc;
	font-size: 16px;}
	.eventtitle span {
	display: block;
	position: absolute;
	top: 18px;
	right: 0;
	width: 235px;
	text-align: right;
	color: #990000;
}

div#eventarticle {
	float: left;
	width: 560px;}
	#eventarticle h2 {
		padding: 15px 10px 5px;
		font-size: 22px;}
	#eventarticle a { text-decoration: none;
		font-weight: bold;}
	#eventarticle p {
		padding: 10px;
		font-size: 12px;
		line-height: 18px;}


table#marriage {
padding: 10px;
width: 550px;
margin-left: 10px;
}

table#marriage tr td {
font-size:11px;
text-align:left;
vertical-align:top;
padding: 5px;
}

div#prayerrequest {
width: 300px;
text-align:center;
position:relative;
background-color:#FFFFFF;
padding-top:10px;
padding-bottom: 10px;
}
