/* @override http://christthekingpresbyterianchurch.cpmpreview1.com/css/styles.css */
/*=====
SITE: Christ the King
FILE: styles.css - main CSS styles for staging site
CREATED: 6/11/2008
MODIFIED: 6/19/2008
AUTHOR: Ben Otero (ben@churchplantmedia.com)
=====*/

/* @group GLOBAL */
html						{ height:100%; }
body 						{ 
							  background:#292927 url(/images/body_bg.gif) repeat-x; margin:0; padding:0; font-size:62.5%; 
							  font-family:"Lucida Grande", arial, helvetica, sans-serif; color:#2A3135; height:100%;
							}
hr 							{ display: none; }

#container 					{ margin:0 auto; width:960px; min-height:85%; position:relative; }
#mainContent 				{ position:relative; width:960px; padding-top:10px; }
a 							{ overflow: hidden; }

.clearfix:after 			{ content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.clearfix 					{ display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix 			{ height: 1%;}
.clearfix 					{ display: block;}
/* End hide from IE-mac */
/* @end */

/* @group HEADER */
#header 				{ position:relative; z-index:1000; width:960px; height:149px; }
h1, h1 a				{ display:block; width:343px; height:60px; }
h1						{ background:url(/images/logo.gif) no-repeat; text-indent:-999em; position:absolute; top:18px; left:-22px; }
h1 a:focus				{ outline:none; }

#service-times			{ 
						  position:absolute; top:12px; right:4px; display:block; padding:0 20px 0 0; height:43px; 
						  background:url(/images/service_right_bg.gif) no-repeat top right;
						}
#service-times p		{ line-height:43px; margin:0; padding-left:17px;font-size:1.3em; color:#fcfbf8; background:url(/images/service_left_bg.gif) no-repeat left top; }
#service-times a		{ padding:4px; color:#f4efe5; background:#8a320c; text-decoration:none; margin-left:8px; }
#service-times a:hover	{ background:#b63c08; }
#skip 					{ position: absolute; text-indent: -9999px; list-style: none; overflow-x:hidden; }
/* @end */

/* @group NAVIGATION */
#nav, #nav * 			{ list-style:none; margin:0; padding:0}
#nav 					{ height:40px; position:absolute; left:0; bottom:0; border:1px solid #c65e30; border-width:1px 0; width:960px; }
#nav li 				{ float:left; } 
#nav li.current a, 		
#nav li.current:hover a { background:#8a320c }
#nav li a 				{ 
						  display:block; font-size:1.4em; margin:0 2px; padding:0 23px; line-height:35px; color:#f2f0e6; text-decoration:none; 
						  margin-top:3px; text-transform:uppercase; 
						}
#nav li a:hover			{ background:#a34015; padding:0 23px;  }
#nav li ul				{ display:none;  }
/* @end */

/* @group BANNER */
#banner					{ display:block; width:1004px; height:270px; background:url(/images/sub_banner_bg.jpg) no-repeat; position:relative; left:-22px; top:10px; }
#banner-inner			{ 
						  float:left; display:block; width:960px; height:248px; background:url(/mediafiles/subpage-header.jpg) no-repeat; 
						  margin-left:22px; margin-top:0; 
						}
/* @end */


/* @group CONTENT */
#content						{ float:left; width:660px; margin-left:23px;}
#content.wide					{ float:none; width:880px; }
#content p,
#content li,
#content td						{ font-size:1.2em; line-height:1.5em; color:#c1c1bd; }
#content li p,
#contnet td *					{ font-size:1em; line-height:1; }

#content a						{ color:#6abae6; }
#content a:hover				{ text-decoration:none; }

img.left-align					{ float:left; position:relative; left:-10px; margin:0 0 5px; }
img.right-align					{ float:right; position:relative; right:-10px; margin:0 0 5px; }
img.no-border					{ border:0; }

#content h2				{ margin-bottom:0; }
#content h3, #content h4,
#content h5, #content h6{ color:#6abae6 }
#content h3				{ font-size:1.6em; }
#content h4				{ font-size:1.5em; }
#content .article h4	{ margin-bottom:0; }
#content p				{ margin-top:3px; }
#content h5				{ font-size:1.4em; }
#content h6				{ font-size:1.3em; }
/* @end */




/* @group SIDEBAR */
#sidebar				{ 
						  float:right; width:220px; background:url(/images/sidebar_bg.gif) no-repeat;
						  position:relative;  
						}
#sidebar img			{ border:0; }

.box					{ background:url(/images/box_bg.gif) repeat-y left top; }
.box-btm				{ 
						  background:url(/images/box_btm.gif) no-repeat left bottom; display:block; height:20px; width:235px; 
						  position:relative;
						}

/* @group EVENTS */
#sidebar #events h3			{ background:url(/images/sidebar_bg.gif) no-repeat; display:block; margin:0 -17px; padding:10px 17px; }
#sidebar #events.box		{ padding-top:0; }
#sidebar #events h4			{ font-size:1.3em; }
#sidebar #events .date		{ padding:3px; }
/* @end */

/* @group SUBNAV */
#subnav .box-btm		{ margin:0; }
#subnav					{ margin-top:5px; margin-bottom:1.5em; padding:7px 17px 0 17px; background:url(/images/box_bg.gif) repeat-y left top; }
#subnav .box-btm		{ margin-left:-17px; }
#snav, #snav *			{ margin:0; padding:0; list-style:none; }
#snav li				{ display:none; } 

#articles li#snav_resources,
#articles li#snav_resources li,
#sermons li#snav_resources,
#sermons li#snav_resources li,
#snav li.current,
#snav li.current li		{ display:block; }
#snav li.current li li	{ display:none; }
#snav li li.current li,
#snav li li.active li	{ display:block; } 

#articles li#snav_resources a,
#sermons li#snav_resources a,
#snav li.current a		{ 
						  display:block; font-size:14px; font-weight:bold; text-decoration:none; color:#fff; 
						  padding:0 7px 9px; border-bottom:1px solid #212121; margin-bottom:7px; 
						}	
						
#articles li#snav_resources li a,							
#sermons li#snav_resources li a,
#snav li.current li a	{ font-size:12px; font-weight:normal; color:#939393; padding:0 7px; margin:0; border:0; height:28px; line-height:28px; }	 

#snav li.current li a:hover	{ text-decoration:underline; color:#525252; }

#articles li#snav_resources li#snav_resources_articles a,	
#sermons li#snav_resources li#snav_resources_sermons a,
#snav li li.current a:hover,
#snav li li.current a	{  
						  background:url(/images/current_arrow.gif) no-repeat; position:relative; left:-6px;
						  padding:0 0 0 16px; height:28px; color:#fff; margin:0; line-height:28px; width:189px; text-decoration:none;
						} 
#sermons li#snav_resources li a:hover,
#articles li#snav_resources li a:hover,
#snav li li a:hover		{ color:#525252; }

/* 3RD LEVELS - initially hide 3rd levels */

#snav li li.active a,
#snav li li.current.active a	{ background:url(/images/right_arrow.gif) no-repeat right center; display:inline; padding-right:10px; color:#939393; }
#snav li li.current.active a:hover	{  text-decoration:underline; color:#525252; }
#snav li.current li li a		{ margin-left:15px; }
#snav li li.active li a,
#snav li li.current li a:hover,
#snav li li.current li a		{ background:none; color:#939393; text-decoration:none; margin-left:15px; }
#snav li li.current li a:hover	{ text-decoration:underline; } 
#snav li li.active li.current a:hover,
#snav li li.active li.current a	{ 
							  	  left:-32px; padding-left:38px; width:175px; background:url(/images/current_arrow.gif) no-repeat; 
							  	  color:#fff; text-decoration:none; display:block;
							  	}
/* SERMON AND ARTICLE PAGE CORRECTIONS */
#events li#snav_home,
#articles li#snav_home,
#sermons  li#snav_home	{ display:none; }
/*@end subnav*/
/* @end */


/* @group FOOTER */
#footer-wrap	{ background:#141413; height:125px; margin-top:40px; }
#footer 		{ width:920px; margin:0 auto; padding:20px 0;}
#footer p 		{ font-size:1.2em; color:#5c5c59; margin:0; padding:0; font-family:georgia, times, serif; width:auto; float:left; }
#footer a		{ 
				  display:block; width:140px; height:21px; background:url(/images/cpm_logo.gif) no-repeat; text-indent:-999em; 
				  float:right;
				}
#footer a:hover	{ background-position:left bottom; }
#footer a:focus	{ outline:none; }
/* @end */


/* @group SERMONS */
#filter								{ margin-top:2em; }
#filter select						{ width:100px; margin-left:10px; }
#filter a							{ margin-left:20px; }
#primaryContent .sermonlist h4		{ margin:0; padding:10px 0; }
.sermonbox							{ position:relative; padding:10px 0; }
.sermonbox a						{ text-decoration:underline; }
.sermonbox a:hover					{ text-decoration:none; }

#content .sermonbox h5				{ margin:0; }
#content .sermonbox h5 span			{ font-size:10px; margin-left:10px; color:#fff;}
.sermonbox h5 a 					{ font-weight:bold; }
.sermonbox h5 a:hover 				{ color:#556c6b }
#content .sermonbox p				{ margin:0;}


.sermonbox ul					{ position:absolute; top:20px; right:10px; margin:0; padding:0; list-style: none;}
.sermonbox li					{ float:left; display:inline; margin-right:5px; }
.sermonbox li a					{ display:block; width:16px; height:16px; text-indent:-999em; }
.sermonbox li.sl_listen a		{ background:url(/images/play_icon.gif) no-repeat; }
.sermonbox li.sl_download a		{ background:url(/images/download_icon.gif) no-repeat; }
.sermonbox li.sl_notes a		{ background:url(/images/notes_icon.gif) no-repeat; }
.sermonbox li.sl_video a		{ background:url(/images/video_icon.gif) no-repeat; }
.sermonbox li a:focus			{ outline:none; }

	/* @group MEDIA BOX */
	#text						{  }
	#byline						{ margin:10px 0 0; padding:0; list-style:none; }
	#mediabox,
	#events						{ margin:5px 0 0; padding:7px 17px 0; width:186px; background:url(/images/box_bg.gif) repeat-y; }
	#mediabox h3,
	#events h3					{ font-size:1.4em; color:#fff; margin-top:3px; }
	#mediabox ul				{ margin:0; padding:0; list-style:none; }
	#mediabox li 				{ padding:2px 0 2px 20px; }
	#mediabox li a				{ color:#939393; font-size:1.2em; text-decoration:none; }
	#mediabox li#mb_jukebox		{ background:url(/images/play_icon_app.gif) no-repeat left 2px; }
	#mediabox li#mb_download	{ background:url(/images/download_icon_app.gif) no-repeat left 2px; }
	#mediabox li#mb_notes		{ background:url(/images/notes_icon_app.gif) no-repeat left 2px; }
	#mediabox li#mb_video		{ background:url(/images/video_icon_app.gif) no-repeat left 2px; }
	#mediabox li#mb_podcast		{ background:url(/images/feed_icon_app.gif) no-repeat left 2px; }
	/* @end */


	/* @group HOW IT WORKS */
	#how-it-works				{ margin:0 0 2.5em; padding:0; list-style:none; background:#141413; height:30px; }	
	#how-it-works ul			{ margin:0; padding:0; list-style:none; }
	#how-it-works li			{ padding-left:20px; margin-bottom:1.5em; font-size:1.2em; display:inline; line-height:30px; margin-right:30px;}
	#how-it-works li#play		{ background:url(/images/play_icon.gif) no-repeat; }
	#how-it-works li#notes		{ background:url(/images/notes_icon.gif) no-repeat; }
	#how-it-works li#video		{ background:url(/images/video_icon.gif) no-repeat; }
	#how-it-works li#save		{ background:url(/images/download_icon.gif) no-repeat; }
	/* @end */
	
	/* @group SORTING */
	#sorting					{ padding:17px; margin-top:2.5em; }
	#sorting h3					{ 
								  background:url(/images/sidebar_bg.gif) no-repeat left top; padding:17px; margin:-17px -17px 0; 
								  font-size:1.4em; color:#fff;
								}
	#sorting label,
	#sorting select				{ display:block; }
	#sorting label				{ margin-bottom:.5em; color:#939393 }
	#sorting select				{ width:100%; margin-bottom:1.5em; }
	#sorting a					{ color:#939393; font-size:1.2em; }
	#sorting a:hover			{ text-decoration: none; }
	#mediabox .box-btm,
	#sorting .box-btm,
	.box-btm					{ margin:0 -17px -17px; }
	/* @end */
	
	/* @group EVENTS */
	#events .event			{ position:relative; border-top:1px dashed #363633; padding:11px 0 13px;}
	#events .first			{ border:none; }
	#events h4				{ font:normal 1.6em georgia, times, serif; margin:0; width:70%; }
	#events h4 a			{ color:#f2f0e6; text-decoration:none }
	#events h4 a:hover		{ text-decoration:underline; }
	#events p				{ font-size:1.1em; color:#c1c1bd; }
	.event span.date		{ position:absolute; top:8px; right:0; padding:5px; color:#7b7b76;  background:#333331; }	
	/* @end */

/* @end */

/* @group CALENDAR */
#content .calendar				{ margin-bottom: 25px; border-collapse: collapse; width:100%; }
#content .calendar caption		{ padding-bottom: 10px; color: #939393; font-size: 1.4em; }
#content .calendar th			{ padding: 6px 0; background:#141413; color:#939393;  font-size: 1.3em; font-weight: normal; }
#content .calendar td			{ 
											  width: 68px; height: 68px; padding: 2px; border: 1px solid #fff; border-left: 0;
											  border-top: 0; background:#f4f4f4; color:#55636b; font-size: 1em; vertical-align: top; 
											}
#content .calendar td a			{ text-decoration: none; color:#ba5022; }
#content  .calendar td ul		{ margin: .5em 0 0 .5em; padding:0; font-size: 100%; list-style: none; }
#content  .calendar td li		{ margin-bottom: .75em; font-size: 1.1em; line-height: 1.2; }
#content  .calendar td li a		{ text-decoration: underline; color:#ba5022}
#content  .calendar td li a:hover{ text-decoration: none; }
/* @end */