body {
	background: #0D87BD url('/images/northside_bg.png') repeat-x;
	margin: 0px;
	padding: 0px;
	font: 1em Verdana, Arial, Helvetica, sans-serif;
	behavior: url(css/csshover.htc);
}

#wrapper {
	margin: 0 auto;
	padding: 0;
	width: 760px;
	text-align: left;
}

#main {
	margin: 5px 0 0 0;
	width: 760px;
	background-color: #fff;
	border-left: 5px solid #fff;
	border-right: 5px solid #fff;
	border-bottom: 5px solid #fff;
	border-top: 5px solid #fff;
}

#header {
	width: 760px;
	height: 175px;
	position: relative;
}

#header.home {background-image: url(/images/hdr_home.jpg);}

/* -- About Headers -- */
.aboutHistory {background-image: url(/images/hdr_about_history.jpg);}
.aboutBeliefs {background-image: url(/images/hdr_about_beliefs.jpg);}
.aboutServices {background-image: url(/images/hdr_about_services.jpg);}
.directions {background-image: url(/images/hdr_about_directions.jpg);}

/* -- Events Headers -- */
.events {background-image: url(/images/hdr_events.jpg);}

/* -- Contact Headers -- */
.contact {background-image: url(/images/hdr_contact.jpg);}
.office {background-image: url(/images/hdr_contact_office.jpg);}
.staff {background-image: url(/images/hdr_contact_staff.jpg);}
.prayer {background-image: url(/images/hdr_contact_prayer.jpg);}

/* -- Ministries Headers -- */
.ministriesChildren {background-image: url(/images/hdr_ministries_children.jpg);}
.ministriesCollege {background-image: url(/images/hdr_ministries_college.jpg);}
.ministriesFamily {background-image: url(/images/hdr_ministries_family.jpg);}
.ministriesMissions {background-image: url(/images/hdr_ministries_missions.jpg);}
.ministriesMusic {background-image: url(/images/hdr_ministries_music.jpg);}
.ministriesStudy {background-image: url(/images/hdr_ministries_study.jpg);}
.ministriesWomen {background-image: url(/images/hdr_ministries_women.jpg);}
.ministriesYouth {background-image: url(/images/hdr_ministries_youth.jpg);}

/* -- Campus Headers -- */
.campus {background-image: url(/images/hdr_campus.jpg);}

/* -- Listen Headers -- */
.listenCurrent {background-image: url(/images/hdr_listen_current.jpg);}
.listenArchives {background-image: url(/images/hdr_listen_archives.jpg);}

/*
---------------------------
	TOP NAVIGATION
---------------------------
*/

* {
	margin: 0;
	padding: 0px;
}
	
/* the horizontal menu starts here */
#topNav {
	width: 100%; 
	height: 25px;
	float: left;
	border-top: 1px solid #000000;
	border-bottom: 1px solid #000000;	
	font-family: Verdana, Arial, Helvetica, sans-serif; 
	font-size: 85%;	
	font-weight: 400;
	font-color: #237ECB;
	background: url(../images/topNav_bg.png) repeat-x; 
	margin-top: 125px; 
}
	
#topNav ul {
	margin: 3px 0 0 30px;

}
	
#topNav li {
	float: left;
	position: relative;
	list-style-type: none;
}
	
#topNav a {
	display: block; 
	padding: 0 15px; /*creates space each side of menu item's text */
	text-decoration: none;	 
	color: #fff;	
}
	
#topNav ul li a:hover {
	color: #999;
}
/* the horizontal menu ends here */

/* the drop-down starts here */
#topNav ul li ul {
	border: 1px solid #666666;
	padding: 0px;
	width: 175px;
	display: none;
	position: absolute;
	background: url(../images/topNav_dropdown_bg.png) repeat;
	margin: 0;
	z-index: 999;
}
	
#topNav ul li ul li {
	width: 100%; /* makes the list items fill the list container (ul) */
	font-weight: normal; /* Set weight of text for sublinks */
}

#topNav ul li ul li a:link,
#topNav ul li ul li a:visited {
	color: #ccc;
}
	
#topNav ul li ul li a:hover {
	background: #0D87BD;
	color: #fff;
}

/* make the drop-down display as the menu is rolled over */
div#topNav ul li ul {display: none;} 
div#topNav ul li:hover ul {display: block; } 

/* THE HACK ZONE - */

/* the Tantek hack to feed IE Win 5.5-5.0 a lower value to get the pop-out to touch the drop-down */
* html  div#topNav ul li ul li ul { 
  	left: 9.85em; 
  	voice-family: "\"}\""; 
  	voice-family: inherit;
  	left: 10em;
 	}
/* and the "be nice to Opera" rule */
html>body div#topNav ul li ul li ul {
  	left: 10em;
  	}

/* an Opera-only hack to fix a redraw problem by invisibly extending the ul */
/* the first-level drop stays open for 100px below the bottom but at least it works */
/* this can be reduced to as little as 22px if you don't have pop-outs */
/* the pop-out menu stays open for 22px below the bottom but at least it works */
	@media all and (min-width: 0px) {
   	body div#topNav ul li ul {padding-bottom: 200px;}
   	body div#topNav ul li ul li ul {padding-bottom: 22px;}
   	body div#topNav ul li ul li ul li ul li:hover {visibility: visible;} 
   	}
/*end Opera hack */
/* end of hack zone */
/* END OF LIST-BASED MENU */

 /* this stylesheet is read by IE5 Mac only - hack omits 'url' and leave no space between @import and ("   */
@import("../ie51_menu_hack.css"); 
/* END OF DROP DOWN MENUS */


/*
-----------------------------
	BOTTOM NAVIGATION
-----------------------------
*/

#bottomNav {
	text-align: center;
}

#bottomNav ul {
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 80%;
	color: #333333;
}

#bottomNav li {
	display: inline;
}

#bottomNav li a:link,
#bottomNav li a:visited {
	font-size: 90%;
	color: #666666;
}


/*
-----------------------------
	CONTENT
-----------------------------
*/
#content {
	padding: 20px;
	background:#FFF;
}

#content ul {
	list-style: url(../images/bullet.png) outside;
	font-size: 85%;
	margin-bottom: 5px;
	margin-top: 2px;
	padding-left: 25px;
}

#content .TabbedPanelsContent ul {
	list-style: url(../images/bullet.png) outside;
	font-size: 85%;
	margin-bottom: 5px;
	margin-top: 2px;
	padding-left: 25px;
	line-height: 1.2em;
}

#content .TabbedPanelsContent ul li { margin-bottom: 0.6em; 
}

#content ol {
	font-size: 80%;
	margin-left: 30px;
	margin-bottom: 5px;
	margin-top: 2px;
}

#content img {
	border: none;
}

#content strong {
	color: #333333;

}

#contentLeft {
	float: left;
	width: 300px;
}

#contentRight {
	float: right;
	width: 350px;
}

#contentRight dl {
	border-bottom: 1px dotted #999999;
	margin: 0px;
	display: block;
	padding: 0px;
}

#contentRight dt,
#contentRight dt a:link,
#conenetRight dt a:visited {
	font-weight: bold;
	font-size: 90%;
	color: #698D47;
	text-decoration: none;
}

#contentRight dd,
#contentRight dd a:link,
#contentRight dd a:visited {
	font-size: 80%;
	margin: 0px;
	padding: 0px;
	color: #333333;
	text-decoration: none;
}

#contentRight a:hover {
	margin: 0;
	padding: 0;
	display: block;
	text-decoration: none;
}

#homeEvents {
	margin: 0 0 25px;
	padding: 0;
}

#homeEvents dl {
	padding-bottom: 10px;
	padding-left: 5px;
	padding-top: 5px;

}

#serviceTimes,
#announcements,
#sermonSeries {
	margin-bottom: 25px;
}

#serviceTimes dl {
	margin: 0px;
	padding: 0px;
}

#serviceTimes dl dt {
	font-size: 80%;
}

#serviceTimes dl dd {
	text-align: left;
	margin: 0px;
	padding: 0px;
	font-size: 80%;
}

#serviceTimes ul {
	margin-top: 0;
}

#serviceTimes ul li {
	list-style: square;
	font-size: 80%;
}



h1 {
	border-bottom: 1px solid #0D87BD;
	color: #0D87BD;
	margin: 0px 0px 5px;
	padding: 0px;
	font: bold 100% Geneva, Arial, Helvetica, fantasy;
}

h2 {
	font-size: 0.80em;
	color: #79A84E;
	margin: 5px 0 0px;
}

h3 {
	font-size: 80%;
	color: #FF0000;
}

p {
	font-size: 80%;
	margin: 0px;
	padding: 2px 0px 10px;
	line-height: 120%;
}

a:link {
	color: #45619b;
}	

a:visited {
	color: #666666;
}

/*
------------------------------
	FOOTER 
------------------------------
*/
#footer {
	border-top: 1px solid #EEE;
	margin: 5px 0px 0px;
	padding-top: 5px;
	clear: both;
	height: 40px;
}

#bottomNav {
	text-align: center;
}

#bottomNav ul {
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 80%;
	color: #333333;
}

#bottomNav li {
	display: inline;
}

#bottomNav li a:link,
#bottomNav li a:visited {
	font-size: 90%;
	color: #666666;
}

#copyright {
	color: #CCCCCC;
	font-size: 80%;
	margin-top: 3px;
	
}

/*
---------------------------
	CONTACT PAGE
---------------------------
*/
#staff {
	float: left;
	border: 1px solid #ccc;
	height: 95px;
	width: 325px;
	margin-bottom: 10px;
	background: #f1f1f1;
	margin-right: 15px;
	margin-left: 15px;
	}
	
#staff img {
	float: left;
	border: 1px solid #666666;
	margin: 8px;	
}
	
/*
------------------------------
	EVENT CALENDAR
------------------------------
*/

.topDates {
	text-align: left;
	margin-bottom: 20px;
	font-size: 80%;
}

.bottomDates {
	text-align: left;
	margin: 20px 0 20px;
	font-size: 80%;
}

.topDates ul,
.bottomDates ul {
	margin: 0;
	padding: 0;
	list-style: none;
	color: #333;
}

.topDates ul li,
.bottomDates ul li {
	display: inline;
}

.topDates a:link,
.bottomDates a:link,
#topDates a:visited,
#bottomDates a:visited {
	color: #666;
}

.topDates a:hover,
.bottomDates a:hover {
	text-decoration: underline;
	color: #333;
}

#events  {
	margin: 0;
	padding: 0;
}

#events h2 {
	padding: 0;
	border-bottom: 1px dashed #999;
}
	
#events table {
	width: 100%;
	border: none;
	margin-bottom: 10px;
	padding: 0;
}

#events th {
	border-bottom: 1px dotted #333;
	text-align: left;
	font-size: 80%;
	color: #804C24;
}

#events td {
	padding: 2px 0px 2px 0px;
	margin: 0;
	border-bottom: 1px dotted #999;
	font-size: 80%;
	background: #fff;
	color: #333333;
}

.eventTitle {
	width: 35%;
}

.eventDescription {
	width: 55%;
}

.eventTime {
	width 10%;
	text-align: right;
}

.sermonInfo {
	width: 300px;
	border-bottom: 1px dotted #506386;
	padding-bottom: 5px;
	margin-bottom: 8px;
}

.sermonInfo h3 {
	font: 12px Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #45619B;
	margin: 0 0 2px 0;
	padding: 0 0 2px 0;
	border-bottom: 1px dotted #506386;
}

.sermonInfo p {
	color: #444;
	margin: 0;
	padding: 0;
}

.sermonInfo p em {
	color: #333;
}

.sermonInfo h3 .date {
	font-style: normal;
	color: #804C24;
}

.sermonInfo h3 .title {
	font-weight: normal;
	font-style: normal;
	color: #804C24;
}

.sermonInfo .downloadBox {
	border: 1px solid #999;
	background: #E3E3E3;
	top: 22px;
	right: 0;
	padding: 5px;
	text-align: center;
	float: right;
}

.sermonInfo .sermonData {
	float: left;
	width: 600px;
}
#content h4 {
	font-size: .7em;
	color: #666666;
	font-weight: normal;
	margin-bottom: 10px;
}

.smallImage {
	margin-right: 20px;
	border: 1px solid #000;
}

iframe {
	border: 1px solid #fff;
}


/*	===============================
		FORM
	=============================== */
	
form #textfield_name,
form #textfield_adultAge,
form #textfield_phone,
form #textfield_email,
form #textfield_address1,
form #textfield_address2,
form #textfield_city,
form #textfield_zip,
form #textfield_subdivision,
form #checkbox_days {
	display: block;
	margin-top: 5px;
}

form span.fieldInfo {
	font: 0.9em Arial, Helvetica, sans-serif;
	color: #333;
}

form label {
	font: 0.9em Arial, Helvetica, sans-serif;
	color: #333;
}
.orange {
	color: #FF9900;
	font: bold;
}
.red {
	color: #990000;
	font: bold;
}
.yellow {
	color: #CCCC00;
	font: bold;
}


/*	===============================
		SERMON SERIES AUDIO
	=============================== */

.coverArt {
	width: 150px;
	height: 150px;
	float: left;
	margin: 15px 0 0 15px;
	border: 1px solid #CCC;
	padding: 0px;
}

.coverArt img {
	height: 150px;
	width: 150px;

}
.AccordionPanelContent .seriesDescription {
	float: right;
	width: 500px;
	padding-left: 5px;
	padding-bottom: 5px;
	margin-bottom: 10px;
	border: 1px dashed #7DAA55;
	background: #FFFFFF;
	color: #333333;
	margin-top: 15px;
	margin-right: 15px;
}


.AccordionPanelContent .sermonContent {
	float: right;
	width: 500px;
	padding-left: 5px;
	padding-bottom: 5px;
	border-top: 1px solid #CCCCCC;
	margin-top: 5px;
	margin-right: 15px;
}
.AccordionPanelContent .sermonContent h2 { font-size: 0.8em; }


.AccordionPanelContent .sermonContent p {
	margin: 0px;
	padding: 0px;
	font-size: .7em;
}

.AccordionPanelContent .sermonContent .sermonEmphasized {
	font-style: italic;
	color: #4E6835;
}

.AccordionPanelContent .sermonInset {
	width: 115px;
	float: right;
	font: 0.75em Geneva, Arial, Helvetica, sans-serif;
	text-align: right;
	color: #666666;
	margin-top: 5px;
	margin-right: 5px;
}

.sermonContent .sermonInset .sermonIcons { margin-top: 5px; }

.sermonContent .sermonInset .sermonIcons img { margin-left: 5px; }
