body {				/* Here you can set the color on the left and right side */
	background: #202020;
	text-align: center;
	margin:0px;
	font: 10pt arial
}

.clear				/* This is to clear a line of floating divs */
{
     background: none;
     border: 0px;
     clear: both;
     display: block;
     float: none;
     font-size: 0px;
     list-style: none;
     margin: 0px;
     padding: 0px;
     overflow: hidden;
     visibility: hidden;
     width: 0px;
     height: 0px
}

a:link, a:visited, a:focus {
	color: #990000;
	text-decoration: none
}

a.link2:link, a.link2:visited, a.link2:focus {		/* The member name in bulletins and prayer requests */
	color: #333333;
	text-decoration: none;
}

a:hover, a:active, a.link2:hover, a.link2:active {
	color: #333333;
	text-decoration: underline
}

a img {
	border:0px;
	display:block;				/* This is needed for Firefox to not underline the image with the text */
	margin:0px auto;
}

blockquote {
	border:2px solid #666666;
	background:#eeeeee;
	padding:8px;
	margin:15px 15px 0px 15px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
}

.required, .colored_text {			/* This is used for the # in your network and # of profile views */
	color: #990000
}

.err_class {
	color: #990000;
	font-weight:bold;
}










/*	_________________HEADER_________________		*/



#header {
	border: 0px;
	top: 0px;
	background: #000000;
	width:1000px;
	margin: 0px auto;
	text-align:center;
}

#logo {                                      /* Logo at the top (contains link to index page) */
	background: #000000 url(http://www.faithfreaks.com/images/header1.png) no-repeat;
	width:486px;
	height:130px;
	display:inline;
	float:left;
}

#header div.header_ad {
	height:60px;
	width:468px;
	padding:4px 5px 0px 0px;
	float:right;
}

#top_nav {
	display:block;
	width:990px;
	margin:0px auto;
	background: #000000;
	text-align:center;
	padding:0px 5px;
}

#top_nav ul {
	list-style: none;
	padding: 0px;
	margin: 0px

}

#top_nav li {
	float:left;
	margin: 0px 1px 0px 0px;
}

#top_nav li a {               /* Nav buttons */
	background: #000000 url(http://www.faithfreaks.com/images/nav_dropdown.png) top left no-repeat;
	height:36px;
	line-height:2.5em;
	float:left;
	width:89px;
	display:block;
	color:white;
	text-decoration:none
	text-align:center;
	vertical-align:middle;
	font-family:"Arial Black",Arial;
	font-size:10pt;
}

#top_nav li a:hover {                  /* Nav buttons on rollover */
	background: #000000 url(http://www.faithfreaks.com/images/nav_dropdown.png) -91px 0 no-repeat;
	text-decoration:none;
}

#topnav .navsignout { background: #000000 url(http://www.faithfreaks.com/images/nav_btn.png) top left no-repeat; }
#topnav .navsignout:hover { background: #000000 url(http://www.faithfreaks.com/images/nav_btn.png) -91px 0 no-repeat; }
#top_nav span { margin:0px 0px 0px -12px; }

#sub_nav {
	width:1000px;
	background:#000000;
	margin:0px auto;
	position:relative;
	color:white;
	font-weight:bold;
	z-index:10;
}

.submenu {
	position:absolute;
	color:white;
	font-weight:bold;
	left:0px;
}

#sub_home { margin:0px 0px 0px 5px; }
#sub_people { margin:0px 0px 0px 95px; }
#sub_mail { margin:0px 0px 0px 95px; }
#sub_profile { margin:0px 0px 0px 185px; }
#sub_friends { margin:0px 0px 0px 275px; }
#sub_groups { margin:0px 0px 0px 365px; }
#sub_music { margin:0px 0px 0px 455px; }
#sub_connect { margin:0px 0px 0px 545px; }
#sub_prayer { margin:0px 0px 0px 635px; }
#sub_more { margin:0px 0px 0px 725px; }

.submenu ul {
	list-style:none;
	margin:0px;
	padding:0px;
}

.submenu li {
	background:#000000;
	width:110px;
/*	min-width:86px;*/
	text-align:left;
	padding:2px;
/*	opacity: 0.8;
	filter:alpha(opacity: 80);
	-moz-opacity: 0.8;
	-khtml-opacity: 0.8;*/
}

.submenu a {
	color:#ffffff;
}
 
 









/* Main Area and Panels */


#mainarea {				/* Everything between the header and footer */
	text-align:center;
	clear:both;
	margin: 0px auto;
	border: 7px solid #000000;
	width:972px;
	padding: 7px;
	background: #ffffff;
}

.mainpanel {
	float:left;
	background:url(http://www.faithfreaks.com/images/panel_whitemiddle_628.png) repeat-y;
	padding:0px;
	margin:0px 0px 20px 0px;
	width:628px;
}

.fullpanel {
	background:url(http://www.faithfreaks.com/images/panel_whitemiddle_802.png) repeat-y;
	padding:0px;
	margin:0px 0px 20px 0px;
	width:802px;
}

.leftcolumn {
	clear:none;
	float:left;
	padding:0px;
	margin:0px;
	width:324px;
	max-width:324px;
	display:inline;
}

.rightcolumn {
	clear:none;
	float:left;
	padding:0px;
	margin:0px 14px;
	width:460px;
	max-width:460px;
}

div.middlecolumn {
	float:left;
	margin:0px 12px;
}

.skinnypanel .panelcontent {
	text-align:center;
}

.skinnypanel .button2 {
	float:none;
}

.leftcolumn div.panel {
	clear:both;
	float:none;
	background:url(http://www.faithfreaks.com/images/panel_whitemiddle_324.png) repeat-y;
}

.rightcolumn div.panel {
	clear:both;
	float:none;
	background:url(http://www.faithfreaks.com/images/panel_whitemiddle_460.png) repeat-y;
}

div.middlecolumn div.panel {
	background:url(http://www.faithfreaks.com/images/panel_whitemiddle_628.png) repeat-y;
	padding:0px;
	margin:0px 0px 20px 0px;
	width:628px;
}

div.skinnycolumn {
	float:left;
	width:160px;
	margin:0px;
	padding:0px;
	border:0px;
}

div.skinnypanel {
	background:url(http://www.faithfreaks.com/images/panel_whitemiddle_156.png) repeat-y;
	width:156px;
	float:right;
}

.mainpanel h1, div.middlecolumn h1 {
	background: url(http://www.faithfreaks.com/images/panel_top_628.png) top left no-repeat;
	width: 628px;
}

.fullpanel h1 {
	background: url(http://www.faithfreaks.com/images/panel_top_802.png) top left no-repeat;
	width: 802px;
}

.leftcolumn h1 {
	background: url(http://www.faithfreaks.com/images/panel_top_324.png) top left no-repeat;
	width: 324px;
}

.rightcolumn h1 {
	background: url(http://www.faithfreaks.com/images/panel_top_460.png) top left no-repeat;
	width: 460px;
}

h1 {
	color: #ffffff;
	height: 56px;
	text-align: center;
	margin:0px;
}

h1 span {
	position:relative;
	top:6px;
	font-family: "Arial Black", Arial;
	font-size: 16pt;
	font-weight:normal;	/* Needed for Arial Black font to look good in IE6 */
}

.skinnypanel h2 {
	color: #ffffff;
	text-align:center;
	background: url(http://www.faithfreaks.com/images/panel_top_156.png) top left no-repeat;
	width: 156 px;
	height: 31px;
	margin:0px;
}

h2 span {				/* This is used on the home page where it shows the date */
	font-family: "Arial Black", Arial;
	font-size: 10pt;
	font-weight:normal;	/* Needed for Arial Black font to look good in IE6 */
}

.panelcontent {
	padding: 0px 17px 20px 11px;
	word-wrap: break-word;
	font: 10pt Arial;
}

.mainpanel table {
	margin-bottom:20px;
}

.mainpanel div.b, div.middlecolumn div.b {
	background: url(http://www.faithfreaks.com/images/panel_bottom_628.png) 0 100% no-repeat;
}

.fullpanel .panelcontent {
	text-align: left;
}

.fullpanel div.b {
	background: url(http://www.faithfreaks.com/images/panel_bottom_802.png) 0 100% no-repeat;
}

.leftcolumn div.b {
	background: url(http://www.faithfreaks.com/images/panel_bottom_324.png) 0 100% no-repeat;
	position: relative; /* peekaboo bug fix for IE6 */
	min-width: 0; /* peekaboo bug fix for IE7 */
}

.rightcolumn div.b {
	background: url(http://www.faithfreaks.com/images/panel_bottom_460.png) 0 100% no-repeat;
	position: relative; /* peekaboo bug fix for IE6 */
	min-width: 0; /* peekaboo bug fix for IE7 */
}

.skinnypanel div.b {
	background: url(http://www.faithfreaks.com/images/panel_bottom_156.png) 0 100% no-repeat;
	position: relative; /* peekaboo bug fix for IE6 */
	min-width: 0; /* peekaboo bug fix for IE7 */
}

.tl, .t, .tr, .l, .r, .bl, .br {
	margin:0px;
	padding:0px;
}










/* Miscellaneous */



.formcol1 {
	text-align:right;
}

.formcol2 {
	text-align:left;
}

.button1, .button1:link, .button1:focus, .button1:visited {
	float:left;
	margin:3px;
	font-family: "Arial Black", Arial;
	font-size: 10pt;
	BACKGROUND: #cc0000 url(http://www.faithfreaks.com/images/panel_btn.png) top left no-repeat;
	color: #ffffff;
	height: 29px;
	line-height: 2;
	width: 142px;
	text-decoration: none;
	text-align: center;
	display:block;
	valign: middle;
	white-space: nowrap
	outline: none;
	border: none;
}

.button1:hover, .button1:active {
	BACKGROUND: #cc0000 url(http://www.faithfreaks.com/images/panel_btn.png) -142px 0 no-repeat;
	font-family: "Arial Black", Arial;
	font-size: 10pt;
	color: #ffffff;
	text-decoration: none;
}

.buttons1sm {
	width: 130px;
	margin: 0px auto;
}

.buttons2sm {			/* This is used on pages that have 2 a.button2's side-by-side that need to be centered (e.g. top_friends_action.php) */
	width: 260px;
	margin: 0px auto;
}

.button2, .button2:link, .button2:focus, .button2:visited {
	float:left;
	margin:2px auto;
	font-family: "Arial Black", Arial;
	font-size: 10pt;
	BACKGROUND: url(http://www.faithfreaks.com/images/panel_btn_date.png) top left no-repeat;
	color: #ffffff;
	height: 30px;
	line-height: 2;
	width: 114px;
	text-decoration: none;
	text-align: center;
	display:block;
	valign: middle;
	white-space: nowrap;
	border: none;
	min-width: 0; /* peekaboo bug fix for IE7 */
}

.button2:hover, .button2:active {
	BACKGROUND: url(http://www.faithfreaks.com/images/panel_btn_date.png) -118px 0 no-repeat;
	font-family: "Arial Black", Arial;
	font-size: 10pt;
	color: #ffffff;
	text-decoration: none;
}

.centerer {			/* I use this as a container to center my buttons since they are float:left */
	display:table;		/* Display:table does not work in IE so there is a conditional comment in d-top.php */
	margin: 0px auto;	/* Even so, this will only work in IE if the container for this has text-align:center */
}

.ad300 {
	width:300px;
	height:250px;
	text-align:center;
	padding:0px;
	border:0px;
	margin:0px auto 20px auto;
}

.ad300x2 {
	width:628px;
	float:left;
}

.ad300x2 .ad300 {
float:left;
margin:0px 5px 20px 5px;
}

.ad-skyscraper {
	float:right;
	width:160px;
	height:600px;
	margin:0px;
	padding:0px;
}

.widead {
	clear:both;
	width:830px;
	margin:0px auto;
	text-align:center
}

.fl {
	float:left;
	margin:0px 4px 0px 2px;
	text-align:left;
}

.pagenumbers {
	margin-top:0px;
}

.browsediv {
	height:165px;
	max-height:165px;
	width:90px;
	max-width:90px;
	padding:0px;
	margin:0px 4px;
	float:left;
	text-align:center;
}

.browsediv span {
	font-weight:bold;
}

.browsediv img {
	display:block;
	border:0px;
	margin:0px auto;
	max-height:120px;
}

td {
	font: 10pt arial;	/* Don't know why IE6 doesn't carry this from panelcontent */
}

table.messageview {
  width:100%;
  text-align:left;
  background:#666666;
}

table.messageview td.col1 {
  width:12%;
  padding:3px;
  background:#cccccc;
  font-weight:bold;
  text-align:left;
}

table.messageview td.col2 {
  background:#ffffff;
  padding:3px 8px;
}

table.comments {
	margin:0px auto;
	width:500px;
	border-collapse:collapse;
}

table.comments th {
	background: #eeeeee;
	text-align:left;
	padding:3px;
	border:1px solid black;
}

table.comments td.col1 {
	width:25%;
	padding:3px;
	border:1px solid black;
	text-align:center;
}

table.comments td.col2 {
	border:1px solid black;
	padding:3px;
	width:75%;
	text-align:left;
	vertical-align:top;
}

table.message td.color1{
background:#cccccc;
text-align:left;
font-weight:bold;
}

table.message td.color2{
text-align: left;
}

table.message, table.bulletin {
width:600px;
}

.rightcolumn table.forum, .rightcolumn table.bulletin {
	width:424px;
}

.mainpanel table.forum, .mainpanel table.bulletin, table.colored_back {
	width:596px;
}

table.forum td, table.bulletin td, table.mailbox td, table.colored_back td {
	background:#eeeeee;
	vertical-align:top;
	text-align:left;
	padding:2px;
}

table.colored_back td {
	padding:10px 2px;
}

table.colored_back img, table.colored_back embed {
	max-width:380px;
}

table.bulletin .subj {
	width:50%
}

table.bulletin .name {
	width:35%
}

table.forum img {
	float:left;
	margin:0px 4px 0px 0px;
}

.rightcolumn table.forum div {
	width:105px;
}

table.forum .topic {
}

table.forum .posts {
	text-align:center;
}

table.forum .lastpost {
	width:38%;
}

table.forum .topicstarter {
	width:38%;
}

table.forumview {
    width:100%;
    background: #666666;
}

table.forumview td {
    vertical-align:top;
    background: #ffffff;
    padding: 5px;
}

table.forumview td.author {
    text-align: center;
}

table.forumview td.message {
    text-align: left;
}

table.forumview th {
    background: #cccccc;
    padding: 5px;
}

span.quotebutton {
	float:right;
	padding:3px;
	border: 2px solid #666666;
	background: #cccccc;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}

table.compose {
	width:100%;
	border:1px solid black;
	border-collapse:collapse;
}

table.compose td.col1 {
	background: #eeeeee;
	border:2px solid black;
	padding:2px;
	font-weight:bold;
}

table.compose td.col2 {
	border:2px solid black;
	padding:2px;
}

table.compose textarea, table.compose input {
	width:99%;
}
	
table.twocol {			/* Currently this is only used on view_church.php for info table */
/*	width:100%; 		causes IE6 to choke */
}

table.twocol td.col1 {
	text-align:left;
	background:#eeeeee;
	font-weight:bold;
}

table.twocol td.col2 {
	text-align:left;
	background:#eeeeee;
}

#bottom {
	margin: 0px auto;
	clear:both;
	width:1000px;
	background:#000000;
	color:#ffffff;
	text-align:center
}

#bottom a:link, #bottom a:visited, #bottom a:focus, #bottom a:hover, #bottom a:active {
	color:#ffffff;
	font-weight:bold
}
