body {
	margin : 0;
	padding : 1em 0;
	font-family: Tahoma, Arial, 'Lucida Grande', Verdana, Helvetica, sans-serif;
	/*background-color: #19909E; /*#5555BB;*/ 
	background: url(/images/school_background.jpg);
}
 
a:link, a:visited {
	/*color: #1b3c74;*/
	color: #000000;
	text-decoration: none;
}
a:hover{
	color:#FF8710;
	text-decoration:underline;
}

a.colored:link, a.colored:visited {
	color: #1000AA;
	text-decoration: none;
}
a.colored:hover{
	color:#FF8710;
	text-decoration:underline;
}

a.underline:link, a.underline:visited {
	/*color: #1b3cFF;*/
	color: #000000;
	text-decoration: underline;
}
a.underline:hover{
	color:#FF8710;
	text-decoration:underline;
}

a.sectionTitle:link, a.sectionTitle:visited {
	color: #000066;
}

img, a:link img, a:visited img {
	border: 0;
}

a.next_prev:link, a.next_prev:visited {
	color: #2200FF;
}
a.next_prev:hover{
	color:#FF8710;
	text-decoration:underline;
}

.ubf_next {
	margin-top: 10px;
	font-weight:bold;
	text-align:right;
	font-family: Arial, 'Lucida Grande', Verdana, Helvetica, sans-serif;
}

#container {
	margin: 0 auto;
	padding: .3em 1.5em;
	font-size: .8em; /* it causes all font size within container div */
	width: 68.1em;
	/*height: 56em;*/
	background-color: #FFFFFF;
}

textarea {
	border: 1px solid #999999;
}
	
.font_s {
	font-size: .85em;
	font-family: Arial;	
}

.font_m {
	font-size: .88em;
	font-weight: bold;
	font-family: Arial;
}

.font_s.right {
	text-align: right;
}

#logo {
	margin: 0;
	padding: .2em;
	width: 25em;
	float: left;
}

#keyverse {
	margin-top: .5em;
	padding: .5em 0;
	color:#111111;
	font-size: 1.1em;
	font-weight: normal; 
	font-family: "Century Gothic", Helvetica, Arial, Verdana;
	letter-spacing: -1px;
	text-align: center;
	border-top: 1px dotted #19909E;
}

.input_text_s {
	height: 1em;
	font-size: .9em;
	width: 9em;
	font-family: Arial, Verdana, Helvetica, sans-serif;
}

.input_text_m {
	height: 1em;
	font-size: .9em;
	width: 11em;
	font-family: Arial, Verdana, Helvetica, sans-serif;
}

.input_text_xl {
	height: 1.2em;
	font-size: .9em;
	width: 18em;
	border: 1px solid #999999;
	font-family: Arial, Verdana, Helvetica, sans-serif;
}

.input_button {
	height: 2em;
	width: 4em;
	font-size: .9em;
	font-family: Arial, Verdana, Helvetica, sans-serif;
}

.login {
	margin-top: 1em;
	float: right;
}

.login.OK {
	color: #0000FF;
	text-align: right;
}

#loginSupport {
	padding-top: .3em;
	padding-right: 1;
	font-size: .85em;
}

#loginMessage {
	width: 300px;
	color: #999999;
	font-size: 11px;
	font-family: Arial, Verdana, Helvetica, sans-serif;
}

#loginErrorMessage {
	width: 280px;
	height: 15px;
	float: left;
	color: #FF0000;
	font-size: 11px;
}

#loginOthers {
}

#topMenu {
	width: 100%;			/* to make menulist and login one line */
	overflow: hidden; /* */
	margin: 0;
	padding: 3px 0;
	border-top: 1px solid #CCCCCC;
	border-bottom: 1px solid #CCCCCC;
}

#topMenu ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
}

#topMenu li	{
	display: inline;
	margin-right: .3em;
}

#menulist {
	float: left;
}

.loginMenu {
	font-size: .95em;
	font-family: Arial;
}

/* banner image */
#banner {
	margin: 5px 0;
	padding: 0;

}

/*#banner img {
	width: 100%;
	*width: 68.1em;
	height: 15.3em;
	*height: 15.5em;
}*/

#mainContents {
	/* hack for expanding without height */
	margin-top: 1em;
	width: 100%;
	overflow: hidden;
	/* ------------ */
	/*border: 1px solid #FF0000;*/
}

.section {
	height: 100%;
	padding: 0;
	margin-bottom: 1.5em;
	line-height: 140%;
}

.section.colored {
	/*background: #C3D9FF;*/
	background-color: #FFFFFF;
	border: 1px solid #C3D9FF;
	padding: .2em;
}

.sectionInside.colored {
	background-color: #ECF2F8;
}

.head {
	margin-bottom: .5em;
	padding: .3em 0;
	font-weight: bold;
	font-size: .9em;
	text-transform: uppercase;
	border-top: 4px solid #999999;
	border-bottom: 1px solid #999999;
	/*background-color: #FFAAFF;*/	
	font-family: Arial, Verdana, 'Lucida Grande', Helvetica, sans-serif;
}

.head.notop {
	border-top: none;
	border-bottom: 1px solid #C3D9FF;	
}

#media {
	padding: 0;
	width: 250px;
	float: left;
	/*border-right: 1px dotted #999999;*/
}

#latestPhoto {
	margin-bottom: 5px;
	padding: 5px;
	width: 240px;
	height: 210px;
	background-color: #CACACA;	
}

.recentVideo {
	margin-bottom: 5px;
	padding: .4em;
	width: 20em;
	height: 18em;
	background-color: #CACACA;	
}

.mediaData {
	height: 159px;
	background-color: #CACACA;
}

.mediaIntro {
	padding: .5em .1em;
	height: 3em;
	background-color: #EFEFEF;
}

.mediaIntro.archive {
	height: 1em;
}

.mediaData img {
	width: 100%;
	height: 100%;
	display: block;

}

.fleft {
	float: left;
}

.fright {
	float: right;
}

#videoPlayer {
	margin-top: 2em;
	text-align: center;
}

#bibleStudy {
	margin: 0 15px;
	width: 370px;
	float: left;
	/*border-left: 1px solid #999999;*/
}
.list:hover {
	background-color: #FFFFCC;
}

#bibleStudy .list {
	margin-bottom: .4em;
	padding-bottom: .4em;
	border-bottom: 1px dotted #CACACA;
}

#bibleStudy .head {
	border-top: 4px solid #999999;
	/*border-top: none; */
	border-bottom: 1px solid #999999;	
}

#bibleStudy .title {
	font-size: 1em;
	font-family: Tahoma,  Arial, 'Courier New', 'Century Gothic',  Helvetica, sans-serif;	
}

#bibleStudy .passage, #bibleStudy .date {
	font-size: .85em;	
	font-family: Arial, 'Courier New', 'Century Gothic', Helvetica, sans-serif;
}

#bibleStudy .date {
	text-align: right;
}

#sideBar {
	width: 220px;
	float: right;
	margin-top:10px;
	/*background-color: #CC88FF;*/	
}

#sideBar_aboutus {
	width: 280px;
	float: right;
	margin-top:10px;
}

#sideBar .info {
	position: relative;
	padding-left: 10px;
	font-size: 12px;
	font-weight: normal;
	color: #636363;	
	font-family: Arial,  Tahoma, 'Lucida Grande',  "Geneva",  Helvetica, sans-serif;	
}

#sideBar_aboutus .info {
	position: relative;
	padding-left: 10px;
	font-size: 12px;
	font-weight: normal;
	color: #636363;	
	font-family: Arial,  Tahoma, 'Lucida Grande',  "Geneva",  Helvetica, sans-serif;	
}

#sideBar .info.address, #sideBar_aboutus .info.address {
	padding-left: 2.5em;
}

.section ul {
	margin: 0 0 0 20px;
	padding: 0;
	font-size: 11px;
	list-style-image: url(/images/arrow_small.gif);
	line-height: 140%;
	text-align: justify;
	font-family:  Arial, Verdana, Tahoma, 'Lucida Grande',  Helvetica, sans-serif;
}

#links .info {
	padding-left: 1em;
}

#footer {
	margin: 1em 0 0 0;
	color: #FFFFFF;
	text-align: center;
	font-size: 11px;
	font-family: Arial,  "Tahoma", Verdana, Helvetica, sans-serif;
}

.archives {
	/*padding-right: 5px;*/
	width: 620px; 
	float: left;
	/*border-right: 1px dotted #CCCCCC;*/	
}

.archives.aboutus {
	/*padding-right: 5px;*/
	width: 580px; 
	float: left;
	/*border-right: 1px dotted #CCCCCC;*/	
}

/* ---------- photos -------------*/
.item.photos {
	margin-top: -1em;
	width: 44em;
	border-bottom: none;	
}

#photoIntro {
	font-size: .85em;
	font-family: Arial,  "Tahoma", Verdana, Helvetica, sans-serif;
	border-bottom: 1px dotted #999999;
}

#photoCategory {
	font-size: .9em;
	font-family: Arial,  "Tahoma", Verdana, Helvetica, sans-serif;

}

#photoList {
	
}

.hiddenList {
	display: none;
}

.root {
	margin-top: .5em;
	font-weight: bold;
	display: block;
}

.firstLevel {
	padding-left: .5em;
}

.secondLevel {
	padding-left: 1em;
}

#messageOuter {
	margin-bottom: 1em;
	padding: .3em;
	background-color: #393939;
}

#messageInner {
	padding: .2em;
	background-color: #FAFAFA;
}

#messageHead {
	padding: .2em 0;
	margin-bottom: 1em;
	border-top: 1px solid #999999;
	border-bottom: 1px solid #999999;
	text-align: right;
	font-size: .9em;
}

#titleBanner {
	margin: .5em 0 1em 0;
	padding-bottom: .5em;
	font-size: 2em;
	font-family: Verdana, 'Century Gothic', Arial, Helvetica, sans-serif;
	border-bottom: 1px solid #000000;	
}

#titleBanner11 {
	margin-top: 10px;
}

#subtitleBanner {
	font-size: .85em;
	font-style: italic;
	font-family: Arial, Helvetica, sans-serif;
}

.subtitle {
	margin: .3em 0 .5em 0;
	padding: .1em .2em;
	font-family: Arial, Verdana, 'Century Gothic', Helvetica, sans-serif;
	color: #484848;
	font-size: 1.2em;
	font-weight: bold;
	/*background: url(/images/box_categ_middle.png) repeat-x;*/
	background: url(/images/gradient_listing_long.jpg) repeat-y;
	/*background-color: #FFBBFF;*/
}
	
.text {
	padding: 0 0 0 1em;
	line-height: 160%;
	text-align: justify;
}

.text.message {
	padding: 0;
}

.more {
	position: relative;
	height: 2em;
	top: -.7em;
	text-align: right;
	/*background: url(/images/directions.gif) no-repeat;
	background-position: 25em -.2em;*/
}

#mapView {
	width: 43.5em;
	height: 30em;
	border: 1px solid #999999;
}

.marker {

}

.marker .picture {
	margin-right: 1em;
	width: 7.5em;
	height: 6em;
	float: left;
	background-color: #DDDDDD;
}

.marker .picture img {
	width: 100%;
	height: 100%;
}

.marker .chapter {
	font-size: 1em;
	font-weight: bold;
	color: #595959;
	font-family: 'Century Gothic', Arial, Verdana,  Helvetica, sans-serif;
}

.marker .addr {
	padding-left: 1em;
	font-size: .85em;
	font-family: Arial, Verdana, 'Century Gothic', Helvetica, sans-serif;
}

#sideBar ul li span {
	position: relative;
	top: -3px;
}

#archiveSideBar {
	width: 5em;
	float: left;
	background-color: #CACACA;
}

.item {
	margin-bottom: 1.5em;
	border-bottom: 1px dotted  #999999;
}

.itemTitle {
	margin-bottom: .3em;
	font-size: 1.5em;
	color: #000066;
}

.itemTitle a {
	position: relative;
	top: -.1em;
	color: #000066;
}

.itemTitle.detail {
	text-align: center;
}

.itemHead {
	margin-bottom: 1.5em;
	font-size: .85em;
	font-family: Verdana, 'Century Gothic', Helvetica, sans-serif;
}

.itemHead .category {
	float: left;
}

.itemHead .postedBy {
	text-align: right;
	display: block;
}

.postedDate.left {
	text-align: left;
}

.itemText {
	margin-bottom: 15px;
	font-size:12px;
	font-family: Arial, 'Century Gothic', Helvetica, sans-serif;
	/*text-align: justify;*/
}

.itemText .imgOuter {	
	padding: 10px;
	text-align: center;
	background-color:  #ECF2F8;
}

.itemText img {
	border: 1px solid #999999;
}

.itemText.keyverse {
	margin-bottom: 2em;
	font-size: .9em;
	font-family: 'Century Gothic', Arial, Verdana, Helvetica, sans-serif;
}

#message {
	width: 100%;
	background-color: #BBBBBB;
}

#welcome {
	margin-bottom: 2em;
	font-size: 1.1em;
	font-family: 'Century Gothic', Arial, Verdana, Helvetica, sans-serif;
}

#contactInfo {
	margin: .4em 0 0 1em;
	padding: 0;
	width: 100%;
	font-size: 1em;
	font-family: Verdana, 'Century Gothic', Arial,  Helvetica, sans-serif;
	line-height: 160%;
}

#contactInfo .title {
	width: 7em;
	float: left;
	font-weight: bold;
}

.part.contactus {
	height: 38em;
	/*background: url(/images/shepherd.png) bottom right no-repeat;*/
	z-index: -1;
}

#leavamessageTitle {
	margin-top: 2em;
	width: 24em;
}

/*
 additional div for hacking..
 
img { float: left; padding: 0.5em; }
.item { border: 1px solid black; }
.spacer { clear: both; }

<div class="item">
  <img src="monkey.png"/>
  <p>One time I hired a monkey to
     take notes for me in class.</p>
  <div class="spacer"></div> <----
</div>
*/
/*
after pseudo is not supported in IE 5,6
.item { border: 1px solid black; padding: 0.5em; }
img { float: left; }
.item:after { content: ""; display: block; height: 0; clear: both; }

<div class="item">
  <img src="monkey.png"/>
  <p>One time I hired a monkey to
     take notes for me in class.</p>
</div>
*/