/* @override http://www.sonrisechurch.info/css/styles.css */

/* @group TOC */
/*=====
FILE: styles.css
CREATED:
MODIFIED: 12/19/2008
AUTHOR: Ben Otero (ben@churchplantmedia.com)

TOC
I.		GLOBALS
III. 	HEADER
IV.		NAVIGATION
V.		PRIMARY CONTENT
VI. 	SECONDARY CONTENT
VII. 	FOOTER
VIII.	CALENDAR
IX.		SERMON SECTION
X.		FORMS
XI.		TABLES
XII.	MISCELLANEOUS

=====*/
/* @end */

/* @group GLOBALS */
body				{ 
					  background: url(/images/bg.jpg) repeat; margin:0; padding:0; font-size:62.5%; 
					  font-family:Arial, Verdana, sans-serif; 
					}
#container			{ margin:0 auto 40px; width:790px; padding:68px 0 0 11px; background:url(/images/container_bg.png) no-repeat left 57px;  }
#mainContent		{ width:770px; background:url(/images/maincontent_bg.gif) repeat-y; }
#home #mainContent	{ background-image:url(/images/home_maincontent_bg.gif); }
.show 				{ display:block; }
.hidden, hr			{ display:none; }
#skip 				{ position:absolute; top:-999em; left:-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; height:79px; width:770px;}
#header h1 			{ 
					  position:absolute; top:-17px; left:-11px; background:url(/images/logo.png) no-repeat; 
					  width:208px; height:87px; margin:0; padding:0;
					}
#header h1 a		{ display: block; text-indent:-999em; width:208px; height:87px; }
#header h1 a:focus	{ outline:none; }

	/* --- SERVICE TIMES ----*/
	#service-times 			{ position:absolute; top:0px; right:14px;}
	#service-times p		{ font-size:1.2em; color:#f6efe0; margin:3px 0 0 10px; font-family:"Trebuchet MS", arial, verdana, sans-serif; text-align:right; }
	#service-times p b,
	#service-times p strong	{ text-transform:uppercase; color:#181b10; }
	#service-times img		{ border:none; position:relative; top:6px; }
/* @end */

/* @group NAVIGATION */
#nav, #nav * 		{ list-style:none; margin:0; padding:0;  }
#nav li				{ cursor:pointer; padding-bottom:2px; background:url(/images/nav_li_bg.gif) no-repeat left bottom; }
#nav li a			{ 
					  display:block; background:url(/images/nav_a_bg.gif) no-repeat left 1px; 
					  padding:8px 0 12px 24px; height:10px; text-decoration:none; 
					  font-size:1.3em; font-weight:bold; color:#fff; text-transform:lowercase;
					}
#nav li:hover a,
#nav li a:hover		{ background-position:left -30px; color:#cc751f;  }

/* ---- POSITION -----*/
#nav li ul					{ position:absolute; left:-5000px; z-index:1001; margin:0; padding:0; list-style:none; border:2px solid #232717; }
#nav li li					{ background:none; padding-bottom:0; border-bottom:1px solid #9c8c69; }
#nav li:hover li a,
#nav li li a				{ background:#9c8c69; color:#fdfdfc; padding:6px 10px; height:auto; font-weight:normal; font-size:1.2em; }				
#nav li li a:hover			{ background:#bbad8f; color:#232717;  }
#nav li ul 					{ position:absolute;left:-5000px;z-index:1001; background:none; }
#nav li:hover ul 			{ width:150px;}
#nav li ul 					{ margin:-32px 0 0 140px;}

#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;}

/* @end */

/* @group PRIMARY CONTENT */
#primaryContent 			{ float:right; position:relative; width:588px; margin-top:-3px; padding-bottom:20px; }
#home #primaryContent		{ padding-bottom:0; }
#banner						{ 
							  display:block; background:url(/mediafiles/subpage-banner.jpg) no-repeat; 
							  width:588px; height:170px; margin-top:3px;
							}
#home #banner				{ background:url(/mediafiles/home-banner.jpg) no-repeat; height:343px; }
#quicklinks					{ margin-left:-10px; }
#primaryContent h2			{ background:url(/images/heading_bg.gif) repeat-x left 8px; font-size:2.1em; color:#2b5366; }
#primaryContent h2 span 	{ background:#ebe1ce; padding-right:10px;}
#primaryContent p,
#primaryContent td,
#primaryContent li			{ font-size:1.2em; line-height:1.4em; color:#312c28; }
#primaryContent li p		{ font-size:1em; }
#primaryContent td p		{ font-size:1em; }
#primaryContent a			{ color:#2b5366;  }
#primaryContent a:hover		{ text-decoration:none; }
#primaryContent img.left-align	{ float:left; margin:10px 10px 10px 0; }
#primaryContent img.right-align	{ float:right; margin:10px 0 10px 10px; }
#primaryContent img.no-border	{ border:0; }
#content					{ padding:0 30px 0 9px; }

	/* @group HEADINGS */
	#primaryContent h3		{ font-size:1.4em; color:#2b5366; }
	.bolder,
	#primaryContent h4		{ font-size:1.3em; color:#2b5366; }
	.bolder					{ font-weight:bold; }
	#primaryContent h5		{ font-size:1.2em; color:#2a2b28; }
	#primaryContent h6		{ font-size:1.1em; color:#2a2b28; }
	.article				{ margin:0; padding:0; }
	#primaryContent .article h4.title		{ margin:0; }
	.article p				{ margin-top:0; }
	/* @end */
	
	
	/* @group SERMON STYLES */
	.sermonlist					{ border-top:8px solid #2b5366; }
	.sermonlist h4				{ margin:0; background:#fff; padding:10px; }
	.sermonbox					{ position:relative; background:#fff; padding:10px; }
	.sermonbox h5,
	.sermonbox p				{ margin:0; }
	.sermonbox ul				{ position:absolute; top:10px; right:30px; padding:0; margin:0; list-style:none; }
	.sermonbox li				{ float:left; padding:5px; }
	.sermonbox li a				{ display:block; width:16px; height:16px; text-indent:-999em; }
	.sermonbox li a:focus		{ outline:none; }
	.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; }
	
	#sorting ul					{ margin:0; padding:0; list-style:none; }
	#sorting li					{ margin-bottom:0.5em; }
	#sorting li a				{ font-size:1.2em; color:#fff }
	#sorting li a:hover			{ text-decoration:none; }
	
	/*---- HOW IT WORKS ----*/
	#how-it-works, #sorting			{ padding:20px 0 0 15px; width:152px; }	
	#how-it-works h3				{ margin-left:-15px; }
	#how-it-works ul				{ margin-right:25px; padding:0; list-style:none; }
	#how-it-works li				{ font-size:1.1em; color:#fff; margin-bottom:10px; padding-left:20px; }
	#how-it-works li#play			{ background:url(/images/play_icon_app.gif) no-repeat; }
	#how-it-works li#save			{ background:url(/images/download_icon_app.gif) no-repeat; }
	#how-it-works li#notes			{ background:url(/images/notes_icon_app.gif) no-repeat; }
	#how-it-works li#video			{ background:url(/images/video_icon_app.gif) no-repeat;}
	
	/*--- SERMON PAGE -----*/
	#byline				{ float:left; margin:0; padding:0; list-style:none; width:300px;}
	ul#byline li		{ float:left; padding-right:10px; font-size:1.1em; color:#2a2b28; }
	#text				{ margin-top:50px;}
	
	/*---- MEDIA LINKS -----*/
	#mediabox					{ float:right; background:#fff; margin:0 10px 0 0; padding:10px; list-style:none; border:1px solid #2b5366; }
	#mediabox li#mb_links		{ background:#2b5366; margin:-10px -10px 10px; padding:10px; color:#fff; }
	#mediabox li				{ margin-bottom:1.5em; font-size:1.2em; }
	#mediabox li a				{ padding:4px 0 4px 22px; }
	#mediabox li#mb_jukebox a 	{ background:url(/images/play_icon.gif) no-repeat 2px 2px; }
	#mediabox li#mb_download a	{ background:url(/images/download_icon.gif) no-repeat 2px 2px; }
	#mediabox li#mb_notes a		{ background:url(/images/notes_icon.gif) no-repeat 2px 2px; }
	#mediabox li#mb_podcast a	{ background:url(/images/feed_icon.gif) no-repeat 2px 2px; }
	#mediabox li#mb_video a		{ background:url(/images/video_icon.gif) no-repeat 2px 2px; }
	/* @end */	
	
	
	/* @group QUICKLINKS */
	#quicklinks					{ position:relative; left:5px; width: }
	.col						{ float:left; padding:10px 7px; height:110px; font-family:"Trebuchet MS", arial, verdana, sans-serif; }	
	#primaryContent .col h4,
	#primaryContent .col p,
	#primaryContent .col p a	{ color:#251f13; margin-top:0; }
	#primaryContent .col p		{ margin-left:5px; }	
	#primaryContent .col h4		{ font-size:16px; font-weight:normal; margin:0 0 .5em; }
	.col a						{ text-decoration:none; }
	#primaryContent .col a:hover{ text-decoration:underline; }
	.col img					{ float:left; margin:5px 5px 10px 0; border:0; }
	#ql1						{ width:177px; padding:20px 10px 10px; }
	#ql2						{ background:#d2c4aa; padding:20px 10px 0 5px; width:176px; margin-left:8px;}	
	#ql2 img					{ margin-bottom:35px; border:0; }
	#ql3						{ padding:0; width:182.9px; margin-right:-10px; }
	#ql3 img					{ margin:0; }
	#ql1.col					{ padding:0; width:197px; }	
	#ql1 img					{ margin:0; }
	#ql1 p						{ margin:0; padding:0; }
	/* @end */
/* @end */

/* @group SECONDARY CONTENT */
#secondaryContent 		{ float:left; width:174px; position:relative; z-index:500; }
#secondaryContent img	{ border:0; }
#secondaryContent h3	{ background:#707f4e; width:163px; height:19px; }

	/* @group Upcoming-Events */
	#upcoming-events						{ padding:0 0 11px 15px;	}
	#upcoming-events table.calendar			{ 
										  	  border-collapse: collapse; width:155px; margin-left:-4px;
										  	  background: #232717; font-family: Arial, Helvetica, Verdana, Tahoma, sans-serif;
											}	
	#upcoming-events table.calendar caption	{ 
											  color: #ede0cc; font-size: 1.1em; text-transform:uppercase; margin-bottom:5px;
											  font-family: "Trebuchet MS", Arial, Helvetica, Verdana, Tahoma, sans-serif;
											}	
	#upcoming-events table.calendar caption span
											{ color: #A6A763; position:relative; top:1px; }
	#secondaryContent table.calendar th		{ 
											  background: #b57017; padding: 3px 0; color: #fff; font-size: 1em; font-weight: normal;
											  text-align: center;
											}	
	#secondaryContent table.calendar td		{ 
											  width: 24px; height: 20px;  
											  color: #ab9d85; font-size: 1.1em; font-weight: normal; text-align: center;
											}
	#secondaryContent table.calendar td.linked-day a { background:#191c10; color:#fbf9f6; font-size:10px; }		
	#secondaryContent table.calendar a		{ display: block; padding: 4px; background: #0C2441; color: #BFBB65; text-decoration: none; }	
	
	#traildiv								{ 
											  position: absolute; top: 0px; left: 0px; z-index: 999; visibility: hidden; 
											  width: 100px; height: 100px; color: #FFF;
											}	
	#traildiv ul							{ 
											  padding: .75em; padding-bottom: 0; border: 3px solid #15130D; background: #2B271B; 
											  font-size: 1.1em;
											}	
	#traildiv li							{ color: #FFF; margin-left: 1em; margin-bottom: .75em; }
	#traildiv a								{ color: #FFF; text-decoration: none; }	
	/* @end */
	#online-giving		{  margin-left:7px; }
/* @end */

/* @group FOOTER */
#footer				{ background:url(/images/sub_footer_bg.gif) no-repeat left top; padding:30px 20px; height:40px; width:730px; }
#home #footer		{ background:url(/images/footer_bg.gif) no-repeat; margin-top:-8px; }
#footer p			{ margin:0; font-size:1.1em; color:#383122; }
#footer p#design	{ float:right; margin-top:-1.5em; }
#footer a			{ color:#384124; }
#footer a:hover		{ text-decoration:none; }
/* @end */

#primaryContent td	{ padding:5px 0; margin:0; }

/* @group CALENDAR */
#primaryContent table.calendar				{ 
											  border: 1px solid #599529; border-width:1px 0 0 1px; border-collapse: collapse; 
											  width:90%; margin:0 auto 50px; 
											}
#primaryContent table.calendar caption 		{ padding-bottom: 10px; color:#2b5366; font-size: 1.4em; }
#primaryContent table.calendar caption span { color: #2b5366 }
#primaryContent table.calendar th			{ 
											  padding: 6px 0; background: #2b5366; color: #fff; font-size: 1.3em;
											  font-weight: normal;
											}
#primaryContent table.calendar td			{
				 		  					  width: 68px; height: 68px; padding: 2px; border: 1px solid #2b5366;
											  border-width:0 1px 1px 0; background: #fff; color: #2b5366;
											  font-size: 1em; vertical-align: top;
											}
#primaryContent table.calendar td a			{ color: #2b5366; text-decoration: none; }
#primaryContent table.calendar td ul		{ margin: .5em 0 0 .5em; padding:0; font-size: 100%; list-style: none; }
#primaryContent table.calendar td li		{ margin-bottom: .75em; font-size: 1.1em; line-height: 1.2; }
#primaryContent table.calendar td li a		{ color:#2b5366; text-decoration: underline; }
#primaryContent table.calendar td li a:hover{ text-decoration: none; }
/* @end */