body {
background: #262626 url('http://therefuge.net/images/site/bg.jpg') repeat-x;
margin:0;
padding: 0;
color: #444;
font: normal 12px/20px 'Helvetica Neue', Helvetica, Arial, sans-serif; /* normalize font size across browsers */
}

.wrapper {width: 965px; margin: 0 auto; z-index:-1;}

.header {}

.logo {width: 300px; float:left; padding-top: 10px; padding-bottom:5px;}

.h4 {
font-weight: bold;
font-size: 14px;
padding: 0px;
margin: 0px;
}



/*-------------------------------------------------------------- Everything HEADER RIGHT--------------------------------------------------------------------------*/

.header_right {width:615px; float: right;}


/*Quick Links Drop Down*/

.quick_links {width: 195px; float: left; position: relative; z-index:4000; margin-right: 5px; margin-left: 5px; }
a.quick_links_button { width:195px; height: 34px; float:left; background: url('http://therefuge.net/images/site/quick_links_button.png') no-repeat;}
.dropnav {display:block;}

.quick_links li.dropmain {  position: relative; list-style: none; }	
.quick_links li.dropmain ul.dropsub {
display: none; 
position: absolute; top: 31px; right: 0px; z-index: 99; 
background-color: #666;
background-image: -moz-linear-gradient(0% 0% 180deg, #666, #333) !important;
background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#666666), to(#333333), color-stop(.8,#333333)); 
padding-right: 0px; 
margin-top: 0px; 
padding-top: 0px;
}
	
.quick_links li.dropmain ul.dropsub li { width: 175px; margin: 0px; padding:0px; font-size: 13px; color: #fff; border-bottom: 1px solid #999;}
.quick_links ul.dropsub li a { text-decoration: none; color: #fff; font-size: 13px; padding:5px 8px;}
.quick_links ul.dropsub li a:hover { text-decoration: none; color: #cc0000; font-size: 13px; width: 159px;}

.quick_links li:hover ul.dropsub { 
display: block; 
width: 175px; 
margin: 0px;
padding: 10px; 
-moz-border-radius: 0px 0px 10px 10px; -webkit-border-radius: 0px 0px 10px 10px;
border-radius: 0px 0px 10px 10px; border-radius: 0px 0px 10px 10px;
}


/*-------Other Churches Drop Down-----------*/

.other_churches { width: 195px; float: left; position: relative; z-index:4000; margin-right: 5px; margin-left: 5px}
a.other_churches_button{ width:195px; height: 34px; float:left; background: url('http://therefuge.net/images/site/other_churches_button.png') no-repeat;}
.dropnav {display:block;}


.other_churches li.dropmain {  position: relative; list-style: none; }	
.other_churches li.dropmain ul.dropsub {
display: none; 
position: absolute; top: 31px; right: 0px; z-index: 99; 
background-color: #666;
background-image: -moz-linear-gradient(0% 0% 180deg, #666, #333) !important;
background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#666666), to(#333333), color-stop(.8,#333333)); padding-right: 0px; 
margin-top: 0px; 
padding-top: 0px;
}
	
.other_churches li.dropmain ul.dropsub li { width: 175px; margin: 0px; padding:0px; font-size: 13px; color: #fff; border-bottom: 1px solid #999;}
.other_churches ul.dropsub li a { text-decoration: none; color: #fff; font-size: 13px; padding:5px 8px;}
.other_churches ul.dropsub li a:hover { text-decoration: none; color: #cc0000; font-size: 13px; width: 159px;}

.other_churches li:hover ul.dropsub { 
display: block; 
width: 175px; 
margin: 0px;
padding: 10px; 
-moz-border-radius: 0px 0px 10px 10px; -webkit-border-radius: 0px 0px 10px 10px;
border-radius: 0px 0px 10px 10px; border-radius: 0px 0px 10px 10px;
}


/*Campuses Drop Down*/

.campuses {width: 195px; float: left; position: relative; z-index:4000; margin-right: 5px; margin-left: 5px; }
a.campuses_button { width:195px; height: 34px; float:left; background: url('http://therefuge.net/images/site/campus_button.png') no-repeat;}
.dropnav {display:block;}

.campuses li.dropmain {  position: relative; list-style: none; }	
.campuses li.dropmain ul.dropsub {
display: none; 
position: absolute; top: 31px; right: 0px; z-index: 99; 
background-color: #666;
background-image: -moz-linear-gradient(0% 0% 180deg, #666, #333) !important;
background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#666666), to(#333333), color-stop(.8,#333333)); 
padding-right: 0px; 
margin-top: 0px; 
padding-top: 0px;
}
	
.campuses li.dropmain ul.dropsub li { width: 175px; margin: 0px; padding:0px; font-size: 13px; color: #fff; border-bottom: 1px solid #999;}
.campuses ul.dropsub li a { text-decoration: none; color: #fff; font-size: 13px; padding:5px 8px;}
.campuses ul.dropsub li a:hover { text-decoration: none; color: #cc0000; font-size: 13px; width: 159px;}

.campuses li:hover ul.dropsub { 
display: block; 
width: 175px; 
margin: 0px;
padding: 10px; 
-moz-border-radius: 0px 0px 10px 10px; -webkit-border-radius: 0px 0px 10px 10px;
border-radius: 0px 0px 10px 10px; border-radius: 0px 0px 10px 10px;
}



.network_links {float:right; margin-right: 10px; margin-top: 25px; width: 210px;}
.network_links li {float: right; padding: 0px 5px; margin-top: 15px;}
.watch_now {width: 150px; float:right; margin-top: 15px; margin-right: 20px;}


/*------Search-------*/

.search_bar {margin-top: 5px;}
.search {margin-top: 10px; width: 265px; height: 43px; background: url('http://therefuge.net/images/site/search_bg.png') no-repeat; float: left; }
.search .input {border: 1px solid #ddd; width: 160px; height: 25px; margin: 7px 3px 0px 17px;  float: left; -moz-border-radius: 5px; -webkit-border-radius: 5px;}
.search_submit {background: none; border:none; font-size: 16px; color: #fff; font-weight: 100; float: left; margin-top: 10px;}
.drop_down_search { width: 135px; float: left;}

.our_media_button { 
width: 135px; 
height: 43px; 
background: url('http://therefuge.net/images/site/our_media_button.png') no-repeat; 
text-indent: -999em; 
float: left; 
margin-top: 10px;
} 




/*------------------------------------------------------------- End Everything HEADER RIGHT------------------------------------------------------------------------*/









/*------------------------------------------------------------------- Top NAV--------------------------------------------------------------------------------*/

div.topnav { 
width:957px; 
height:45px; 
background: url('http://therefuge.net/images/site/topnav_bg.png') no-repeat; 
margin: 0px auto; 
border-bottom: 1px solid #ddd; 
margin-bottom: 15px;
position: relative; z-index: 3000;
}

#nav li a { display:block;	list-style: none; float: left;}
#nav, #nav li { list-style: none; float: left; margin: 0; padding: 0;}

/* -------------------------------------------------------------------  OLD Top NAV

#nav li a.new 				{ background: url('http://therefuge.net/images/site/topnav.jpg') no-repeat 0px 0px; width: 196px; height: 45px; text-indent:-999em;}
#nav li a:hover.new	   		{ background: url('http://therefuge.net/images/site/topnav_over.jpg') no-repeat 0px 0px; width: 196px; height: 45px; text-indent:-999em; }


#nav li a.about				{ background: url('http://therefuge.net/images/site/topnav.jpg') no-repeat -196px 0px; width: 122px; height: 45px; text-indent:-999em;}
#nav li a:hover.about	   	{ background: url('http://therefuge.net/images/site/topnav_over.jpg') no-repeat -196px 0px; width: 122px; height: 45px; text-indent:-999em; }


#nav li a.ministries		{ background: url('http://therefuge.net/images/site/topnav.jpg') no-repeat -318px 0px; width: 155px; height: 45px; text-indent:-999em; }
#nav li a:hover.ministries	{ background: url('http://therefuge.net/images/site/topnav_over.jpg') no-repeat -318px 0px; width: 155px; height: 45px; text-indent:-999em; }


#nav li a.news				{ background: url('http://therefuge.net/images/site/topnav.jpg') no-repeat -473px 0px; width: 200px; height: 45px; text-indent:-999em; }
#nav li a:hover.news	   	{ background: url('http://therefuge.net/images/site/topnav_over.jpg') no-repeat -473px 0px; width: 200px; height: 45px; text-indent:-999em; }


#nav li a.contact			{ background: url('http://therefuge.net/images/site/topnav.jpg') no-repeat -673px 0px; width: 173px; height: 45px; text-indent:-999em; }
#nav li a:hover.contact  	{ background: url('http://therefuge.net/images/site/topnav_over.jpg') no-repeat -673px 0px; width: 173px; height: 45px; text-indent:-999em; }

OLD Top NAV--------------------------------------------------------------------------------*/

#nav li a.new 				{ background: url('http://www.therefuge.net/images/site/new_here.png') no-repeat ; width: 215px; height: 45px; text-indent:-999em;}
#nav li a:hover.new	   		{ background: url('http://www.therefuge.net/images/site/new_here_over.png') no-repeat ; width: 215px; height: 45px; text-indent:-999em; }


#nav li a.about				{ background: url('http://www.therefuge.net/images/site/about.png') no-repeat ; width: 114px; height: 45px; text-indent:-999em;}
#nav li a:hover.about	   	{ background: url('http://www.therefuge.net/images/site/about_over.png') no-repeat ; width: 114px; height: 45px; text-indent:-999em; }


#nav li a.ministries		{ background: url('http://www.therefuge.net/images/site/ministries.png') no-repeat ; width: 175px; height: 45px; text-indent:-999em; }
#nav li a:hover.ministries	{ background: url('http://www.therefuge.net/images/site/ministries_over.png') no-repeat ; width: 175px; height: 45px; text-indent:-999em; }


#nav li a.news				{ background: url('http://www.therefuge.net/images/site/news.png') no-repeat ; width: 212px; height: 45px; text-indent:-999em; }
#nav li a:hover.news	   	{ background: url('http://www.therefuge.net/images/site/news_over.png') no-repeat ; width: 212px; height: 45px; text-indent:-999em; }


#nav li a.media				{ background: url('http://www.therefuge.net/images/site/media.png') no-repeat ; width: 104px; height: 45px; text-indent:-999em; }
#nav li a:hover.media  		{ background: url('http://www.therefuge.net/images/site/media_over.png') no-repeat ; width: 104px; height: 45px; text-indent:-999em; }

#nav li a.contact			{ background: url('http://www.therefuge.net/images/site/contact.png') no-repeat ; width: 137px; height: 45px; text-indent:-999em; }
#nav li a:hover.contact  	{ background: url('http://www.therefuge.net/images/site/contact_over.png') no-repeat ; width: 137px; height: 45px; text-indent:-999em; }



/*Drop Down Menu CSS */

.topnav li.mainnav {  position: relative; z-index: 1000; list-style: none;}	
.topnav li.mainnav ul.subnav {
display: none; 
position: absolute; top: 45px; left: 0; z-index: 9999; 
background: url('http://therefuge.net/images/site/subnav_bg.png') repeat; 
padding-right: 0px; 
margin-top: 10px; 
padding-top: 5px;
text-transform: uppercase;
-moz-border-radius: 0px 0px 20px 20px; -webkit-border-radius: 0px 0px 20px 20px;
border-radius: 0px 0px 20px 20px; border-radius: 0px 0px 20px 20px;
border-bottom: 1px solid #fff;
border-right: 1px solid #fff;
border-left: 1px solid #fff;

}
	
.topnav li.mainnav ul.subnav li { width: 150px; margin: 0px; padding: 0px;}	
.topnav li.mainnav ul.subnav li a { background: none; padding: 3px 2px; color: #fff; font-size: 12px; clear: left;}
.topnav li.mainnav ul.subnav li a:hover { background: none; padding: 3px 2px; color: #cc0000; font-size: 12px;}
.topnav li:hover ul.subnav { display: block; width: 135px; margin: 0px;padding: 10px;}
.topnav ul li a { text-decoration: none; color: #fff; font-size: 14px;}
.topnav ul li a:hover { text-decoration: none; color: #cc0000;}
	
/*End Drop Down Menu CSS */



/*------------------------------------------------------------------- End Top NAV--------------------------------------------------------------------------------*/









/*---------------------------------------------------------------- Javascript Slideshow ----------------------------------------------------------------------------*/


.slides {width:960px; height:226px; margin:0 auto; background:#000; position: relative; z-index: -10;}

/*---------------------------------------------------------------- End Javascript Slideshow -------------------------------------------------------------------------*/

.slideshow {z-index:-9999;}




.content {width: 960px; margin:0 auto; background: #f5f5f5 url('http://www.therefuge.net/images/site/contentbg_03.jpg') repeat-y; -moz-border-radius: 0px 0px 10px 10px; -webkit-border-radius: 0px 0px 10px 10px;}
.content_nosidebar {width: 960px; margin:0 auto; background: #f5f5f5; -moz-border-radius: 0px 0px 10px 10px; -webkit-border-radius: 0px 0px 10px 10px;}




/*-------------------------------------------------------------------- Big 3 Buttons ----------------------------------------------------------------------------*/

.bottom_buttons {margin-bottom: 15px;}

.bottom_buttons li {width:280px; height: 85px; float: left; margin: 14px 20px;}



.three_buttons { font-size: 12px;
width: 960px; 
background: #fff url('http://therefuge.net/images/site/3button_bg.jpg') repeat-x; 
/*
padding: 0px 0px 40px 0px;
-moz-border-radius: 0px 0px 10px 10px; -webkit-border-radius: 0px 0px 10px 10px;
border-radius: 0px 0px 10px 10px; border-radius: 0px 0px 10px 10px;
*/

 }

.three_buttons li {width:280px; height: 85px; float: left; margin: 14px 20px;}

.three_buttons li a {width:260px; height: 75px; float: left; background: url('http://therefuge.net/images/site/box-1.png') no-repeat; padding: 10px 0px 0px 20px; color: #fff;}

.three_buttons li a:hover {width:260px; height: 75px; float: left; background: url('http://therefuge.net/images/site/box_hover1-1.png') no-repeat; padding: 10px 0px 0px 20px; color:#fff; text-decoration: none;}




.three_buttons a span {font-size: 20px; line-height: 20px; font-family: 'Josefin Sans Std Light', arial, serif; }

li a span.big_event_title {font-size: 18px; color: #fff;}

/*------------------------------------------------------------------ End Big 3 Buttons --------------------------------------------------------------------------*/



.content_body {
width: 960px;
margin: 0 auto;
background: #fff url('http://www.therefuge.net/images/site/contentbg_03.jpg') repeat-y;
-moz-border-radius: 0px 0px 10px 10px; -webkit-border-radius: 0px 0px 10px 10px;
border-radius: 0px 0px 10px 10px; border-radius: 0px 0px 10px 10px;
}

.content_body_nosidebar {
width: 960px;
margin: 0 auto;
background: #fff;
-moz-border-radius: 0px 0px 10px 10px; -webkit-border-radius: 0px 0px 10px 10px;
border-radius: 0px 0px 10px 10px; border-radius: 0px 0px 10px 10px;
}

.content_text {padding: 0px 10px; width: 940px;}
 /*
.content { 
width: 960px; 
background: #fff url('http://therefuge.net/images/site/3button_bg.jpg') repeat-x; 
padding: 0px 0px 40px 0px;
-moz-border-radius: 0px 0px 10px 10px; -webkit-border-radius: 0px 0px 10px 10px;
border-radius: 0px 0px 10px 10px; border-radius: 0px 0px 10px 10px;
}
*/

.content_sidebar {
width: 250px;
float:left;
min-height: 10px;
background: #aeb0b2;
height:100% !important;
font-family: "myriad-pro-condensed-1";
}

.content_sidebar li {width: 250px; height: 65px; background: url('http://therefuge.net/images/site/-sidebar_button.jpg') no-repeat; }

.content_sidebar li a {
text-decoration: none;
width: 235px; 
height: 45px; 
background: url('http://therefuge.net/images/site/sidebar_button.jpg') no-repeat; 
float: left; 
color: #222;
font-size: 20px;
padding: 20px 0px 0px 15px;
text-align: left;
text-transform: uppercase;
}

.content_sidebar li a:hover {
text-decoration: none; 
width: 235px; 
height: 45px; 
background: url('http://therefuge.net/images/site/sidebar_button_over.jpg') no-repeat; 
float: left; 
font-size: 20px;
padding: 20px 0px 0px 15px;
}

#active_content_sidebar  {width: 250px; height: 65px; background: url('http://therefuge.net/images/site/-sidebar_button.jpg') no-repeat; }

#active_content_sidebar a {
text-decoration: none; 
width: 235px; 
height: 45px; 
background: url('http://therefuge.net/images/site/active_sidebar_button.jpg') no-repeat; 
float: left; 
color: #222;
font-size: 20px;
padding: 20px 0px 0px 15px;
text-align: left;
}

#active_content_sidebar a:hover {
text-decoration: none; 
width: 235px; 
height: 45px; 
background: url('http://therefuge.net/images/site/sidebar_button_over.jpg') no-repeat; 
float: left; 
font-size: 20px;
padding: 20px 0px 0px 15px;
}

.back_content_sidebar li {width: 250px; height: 65px; background: url('http://therefuge.net/images/site/-back_sidebar_button.jpg') no-repeat; }

.back_content_sidebar li a {
	text-decoration: none; 
	width: 235px; 
	height: 45px; 
	background: url('http://therefuge.net/images/site/back_sidebar_button.jpg') no-repeat; 
	float: left; 
	color: #222;
	font-size: 20px;
	padding: 20px 0px 0px 15px;
	text-align: left;
}

.back_content_sidebar li a:hover {
	text-decoration: none; 
	width: 235px; 
	height: 45px; 
	background: url('http://therefuge.net/images/site/back_sidebar_button_over.jpg') no-repeat; 
	float: left; 
	font-size: 20px;
	padding: 20px 0px 0px 15px;
}


/*------Content-------*/

.content_right {
width: 630px;
float: left;
margin-left: 30px;

}

.content_right_full {
width: 95%;
float: left;
padding: 20px 0px 0px 15px;
background: #fff;
-moz-border-radius: 0px 0px 10px 10px;
-webkit-border-radius: 0px 0px 10px 10px;
border-radius: 0px 0px 10px 10px;

}

.content_right_events {
width: 630px;
float: left;
margin-left: 30px;
-moz-border-radius: 0px 0px 10px 10px;
-webkit-border-radius: 0px 0px 10px 10px;
border-radius: 0px 0px 10px 10px;
}



.video {width: 512px; height: 288px; border: 1px solid #ddd; padding: 5px; margin: 20px auto;}


ul.staff {text-transform: uppercase; font-size:16px; font-weight:300; padding: 0px 20px;}
ul.staff li {float:left; padding-right: 0px; text-align:center; width: 220px;}
ul.staff li span {font-size:14px;}






/*MediaPlayer Page*/

.media_content {width: 955px; margin:0 auto; padding: 10px; background: #fff;}


.mediaplayer_left { width: 640px; float: left;}
.videoinfo  {margin: 5px 0px;}

.videoinfo ul {list-style:none; margin:10px 0px; padding:0;}
.videoinfo li {list-style:none; float:left; margin:0; padding:0;}

.videoinfo h3 {font-size: 24px; color: #60adc5; font-weight: 250; margin: 0px 10px; padding-top: 0px; }
.videoinfo h4 {font-size: 30px; color: #181818; font-weight: 250; margin: 10px 10px; padding-bottom: 5px; }
.content_right h4 {font-size: 22px; color: #181818; font-weight: 250; margin: 10px 0px; padding: 0; }


.videoinfo p {padding-left: 10px; padding-top: 0px;}

.mediaplayer_right {width: 300px; float: right;}


/*Playlist Buttons*/
ul.tabs {list-style: none; margin: 0; padding: 0;}
ul.tabs li {list-style: none; margin: 0; padding: 0;}

ul.tabs li a { 
float: left; text-decoration: none; color: #181818; background: #ebe8e8; width: 85px; height: 15px; text-transform: uppercase; margin-right: 10px; padding: 10px 0px;
text-align: center;
}

ul.tabs li a:hover { color: #fff; background: #60adc5; width: 85px; height: 15px; margin-right: 10px; padding: 10px 0px;}


.video_button {
 	line-height: 1;
    text-decoration:none;
    display: inline-block;
    padding: 2px 5px;
    font-family: Arial, sans-serif;
    text-transform:uppercase;
    font-size:12px;
    color:#fff;
    cursor:pointer;
    -moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	text-shadow: -1px -1px 0px rgba(0,0,0,0.15);
}

/*End Playlist Buttons*/


/* Start Media Playlists*/
.tab_content ul {list-style: none; margin: 0; padding: 0; margin-top: 10px;}
.tab_content ul li {list-style: none; width: 250px; height: 75px; border: 1px solid #ebe8e8; -moz-border-radius: 5px; -webkit-border-radius: 5px; margin: 0px 0px; padding: 10px 0px;}
.tab_content ul li a {text-decoration: none; color: #181818; width: 245px; height: 75px; float: left;}
.tab_content ul li a:hover {text-decoration: none; color: #181818; background: #ebe8e8;  float: left;}
/* End Media Playlists*/

.video_thumb {width: 110px; height: 62px; float: left; clear: both; margin-bottom: 10px;  border: 1px solid #ebe8e8;}
span.series_title {font-size: 14px; font-weight: bold; padding: 10px 0px 0px 10px; }
span.sermon_title {font-size: 13px; padding: 10px 0px 0px 10px; }

/*End MediaPlayer Page*/


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


.calendar_right {
width:390px;
color:#333;
float:left;
font-size:16px;
background: #ffffff;
margin: 0px 25px;
padding:10px;
}

.calendar_right li {border-bottom:1px dashed #cccccc; padding: 5px 0px;}
.calendar_right a {color:#222;}




.events_list li {
padding: 15px 0px;
width: 460px;
min-height: 125px;
}

.event_title  {font-size:16px; color: #000;}


.event_month {font-size:16px; text-transform: uppercase;}
.event_day {font-size:20px;}
.big_date {float:left; background: #999; width:50px; height:40px; padding: 10px; color: #fff; margin-right: 10px; text-align:center; -moz-border-radius: 5px; -webkit-border-radius: 5px;}
.event_info {float:left; width: 375px;}


.video_announcements {margin-top: 60px;}



ul.forms {width: 400px;background: #f7f6ec; padding: 15px; margin-top:10px;}
ul.forms li {padding: 5px 0px; }

ul.forms label {font-size:14px; width: 150px; font-weight:bold; color:#000;}
ul.forms input {width:350px; height:30px; border:1px solid #ddd; font-size:14px;}


.event_image { border:1px solid #ddd; padding: 5px; margin-bottom: 10px;}



.footer {font-size: 11px; color: #999; margin: 10px 10px; padding-bottom: 25px;}
.footer_left {float:left;}
.footer_right {float:right; font-size: 12px;}

.contact_left {
width: 400px;
float:left;
padding: 0px 15px;
}

.contact_right {width:450px; float:right; padding: 10px 15px;}

.contact_right .input {
border:1px solid #ddd;;
width:400px;
height:25px;
font-size:16px;
}

.contact_right .textarea {
border:1px solid #ddd;;
width:400px;
height:150px;
font-size:16px;
margin-bottom:25px;
}

ul {list-style: none; margin:0; padding:0;}
ul li {list-style: none; margin:0; padding:0;}

p {margin: 3px 0px;}
.clear {clear:both;}

a {text-decoration: none; color:#cc0000;}
a:hover {text-decoration: underline; color:#cc0000;}


h2 {margin: 5px 0px; padding-bottom: 15px; font-size:22px;}


.ie_body {
width: 853px;
font-size: 16px;
line-height:30px;
padding: 20px;
background: #000;
margin: 50px auto;
color: #ddd;
}

ie_body h4 {
font-size: 34px;
margin: 0;
padding: 0;
}

ul.browsers {
list-style: none;
margin: 50px 30px;
padding: 0;
}

ul.browsers li {
list-style: none;
margin: 0;
padding: 0;
float: left;
}


h1 {font-size: 24px; color: #000;}


.pagination_links  { font-size: 14px; margin-top: 15px;}
.pagination_links span {font-style: Georgia; font-size:12px; font-style: italic;}

.pagination_links a { font-size: 14px; border: 1px solid #ddd; padding: 2px 4px;}
.pagination_links a:hover { font-size: 14px; border: 1px solid #ddd; padding: 2px 4px; background: #444;}


/*start Request Forms*/

.forms_body {
margin: 0px 20px;
}

a { }
a:visited { }
a:hover { text-decoration: none; }
img { border: none; }
p, ul, ol, dl, table { margin-bottom: 18px; }
ul, ol, dd { margin-left: 36px; }
input, textarea, select { font: inherit; }

/*****Custom Classes*****/
.clearing { clear: both; }
.clearfix { overflow: hidden; }
.last { margin-bottom: 0; }
.screenReader { display: block; left: -9999px; position: absolute; top: -9999px; }
.leftSide { float: left; margin: 0 10px 10px 0; }
.rightSide { float: right; margin: 0 0 10px 10px; }
.centered { display: inline; margin: 0 auto 18px; }

/*****Basic Layout*****/

.forms_body {
padding: 10px 0px;
}

ul.request_icons li {width: 150px; float: left; margin: 0 20px 0 0;}

.request_thumb {width: 100px;  padding: 0 0 0 30px; clear:both;} 
span.request_title {font-size: 14px; font-weight: bold; margin: 10px 0px 0px 10px; color: #000; clear:both;  }




/* 
VideoJS Default Styles (http://videojs.com)
Version 2.0.2

REQUIRED STYLES (be careful overriding)
================================================================================ */
/* Box containing video, controls, and download links.
   Will be set to the width of the video element through JS
   If you want to add some kind of frame or special positioning, use another containing element, not video-js-box. */

.video-js-box { text-align: left; position: relative; line-height: 0 !important; margin: 0; padding: 0 !important;  }
/* Video Element */
video.video-js { background-color: #000; position: relative; padding: 0;}


.vjs-flash-fallback { display: block; }

/* Poster Overlay Style */
.video-js-box img.vjs-poster { display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; margin: 0; padding: 0; cursor: pointer; }
/* Subtiles Style */
.video-js-box .vjs-subtitles { color: #fff; font-size: 20px; text-align: center; position: absolute; bottom: 40px; left: 0; right: 0; }

/* Fullscreen styles for main elements */
.video-js-box.vjs-fullscreen { position: fixed; left: 0; top: 0; right: 0; bottom: 0; overflow: hidden; z-index: 1000; }
.video-js-box.vjs-fullscreen video.video-js,
.video-js-box.vjs-fullscreen .vjs-flash-fallback { position: relative; top: 0; left: 0; width: 100%; height: 100%; z-index: 1000; }
.video-js-box.vjs-fullscreen img.vjs-poster { z-index: 1001; }
.video-js-box.vjs-fullscreen .vjs-spinner { z-index: 1001; }
.video-js-box.vjs-fullscreen .vjs-controls { z-index: 1003; }
.video-js-box.vjs-fullscreen .vjs-big-play-button { z-index: 1004; }
.video-js-box.vjs-fullscreen .vjs-subtitles { z-index: 1004; }

/* Styles Loaded Check */
.vjs-styles-check { height: 5px; position: absolute; }
/* Controls Below Video */
.video-js-box.vjs-controls-below .vjs-controls { position: relative; opacity: 1; background-color: #000; }
.video-js-box.vjs-controls-below .vjs-subtitles { bottom: 75px; } /* Account for height of controls below video */

/* DEFAULT SKIN (override in another file)
================================================================================
Using all CSS to draw the controls. Images could be used if desired.
Instead of editing this file, I recommend creating your own skin CSS file to be included after this file,
so you can upgrade to newer versions easier. */

/* Controls Layout 
  Using absolute positioning to position controls */
.video-js-box .vjs-controls {
  position: absolute; margin: 0; opacity: 0.85; color: #fff;
  display: none; /* Start hidden */
  left: 0; right: 0; /* 100% width of video-js-box */ 
  width: 100%;
  bottom: 0px; /* Distance from the bottom of the box/video. Keep 0. Use height to add more bottom margin. */
  height: 35px; /* Including any margin you want above or below control items */
  padding: 0; /* Controls are absolutely position, so no padding necessary */
}

.video-js-box .vjs-controls > div { /* Direct div children of control bar */
  position: absolute; /* Use top, bottom, left, and right to specifically position the control. */
  text-align: center; margin: 0; padding: 0;
  height: 25px; /* Default height of individual controls */
  top: 5px; /* Top margin to put space between video and controls when controls are below */

  /* CSS Background Gradients 
     Using to give the aqua-ish look. */
  /* Default */ background-color: #0B151A;
  /* Webkit  */ background: #1F3744 -webkit-gradient(linear, left top, left bottom, from(#111111), to(#555555)) left 12px;
  /* Firefox */ background: #1F3744 -moz-linear-gradient(top,  #111111,  #555555) left 12px;

  /* CSS Curved Corners */
  border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px;

  /* CSS Shadows */
  box-shadow: 1px 1px 2px #000; -webkit-box-shadow: 1px 1px 2px #000; -moz-box-shadow: 1px 1px 2px #000;
}

/* Placement of Control Items 
   - Left side of pogress bar, use left & width
   - Rigth side of progress bar, use right & width
   - Expand with the video (like progress bar) use left & right */
.vjs-controls > div.vjs-play-control       { left: 5px;   width: 25px;  }
.vjs-controls > div.vjs-progress-control   { left: 35px;  right: 165px; } /* Using left & right so it expands with the width of the video */
.vjs-controls > div.vjs-time-control       { width: 75px; right: 90px;  } /* Time control and progress bar are combined to look like one */
.vjs-controls > div.vjs-volume-control     { width: 50px; right: 35px;  }
.vjs-controls > div.vjs-fullscreen-control { width: 25px; right: 5px;   }

/* Removing curved corners on progress control and time control to join them. */
.vjs-controls > div.vjs-progress-control {
  border-top-right-radius: 0; -webkit-border-top-right-radius: 0; -moz-border-radius-topright: 0;
  border-bottom-right-radius: 0; -webkit-border-bottom-right-radius: 0; -moz-border-radius-bottomright: 0;
}
.vjs-controls > div.vjs-time-control { 
  border-top-left-radius: 0; -webkit-border-top-left-radius: 0; -moz-border-radius-topleft: 0;
  border-bottom-left-radius: 0; -webkit-border-bottom-left-radius: 0; -moz-border-radius-bottomleft: 0;
}

/* Play/Pause
-------------------------------------------------------------------------------- */
.vjs-play-control { cursor: pointer !important; }
/* Play Icon */
.vjs-play-control span { display: block; font-size: 0; line-height: 0; }
.vjs-paused .vjs-play-control span {
  width: 0; height: 0; margin: 8px 0 0 8px;
  /* Drawing the play triangle with borders - http://www.infimum.dk/HTML/slantinfo.html */
  border-left: 10px solid #fff; /* Width & Color of play icon */
  /* Height of play icon is total top & bottom border widths. Color is transparent. */
  border-top: 5px solid rgba(0,0,0,0); border-bottom: 5px solid rgba(0,0,0,0);
}
.vjs-playing .vjs-play-control span {
  width: 3px; height: 10px; margin: 8px auto 0;
  /* Drawing the pause bars with borders */
  border-top: 0px; border-left: 3px solid #fff; border-bottom: 0px; border-right: 3px solid #fff;
}

/* Progress
-------------------------------------------------------------------------------- */
.vjs-progress-holder { /* Box containing play and load progresses */
  position: relative; padding: 0; overflow:hidden; cursor: pointer !important;
  height: 9px; border: 1px solid #777;
  margin: 7px 1px 0 5px; /* Placement within the progress control item */
  border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px;
}
.vjs-progress-holder div { /* Progress Bars */
  position: absolute; display: block; width: 0; height: 9px; margin: 0; padding: 0;
  border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px;
}
.vjs-play-progress {
  /* CSS Gradient */
  /* Default */ background: #fff;
  /* Webkit  */ background: -webkit-gradient(linear, left top, left bottom, from(#ff0000), to(#660000));
  /* Firefox */ background: -moz-linear-gradient(top,  #fff,  #777);
}
.vjs-load-progress {
  opacity: 0.8;
  /* CSS Gradient */
  /* Default */ background-color: #555;
  /* Webkit  */ background: -webkit-gradient(linear, left top, left bottom, from(#555), to(#aaa));
  /* Firefox */ background: -moz-linear-gradient(top,  #555,  #aaa);
}

/* Time Display
-------------------------------------------------------------------------------- */
.vjs-controls .vjs-time-control { font-size: 10px; line-height: 1; font-weight: normal; font-family: Helvetica, Arial, sans-serif; }
.vjs-controls .vjs-time-control span { line-height: 25px; /* Centering vertically */ }

/* Volume
-------------------------------------------------------------------------------- */
.vjs-volume-control { cursor: pointer !important; }
.vjs-volume-control div { display: block; margin: 0 5px 0 5px; padding: 4px 0 0 0; }
/* Drawing the volume icon using 6 span elements */
.vjs-volume-control div span { /* Individual volume bars */
  float: left; padding: 0;
  margin: 0 2px 0 0; /* Space between */
  width: 5px; height: 0px; /* Total height is height + bottom border */
  border-bottom: 18px solid #555; /* Default (off) color and height of visible portion */
}
.vjs-volume-control div span.vjs-volume-level-on { border-color: #fff; /* Volume on bar color */ }
/* Creating differnt bar heights through height (transparent) and bottom border (visible). */
.vjs-volume-control div span:nth-child(1) { border-bottom-width: 2px; height: 16px; }
.vjs-volume-control div span:nth-child(2) { border-bottom-width: 4px; height: 14px; }
.vjs-volume-control div span:nth-child(3) { border-bottom-width: 7px; height: 11px; }
.vjs-volume-control div span:nth-child(4) { border-bottom-width: 10px; height: 8px; }
.vjs-volume-control div span:nth-child(5) { border-bottom-width: 14px; height: 4px; }
.vjs-volume-control div span:nth-child(6) { margin-right: 0; }

/* Fullscreen
-------------------------------------------------------------------------------- */
.vjs-fullscreen-control { cursor: pointer !important; }
.vjs-fullscreen-control div {
  padding: 0; text-align: left; vertical-align: top; cursor: pointer !important; 
  margin: 5px 0 0 5px; /* Placement within the fullscreen control item */
  width: 20px; height: 20px;
}
/* Drawing the fullscreen icon using 4 span elements */
.vjs-fullscreen-control div span { float: left; margin: 0; padding: 0; font-size: 0; line-height: 0; width: 0; text-align: left; vertical-align: top; }
.vjs-fullscreen-control div span:nth-child(1) { /* Top-left triangle */
  margin-right: 3px; /* Space between top-left and top-right */
  margin-bottom: 3px; /* Space between top-left and bottom-left */
  border-top: 6px solid #fff; /* Height and color */
  border-right: 6px solid rgba(0,0,0,0);  /* Width */
}
.vjs-fullscreen-control div span:nth-child(2) { border-top: 6px solid #fff; border-left: 6px solid rgba(0,0,0,0); }
.vjs-fullscreen-control div span:nth-child(3) { clear: both; margin: 0 3px 0 0; border-bottom: 6px solid #fff; border-right: 6px solid rgba(0,0,0,0); }
.vjs-fullscreen-control div span:nth-child(4) { border-bottom: 6px solid #fff; border-left: 6px solid rgba(0,0,0,0); }
/* Icon when video is in fullscreen mode */
.vjs-fullscreen .vjs-fullscreen-control div span:nth-child(1) { border: none; border-bottom: 6px solid #fff; border-left: 6px solid rgba(0,0,0,0); }
.vjs-fullscreen .vjs-fullscreen-control div span:nth-child(2) { border: none; border-bottom: 6px solid #fff; border-right: 6px solid rgba(0,0,0,0); }
.vjs-fullscreen .vjs-fullscreen-control div span:nth-child(3) { border: none; border-top: 6px solid #fff; border-left: 6px solid rgba(0,0,0,0); }
.vjs-fullscreen .vjs-fullscreen-control div span:nth-child(4) { border: none; border-top: 6px solid #fff; border-right: 6px solid rgba(0,0,0,0); }

/* Download Links - Used for browsers that don't support any video.
---------------------------------------------------------*/
.vjs-no-video { font-size: small; line-height: 1.5; }

/* Big Play Button (at start)
---------------------------------------------------------*/
div.vjs-big-play-button {
  display: none; /* Start hidden */ z-index: 2;
  position: absolute; top: 50%; left: 50%; width: 80px; height: 80px; margin: -43px 0 0 -43px; text-align: center; vertical-align: center; cursor: pointer !important;
  border: 1px solid #fff; opacity: 0.9;
  border-radius: 20px; -webkit-border-radius: 20px; -moz-border-radius: 20px;
  
  /* CSS Background Gradients */
  /* Default */ background-color: #0B151A;
  /* Webkit  */ background: #1F3744 -webkit-gradient(linear, left top, left bottom, from(#111111), to(#5)) left 40px;
  /* Firefox */ background: #1F3744 -moz-linear-gradient(top,  #0B151A,  #1F3744) left 40px;

  /* CSS Shadows */
  box-shadow: 4px 4px 8px #000; -webkit-box-shadow: 4px 4px 8px #000; -moz-box-shadow: 4px 4px 8px #000;
}
div.vjs-big-play-button:hover {
  box-shadow: 0px 0px 80px #fff; -webkit-box-shadow: 0px 0px 80px #fff; -moz-box-shadow: 0px 0px 80px #fff;
}

div.vjs-big-play-button span {
  display: block; font-size: 0; line-height: 0;
  width: 0; height: 0; margin: 20px 0 0 23px;
  /* Drawing the play triangle with borders - http://www.infimum.dk/HTML/slantinfo.html */
  border-left: 40px solid #fff; /* Width & Color of play icon */
  /* Height of play icon is total top & bottom border widths. Color is transparent. */
  border-top: 20px solid rgba(0,0,0,0); border-bottom: 20px solid rgba(0,0,0,0);
}

/* Spinner Styles
---------------------------------------------------------*/
/* CSS Spinners by Kilian Valkhof - http://kilianvalkhof.com/2010/css-xhtml/css3-loading-spinners-without-images/ */
.vjs-spinner { display: none; position: absolute; top: 50%; left: 50%; width: 100px; height: 100px; z-index: 1; margin: -50px 0 0 -50px;
  /* Scaling makes the circles look smoother. */
  transform: scale(0.5); -webkit-transform:scale(0.5); -moz-transform:scale(0.5);
}
/* Spinner circles */
.vjs-spinner div { position:absolute; left: 40px; top: 40px; width: 20px; height: 20px; background: #fff;
  border-radius: 20px; -webkit-border-radius: 20px; -moz-border-radius: 20px;
  border: 1px solid #ccc; /* Added border so can be visible on white backgrounds */
}
/* Each circle */
.vjs-spinner div:nth-child(1) { opacity: 0.12; transform: rotate(000deg) translate(0, -40px) scale(0.1); -webkit-transform: rotate(000deg) translate(0, -40px) scale(0.1); -moz-transform: rotate(000deg) translate(0, -40px) scale(0.1); }
.vjs-spinner div:nth-child(2) { opacity: 0.25; transform: rotate(045deg) translate(0, -40px) scale(0.2); -webkit-transform: rotate(045deg) translate(0, -40px) scale(0.2); -moz-transform: rotate(045deg) translate(0, -40px) scale(0.2); }
.vjs-spinner div:nth-child(3) { opacity: 0.37; transform: rotate(090deg) translate(0, -40px) scale(0.4); -webkit-transform: rotate(090deg) translate(0, -40px) scale(0.4); -moz-transform: rotate(090deg) translate(0, -40px) scale(0.4); }
.vjs-spinner div:nth-child(4) { opacity: 0.50; transform: rotate(135deg) translate(0, -40px) scale(0.6); -webkit-transform: rotate(135deg) translate(0, -40px) scale(0.6); -moz-transform: rotate(135deg) translate(0, -40px) scale(0.6); }
.vjs-spinner div:nth-child(5) { opacity: 0.62; transform: rotate(180deg) translate(0, -40px) scale(0.8); -webkit-transform: rotate(180deg) translate(0, -40px) scale(0.8); -moz-transform: rotate(180deg) translate(0, -40px) scale(0.8); }
.vjs-spinner div:nth-child(6) { opacity: 0.75; transform: rotate(225deg) translate(0, -40px) scale(1.0); -webkit-transform: rotate(225deg) translate(0, -40px) scale(1.0); -moz-transform: rotate(225deg) translate(0, -40px) scale(1.0); }
.vjs-spinner div:nth-child(7) { opacity: 0.87; transform: rotate(270deg) translate(0, -40px) scale(1.1); -webkit-transform: rotate(270deg) translate(0, -40px) scale(1.1); -moz-transform: rotate(270deg) translate(0, -40px) scale(1.1); }
.vjs-spinner div:nth-child(8) { opacity: 1.00; transform: rotate(315deg) translate(0, -40px) scale(1.3); -webkit-transform: rotate(315deg) translate(0, -40px) scale(1.3); -moz-transform: rotate(315deg) translate(0, -40px) scale(1.3); }

/* Sermon Page */

.sermoncontent {
width:960px;
float: left;
background: #fff;
-moz-border-radius: 0px 0px 10px 10px;
-webkit-border-radius: 0px 0px 10px 10px;
}

.recentsermon {
margin-top: 20px;
margin-left: 20px;
font-family: Helvetica;
font-size:24px;
}

.recentseriestitle {
margin-top: 40px;
margin-left: 20px;
font-family: Helvetica;
font-size:24px;
}

.sermonhr {
margin-top: 20px;
margin-left:20px;
margin-right:20px;
color:#ccc;
background-color:#ccc;
height:1px;
border-width:0px;
}

.recentsermon1 {
float:left;
margin-top: 20px;
margin-left: 2px;
width: 305px;
}

.seriesbuttons {
margin: 0 auto;
margin-left:20px;
margin-right: auto;
}

.seriesbuttons .recentsermon1 {
 
width: 305px;
height: 86px;
display: inline-block; 
}

.recentsermonvid{
margin-left:18px;
height:106px;
}

.recentseries {
float:left;
width:920px;
margin-top:20px;
margin-left:20px;
}

.streambutton {
width:300px;
margin-right:20px;
margin-top:20px;
height:260px;
margin-left:20px;
float:left;
margin-bottom:20px;
border-radius:10px;
-moz-border-radius:10px;
}

.currentsermon{
width:600px;
margin-left:20px;
margin-top:20px;
height:260px;
float:left;
overflow:hidden;
margin-bottom:20px;
border-radius:10px;
-moz-border-radius:10px;
}

.currentcontainer{

}

.videoplayer2{
margin: 0 auto;	
border: 10px solid white;
outline: 1px solid #ccc;
width:640px;
}

.sharetitle {
margin-top: 20px;
margin-left: 20px;
margin-bottom:10px;
font-family: Helvetica;
font-size:24px;
}

.shareemail {
width:650px;
margin-top:20px;

float:left;
}

.sharesm {
width:300px;
height:200px;
margin-top:20px;

float:right;
border-radius:10px;
-moz-border-radius:10px;
background-color:white;
}

.smitem{
width:220px;
height:33px;
padding-top:17px;
border-radius:10px;
-moz-border-radius:10px;
margin-top:10px;
margin-left:35px;
background-color:#ccc;
}



.smitem a {
	margin-left:20px;
	font-size:14px;
	color:white;
	text-decoration:none;
}
.smitem a:hover {text-decoration:underline;}




.sharesubtitle {
font-family: Helvetica;
font-size:18px;
color:white;
margin:0;
text-align:left;
margin-bottom:10px;
}

.media_content{
border-radius:10px;
-moz-border-radius:10px;
width:945px;
}

input.input_box{
	border:1px solid #dddddd;
	background-color:#fafafa;
	padding:4px;
	height:25px;
	font-family:arial;
	font-size:12px;
	width:195px;
	margin-bottom:5px;
	
}
textarea.input_box{
	border:1px solid #dddddd;
	background-color:#fafafa;
	padding:4px;
	font-family:arial;
	font-size:12px;
	width:195px;
	height:65px;
}

.smtitle {
	margin-top:20px;
	margin-left:20px;
	margin-right:20px;
	color:#ccc;
	font-family:helvetica;
	font-size:20px;
	text-align:center;
}

#inner.th{width:115px;}
