/* 
    Date        Changes
    ----        -------
    08/19/09    Added embed.floatimgright for picasa slide show use.
    09/15/09    Modified main menu height to adjust for conversion to pulldown menus.  Appeared behind
                picasa photo slide show, though, so found work around on CoffeeCup website that said make
                the flash object transparent or opaque.  That shifted the slide show left on the page.
                Removed embed.floatimgright & switched to align right to fix.
    09/17/09    Slide show broken in IE8, but not IE7 or IE8 compatibility mode.  Added embed.floatimgright
                back in & removed align:right.  Not sure why this didn't work first time.  Also fixed a few typos
                that caused problems in FireFox 3.5.
    09/18/09    Tweaks to columns sizes since sitemenu was 14 px high & mainmenu has gone from 30 down to 24 px, so
                I made content 20px larger & adjusted column sections to distribute the extra 20 px evenly.                
    10/24/09    Tweaks to divHeader & divMainMenu to get rid of gray separator lines between the banner, the menu & 
                in some configurations the menu & the content section.  Also widened the menu to same width as content
                & banner, but making it's background match the menu color.  Also got rid of a tiny righthand border on the
                footer.  Couldn't fix before, because the Sitemenu used that section, but SiteMenu is unused now.
    01/15/10    Added autobox format to make contentbox have width of auto.                
    01/27/10    Changed body background from dark gray (a2a7b1) to medium gray (c0c0c0).
                Changed general link color from lt. wedgewood (688597) to dk. wedgewood (2a446e) with lt. for hover/selected.
                Changed divFooter text color from dk. wedgewood (2a446e) to dk. charcoal (444444).
                Footer link color from white to dk. wedgewood (2a446e) with lt. wedgewood (688597) for hover/selected.
                Added underlining back to acknowledgements (divFooter a.menu), since all other links appear underlined.
    02/10/10    Added qna (Q&A) list item style.
    5/12/2010   Modified th.left & th.right to change padding from 0 to 10 px & change the td.divider background to d0d0d0.
    9/24/2010   Modified to change the website size from 800X600 To 1024X768.  divHeader & divMainMenu width went from 780 to 1000.
                divContent height went from 470 to 590.  Lots of other numbers changed.  In general width went up 220 & height
                went up 120.  For the top/bottom or 123 segments, height went up 60 or 40, while left & right column width went up
                70 each, while the middle went up 80.  Also increase the size of the smallest text on the site from 11px to 12px.
    9/29/10     Fixed a problem with the size of .lside12.  Too big.  Was 384, now 375.
    10/22/10    Changed the background color of breadcrumbbar & headerbars to #dddddd to lighten them.
    02/01/11    Changed body background from #d0d0d0 to #e4e4e4 to lighten things a bit more.
    03/01/11    Made page 120 px taller, divContent to 710px & lside1/2/3, rside1/2/3, middle1/2/3 up 40, 
                middle/lside/rsidetop/bottom up 60, middle/lside/rside12/23 up 80 & middle123/lsidefull/rsidefull 
                up 120 px. divFullContent up 120 too.
    03/02/11    Scaled back the increases to 30, 45, 60 & 90.
    03/04/11    Changed body background from #e4e4e4 to #ededed & divContent from #ededed to #f8f8f8 to lighten things a tad more.
    03/20/11    Tweaked hr style to height:0px & border-left:0px to fix troubles in IE8 in compatibility vs. no 
                compatibility mode as part of making middle section on home page bigger.  Previously no compatibility
                mode put a 1px border around the 1px empty middle, so hr looked like a small 3 px high empty box
                rather than a 1 px horizontal line.
*/
   
/* Clean slate */
/*body, h1, h2, h3, li, p, ul { font-size: 1em; margin: 0; padding: 0; }*/
html, body {
	height: 100%;
}
body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px; /* 11px; */
	font-weight: normal;
	font-style: normal;
	line-height: 16px;
	color: #000000;
	margin: 0;
}
body, #divAll {
	/*
	background-color: #688EB3;
    background-color: #A2A7B1;
    background-color: #aeb4be;
    background-color: #d0d0d0;
    */
    background-color: #ededed; /* e4e4e4;
}
form {
	/*display: none;*/
	margin: 0;
	padding: 0;
}
p {
	margin-top: 0px;
	margin-bottom: 10px;
	padding-top: 0px;
	padding-bottom: 0px;
}
p, div.subheader2, .tabbed {
	margin-left: 10px;
}
a {
	/*color: #688597;*/
	color: #2A466E;
	font-weight: bold;
	text-decoration: underline;
}

a:hover, a.menuselected {
	/*
	color: #5877a3;
	color: #688597;
	color: #2A466E;
	*/
	color: #688597;
}

ol {
	margin-top: 5px;
	margin-bottom: 10px;
	list-style-type: none;
	list-style-image: url(images/arrow.jpg);
}
li {
	line-height: 18px;
}
li.tightlist {
	line-height: normal;
}
li.announcement, li.announcement_perm {
	margin-bottom:5px;
	margin-left: -15px;
	line-height:15px;
}
li.qna {
	margin-bottom:10px;
	margin-left: -20px;
	line-height:16px;
}
li.calendarlist {
	line-height: normal;
	margin-left: -15px;
}
li.announcement_perm {
	color: #000000;
}
li.bullet, div.subsection2 ol li {
	margin-left: -15px;
}

td, tr {
	padding: 0;
	margin: 0;
}

hr {
	color: #AEB4BE;
	height: 0px;
	border-left:0px;
}

#divAll {
 	position: relative;
	margin: 0 auto;
	width: 998px;   /* 778px; */
	height: 100%;
}
#divContent, #divFooter {
 	position: relative;
	width: 998px;   /* 778px; */
	clear: both;
}
#divHeader {
 	position: relative;
	width: 1000px;  /* 780px; */
	height: 130px;
	background-color: #5877A3;
	/*background-image: url(../images/churchheader.jpg); old way of displaying the banner.
	background-repeat: no-repeat;*/
}

#divContent #divBreadCrumbBar {
	width: 974px;   /* 754px; */
	margin-left: 4px;
	padding: 1px 8px 1px 8px;
}

/* SITE MENU 
#divSiteMenu, #divSiteMenu ul {
	width: 998px; /_* 778px; *_/
	height: 14px;
	margin: 0;
	padding: 0;
}
#divSiteMenu {
	padding: 3px 0 3px 0;
	margin-bottom:1px;
	margin-left: 0px;
	text-align: right;
	clear: both;
	/-* Mac IE hide \*-/ overflow: hidden; /-* end hide *-/
}
#divSiteMenu ul {
	position: relative;
	top: 0px;
	list-style: none;
}
#divSiteMenu ul li {
	margin: 0;
	border: 0px solid #808080;
	text-align: center;
	display: inline;
	width: 65px;
}
*/
#divSiteMenu ul li a, #divFooter a.menu {
	font-size: 12px;
	font-weight: bold;
	/*text-decoration: none;*/
	padding: 0 10px 0 10px;
/*	border-right: 1px solid #808080;*/
	width: 65px;
}
#divSiteMenu ul li.last {
	padding-right:0px;;
}
#divSiteMenu a.menu, #divFooter a {
	/*color: #FFFFFF;*/
	color: #2A466E;
}
#divSiteMenu a.menu:hover, #divSiteMenu a.menuselected, #divFooter a:hover, #divFooter a.menuselected {
	/*
	color: #688597;
	color: #5877a3;
	color: #2A466E;
	*/
	color: #5877a3;
}
#divSiteMenu a.menu:hover, #divFooter a:hover {
	cursor: pointer;
}
#divSiteMenu a.menuselected, #divFooter a.menuselected {
	cursor: pointer;
}

/*#divMainMenu, #divMainMenu ul {*/
#divMainMenu {
	margin: 0;
	padding: 0;
	width: 1000px;  /* 780px; */
	height: 24px;
}
#divMainMenu {
 	position: relative;
    background-color: #2A446E;
	clear: both;
	/* Mac IE hide \*/ overflow: hidden; /* end hide */
}

/*
#divMainMenu ul {
	position: relative;
	top: 0px;
	left: 6px;
	list-style: none;
}
#divMainMenu li {
	/_*float the main list items*_/
	margin: 0;
	float: left;
	display: block;
	margin-right: 3px;
	border: 1px solid #808080;
	text-align: center;
	width: 105px;
}
#divMainMenu li a {
	display: block;
	height: 24px;
	width: 105px;
	font-weight: bold;
	text-decoration: none;
	padding-top: 7px;
	padding-bottom: 6px;
}
#divMainMenu a.menu {
	width: 100%;
	color: #FFFFFF;
	background-image: url(../images/BackgroundMenu.jpg);
	background-position: 50% 0;
	background-repeat: no-repeat;
}
#divMainMenu a.menu:hover, #divMainMenu a.menuselected {
	color: #FFFFFF;
	background-image: url(../images/BackgroundMenuOn.jpg);
}
#divMainMenu a.menu:hover {
	cursor: pointer;
}
#divMainMenu a.menuselected {
	cursor: pointer;
}
*/

#divContent {
	/*height: 100%;*/
	clear: both;
	height: 680px;  /* 710 px; 590px; 470px; */
	background-color: #f8f8f8; /* ededed; */
	border: 1px solid #808080;
	vertical-align: top;
}

#divContent .minheight {
	height: 660px; /* 690px; 570px; 450px; */
	float: right;
	width: 1px;
	/*background-color: red;*/
}
#divContent .bottom {
	clear: both;
	height: 1px;
	overflow: hidden;
}


#divBreadCrumbBar .thispage {
	font-weight: normal;
}
#divBreadCrumbBar a {
	color: #2A466E;
	text-decoration: underline;
	font-weight: bold;
}
#divBreadCrumbBar {
	height: 16px;
	margin-top: 4px;
	background-color: #dddddd;
	/* background-color: #c7c7c7; */
	font-size: 12px; /* 11px; */
	font-weight: normal;
	color: #000000;
}
#divHeaderLine {
	height: 20px;
	background-color: #2A466E;
}

div.header, div.headerbar {
	font-weight: bold;
	margin-bottom: 5px;
}
div.bciheader {
	font-weight: bold;
	text-align:  center;
 	font-style:  italic;
	font-size:   20px;
	color: #2A466E;
	margin-bottom: 10px;
}
a.header {
	text-decoration: underline;
}
div.section {
	margin-left: 0px;
	border: 0px solid blue;
}
div.section div.header, div.section div.headerbar {
	font-size: 14px;
	color: #2A466E;
	margin-bottom: 5px;
}
div.subsection, div.section p {
	margin-left: 10px;
}
div.subsection {
	margin-top: 5px;
	border: 0px solid green;
	clear: both;
}
div.subsection p {
	margin-bottom: 5px;
}
div.subsection div.header {
	font-size: 12px;
	color: #2A466E;
	margin-bottom: 3px;
}
div.subsection div.header .smalltext {
	font-size: 11px;
	font-weight: normal;
}
div.subsection2, div.subsection p {
	margin-left: 10px;
}
div.subsection2 {
	margin-top: 10px;
	border: 0px solid red;
}
div.subsection2 p {
	margin-bottom: 5px;
}
div.subsection2 div.header {
	font-size: 12px;
	color: #2A466E;
	margin-bottom: 3px;
	background-image: url(../images/arrow.gif);
	background-position: left;
	background-repeat: no-repeat;
	padding-left: 15px;
}
div.readmore {
	clear: both;
	text-align: right;
	width: 99%;
	padding-top: 0px;
	margin-top: 0px;
	border:0px solid green;
}
div.readmore a{
	/*color: #2A466E;*/
	/*color: #ffffff;*/
	font-weight: bold;
	font-size: 12px; /* 11px; */
	text-decoration: underline;
}
.noinfo {
	color: #808080;
	font-style: italic;
}
div.verse {
	padding-left: 40px;
	padding-right: 40px;
	padding-top: 0px;
}
span.verse {
	font-style: italic;
}

#divFullContent div.subsection, #divSubContent div.subsection {
	margin-top: 10px;
	margin-bottom: 10px;
}
#divFullContent div.subsection div.header, #divSubContent div.subsection div.header {
	margin-bottom: 10px;
}
#divSubRightCol .section .headerbar {
	font-size: 12px;
}


span.subheader3 {
	font-weight: bold;
	font-size: 12px;
	color: #2A466E;
	height: 18px;
	padding-left: 15px;
	margin-top: 5px;
	text-decoration: none;
	background-image: url(../images/arrow.gif);
	background-position: left;
	background-repeat: no-repeat;
}
.subheader3 p {
	padding-left: 20px;
}
/*.bullet {
	color: #688597;
	font-weight: bold;
	text-decoration: underline;
}*/

#divContent div, p {
	vertical-align: top;
}

#divContent #divFullContent {
	position: absolute;
	height: 630px; /* 660px; 540px; 420px; */
	/* height: auto; */
	margin-top: 10px;
	margin-bottom: 10px;
	left: 15px;
	width: 770px;   /* 550px; */
}
#divContent #divFullContent.wide {
	width: 870px;   /* 650px; */
}
#divContent #divFullContent.xtra_wide {
	width: 960px;   /* 740px; */
	/*height: auto;*/
}

#divContent #divSubContent {
	position: absolute;
	height: 630px; /* 660px; 540px; 420px; */
	/*height: auto;*/
	margin-top: 10px;
	margin-bottom: 10px;
	left: 15px;
	width: 675px;   /* 525px; */
	padding-right: 20px;
}
#divContent #divSubRightCol {
	position: absolute;
	height: 630px; /* 660px; 540px; 420px; */
	/*height: auto;*/
	/*margin-top: 40px;*/
	margin-top: 12px;
	margin-bottom: 10px;
}
.contentbox, .autobox {
	height: auto;
	margin-bottom: 15px;
	border: 1px solid #808080;
}
.autobox {
	width: auto;
}
.contentbox {
	width: 270px;   /* 200px; */
}
.autobox .section .headerbar,
.contentbox .section .headerbar {
/*ackground-color: #A2A7B1; */
	background-color: #dddddd;
	border-bottom: 1px solid #808080;
	padding: 2px 2px 2px 2px;
}
div.subsection2 div.headerbar {
	width: 160px;
	height: 15px;
	font-size: 12px; /* 11px; */
	background-color: #d7d7d7;
	border-bottom: 0px solid #808080;
	padding: 2px 2px 2px 7px;
	text-align: left;
}

#divContent #divLeftCol, #divMiddleCol, #divRightCol {
	position: absolute;
	height: 670px; /* 700px; 580px; 460px;  440*/
	margin-top: 5px;
	margin-bottom: 5px;
}

#divContent #divLeftCol {
	left: 5px;
	width: 285px;   /* 215px; */
}
#divContent #divMiddleCol {
	left: 295px;    /* 225px; */
	width: 410px;   /* 330px; */
}
#divContent #divRightCol, #divContent #divSubRightCol {
	left: 710px;    /* 560px; */
	width: 285px;   /* 215px; */
}
.lsidetop, .lsidebottom, .lsidefull, .lside1, .lside2, .lside3, .lside12, .lside23, 
.rsidetop, .rsidebottom, .rsidefull, .rside1, .rside2, .rside3, .rside12, .rside23,  
.middle1, .middle2, .middle3, .middle12, .middle23, .middle123, .middletop, .middlebottom {
	position: relative;
	padding: 5px;
}
.lsidetop, .lsidebottom, .lsidefull, .lside1, .lside2, .lside3, .lside12, .lside23,  
.rsidetop, .rsidebottom, .rsidefull, .rside1, .rside2, .rside3, .rside12, .rside23 {
	width: 275px;   /* 205px; */
}
.lsidetop, .lsidebottom, .lsidefull, .lside1, .lside2, .lside3, .lside12, .lside23 {
	border-right: 1px solid #AEB4BE;
}
.rsidetop, .rsidebottom, .rsidefull, .rside1, .rside2, .rside3, .rside12, .rside23 {
	border-left: 1px solid #AEB4BE;
}
.lsidetop, .lsidebottom, .rsidetop, .rsidebottom, .middletop, .middlebottom {
	height: 325px; /* 340px; 280px; 220px; */
	margin-bottom: 0px;
}

.lsidefull, .rsidefull, .middle123 {
	height: 660px; /* 690px; 570px; 450px; 430px; */
}
.middle1, .middle2, .middle3, .middle12, .middle23, .middle123, .middletop, .middlebottom  {
	width: 400px;   /* 320px; */
}

.lside1,    .lside2,    .lside3,
.middle1,   .middle2,   .middle3,
.rside1,    .rside2,    .rside3
{
	height: 212px; /* 222px; 182px;  142px;  *136*/
}
.middle12, .middle23, .lside12, .lside23, .rside12, .rside23 {
	height: 435px; /* 455px; 375px; 384px; 304px;  290px; */
}
.middle1, .middle2, .middle12, .lsidetop, .rsidetop, .middletop,
.lside1, .lside2, .lside12, 
.rside1, .rside2, .rside12 {
	border-bottom: 1px solid #AEB4BE;
}

---------------------------------------------------
#divFooter {
	clear: both;
	height: 20px;
/*	font-size: 10px; */
	font-size: 12px; /* 11px; */
    /*
   color: #2A466E;
    */
    color: #444444;
	/*background-color: #CCCCCC;*/
	text-align: center;
}
#divFooter span {
	line-height: 20px;
	vertical-align: middle;
}
#divFooter td {
	padding: 0;
	margin: 0;
}

embed.floatimgright, img.floatimgright {
	float: right;
	margin: 0px 5px 5px 5px;
	margin-bottom:-6px;
}
img.floatimgleft {
	float: left;
	margin: 0px 10px 5px 5px;
	/*_margin-bottom:-6px;*/
}

th {
	border-bottom: 1px solid #808080;
}
td {
	text-align: center;
	vertical-align: top;
	padding-top: 2px;
	padding-bottom: 2px;
}
table.tightlist {
	border-top: 1px solid #2A466E;
	border-left: 1px solid #2A466E;
	margin-top: 4px;
}
td.tightlist {
	text-align: left;
	padding: 1px 2px 1px 2px;
	border-bottom: 1px solid #2A466E;
	border-right: 1px solid #2A466E;
}
td.ctightlist {
	text-align: center;
	padding: 1px 2px 1px 2px;
	border-bottom: 1px solid #2A466E;
	border-right: 1px solid #2A466E;
}
th.left, td.left {
	text-align: left;
	padding-left: 10px;
}
/*
th.left {
	padding-left: 10px;
}
td.left {
	padding-left: 10px;
}
th.right {
	padding-right: 10px;
}
td.right {
	padding-right: 10px;
}
*/
th.right, td.right {
	text-align: right;
	padding-right: 10px;
}
td.divider {
	text-align: left;
	background-color: #d0d0d0;
	padding-left: 10px;
	font-weight: bold;
}
td .smalltext {
	font-size: 10px; /* 9px; */
}

#sundayschoolclasses, #sundayschoolWORM, #calendar {
	border: 1px solid #000000;
}
#sundayschoolclasses td, #sundayschoolWORM td, #calendar td {
	padding: 2px 5px 2px 5px;
	text-align: left;
	background-color: #f7f7f7;
	border-bottom: 1px solid #000000;
}
#sundayschoolWORM th {
	background-color: #d7d7d7;
	border-bottom: 2px solid #000000;
}
#calendar th {
	background-color: #A2A7B1;
	border-bottom: 2px solid #000000;
	color: #000000;
	font-size: 12px;
}
#sundayschoolclasses td.grade {
	width: 100px;
	font-weight: bold;
	vertical-align: middle;
	text-align: center;
	padding: 5px 5px 5px 5px;
}
#sundayschoolclasses td.grade, #sundayschoolWORM th, #sundayschoolWORM td, #calendar th, #calendar td {
	border-right: 1px solid #000000;
}
.classtitle {
	font-weight: bold;
	font-style: italic;
}
.biblebook {
	font-style: italic;
}

#calendar .month {
	background-color: #d7d7d7;
	font-weight: bold;
	font-size: 12px;
	text-align: left;
}
#calendar .datetime {
	font-weight: bold;
	text-align: center;
}
#calendar .evt_cl {
}
#calendar .event {
	font-weight: bold;
}