/*
      UPSIDEDOWN 21 - The Web Ministry for the Sold Out Discipling Movement of Churches
	  Developed by: Rob Onekea & Jeremy Ciaramella for Discipleship Media www.discipleshipmedia.com
	  All rights reserved.
	  
*/


* {
	padding: 0;
	margin: 0;
}

body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	background-repeat: repeat-x;
	background-color: #14203D;
	line-height: 20px;
}

#wrapper { 
 margin: 0 auto;
 width: 1000px;
}

#faux {
	margin-bottom: 0px;
	overflow: auto; /* Paul O Brien Fix for IE www.pmob.co.uk */
	width: 100%;
	background-color: #FFFFFF;
}

#header {
	color: #333;
	width: 980px;
	height: 170px;
	background-color: #D1DBDB;
	background-image: url(../img/header2.jpg);
	margin-top: 10px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 10px;
	padding-bottom: 10px;
	padding-left: 10px;
}


#footer {
	width: 1000px;
	clear: both;
	color: #14203D;
	background-color: #ABBEBE;
	background-image: url(../img/footer.jpg);
	height: 40px;
	background-repeat: no-repeat;
	padding-top: 35px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	text-align: center;
	font-size: 12px;
}

#footer a {
	text-decoration: none;
	color: #245C9C;
}

#footer a:hover {
	color: #F56901;
}



/* ------------------------------- NAVIGATION ----------------------------- */

#navigation {
	color: #666666;
	background-color: #14203D;
	height: 30px;
}

#navigation ul {
	margin: 0;
	padding: 0;
	float: left;
	width: 1000px;
	list-style: none;
	text-transform: uppercase;
}

#navigation ul li {
	float: left;
	background-image: url(../img/tab-right.gif);
	background-repeat: no-repeat;
	background-position: right top;
}


/* Hack to make IE/Mac play nice */
#navigation li a {
	padding: 0 2em;
	line-height: 2.5em;
	text-decoration: none;
	color: #245C9C;
	float: left;
	display: block;
	background-image: url(../img/tab-left.gif);
	background-repeat: no-repeat;
	background-position: left top;
}

#navigation ul a:hover {
	color: #F56901;
}



/* ------------------------------- THREE COLUMN ----------------------------- */
  
#threecolumn #columnA {
	float: left;
	color: #333;
	padding: 0px;
	width: 510px;
	display: inline;
	position: relative;
	margin-top: 0px;
	margin-right: 5px;
	margin-bottom: 10px;
	margin-left: 10px;
}

#threecolumn .img {
	margin: 10px;
}


#threecolumn #columnB {
	display: inline;
	color: #333;
	margin: 0 0 0 0px;
	padding: 0;
	width: 160px;
	float: left;
}

#threecolumn #columnC {
	display: inline;
	position: relative;
	color: #333;
	margin: 0px 0px 10px 0px;
	padding: 0px;
	width: 280px;
	float: right;
}

/* ---------------------------------- TWO COLUMN ------------------------------- */
  
#twocolumn #columnA {
	float: left;
	color: #333;
	padding: 0px;
	width: 750px;
	display: inline;
	position: relative;
	margin-top: 0px;
	margin-right: 5px;
	margin-bottom: 10px;
	margin-left: 10px;
}

#twocolumn #columnB {
	display: inline;
	color: #333;
	width: 220px;
	float: right;
	margin-top: 0;
	margin-right: 10px;
	margin-bottom: 0;
	margin-left: 0px;
	padding-top: 0;
	padding-right: 0px;
	padding-bottom: 0;
	padding-left: 0;
}


/* ---------------------------------- ONE COLUMN ------------------------------ */
  
#onecolumn #columnA {
	float: left;
	color: #333;
	padding: 0px;
	width: 980px;
	display: inline;
	position: relative;
	margin-top: 0px;
	margin-right: 5px;
	margin-bottom: 10px;
	margin-left: 10px;
}
#language {
	float: right;
	width: 190px;
}
#language img {
	float: right;
	padding-top: 7px;
}
.languagebox {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	text-align: center;
}

ul {
	line-height: 10px;
}

.clear { clear: both; background: none; }

.noborder {
	border:none;
    display: block;
    margin-left: auto;
    margin-right: auto }
	
	
/* ----------------------------------- Picture / Scripture Styles ----------------------------------- */

.picture {
	border: none;
	padding: 3px;
	font: 11px/1.4em Arial, sans-serif;
}
.picture img {
	border: 1px solid #CCCCCC;
	vertical-align:middle;
	margin-bottom: 3px;
}
.right {
	float:right;
	text-align: center;
	color: #245B9B;
	margin-top: 0.5em;
	margin-right: 0pt;
	margin-bottom: 0.5em;
	margin-left: 0.8em;
	padding-right: 30px;
	padding-left: 15px;
}
	

.left {
	float:left;
	text-align: center;
	color: #245B9B;
	padding-left: 30px;
	margin: 3px;
	padding-right: 15px;
}
.center {
	margin: 0 auto;
	color: #245b9b;
	text-align: center;
}

.dl_btn {
	padding-top: 10px;
	padding-right: 5px;
	border:none;
}
.topbanner {
	float: right;
	padding-top: 60px;
	margin-right: -180px;
}

.scripture {
	font-style: italic;
	font-weight: bold;
	color: #245B9B;
}

.formbutton{
	cursor:pointer;
	border:outset 1px #ccc;
	color:#FFFFFF;
	font-weight:bold;
	padding: 5px;
	margin-top:10px;
	background-color: #BFBFBF;
	background-image: url(media/formbg.gif);
	background-repeat: repeat-x;
	background-position: left top;
}

input {
	padding-bottom: 5px;
	margin-bottom:5px;
}

.texta {
 font-size: 10px;
 background-color: #CCCCCC;
 border: 1px solid #666666;
}

form {
 border: none;
 padding: 5px;
}


/*  ----------------------------------- 3 Column Rounded Corner Box ----------------------------------- */

#threecolumn .box {
	width: 520px;
	background: url(../img/A_bottom-left.jpg) no-repeat left bottom;
	margin-top: 15px;
	margin-left: 5px;
	margin-right: 20px;
	
}

#threecolumn  .box-outer {
  background: url(../img/A_bottom-right.jpg) no-repeat right bottom;
  padding-bottom: 30px;
}

#threecolumn  .box-inner {
  background: url(../img/A_top-left.jpg) no-repeat left top;
}

#threecolumn .box-inner h2 {
	background: url(../img/A_top-right.jpg) no-repeat right top;
}

#threecolumn .box h2 {
	padding-top: 20px;
}


#threecolumn .box h2{
	padding-left: 20px;
	padding-right: 30px;
	padding-bottom: 0px;
}

#threecolumn .box p {
	padding-bottom: 20px;
	padding-left: 20px;
	padding-right: 20px;
	
}

#threecolumn  .box h3 {
	padding-left: 30px;
	padding-right: 30px;
	color: #AAB9CA;
	font-size: 14px;
	font-weight: normal;
	margin-bottom: 10px;
}

#threecolumn .box a {
	color: #245C9C;
}

#threecolumn .box a:hover {
	color: #F56901;
}



/*  ----------------------------------- Rounded Corner Box 2 ----------------------------------- */

.box2 {
	width: 174px;
	margin-top: 15px;
	margin-left: 20px;
	background-color: #DEE5EE;
	background-image: url(../img/B_bottom-left.jpg);
	background-repeat: no-repeat;
	background-position: left bottom;
}

.box2-outer {
  background: url(../img/B_bottom-right.jpg) no-repeat right bottom;
  padding-bottom: 30px;
}

.box2-inner {
  background: url(../img/B_top-left.jpg) no-repeat left top;
}

.box2 h2 {
	background: url(../img/B_top-right.jpg) no-repeat right top;
	padding-top: 20px;
	font-size:14px;
}

.box2 h2, .box2 p {
	padding-left: 15px;
	padding-right: 30px;
}

.box2 a {
	color: #14203D;
}

.box2 a:hover {
	color: #FE7207;
}

.box2 ul {
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 25px;
	padding-right: 10px;
}

.box2 li {
	line-height:20px;
}

.box2 a {

}

.box2 a:hover {
}



/* ----------------------------------- 2 Column Rounder Corner Box1 -------------------------------- */

#twocolumn .box {
	width: 760px;
	background: url(../img/A_bottom-left.jpg) no-repeat left bottom;
	margin-top: 15px;
}

#twocolumn .box-outer {
  background: url(../img/A_bottom-right.jpg) no-repeat right bottom;
  padding-bottom: 30px
}

#twocolumn .box-inner {
  background: url(../img/A_top-left.jpg) no-repeat left top;
}


#twocolumn .box h2 {
	background: url(../img/A_top-right.jpg) no-repeat right top;
	padding-top: 20px;
}


#twocolumn .box h2{
	padding-left: 30px;
	padding-right: 30px;
	padding-bottom: 0px;
}


#twocolumn .box p {
	padding-left: 30px;
	padding-right: 30px;
	padding-bottom: 15px;
}

#twocolumn .box h3 {
	padding-left: 30px;
	padding-right: 30px;
	color: #AAB9CA;
	font-size: 14px;
	font-weight: normal;
	margin-bottom: 10px;
}

#twocolumn .box a {
	color: #245C9C;
}

#twocolumn .box a:hover {
	color: #F56901;
}



/* -------------------------------- 2 Column Rounded Corner Box2 -------------------------------- */

#twocolumn .box2 {
	width: 190px;
	background: url(../img/B_bottom-left.jpg) no-repeat left bottom;
	margin-top: 15px;
}

#twocolumn .box2-outer {
  background: url(../img/B_bottom-right.jpg) no-repeat right bottom;
  padding-bottom: 30px;
}

#twocolumn .box2-inner {
  background: url(../img/B_top-left.jpg) no-repeat left top;
}

#twocolumn .box2 h2 {
	background: url(../img/B_top-right.jpg) no-repeat right top;
	padding-top: 20px;
}

#twocolumn .box2 h2, .box2 p {
  padding-left: 30px;
  padding-right: 30px;
}

#twocolumn .box2 a {
	color: #14203D;
}

#twocolumn .box2 a:hover {
	color: #FE7207;
}



/* ------------------------------- Rounded Corner Box3 ----------------------------------------- */

.box3 {
	width: 260px;
	background: url(../img/C_bottom-left.jpg) no-repeat left bottom;
	margin-top: 15px;
	margin-left: 8px;
}

.box3-outer {
  background: url(../img/C_bottom-right.jpg) no-repeat right bottom;
  padding-bottom: 30px;
}

.box3-inner {
  background: url(../img/C_top-left.jpg) no-repeat left top;
}

.box3 h2 {
	background: url(../img/C_top-right.jpg) no-repeat right top;
	padding-top: 20px;
	font-size: 13px;
	text-align: left;
}

.box3 h2 {

	padding-left: 15px;
	padding-right: 15px;
	padding-bottom: 5px;
}

.box3 p {
	padding-left: 15px;
	padding-right: 15px;
	padding-bottom:15px;
}



/* ---------------------------------------- Table Styles ---------------------------------------------- */

#playlistTable a {
	text-decoration: none;
}

#playlistTable a hover {
	color:#FFF;
	text-decoration: underline;
}

.clear {
  clear: both;
}

table {
        margin-top: 10px;
	margin-right: auto;
	margin-left: auto;
	border-collapse: collapse;
	width: 95%;
        align: center;
       
}

.imgTable {

        margin-top: 10px;
	margin-right: auto;
	margin-left: auto;
	border-collapse: collapse;
	width: 95%;
        align: center;

}

col {
  border-right: 1px solid #ccc;
}

col#albumCol {
  border: none;
}

thead {
	border-top: 1px solid #a5a5a5;
	border-bottom: 1px solid #a5a5a5;
	background-color: #FFFFFF;
	background-image: url(images/bar.gif);
	background-repeat: repeat-x;
	background-position: left center;
	font-weight: bold;
}

th {
  font-weight: normal;
  text-align: left;
}

#speakerPosHead {
  text-indent: -1000em;
}

th, td {
  padding: 0.1em 1em;
}

.odd {
  background-color:#fff;
}

.even {
  background-color:#F3F3F3;
}

tr:hover {
  background-color:#CCCCCC;
  color: #fff;
}

thead tr:hover {
  background-color: transparent;
  color: inherit;
}

table  img {
	align:center;
	margin-right: auto;
	margin-left: auto;
}

.m_bl {
background: url(../img/m_bl.gif) 0 100% no-repeat #777B84; width: 120px;
}

.m_br {
background: url(../img/m_br.gif) 100% 100% no-repeat;
}

.m_tl {
background: url(../img/m_tl.gif) 0 0 no-repeat;
}

.m_tr {
background: url(../img/m_tr.gif) 100% 0 no-repeat;
padding: 8px;
}

.iframe {
        height:expression(frames("serviceframe").document.body.scrollHeight);
}

.lang_container {
   width: 200px;
   position: relative;
   height: 50px;
   }

.left-element {
   position: absolute;
   left: 0;
   width: 50%;
   }

.right-element {
   position: absolute;
   right: 0;
   width: 50%;
   text-align: right; /* depends on element width */
   }

/* --- blue, green --- */
.blue_text {
   color: #444488;
   }

.green_text {
   color: #339944;
   }