body {
	background: #183E05 url(/images/interface/background.jpg) repeat-x top center;
	color: #555;
	margin: 0;
}
	/* fall style 
	
	body {
		background: url("/images/interface/background_fall.jpg") repeat-x scroll center top #3B3600;
	}
*/
#content a {
	font-weight: bold;
	color: #4D991F;
	text-decoration: none;
}

#leaf {
	
	padding: 2em 0;
}


#wrap {
	position: relative;
	width: 811px;
}

#header #logo { margin: 0; padding: 0; width: 416px; float: left; }
#header #logo a { text-indent:-999em; display: block; width: 416px; height: 75px; background: url(/images/interface/ccc_logo.png) no-repeat 0 0; }

#super-nav { text-align: right; margin: 0; width: 395px; float: right; height: 75px;  }
#super-nav li { color: #fff; font-weight: bold; list-style: none; font-size: 15px; line-height:26px; }
#super-nav li a { color: #E3F391; font-weight: normal; text-decoration: none;  }

	


#header-nav { width: 801px; padding:0 5px; height: 37px; margin-top: 15px; background: #1BA6C5; border-top: solid 1px #10C7E9; float: left; }
#header-nav li { padding:0px 4px; list-style: none; float: left; background: url(/images/interface/navigation_seperator.png) no-repeat right bottom; }
#header-nav li a { padding: 7px; color: #fff; font-size: 15px; text-decoration: none; float: left; }
#header-nav li a:hover { color: #94ecff; }
#header-nav li.current { background: none; }
#header-nav li.current a { background:url("/images/interface/nav_select_bg.png") repeat-x scroll center top #FFFFFF; border:6px solid #FFFFFF; color:#444444; position:relative; top:-11px; }

#content { background: #fff; padding: 20px 17px; position: relative; }

#feature #welcome { width: 220px; height: 208px; padding: 20px; background: url(/images/interface/welcome_bg.png) no-repeat center center; }

#rotator { 
	background:url("/images/interface/rotator.png") no-repeat scroll right top transparent;
	height:239px;
	padding:27px 41px 48px 43px;
	position:absolute;
	right:-34px;
	top:-5px;
	width:478px;
}
#rotator ul { margin: 0; }
#rotator li { list-style: none; }
#rotator a { width: 478px; height: 239px; outline: none; }
#content #rotator img { margin: 0; padding: 0;  border: none; }

#page {
	background:url("/images/interface/top_shade.jpg") no-repeat scroll -50px -45px transparent;
	float:left;
	margin-top:20px;
	padding:0 10px;
	min-height: 560px;
}

#page.inside {
	background: url("/images/interface/top_shade.jpg") no-repeat scroll -50px -67px transparent;
}
	#main_column {
		width: 500px;
		float: left;
		padding: 20px 25px 20px 2px;
	}
	#sidebar { font-size: 0.9em; }
	#sidebar.right {
		width: 200px;
		float: right;
		padding: 20px 10px 20px 20px;
		
		background: url("/images/interface/column_seperator.png") no-repeat top left;
		
	}
	
	#sidebar a {
		font-weight: normal;
	}

#news_col {
	width: 226px;
	float: left;
	background: url("/images/interface/column_seperator.png") no-repeat top right;
	margin-right: 25px;
	padding-right: 25px;
	padding-top: 20px;
}
	#newsletter {
		border-bottom: solid 1px #ddd;
		margin-bottom: 20px;
		padding-bottom: 10px;
	}
	
	#newsletter .shade {
		padding: 2px 5px;
		background: #eee;
		text-align: center;
		font-size: 12px;
	}

	#newsletter input[type="text"] {
		background:none repeat scroll 0 0 #FFFFFF;
		border:1px solid #DDDDDD;
		color:#666666;
		margin-bottom:5px;
		padding:4px;
		position:relative;
		top:3px;
		width: 140px;
	}
	
	#newsletter input[type="submit"] {
		border: none;
		background: url("/images/interface/submit_btn.png") no-repeat top center;
		text-indent: -999em;
		width: 72px;
		height: 31px;
		margin-bottom: 4px;
		cursor: pointer;
		font-size: 0;
		line-height: 0;
	}
		#newsletter input[type="submit"]:hover {
			background: url("/images/interface/submit_btn.png") no-repeat center -32px;
		}
	
	#newsletter label {
		font-weight: normal;
	}



h2 {
	color:#038DBB;
	font-family: "Arial Black", Arial Black, Gadget, sans-serif;
	font-size:19px;
	font-weight:bold;
	letter-spacing:-1px;
	line-height:24px;
}

h3 {
	color:#555;
	font-family: "Arial Black", Arial Black, Gadget, sans-serif;
	font-size:16px;
	font-weight:bold;
	letter-spacing:0px;
	line-height:18px;
}

#articles_col {
	float:left;
	margin-right:25px;
	padding-top:20px;
	width:290px;
	text-align: justify;
}

#thin_col {
	padding-top: 20px;
	float: left;
	width: 165px;
	font-size: 12px;
}

ul.eventlist {
	margin: 0;
}

#content ul.eventlist li {
	list-style: none;
	background: url("/images/interface/date.png") no-repeat 0px 1px;
	padding-left: 24px;
	font-size: 10px;
	text-transform: uppercase;
	border-bottom: solid 1px #ddd;
	padding-bottom: 5px;
	margin-bottom: 10px;
}
	#content ul.eventlist li a {
		display: block;
		font-size: 12.8px;
		text-transform: none;
	}
	
#content ul.articlelist {
	margin: 0;
}
	#content ul.articlelist li.article {
		border-bottom:1px solid #DDDDDD;
		list-style:none outside none;
		margin-bottom:10px;
		padding-bottom:10px;
		position:relative;
		
	}
		#content ul.articlelist li.article span.date {
			margin: 0;
			background: #eee;
			padding: 2px 5px;
			color: #999;
			font-size: 11px;
			text-align: right;
			display: block;
		}
	#content ul.articlelist li.short span.date {
		background:none repeat scroll 0 0 transparent;
		position:absolute;
		right:0;
		top:0;
	}
	
	#content ul.articlelist li.short span.title a {
		color: #444 !important;
	}
		#content ul.articlelist li span.date a {
			color: #777 !important;
			font-weight: normal;
		}
	
#content div.player {
	background:url("/images/interface/sermon_bg.png") no-repeat scroll center top transparent;
	padding:40px 15px 25px;
	position:relative;
	width:130px;
}

	#content div.player.redraw {
		background: #0096b6;
		background: #0096b6 -webkit-gradient(
		    linear,
		    left bottom,
		    left top,
		    color-stop(0, rgb(0,122,163)),
		    color-stop(0.9, rgb(0,171,197))
		);
		
		background: #0096b6 -moz-linear-gradient(
		    center bottom,
		    rgb(0,122,163) 0%,
		    rgb(0,171,197) 90%
		);
		
		-webkit-border-radius: 4px;
		-moz-border-radius: 4px;
		border-radius: 4px;
		
		-moz-box-shadow:0 3px 0px #005573, -1px 1px 1px #005573, 1px 1px 1px #005573, 0 5px 4px rgba(0, 0, 0, 0.4);
		-webkit-box-shadow:0 3px 0px #005573, -1px 1px 1px #005573, 1px 1px 1px #005573, 0 5px 4px rgba(0, 0, 0, 0.4);
		box-shadow:0 3px 0px #005573, -1px 1px 1px #005573, 1px 1px 1px #005573, 0 5px 4px rgba(0, 0, 0, 0.4);
		
		
		
		width: 220px;
		padding:10px 10px 2px;
		position:absolute;
		right:0;
		top:0;
	}
		#content div.player.redraw.small {
			position: relative;
			width: 140px;
			padding: 10px;
		}
	
	#content div.player #play {
		background:url("/images/interface/sermon_buttons.png") no-repeat scroll 0 0 transparent;
		height:19px;
		position:absolute;
		right:26px;
		text-indent:-999em;
		top:10px;
		width:19px;
	}	
		#content div.player #play:hover { background-position: left bottom; }
	
	#content div.player #save {
		background:url("/images/interface/sermon_buttons.png") no-repeat scroll right 0 transparent;
		height:19px;
		position:absolute;
		right:8px;
		text-indent:-999em;
		top:10px;
		width:18px;
	}
		#content div.player #save:hover { background-position: right bottom; }
	
	#content div.player #download {
		
		background:url("/images/interface/ipod.png") no-repeat scroll 5px 3px #07617E;
		color:#7BDEF3;
		font-size:10px;
		font-weight:normal;
		padding:2px 6px 2px 20px;
		position:absolute;
		right:7px;
		text-transform:uppercase;
		top:7px;
		
		
	}
		#content div.player #download:hover {
			background: url("/images/interface/ipod.png") no-repeat scroll 5px 3px #fff;
			color: #07617E;
		}
		
		#content div.player.redraw.small #download {
			height:16px;
			overflow:hidden;
			padding-left:15px;
			right:5px;
			text-indent:-9999px;
			top:6px;
			width:0;
		} 
	
	#content div.player h4.title a {
		color: #fff;
		font-size: 13px;
	}
	
	#content div.player p.date {
		color: #005573;
		font-size: 11px;
		text-transform: uppercase;
		margin-bottom: 0px;
	}
	
	#content div.player .player-swf {
		height:24px;
		left:-7px;
		margin-bottom:4px;
		margin-top:8px;
		overflow:hidden;
		position:relative;
		width:230px;
	}
		#content div.player.redraw.small .player-swf {
			width: 160px;
			left: -10px;	
			margin-bottom: 10px;		
		}

	#content div.player h4.title {
		color: #fff;
		width:172px;
	}	
		#content div.player.redraw.small h4.title {
			width: 140px !important;
			
		}

	#content div.player h4.title a {
		color: #fff;
		font-size: 13px;
	
	}
	
	#content div.player div.date {
		color:#71DBE1;
		text-transform:uppercase;
	}

#content .spotlight a.photo_frame {
	display:block;
	position:relative;
	text-align:center;
	margin-top:10px;
	width: 160px;
	float: left;
	clear: left;
	margin-bottom:10px;
}
	#content .spotlight a.photo_frame img {
		margin: 0;
	}
	
	#content .spotlight a.photo_frame span {
		bottom:9px;
		color:#555555;
		display:block;
		position:absolute;
		text-align:center;
		width:165px;
		left: 0;
	}
	
	#content .spotlight .facts {
		width: 329px;
		float: left;
		margin-top: 10px;
		font-size: 12px;
		padding-top: 5px;
	}
	
	#content .facts {
		
		
		margin-bottom: 10px;
		font-size: 12px;
		
	}
		#content .spotlight .facts p {
			line-height:16px;
			margin-bottom:3px;
		}
		
		#content .facts p {
			margin-bottom:10px;
		}
		
		#content .facts p strong {
			display: block;
		}

#content em {
	background:none repeat scroll 0 0 #FFFDAB;
	font-style:normal;
	font-weight:bold;
}

#content img,
#content p.caption {
	background: #fff;
	padding: 5px;
	border-top:1px solid #EEEEEE;
	
	-moz-box-shadow: 0 3px 5px rgba(0,0,0,0.2);
	-webkit-box-shadow: 0 3px 5px rgba(0,0,0,0.2);
	box-shadow: 0 3px 5px rgba(0,0,0,0.2);
}

#map {
	background: #fff;
	border:5px solid #fff;
	
	-moz-box-shadow: 0 3px 5px rgba(0,0,0,0.2);
	-webkit-box-shadow: 0 3px 5px rgba(0,0,0,0.2);
	box-shadow: 0 3px 5px rgba(0,0,0,0.2);
}

#content img.none,
#content p.caption img,
#map img {
	border: none;
	padding: 0;
	background: transparent;
	margin: 0;
	
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
	box-shadow: none;

}

#content p.caption span {
	display: block;
	font-size: 11px;
	text-align: center;
	line-height: 25px;;
}

#content img.left {
	float: left;
	margin-right: 15px;
}

#content img.right {
	float: right;
	margin-left: 15px;
}

#content h1 {
	color: #0089AD;
	font-size: 30px;
	margin-top: 15px;
}

#content blockquote {
	border:10px solid #333333;
	font-size:18px;
	font-style:normal;
	font-weight:bold;
	margin:0 0 20px;
	padding:20px 20px 5px 20px;
	line-height: 30px;
	
}
	#content blockquote p {
		margin-bottom: 15px;	
	}

#content blockquote em {
	background: url("/images/interface/blockquote.jpg") repeat center center;
	color: #fff;
}


#footer {
	background: #fff url(http://cccbham.ehclients.com/images/interface/top_shade.jpg) no-repeat 50% -75px;
	float:left;
	margin:20px 40px 0;
	padding:15px 10px;
	width:675px;
	
}
	#footer ul { margin: 0; }
	#footer ul li { list-style: none; float: left; padding: 2px 10px; }
	#footer ul li a { float: left; font-weight: normal; color: #999; }

#copyright {
	margin-top: 15px;
	position: relative;
}

#footermsg {
	position:absolute;
	top:0;
}

#copy {
	float:right;
	position:absolute;
	right:0;
	text-align:right;	
}

#copy p {
	color: #519229;
	margin: 0;
	font-size: 11px;
}

#copy a {
	color: #7EAB3E;
	text-decoration: none;
}
	#copy a:hover { text-decoration: underline; }


#content table {
	border-collapse:collapse;
}
	#content th, td {
		border: solid 1px #ddd;
		padding:2px 5px;
	}
	#content th {
		background: #eee;
	}
	
	#content table a {
		font-weight: normal;
	}
	
#sidebar h2 {
	border-bottom: solid 1px #ddd;
	margin-bottom: 10px;
	padding-bottom: 10px;
	
}
#sidebar h2 a {
	color: #1BA6C5;
}
	
#nav_sub {
	margin: 0;
	list-style: none;
	position: relative;
	left: -10px;
	padding-bottom: 10px;
}

	#nav_sub li a {
		padding: 5px 10px;
		font-size: 1.2em;
		list-style: none;
		margin: 5px 0;
		display: block;
		color: #555;
		
		
	}
	
	#nav_sub li.active a {
		background: #555;
		color: #fff;
		

	}
	
	#nav_sub li a:hover {
		background: #999;
		color: #fff;
	}
	
div.events div.event {
	
	border-bottom:1px solid #DDDDDD;
	border-top:1px solid #FFFFFF;
	padding-bottom:10px;
	padding-left:80px;
	padding-top:20px;
	position:relative;
	height: 68px;
}
	div.events div.base { background:none repeat scroll 0 0 #f5f5f5; }
	div.events div.alt { background:none repeat scroll 0 0 #EEEEEE; }
	.events .event h2.event_title { margin-bottom: 0; width: 275px;  }
	
	.events .event_date_icon {
		height:64px;
		left:20px;
		position:absolute;
		top:20px;
		width:64px;
		z-index:3;
	}
	
		.events .event_date_icon.inside {
			height:64px;
			left:0px;
			position:relative;
			float: right;
			top:0px;
			width:64px;
			z-index:3;
		}
	
	.events div.date_time {
		font-size:10px;
		text-transform:uppercase;
	}
	
	.events a.details {
		color: #888 !important;;
		
		padding: 4px 8px;
		display: block;
		width: 100px;
		text-align: center;
		border: solid 1px #ddd;
		position: absolute;
		top: 20px;
		right: 20px;
		font-size: 12px;
		
		background: #fff;
		
		
		
	}
	
	.events a.details:hover {
		background: #fff;	
		
	}
	
	.events div.location {
		bottom:20px;
		font-size:12px;
		position:absolute;
		right:20px;
		text-align:right;
		width:300px;
	}
	
	.events .event_date_icon .month {
		
		
		background:none repeat scroll 0 0 #1BA6C5;
		color:#FFFFFF;
		display:block;
		font-size:12px;
		font-weight:bold;
		height:20px;
		padding:0 2px;
		text-align:center;
		width:41px;
		
		border-top:1px solid #127787;
		border-left:1px solid #127787;
		border-right:1px solid #127787;
	}
	
	div.events .event_date_icon .day {
		
		
		
		
		
		background: #fff;
		
		
		border-bottom:1px solid #127787;
		border-left:1px solid #127787;
		border-right:1px solid #127787;
		display:block;
		font-size:22px;
		font-weight:700;
		height:18px;
		padding:5px 10px;
		text-align:center;
		width:25px;
		line-height:17px;
	}

a#vcal {
	border: solid 1px #ddd;
	background: #fff;
	padding: 10px;
	display: block;
	
	
	position: relative;
	font-size: 12px;
	color: #555;
	font-weight: bold;
	margin-bottom: 20px;
}
	a#vcal img {
		float: left;
		margin-right: 5px !important;
		margin-bottom: 15px !important;
	}
	
	a#vcal span {
		color:#999999;
		display:block;
		font-size:10px;
		font-weight:normal;
	}
div.share {
	text-align: right;
	clear: both;
	padding-bottom: 15px;
}
	div.share h3 { 
		display: inline; 
		font-size: 12px;
	}
	
	div.share img { 
		position: relative;
		top: 4px;
	}

#datepicker {
	margin-bottom: 10px;
}
div.calendar {
	margin-bottom: 20px;
}

.sermon {
	border-bottom:2px dotted #EEEEEE;
	margin-bottom:2em;
	padding-bottom:5px;
	position:relative;
}

	.sermon .description {
		border:7px solid #eee;
		font-size:12px;
		font-style:italic;
		line-height:20px;
		margin:10px 0;
		padding:15px 15px 0;
	}
	
	.sermon h2 {
		width: 250px;
		font-size: 18px;
	}
	
	.sermon .count {
		background-color: rgba(0, 0, 0, 0.1);
		color:rgba(0, 0, 0, 0.2);
		font-size:14px;
		font-weight:bold;
		left:-30px;
		padding:0 4px;
		position:absolute;
		text-align:right;
		top:-1px;
		width:16px;
		z-index:0;
		
		
	}


.sermon .controls .player_frame {
	border-top:2px solid #E8E0CD;
	float:left;
	height:24px;
	margin-top:5px;
	overflow:hidden;
	position:relative;
	width:230px;
	z-index:2;
}

.sermon .controls .player {
	display:none;
	height:1px;
	position:absolute;
	top:-24px;
	width:230px;
	z-index:-1;
}

.sermon .controls .shown {
	display:block;
}

#content #cg_list {
	list-style: none;
	margin: 0;
}
	#content #cg_list li {
		list-style: none;
		padding: 0;
	}
	
	#content #cg_list li a {
		display: block;
		padding: 5px 5px 5px 30px;
		margin-bottom: 15px;
		background: url("/images/interface/home.png") no-repeat 5px 5px;
		
		border-top:1px solid #EEEEEE;
		
		
	}
		#content #cg_list li a:hover {
			background: #1BA6C5 url("/images/interface/home.png") no-repeat 5px 5px;
			color: #fff;

		}
	
	#content #cg_list li a span {
		display: block;
		color: #777;
		
	}
		#content #cg_list li a:hover span {
			color: #80dbef;
		}

.infoContainer {
	font-size: 11px;
}
	.infoContainer .image {
		background: #fff;
		padding: 5px;
		border-top:1px solid #EEEEEE;
		margin-top: 5px;
		width: 150px;
		position: relative;
		left: 5px;
		margin-bottom: 10px;
		

	}
	.infoContainer .email {
		background: url("/images/interface/email.png") no-repeat 0 0;
		padding-left: 20px;
		margin-bottom: 5px;
	}
	.infoContainer .phone {
		background: url("/images/interface/phone.png") no-repeat 0 0;
		padding-left: 20px;
		margin-bottom: 5px;
	}
	.infoContainer .address {
		background: url("/images/interface/book_open_mark.png") no-repeat 0 0;
		padding-left: 20px;
		margin-bottom: 5px;
	}
	.infoContainer .time {
		background: url("/images/interface/date.png") no-repeat 0 0;
		padding-left: 20px;
		margin-bottom: 5px;
	}				

ul.pagination {
	border: solid 3px #eee;
	height: 24px;
	position: relative;
	padding: 0;
	margin: 0;
}
	ul.pagination li {
		list-style: none;
		padding: 0;
		position: absolute;
		width: 80px;
		background: #eee;
		top: 2px;
		text-align: center;
		height: 20px;
	}
		#content ul.pagination li a {
			color: #888;
			font-weight: normal;
			font-size: 10px;
			text-transform: uppercase;
			display: block;
			line-height: 22px;
		}
			#content ul.pagination li a:hover {
				background: #00AAC5;
				color: #fff;
			}

	ul.pagination .page_total {
		left:166px;
		width:162px;
		color: #888;
		font-weight: normal;
		font-size: 10px;
		text-transform: uppercase;
		line-height: 22px;
	}
	
	ul.pagination .next {
		right: 84px;
		background: #e5e5e5;
	}
	
	ul.pagination .end {
		right: 2px;
		background: #dcdcdc;
	}
	
	ul.pagination .previous {
		left: 84px;
		background: #e5e5e5;
	}
	
	ul.pagination .beginning {
		left: 2px;
		background: #dcdcdc;
	}
	
	ul.pagination .here {
		display: none;
	}

#rotator .nav {
	bottom:57px;
	position:absolute;
	right:51px;
	z-index:99;
}
	#rotator .nav a {
		
		
		background-color: rgba(0, 0, 0, 0.5);
		display:block;
		float:left;
		height:5px;
		margin-left:8px;
		padding:2px;
		text-indent:-999em;
		width:5px;
		outline: none;
		
	}
		#rotator .nav a.activeSlide {
			background-color: rgba(255, 255, 255, 0.5);

			
		}
		
	#rotator .Top-Left {
		left:15px;
		position:absolute;
		top:15px;
	}
	
	#rotator .Top-Right {
		right:15px;
		position:absolute;
		top:15px;
		text-align: right;
	}
	
	#rotator .Bottom-Right {
		right:15px;
		position:absolute;
		bottom:15px;
		text-align: right;
	}
	
	#rotator .Bottom-Left {
		left:15px;
		position:absolute;
		bottom:15px;
	}