/* @override http://lebanonfamilychurch.org/css/style.css */

/* Reset */
/* v1.0 | 20080212 */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

/* remember to define focus styles! */
/*:focus {
	outline: 0;
}*/

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* Helpers */

/* Grid */

/* Grid.css */

.container {
	width: 924px;
	margin: 0 auto;
}

/* Columns
-------------------------------------------------------------- */

/* Sets up basic grid floating and margin. */
div.span-1, div.span-2, div.span-3, div.span-4, div.span-5, div.span-6, div.span-7, div.span-8, div.span-9, div.span-10, div.span-11, div.span-12 {float:left;margin-right: 12px;}

/* The last column in a row needs this class. */
div.last { margin-right: 0; }

/* Use these classes to set the width of a column. */
.span-1  { width: 66px;}
.span-2  { width: 144px;}
.span-3  { width: 222px;}
.span-4  { width: 300px;}
.span-5  { width: 378px;}
.span-6  { width: 456px;}
.span-7  { width: 534px;}
.span-8  { width: 612px;}
.span-9  { width: 690px;}
.span-10 { width: 768px;}
.span-11 { width: 846px;}
.span-12, div.span-12 { width: 924px; margin: 0; }

/* Add these to a column to append empty cols. */
.append-1  { padding-right: 78px;}
.append-2  { padding-right: 156px;}
.append-3  { padding-right: 234px;}
.append-4  { padding-right: 312px;}
.append-5  { padding-right: 390px;}
.append-6  { padding-right: 468px;}
.append-7  { padding-right: 546px;}
.append-8  { padding-right: 624px;}
.append-9  { padding-right: 702px;}
.append-10 { padding-right: 780px;}
.append-11 { padding-right: 858px;}


/* Add these to a column to prepend empty cols. */
.prepend-1  { padding-left: 78px;}
.prepend-2  { padding-left: 156px;}
.prepend-3  { padding-left: 234px;}
.prepend-4  { padding-left: 312px;}
.prepend-5  { padding-left: 390px;}
.prepend-6  { padding-left: 468px;}
.prepend-7  { padding-left: 546px;}
.prepend-8  { padding-left: 624px;}
.prepend-9  { padding-left: 702px;}
.prepend-10 { padding-left: 780px;}
.prepend-11 { padding-left: 858px;}

/* Use these classes on an element to push it into the 
   next column, or to pull it into the previous column.  */

.pull-1 { margin-left: -78px;}
.pull-2 { margin-left: -156px;}
.pull-3 { margin-left: -234px;}
.pull-4 { margin-left: -312px;}
.pull-5 { margin-left: -390px;}
.pull-6 { margin-left: -468px;}
.pull-7 { margin-left: -546px;}
.pull-8 { margin-left: -624px;}
.pull-9 { margin-left: -702px;}
.pull-10 { margin-left: -780px;}
.pull-11 { margin-left: -858px;}
.pull-12 { margin-left: -936px;}

.pull-1, .pull-2, .pull-3, .pull-4, .pull-5, .pull-6, .pull-7, .pull-8, .pull-9, .pull-10, .pull-11, .pull-12 {float:left;position:relative;}

.push-1 { margin: 0 -78px 1.5em 78px;}
.push-2 { margin: 0 -156px 1.5em 156px;}
.push-3 { margin: 0 -234px 1.5em 234px;}
.push-4 { margin: 0 -312px 1.5em 312px;}
.push-5 { margin: 0 -390px 1.5em 390px;}
.push-6 { margin: 0 -468px 1.5em 468px;}
.push-7 { margin: 0 -546px 1.5em 546px;}
.push-8 { margin: 0 -624px 1.5em 624px;}
.push-9 { margin: 0 -702px 1.5em 702px;}
.push-10 { margin: 0 -780px 1.5em 780px;}
.push-11 { margin: 0 -858px 1.5em 858px;}
.push-12 { margin: 0 -936px 1.5em 936px;}

.push-1, .push-2, .push-3, .push-4, .push-5, .push-6, .push-7, .push-8, .push-9, .push-10, .push-11, .push-12 {float:right;position:relative;}

/* Misc classes and elements
-------------------------------------------------------------- */

/* Use a .box to create a padded box inside a column.  */ 
.box { 
  padding: 1.5em; 
  margin-bottom: 1.5em; 
  background: #EFEFEF; 
}

/* Use this to create a horizontal ruler across a column. */
hr {
  background: #ddd; 
  color: #ddd;
  clear: both; 
  float: none; 
  width: 100%; 
  height: .1em;
  margin: 0 0 1.45em;
  border: none; 
}
hr.space {
  background: #fff;
  color: #fff;
}

/* Clearing floats without extra markup
   Based on How To Clear Floats Without Structural Markup by PiE
   [http://www.positioniseverything.net/easyclearing.html] */

.clearfix:after, .container:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}
.clearfix, .container {display: inline-block;}
* html .clearfix,
* html .container {height: 1%;}
.clearfix, .container {display: block;}

/* Regular clearing
   apply to column that should drop below previous ones. */

.clear { clear:both; }

/* Typography */

/* Typography Styles */

body {
	font-family: "Lucida Grande", Helvetica, Arial, sans-serif;
	font-size: 12px;
	line-height: 18px;
	-webkit-text-stroke: 1px transparent;
}

@media only screen and (max-device-width:480px) {body {-webkit-text-stroke: 0 black;}}

/* Header */

h1, h2, h3, h4, h5, h6 {
	font-family: "Helvetica Neue", Helvetica, Arial, Geneva, sans-serif;
	font-weight: normal;
}

h3 {
	font-weight: bold;
}

h5 {
	text-transform: none;
	margin: 0 20px 9px 20px;
	font-size: 18px;
	color: #444;
	font-weight: bold;
}

h5 a {
	color: #444;
}

h5 a:hover {
	color: #666;
}

/* Paragraphs */
p {
	font-size: 12px;
	margin: 0 20px 18px;
}

div.sidebar p {
	margin: 0 20px 18px 0;
}

p#tagline {
	margin-top: 18px;
	font-size: 28px;
	color: #0680BC;
}

p.small_date {
	font-size: 11px;
	font-style: italic;
	margin-bottom: 9px;
}


#footer p#copyright {
	float: left;
}

#footer p#right_links {
	font-size: 11px;
	float: right;
	text-align: right;
}

#footer p#right_links a {
	color: #FFF;
	text-decoration: none;
	font-weight: bold;
}

/* Links */
a {
	color: #0680BC;
}

div.sidebar a {
	font-weight: bold;
	color: #0680BC;
	text-decoration: none;
}

div.sidebar a:hover {
	color: #70cfff;
}

/* Lists */

ol, ul {
	margin-left: 20px;
	margin-bottom: 18px;
}

li {
	font-weight: bold;
	color: #444;
}

ol li {
	list-style-type: decimal;
	list-style-position: inside;
}

ul li {
	list-style-type: disc;
	list-style-position: inside;
}


/* Podcast */

#podcast p a {
	color: #FFF;
}

#podcast p, #search p {
	margin: 0 0 18px 0;
}

/* Info Area */

#info-area h3 {
	text-transform: uppercase;
	margin: 0 20px 9px;
	color: #FFF;
}

#info-area p {
	color: #C3C3C3;
}

#info-area a {
	color: #FFF;
	font-weight: bold;
}

#info-area ul {
	margin: auto 20px 18px;
}

#info-area li {
}

#info-area li a {	
	color: #FFF;
}

/* Featured Video */
#featured_video h2 {
	color: #FFF;
	font-size: 18px;
	margin-bottom: 18px;
	margin-left: 75px;
}

#featured_video embed {
	margin-bottom: 9px;
}

#featured_video h3 {
	color: #FFF;
	font-size: 18px;
	margin-bottom: 9px;
}

#featured_video p {
	color: #FFF;
	margin: 0 0 0 0;
}

/* Container White */

div.white h3 {
	color: #444;
	font-size: 27px;
	margin: 0 20px 18px;
	padding: 18px 0 0 0;
}

div.white h4 {
	font-size: 14px;
	padding: 0 0 0 20px;
	color: #444;
	font-weight: bold;
}

div.white p {
	color: #444;
}

/* Sidebar */
div.sidebar h3 {
	font-size: 18px;
	margin: 0 0 9px 0;
}

div.sidebar h4 {
	margin: 0 0 0 -20px;
}

div.sidebar ul li {
	font-size: 12px;
	list-style-type: none;
	list-style-position: inside;
	color: #0680BC;
}

/* Showcase */

#showcase h1 {
	line-height: 27px;
	color: #FFF;
	font-size: 25px;
	font-style: italic;
	margin-bottom: 0px;
	margin-left: -10px;
	text-transform: none;
}

#showcase h3 {
	color: #FFF;
	font-size: 12px;
	margin-top: 18px;
	margin-bottom: 9px;
	text-transform: uppercase;
}

#showcase p {
	font-size: 12px;
	margin: 0 20px 18px 0;
	color: #FFF;
}

#showcase p a {
	font-weight: bold;
	color: #FFF;
	text-decoration: none;
}

#showcase p a:hover {
	color: #888;
}

#showcase p.showcase-subtitle {
	font-size: 14px;
	margin-top: -9px;
}

#showcase p.showcase-description {
	font-size: 14px;
}

#showcase-secondary {
	font-size: 12px;
}

p#title-showcase {
	margin-top: 18px;
}

 /*Secondary Area*/ 

#secondary h3.first {
	margin-left: 20px;
}

#secondary h3 {
	color: #FFF;
	text-transform: uppercase;
	margin: 0 0 18px 0px;
	font-size: 12px;
}

#secondary p {
	margin: 0 0 18px 20px;
	font-weight: bold;
	color: #FFF;
}

#secondary p.previous {
	font-size: 12px;
}

#podcast  {
	}

#podcast p {
	margin: 0 0 0 0;
}

/* Previous Messages */

#previous-messages h3 {
	margin-left: 20px;
}



/* Sidebar */
div.sidebar ul { margin: 0 0 18px 0;}

/* Footer */

#footer p {
	font-size: 11px;
	color: #FFF;
}

#footer p span {
	float: right;
}

#footer p span a {
	font-weight: bold;
	color: #FFF;
	padding: 0 2px;
}

/* Form */

#contact_form {
	padding: 18px 20px;
	margin: 16px 20px;
	border: 1px dotted #888;
}

#contact_form p {
	font-size: 11px;
	color: #666;
	margin-bottom: 20px;
	border-bottom: solid 1px #dedede;
	padding-bottom: 10px;
}

#contact_form label {
	display: block;
	font-weight: bold;
	text-align: right;
	width: 140px;
	float: left;
	color: #444;
}

#contact_form .small {
	color: #444;
	display: block;
	font-size: 11px;
	font-weight: normal;
	text-align: right;
	width: 140px;
}

#contact_form input {
	float: left;
	width: 250px;
	font-size: 16px;
	margin: 2px 0 28px 10px;
}

#contact_form textarea {
	width: 350px;
	height: 140px;
	margin: 2px 0 10px 10px;
	border: 1px #999 solid;
}

div.successmessage p {
	background: #558c26;
	padding: 10px;
	color: #FFF;
	font-weight: bold;
}

div.player_box p {
	color: #444;
}

/* Custom */

/*
Designed by: David Hemphill www.davidhemphill.com
*/

/* Body */
body { background: #111 url(../img/bg-page.png);}
#gradient { position: absolute; top: 0; left: 0; width: 100%; height: 291px; background: transparent url(../img/bg-gradient.png) repeat-x; z-index: 0; }
.white { background: #FFF; }
.black { background: #000; }
div.paper { /*
background: #FFF url(../img/bg-baseline.gif) repeat; */
background: #FFF url(../img/bg-paper.gif) no-repeat; }

/* Header */
#header { height: 162px; }
#header #logo { margin-top: 43px; display: block; height: 119px; width: 389px; background: url(../img/logo.png) no-repeat; }
#header a span { display: none; }

/* Navigation */
#navigation { width: 924px; margin: 0 auto; background: #000; height: 54px; }
#navigation ul { margin: 0; }
#navigation li { list-style: none; display: inline;}
#navigation li a { display: block; float: left; height: 54px; }
#navigation li a span { display: none; }
/*#nav-new { width: 144px; margin-right: 12px; background-image: url(../img/bg-nav-new.png); }
#nav-services { width: 144px; margin-right: 12px; background-image: url(../img/bg-nav-services2.png); }
#nav-ministries { width: 222px; margin-right: 12px; background-image: url(../img/bg-nav-ministries.png); }
#nav-watchlisten { width: 222px; margin-right: 12px; background-image: url(../img/bg-nav-watchlisten.png); }
#nav-contact { width: 144px; background-image: url(../img/bg-nav-contact.png); }*/

/* Used for background hovers */
/*.activetab { background-position: 0 -54px; }
.notvisible { visibility: hidden; }*/

#nav-new { width: 144px; margin-right: 12px;
	background: url(../img/bg-nav-sprite.png) 0 414px;
}
#nav-services { width: 144px; margin-right: 12px;
	background: url(../img/bg-nav-sprite.png) 0 276px;
}
#nav-ministries { width: 222px; margin-right: 12px;
	background: url(../img/bg-nav-sprite.png) 0 552px;
}
#nav-watchlisten { width: 222px; margin-right: 12px;
	background: url(../img/bg-nav-sprite.png) 0 138px;
}
#nav-contact { width: 144px;
	background: url(../img/bg-nav-sprite.png) 0 690px;
}

#nav-new:hover { background-position: 0 360px; }
#nav-services:hover { background-position: 0 222px; }
#nav-ministries:hover { background-position: 0 498px; }
#nav-watchlisten:hover { background-position: 0 84px; }
#nav-contact:hover { background-position: 0 636px; }

/* Showcase */
#showcase { height: 450px; background: #111 url(../img/bg-showcase.jpg) no-repeat center top; margin-bottom: 18px; }
#showcase img.message-image { display: block; width: 540px; height: 304px; border: 8px solid #333; margin: 12px 12px 10px 12px; }
#current_message_description { margin-left: -25px; }

/* Secondary Area */
#previous-messages span, #podcast span { width: 265px;}
#previous-messages span.previous { display: block; float: left; margin-bottom: 18px; margin-left: 20px; }
#previous-messages span.previous a { color: #FFF; font-weight: bold; text-decoration: none; }
#previous-messages span.previous a:hover { color: #888;}
#previous-messages span.float_right { width: 89px; float: right; clear: both; margin-top: -38px;}


#search {  }
#search input.text { background: #222; width: 260px; padding: 5px; color: #fff; font-size: 12px; border: 1px solid #c3c3c3; }
#search input.text:focus { outline: 0; }

/* Mailing List input */
#mailinglistinput { width: 254px; margin-bottom: 9px; }

/* Upcoming Event */
div.upcoming_event p { display: none; font-size: 11px; }

/* Info Area */
#info-area { background-image: url(../img/bg-info-area.png); padding-top: 18px; }
#info-area ul li { list-style-type: disc; list-style-position: inside; color: #FFF; }
#info-area input.text { margin: 0px 5px 18px 20px; width: 190px; background: #222; padding: 5px; color: #fff; font-size: 12px; border: 1px solid #c3c3c3; }
input.button { width: auto; }

/* special sidebar that needs left margin to be 20px */
div.pushsidebar { padding-bottom: 36px; }
div.pushsidebar h3,
div.pushsidebar p { margin: 0 20px 9px 20px; }
img.pushleft { margin-top: 18px; margin-left: 20px; /*margin-bottom: 18px; */ }
div.killpad { margin: auto 10px 0 -10px; }
div.killpad hr { width: 275px; margin: auto 20px 18px; color: #555; background-color: #333; }

/* Featured Video */
div#video_holder { background-image: url(../img/bg-featured_video.jpg); background-repeat: no-repeat; }

div#video_holder_small {
	background: url(../img/bg-featured_video.jpg) no-repeat center -75px;
}

/* Video Player Box */
div.player_box img,div.player_box embed { margin: 0 20px; width: 400px; height: 225px; }
#featured_video embed { width: 854px; height: 480px; }
#featured_video { margin: 0 auto -24px; width: 854px; padding-top: 18px; min-height: 606px;}

#message_video {
	margin: 0 auto -24px; width: 854px; padding-top: 18px; min-height: 403px;
}

#message_video object,
#message_video embed {
	display: block;
	width: 640px;
	height: 360px;
	margin: 0 auto;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
}

/* Sidebar */
div.sidebar ul { margin-bottom: 9px; }
div.pushleft20 { margin-left: 20px; }

/* Forms */

/* Staff Profile Pages */
#thestaffheader {
	background: url(../img/bg-thestaffheader.png);
	background-repeat: no-repeat;
	height: 36px;
	text-indent: -999999px;
}

#staff_profile {
	background: #222 url(../img/bg-staff.jpg) no-repeat;
}

div.staff_pictures { width: 420px;
	float: left;
	padding: 20px 0 0 0;
}

div.staff_bio {
	width: 504px;
	float: left;
	padding: 20px 0 0 0;
}

div.staff_pictures ul, div.staff_pictures li {
	margin: 0;
}

div.staff_pictures li {
	padding: 0;
	margin: 0 0 0 -15px;
	list-style: none;
}

div.staff_pictures img {
	padding: 0 0 0 20px;
}

/* --- Staff Profile Page Typography -- */
div.staff_bio h3 {
	font-size: 30px;
	color: #FFF;
	padding: 0 20px 0 20px;
	margin-bottom: 18px;
}

div.staff_bio p {
	color:  #FFF;
	font-size: 14px;
}

/* Series Pages /media/series */
div#media-series h3 {
	font-size: 22px;
	color: #FFF;
	margin: 36px 20px 9px;
}

div#media-series p {
	color: #FFF;
}

/* Series Wrapper */

div.series_wrapper {
	background: #111;
	min-height: 270px;
}

div.series_artwork {
	
}

div.series_artwork img {
	border: 3px #FFF solid;
	margin: 20px;
	width: 400px;
}

div.series_description {
	
}

div.series_description h4 {
	margin: 20px 20px 18px 0;
	color: #FFF;
	font-size: 21px;
}

div.series_description p {
	color: #FFF;
	font-size: 12px;
	margin: 0 20px 18px 0;
}

/* Pagination */
.jqGSContainer .jqGSPagination ul {
	padding: 0;
	margin: 10px 0 20px 0;
	position: relative;
	float: right;
}

.jqGSContainer .jqGSPagination ul li {
	padding: 10px;
	float: left;
	text-align: center;
	padding-bottom: 1px;
	list-style-type: none;
}

.jqGSContainer .jqGSPagination ul li a {
	padding: 2px 0px;
	background: #000;
	border: 1px solid #fff;
	color: #fff;
	text-decoration: none;
	display: block;
	width: 20px;
	font: 10px Verdana, Arial, Helvetica, sans-serif;
}

.jqGSContainer .jqGSPagination ul li a.selected {
	background: #fff;
	color: #f03;
	border: 1px solid #eaeaea;
}

.jqGSContainer .jqGSPagination ul li a:hover {
	background: #fff;
	color: #000;
	border: 1px solid #fff;
}

/* Staff Footer */
#staff_footer {
		background: url(../img/bg-featured_video.jpg) no-repeat center -75px;
	padding-top: 18px;
	padding-top: 18px;
}

#staff_footer h3 {
	font-size: 22px;
	color: #FFF;
	margin: 0 18px 18px;
}

#staff_footer p {
	color: #AAA;
	font-weight: normal;
}

#thestaff_listing li {
	list-style-type: none;
}

#thestaff_listing li a {
	font-weight: normal;
	color: #AAA;
	text-decoration: none;
}

#thestaff_listing li a:hover {
	color: #FFF;
}

/* Photogallery */
#photogallery {
	background: #111;
}

#photogallery embed {
	display: block;
	clear: both;
	width: 802px;
	margin: 0 auto;
	padding: 18px 0 18px 0;
}

/* giving links */

#givinglinks {
	text-align: right;
	height: 25px;
	width: 350px;
	position: absolute;
	top: 18px;
	left: 573px;
	font-size: 14px;
	font-weight: bold;
	color: #AAA;
}

#givinglinks a {
	font-size: 12px;
	color: #FFF;
	text-decoration: none;
}

#givinglinks a:hover {
	color: #AAA;
}


/* Footer */
#footer { background: #000; padding-top: 18px; height: 72px; border-top: 1px solid #C3C3C3; clear: both; }

#jumper select {
	margin-top: 0px;
	width: 100px;
	float: right;
	display: inline;
}

/* Notice  */
div#notice {
	width: 925px;
	z-index: 1;
	position: relative;
	left: 0;
	top: 0px;
	height: 35px;
	line-height: 35px;
	opacity: 1;	
	background: #521805;
	margin: 0 auto;
}

div#notice p {
	color: #FFF;
}

/* Tweet stuff */
#twitter {
	margin-left: -20px;
	background: #e2e2e2;
}

#tweet_text {
	
	color: #0680bc;
	font: italic 16px Georgia, "Times New Roman", Times, serif;
}

#tweet_time {
	font-size: 10px;
	color: #AAA;
	margin-top: -9px;
}

#twitter_link {
	margin-bottom: 0;
}

/* Video stuff */
#videothumbs li {
	width: 278px;
	min-height: 236px;
	list-style: none;
	float: left;
	margin: 0 9px 9px;
	color: #444;
	font: bold 14px "Helvetica Neue", Helvetica, Arial, Geneva, sans-serif;
}

#videothumbs li a {
	outline: none;
	text-decoration: none;
}

.messagetitle {
	color: #444;
}

span.divider {
	color: #AAA;
}

/* /media/watch */
img.small_series_artwork {
	border: 8px solid #000;
	display: block;
	margin: 18px auto;
}

/* Media Footer */
#media_footer {
	background: url(../img/bg-featured_video.jpg) no-repeat center -75px;
	padding-top: 18px;
}

#media_footer h3 {
	font-size: 22px;
	color: #FFF;
	margin: 0 18px 18px;
}

#media_footer p {
	color: #AAA;
	font-weight: normal;
}

#media_footer li {
	list-style-type: none;
}

#media_footer li a {
	font-weight: bold;
	color: #0680bc;
	text-decoration: none;
}

#media_footer li a:hover {
	color: #FFF;
}

#videothumbs a.share-link {
	font-weight: normal;
	font-size: 11px;
	color: #666;
}

#videothumbs a.share-link:hover {
	color: #999;
}