/*=====
CLIENT: Christ's Church
FILE: styles.css
CREATED:
MODIFIED: 1/7/2009
AUTHOR: Ben Otero (ben@churchplantmedia.com)


=====*/

/* @group GLOBALS */
html				{ height:100%; }
body 				{ background:#395f61; font-size:62.5%; font-family:Arial, verdana, sans-serif; height:100%; }
#container-outer	{ 
					  background:url(/images/outer_container_bg.jpg) repeat-y center top; 
					  padding-top:30px; width:100%; position:relative; min-height:100%;
					}
* html #container-outer { height:100%; }
#container			{ margin:0px auto; padding:0; width:800px; }
#mainContent		{ background:url(/images/maincontent_sub_bg.jpg) repeat-y ; }
#home #mainContent	{ background:url(/images/maincontent_bg.jpg) repeat-y;  }

.show 				{ display:block; }
.hidden, hr			{ display:none; }
#skip				{ position:absolute; left:-999em; top:-999em; }
.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; background:url(/images/header_bg.jpg) no-repeat left bottom; height:103px; z-index:2000; }
#home #header		{ background:url(/images/alt_header_bg.jpg) no-repeat left bottom; height:93px;  }
#header h1			{
					  display:block; background:url(/images/logo.png) no-repeat; width:310px; height:84px;
					  text-indent:-999em; position:absolute; top:-10px; left:20px; 
	 				}
#header h1 a		{ display:block; width:192px; height:66px; }
/* @end */


/* @group NAVIGATION */
#navigation			{ 
					  position:absolute; top:66px; right:38px; padding-left:12px;
					  background:#fff url(/images/nav_outer_bg.gif) no-repeat left top; z-index:1000; height:31px;
					} 
#home #navigation	{ top:62px; }
#nav				{ background:url(/images/nav_inner_bg.gif) no-repeat right top; padding-right:14px; height:31px; } 
#nav li 			{ cursor:pointer; float:left; display:inline; }
#nav li a 			{ 
					  display:block; background:url(/images/nav_li.gif) no-repeat left bottom; line-height:32px; padding:0 12px 0;
					  font-size:1.2em; font-family:"Trebuchet MS", "Lucida Grande", arial, sans-serif; color:#333; 
					  text-transform:uppercase; font-weight:bold; text-decoration:none; position:relative; top:-1px;
					}
#nav li a:hover,
#nav li:hover a,
#nav #nav_home a:hover,
#nav li.current a		{ color:#fff; background:url(/images/nav_a_hover.gif) repeat-x left bottom; }  

#nav #nav_home a		{ background-image:none; color:#333; }  

#nav li li a, 
#nav li:hover li a,
#nav li.current:hover li a,
#nav li a:hover li a{ background:#fff; color:#333;  width:138px; line-height:24px; }

#nav li.current:hover li a:hover,
#nav li li a:hover	{ background:#322c15; color:#fff; }

#nav li ul 			{ position:absolute;left:-5000px;z-index:1001; width:160px; }
#nav li li			{ float:none; display:block; }
#nav li:hover ul 	{ left:auto; zoom:1;}
#nav li:hover ul ul, 
#nav li:hover ul ul ul, 
#nav li:hover ul ul ul ul 
					{ left:-5000px;}
#nav li:hover ul, 
#nav li li:hover ul, 
#nav li li li:hover ul, 
#nav li li li li:hover ul 
					{ left:auto;}
#nav li:hover ul li:hover ul 
					{ margin:-28px 0 0 160px;}

/* @end */

/* @group PRIMARY CONTENT */
#primaryContent			{ float:right; margin-right:35px;padding:20px 10px; width:490px; position:relative; }

#home #primaryContent 	{ 
						  position:relative; float:none; padding:20px 0 0 335px; width:395px; height:278px;			   
						  margin-left:30px;  
						}
#banner					{ position:absolute; top:0; left:0; }
#home #banner			{ background:url(/mediafiles/home-header.jpg) no-repeat; width:329px; height:298px;}						
#welcome				{ padding:0 10px; }
#primaryContent h2		{ margin-bottom:1em; }
#primaryContent h3		{ font-size:1.3em; color:#fff; margin:1em 0 .5em; font-weight:bold; }
#primaryContent h4		{ font-size:1.2em; color:#fff; margin:1em 0 .2em; font-weight:bold; }
#primaryContent h5,
#primaryContent h6		{ font-size:1.1em; color:#fff; margin:1em 0 0; font-weight:bold; }
#primaryContent p,
#primaryContent li		{ font-size:1.2em; color:#fff; line-height:1.5em;}
#primaryContent p 		{ margin-bottom:1.2em; }
#primaryContent ul,
#primaryContent ol		{ margin:1em 0; padding-left:1em; }
#primaryContent a		{ color:#e6e0a8;  }
#primaryContent a:hover	{ text-decoration:none; }
/* @end */

/* @group SECONDARY CONTENT */
#secondaryContent 		{ margin-left:40px; padding:20px 10px 10px; float:left; width:179px; }
#home #secondaryContent	{ border-top:5px solid #fff; width:742px;  margin-left:30px; padding:0; background:#232005; }
#home #sidebar			{ float:left; width:214px; }
#secondaryContent h3	{ font:1.4em "Lucida Grande", "Trebuchet MS", arial, verdana, sans-serif; color:#8bb9c8; }
#secondaryContent p		{ font-size:1.2em; color:#fffafa; line-height:1.5em; }

	/* @group QUICKLINKS */
	#quicklinks				{ float:left; width:528px; height:142px; display:inline; position:relative; margin-right:-30px;}
	#quicklinks h3			{ 
							  display:block; width:37px; height:141px; background:url(/images/quicklinks_tab.gif) no-repeat; text-indent:-999em;
							  position:absolute; right:-39px; top:7px;
							}
	#quicklinks li			{ float:left; display:inline; background:#232005; }
	#quicklinks li span		{ 
							  display:block; background:url(/images/quick_arrows.gif) no-repeat 0 2px; padding-left:10px; font-size:10px; margin-left:10px; 
							  color:#e3dd9e; font-weight:bold; text-transform:uppercase;
							}
	#quicklinks img			{ border:none; position:relative; margin-left:0px; }
	#quicklinks li#quick1	{ background:#232005 url(/mediafiles/quicklink1.jpg) no-repeat; width:168px; }
	#quicklinks li#quick2	{ background:#232005 url(/mediafiles/quicklink2.jpg) no-repeat; width:166px; }
	#quicklinks li#quick3	{ background:#232005 url(/mediafiles/quicklink3.jpg) no-repeat; width:166px; }
	#quicklinks li a		{ font-size:10px; color:#e3dd9e; text-decoration:none;  }
	#quicklinks li a:hover	{ text-decoration:underline; }
	/* @end */
	
	/* @group SERVICE TIMES */
	#service-times			{ background:#175461; padding:11px 9px; }
	#service-times p		{ font:1.2em "Lucida Grande", arial, verdana, sans-serif; color:#fff; text-align:center;}
	#service-times p a		{ 
							  display:block; background:url(/images/directions_bg.gif) no-repeat; 
							  width:186px; height:19px; margin:1em auto 0; text-indent:-999em;
							}
	/* @end */
	
	/* @group UPCOMING EVENTS */
	#upcoming-events		{ border-bottom:1px solid #232005; padding-bottom:20px; }
	#upcoming-events h3		{ margin-bottom:0.5em; font-weight:bold; }
	.event h4				{
							  font-size:1.2em; font-family:"Lucida Grande", "Trebuchet MS", arial, sans-serif; 
							  margin-bottom:0;
							}
	.event h4 a				{ color:#fffafa; text-decoration:none; font-weight:bold; }
	.event h4 a:hover		{ text-decoration:underline; }
	.event p.date			{ font-size:11px; margin-top:0; margin-bottom:1em; }
	/* @end */
	
	/* @group PODCAST */	
	#podcast				{ 
							  background:url(/images/podcast_bg.jpg) no-repeat 0px 15px; 
							  padding:15px 15px 15px 55px; width:119px; height:48px; 
							}
	#home #podcast			{ background-color:#232005; width:129px; padding-left:65px; padding-bottom:0; background-position:15px 15px; }
	#podcast h4				{ font-size:12px; color:#c7e3ea; margin-bottom:3px; font-weight:normal; font-family:"Lucida Grande", arial, verdana, sans-serif; }
	#podcast p				{ color:#fff; font-size:1em; line-height:1.2em; font-family:"Lucida Grande", arial, verdana,sans-serif; }
	#podcast p a			{ color:#fff; }
	#podcast p a:hover		{ text-decoration:none; }
	/* @end */	
	
/* @end */

/* @group FOOTER */
#footer						{ background:url(/images/footer_sub_bg.jpg) no-repeat; padding:40px 30px; height:35px; }
#home #footer				{ background:url(/images/footer_bg.jpg) no-repeat; }
#footer p					{ float:left; color:#fff; font-size:1.1em; }
#footer p#powered			{ float:right; }
#footer p a					{ color:#e6e0a8 }
#footer p a:hover			{ text-decoration:none; }
/* @end */

/* @group CALENDAR */

/* @end */

/* @group SERMON STYLES */
#primaryContent .sermonlist h4				{ margin-top:1.5em; margin-bottom:1.5em;}
.sermonlist					{  margin-top:.5em; position:relative; }
.sermonbox:hover			{ background:#fff; }
.sermonbox 					{ background:#fffafa; padding:10px; }
#primaryContent .sermonbox h5 {  margin:0;  }
#primaryContent .sermonbox h5 a,
#primaryContent .sermonbox p,
#primaryContent .sermonbox p a					
							{ color:#191702; margin-bottom:0; }

.sermonbox ul				{ position:absolute; top:35px; right:30px; }
.sermonbox ul li			{ float:left; margin-right:5px; }
.sermonbox ul li a			{ display:block; width:16px; height:16px; text-indent:-999em; }
.sermonbox li.sl_listen a,
#mediabox li#mb_jukebox a	{ background:url(/images/play_icon.gif) no-repeat; }
#mediabox li#mb_download a,
.sermonbox li.sl_download a	{ background:url(/images/download_icon.gif) no-repeat; }
#mediabox li#mb_notes a,
.sermonbox li.sl_notes a	{ background:url(/images/notes_icon.gif) no-repeat; }
#mediabox li#mb_video a,
.sermonbox li.sl_video a	{ background:url(/images/video_icon.gif) no-repeat; }


	/* @group SORTING */
	#sorting h3				{ margin-bottom:1.5em; }
	#sorting label,
	#sorting select			{ display:block; }
	#sorting label			{ font-size:1.3em; color:#fff; margin-bottom:.5em;}
	#sorting select			{ margin-bottom:1.5em; width:100%; }
	#sorting a				{ color:#fff; font-size:1.2em; }
	#sorting a:hover		{ text-decoration:none; }
	/* @end */

	/* @group HOW IT WORKS */
	#how-it-works 			{ height:30px; background:#161402; }
	#how-it-works li		{ color:#fff; line-height:30px; font-size:1.2em; padding-left:22px; float:left; display:inline; margin-right:24px;}
	#how-it-works li#how	{ padding-left:5px;  }
	#how-it-works li#play	{ background:url(/images/play_icon_app.gif) no-repeat left center; }
	#how-it-works li#save	{ background:url(/images/download_icon_app.gif) no-repeat left center; }
	#how-it-works li#notes	{ background:url(/images/notes_icon_app.gif) no-repeat left center; }
	#how-it-works li#video	{ background:url(/images/video_icon_app.gif) no-repeat left center; }
	/* @end */
	
	/* @group MEDIABOX */
	ul#byline				{ float:left; width:300px; margin:0; padding:0; list-style:none; }
	ul#byline li 			{ float:left; margin-right:10px;  }
	#mediabox				{ float:right; background:#fff; padding:10px; border:1px solid #232005; }
	#mediabox li			{ margin-bottom:.5em; }
	#mediabox li#mb_links	{ background:#232005; padding:5px; margin:-1em -1em 1.5em; }
	#mediabox li a			{ color:#191702; padding:2px 0 2px 20px;  }
	#mediabox li#mb_podcast a { background:url(/images/feed_icon.gif) no-repeat; }
	#text					{  width:300px; margin-top:2.5em; float:left;}
	
	/* @end */
/* @end */

/* @group CALENDAR */
 table.calendar{
   margin-bottom: 25px;
   border: 1px solid #fffafa;
   border-collapse: collapse;
}

 table.calendar caption{
   padding-bottom: 10px;
   color: #fff; text-align:center;
   font-size: 1.4em;
}

 table.calendar caption span{
   color: #fff;
}

 table.calendar th{
   padding: 6px 0;
   background: #191702;
   color: #fff; text-align:center;
   font-size: 1.3em;
   font-weight: normal;
}

 table.calendar td{
   width: 68px;
   height: 68px;
   padding: 2px;
   border: 1px solid #fffafa;
   border-left: 0;
   border-top: 0;
   background: #fff;
   color: #191702;
   font-size: 1.1em;
   vertical-align: top;
}


#primaryContent table.calendar td a{
   color: #191702;
   text-decoration: underline;
}

 table.calendar td ul{
   margin: .5em 0 0 .5em;
   font-size: 100%;
   list-style: none;
}

 table.calendar td li{
   margin-bottom: .75em;
   font-size: 1.1em;
   line-height: 1.2;
}

#primaryContent table.calendar td li a{
   color: #333;
   text-decoration: underline;
}

#primaryContent table.calendar td li a:hover{
   text-decoration: none;
}
/* @end */