/* blue used #003399 and #99ccff 000099   red used AD1F00  #cc0000  grey used fafafa 797979   gold used - cc9933  #F6F1E5 */

/* IMPORTANT - when adding a new page, be sure to add the class & ID to change the tab color */

/* colors */
.black {color:#797979;}
.gray {color:#666666;}
.medBlue {color:#003399;} 
.blue {color:#99ccff;}
.darkBlue {color:#000099;}
.red {color:#AD1F00;}    /*grey used fafafa 797979  */ 
.darkGold {color:#cc9933;}
.medGold {color:#e0cea3;}
.lightGold {color:#E9DCBD;} 

.red {color:#AD1F00;}
/* -------------------------------------------- */

/*--------------------
  Universal styles
  --------------------*/
sup {font-size:60%;}

span.scriptOff {background:#fff; padding:5px; position:relative; border:solid 2px red; z-index:500;}

.right {float:right;} 
.floatLeft {position:relative; display:inline; float:left;}
.floatRight {position:relative; display:inline; float:right;}

.hidden {display:none; visibility:hidden;}
.visible {visibility:visible; display:block;}
.visibleInline {visibility:visible; display:inline;}

.underlineDotted {border-bottom:dotted 1px #003399;}

/*html level styles */
ul.noBullet li, ul.col_2_noBullet li {list-style:none;}
ul.col_2, ul.col_2_noBullet {width:200px; margin-right:25px;}

div.container div, /* should apply to only direct child of container div */
	div.container ul.col_2_noBullet,
	div.container ul.col_2 {position:relative; display:inline; float:left; } 

/* general link and image stuff */
a img {border: 0px;}
a {text-decoration:none; color: #336699;}
a:hover {text-decoration: underline;}

/* misc styles */
.clearstuff {
	clear: both; line-height:10%;
}

.readMore {
	font-size:9px; text-align:right; line-height:100%; 
	margin:0px; margin-right:6px; list-style:none; /* keep for use with lists */}
.readMore_divider {font-size:9px; border-top:dotted 1px #cc9933; margin-top:10px; margin-bottom:1px; padding-top:3px; }
*.readMore span.hotSpot, *.closeDiv span.hotSpot /* Events page specific */ /* see ie hack below */
	{
	font-size:9px; font-weight:normal;
	margin:0px; padding-top:0.75em;
	position:relative; display:inline; float:right;
}
/* IE5 HACK  for hotspot position */
*html *.readMore span.hotSpot, *.closeDiv span.hotSpot {padding-top:0.5em;}

.hotspot {color: #006699; cursor: pointer;}
.hotSpot {color: #006699; cursor: pointer;}

/* body styles - NOTE see 'body.subPage styles below' */
body {
	background-image: url(../images/gradient_background.jpg);
	margin: 0px;
	font-family: verdana, arial, Helvetica, sans-serif;
	font-size: 10px;
	line-height: 130%;
	color:#797979;	
}

/* ------------- 
  end   Universal styles 
--------------------------*/


#bodyDiv {
	width: 860px;
	margin: auto;
	background: url(/images/bg_gold.jpg);
}

/* begin rounded corner frame - thanks to  */
.raised {background: transparent; width:870px; margin:0 auto; margin-top:20px;}

.raised .top, .raised .bottom {display:block; background:transparent; font-size:1px;}
.raised .b1, .raised .b2, .raised .b3, .raised .b4, .raised .b1b, .raised .b2b, .raised .b3b, .raised .b4b {display:block; overflow:hidden;}
.raised .b1, .raised .b2, .raised .b3, .raised .b1b, .raised .b2b, .raised .b3b {height:1px;}
.raised .b2 {background:#e0cea3; border-left:1px solid #fff; border-right:1px solid #E9DCBD;} /* lightest to darkest */
.raised .b3 {background:#e0cea3; border-left:1px solid #fff; border-right:1px solid #e0cea3;}
.raised .b4 {background:#e0cea3; border-left:1px solid #fff; border-right:1px solid #cc9933;}
.raised .b4b {background:#e0cea3; border-left:1px solid #E9DCBD; border-right:1px solid #cc9933;}
.raised .b3b {background:#e0cea3; border-left:1px solid #e0cea3; border-right:1px solid #cc9933;}
.raised .b2b {background:#e0cea3; border-left:1px solid #cc9933; border-right:1px solid #cc9933;}

.raised .b1 {margin:0 5px; background:#fff;}
.raised .b2, .raised .b2b {margin:0 3px; border-width:0 2px;}
.raised .b3, .raised .b3b {margin:0 2px;}
.raised .b4, .raised .b4b {height:2px; margin:0 1px;}
.raised .b1b {margin:0 5px; background:#999;}
.raised .boxcontent {display:block;  background:#e0cea3; border-left:1px solid #fff; border-right:1px solid #999; padding-top:4px;}
/* end rounded corner frame - thanks to  */

/* begin photo pop-up gallery */
.gallery {
font-family: verdana, sans-serif; 
z-index:100;
width:150px;
}
.gallery ul { /* this is the container horizontal list of thumbnails */
width:150px;
padding-bottom:5px;
}
.gallery ul li {
position:relative;
list-style:none;
}
.gallery ul li img {border:solid 1px #cc9933; width:130px; padding:2px; background:#fff;}
*html .gallery ul li img {float:none;}
/* for magnifying glass */
.gallery ul li div.magnifier img { 
	width:12px;
	z-index:500;
	position:relative; float:left; display:inline;
	margin-left:3px; margin-top:-23px; /* see IE hack below */
	text-align:center; background:#fff;   
	border:ridge 1px #cc9933;
	} 
/* IE hack */
*html .gallery ul li div.magnifier img {margin-top:-29px;}
	
	
/* TEST for magnifying glass 
.gallery ul li div.reducer, .gallery ul li div.magnifier 
{width:12px; height:12px;
	z-index:500px;
	position:relative; float:left; display:inline;
	margin-left:3px; margin-top:-23px;
	text-align:center; background:#fff;   
	border:ridge 1px #cc9933;}
.gallery ul li div.reducer {
	background:url(/images/reduceGlass.gif)no-repeat;
	}

.gallery ul li div.magnifier { 
	background:url(/images/magnifyingGlass.gif)no-repeat;
	} 
	*/
		
.gallery ul li a, .gallery ul li a:visited {
text-decoration:none; 
color:#000;
cursor:default;
}
.gallery ul li ul { /* 2nd level photos */
position:absolute;
top:-6px;
left:-330px; 
}
ul.pos2 {display:none;/*position:absolute; left:-9999px;*/}
ul.pos2_Vis {display:block;}

.gallery ul li ul li img {border:solid 2px #cc9933; width:300px;} /* second-level photo */
.gallery ul.pos2_Vis div.caption { /* caption - second-level photo */
	font-weight:bold; font-style:oblique; color:#cc9933;
	display:block; width:294px; position:relative;
	border:solid 2px #cc9933;
	padding:5px; margin-top:-3px; /* see IE hack below */
	background:#fff;
} 
/* IE hack */
*html .gallery ul.pos2_Vis div.caption {margin-top:-10px;}
/* end photo pop-up gallery */



/* headings and font sizes */
h1 { /* IMPORTANT NOTE: make sure to check individual ids for size */
	/* IMPORTANT NOTE #2: .content is only used on sub pages */
	border-bottom:solid 1px #cc9933;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	margin-top:0.25em;
	margin-bottom:0.25em;
	padding-left: 6px;
	color: #003399;
}

h1 span.small {font-size:10px; font-weight:normal;}

#billboard h1 {
	border-style: none;
	margin: 0px;
	padding: 10px 0px 6px 0px;
	color: #AD1F00;
	font-family: Arial, Helvetica, sans-serif; font-size: 26px; font-weight:bold;
}
div#homeCenter h1 {
	font-size:16px; color:#003399;
	padding-bottom:0.125em; margin-top:0.5em; 
	margin-left:-6px; /* left margin needed to offset padding for underline set on all h1s */
}
div#homeCenter h1 span.eventDate {float:right; position:relative; display:inline; margin-top:-12px; margin-right:7px;}

#rightNav h1 {  /* see ie hacks below */
	font-size:12px; color:#003399;
	margin-top:-10px; padding-top:10px; 
	background:url(../images/roundTop_blueGrad.gif) no-repeat;  
	border-bottom:solid 2px #003399; 
	padding-bottom:0.2em; padding-left:1em; margin-left:-1px;
}
*html div#rightNav h1 {position:relative; top:-3px; margin-top:1px; padding-top:11px;}
*html div#rightNav {margin-top:-20px;}

/* begin sub page h1 specifics */
.subPage div.leftLists h1, .subPageWide div.leftLists h1 {	border-bottom:solid 1px #cc9933;}
.subPage h1.pageHead, .subPageWide h1.pageHead {
	font-size:20px; color:#AD1F00;
	margin-bottom:1em; margin-top:0px; margin-left:10px;
	 /* this is needed to offset the 6px padding on homepage h1s */
	border-bottom:none;  }
.subPage h1.pageHead img, .subPageWide h1.pageHead img {float:right; margin-left:5px; margin-top:-18px;}
	
div.content h1 {font-size:16px; padding-bottom:0.25em; margin-left:-15px;} /*for sub pages */

div.expandable h1 {border-bottom:none; } /* keep after the .content h1 */
/* end sub page h1 specifics */

h2 span.small {font-size:10px; font-weight:normal;}	

div#leftNav h2 { 
	font-size:11px;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	padding-left: 6px;
}

#billboard h2 {
	text-align: left;
	color: #797979;
	font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; 
	margin: 0px;
	padding: 3px 3px;
}
#homeCenter h2 {font-size:13px; color:#000; padding-top:1px; margin-bottom:2px; }

/* begin sub page h2 specifics */
div.content h2 {
	font-size:12px; line-height:120%; font-weight:bold; 
	margin-bottom:-6px; margin-left:-6px; /* this is needed to offset the 6px padding on homepage h1s */
}
body.subPage div#leftNav h2 {
	font-size:9px; font-weight:bold;
}
ul.announcementList h2 {
	border-bottom:dotted 2px #AD1F00; border-top:dotted 2px #AD1F00;
	padding:0.5em;
	background:#fcfcfc;
	text-align:left;
}
div#rightNav.content h2 {font-size:11px; margin-left:0;} 

body#eventsPage.subPage div.content h2.readMore {
	font-weight:normal; margin-bottom:2em;}
/* end sub page h2 specifics */

#bodyDiv h3
{	font-size:11px;
	font-family: Arial, Helvetica, sans-serif;
	margin:0px;
	padding-left: 6px;		
}
div#top h3 {
	font-family:arial, helvetica, sans-serif;
	color:#fff; font-size:14px; 
	letter-spacing:0.15em;
	float:right; text-align:right;
	margin: 0px; 
	padding:0;  padding-top:5px;
}

div#top h3 em {letter-spacing:0; }	

div#top div#logo h3	
{
	width:320px; 
	margin-top:0.125em; padding-bottom:0.125em; 
	background:#fff; 
	border-top:solid 1px #cc9933; 
	color:#cc9933; font-size:10.5px; font-weight:bold; text-align:center;}
	
/* begin sub page h3 specifics */	
div.content h3 {font-size:12px; font-weight:bold;}	

h3.underlineDotted {margin-bottom:-0.5em;}	
/* end sub page h3 specifics */
/* end headings and font sizes */


/* begin header */
#top 
{	background: #AD1F00;
	height: 91px;
	margin: auto;
	position: relative;
	width: 860px;
	padding-top:0px;	
}
div#top img.emblem 
{
	position:relative; display:inline; float:right;
	z-index:1000; 
	padding-right:1.25em; 
	height:25px; margin-top:-0.15em;
}
div#top div.redStripe /* for red & white stripes */
{
	height:21px;
	width: 538px;
	float:right;	
	color:#fff; 
	border-bottom: solid 14px #fff; 
} 
div#top div#logo {border:none; width:320px; padding-top:6px; float:left; background:#fff;}	
div#top div#logo img {padding-left:7px; margin-left:12px;}	
/* end header */


#bodyDiv ul {
	margin-top: 5px;
	margin-bottom: 5px;
	list-style-type:disc; margin-left:1.25em; 
}
#bodyDiv li {
	line-height: 120%;
	margin-left:6px;
	padding-left:0em;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom:6px;
}
#bodyDiv ul.tight li 
{	line-height:120%; 
	padding-bottom:0px;
}

#homeContent /* container */
{
	margin: 0px;
	padding: 7px;
	padding-right:0px;	
}

#footer {
	background: #fafafa;
	text-align: center;
	font-size: 11px;
	margin-top:15px;
	padding:8px 0px;
	border-top: 1px solid #cc9933;
}
#footerads {
	margin:0px auto auto;
	text-align:center;	
	padding-top: 20px;
	padding-bottom: 5px;

}


/* begin pull-down menus */
/* IMPORTANT to help IE with pull-downs - must be included in each page */
body {behavior:url(/csshover.htc); }

div#nav {
	height:25px;
	width:860px;
	margin:auto;	
	border-top: solid 4px #e0cea3;
	font-size:10px;
}
div#nav ul {
	list-style-type:none;
}
div#nav li {
	position:relative; 
	float:left;
	margin: 0; 
	text-align: center;
	z-index:990; /* must stay here */
}
div#nav li a {
	display:block; 
}

div#nav li a:hover {text-decoration:none; }
div#nav ul ul {
	width:130px; /* must keep width on the ul and the li */
	position:absolute; display:none; 
	margin-top:-0.5px; 
	border:solid 1px #003399;
} 
div#nav ul ul li {
	width:125px; /* must keep width on the ul and the li */
	background:#f6f6f6; 
	border:none; border-bottom:solid 1px #003399; 
	padding:3px; padding-top:7px; padding-right:1px; }
div#nav ul ul li a {color:#003399; text-align:left; font-weight:bold; }
/* begin hover styles */
div#nav ul ul li:hover {background:#fff; border:none; border-bottom:solid 1px #cc9933; }
div#nav ul.level1 li.submenu:hover ul.level2,
div#nav ul.level2 li.submenu:hover ul.level3 {display:block; z-index:999;}
div#nav ul.level1 li.submenu:hover .xb2, 
	div#nav ul.level1 li.submenu:hover .xb3, 
	div#nav ul.level1 li.submenu:hover .xb4 {background:#AD1F00;} /* hover for top of tab */
div#nav ul.level1 li.submenu:hover .xboxcontent {background:#AD1F00; color:#fff;} /* hover for base of tab */
/* end hover styles */

/* begin rounded tabs for pull-down menus */
.xtabs span {margin:0; padding-bottom:0.5em;}
.xtop {display:block; }
.xb1, .xb2, .xb3, .xb4 {
display:block; 
/* hide overflow:hidden from IE5/Mac */ 
/* \*/ 
overflow: hidden; 
/* */ 
}
.xb1, .xb2, .xb3 {height:1px;}


/* ------------------------------------
   Begin color change for tabs - top of tab
   ------------------------------------ */
.xb2, .xb3, .xb4 {background:#003399; border-left:1px solid #fff; border-right:1px solid #fff;} /* main color */   
div.aboutTabPage #about .xb2, div.aboutTabPage #about .xb3, div.aboutTabPage #about .xb4 {background:#E9DCBD; }
div.servicesTabPage #services .xb2, 
	div.servicesTabPage #services .xb3, div.servicesTabPage #services .xb4 {background:#E9DCBD; }
/* FRIENDS */
div.supportersTabPage #supporters .xb2, 
	div.supportersTabPage #supporters .xb3, div.supportersTabPage #supporters .xb4 {background:#E9DCBD; }
div.eventTabPage #events .xb2, div.eventTabPage #events .xb3, div.eventTabPage #events .xb4 {background:#E9DCBD; }
div.faqTabPage #faq .xb2, 
	div.faqTabPage #faq .xb3, div.faqTabPage #faq .xb4 {background:#E9DCBD; }
div.donationsTabPage #donations .xb2, 
	div.donationsTabPage #donations .xb3, div.donationsTabPage #donations .xb4 {background:#E9DCBD; }	
/* VOLUNTEER */
div.volunteerTabPage #volunteer .xb2, div.volunteerTabPage #volunteer .xb3, 
	div.volunteerTabPage #volunteer .xb4 {background:#E9DCBD; }
div.contactTabPage #contact .xb2, div.contactTabPage #contact .xb3, div.contactTabPage #contact .xb4 {background:#E9DCBD; }
/* ------------------------------------
   end color change for tabs - top of tab
   ------------------------------------ */
.xb1 {margin:0 5px; background:#fff;}/*creates top outline */
.xb2 {margin:0 3px; border-width:0 2px;}
.xb3 {margin:0 2px;}
.xb4 {height:2px; margin:0 1px;}

.darkGold {color:#cc9933;}
.medGold {color:#e0cea3;}
.lightGold {color:#E9DCBD;} 

/* ------------------------------------
   Begin color change for tabs - tab base
   ------------------------------------ */
.xboxcontent {
	color:#fff; display:block; background:#000099; border:0 solid #fff; border-width:0 1px 2px 1px; } /* main color */
div.aboutTabPage #about .xboxcontent{background:#e0cea3; color:#003399;}
div.servicesTabPage #services .xboxcontent{background:#e0cea3; color:#003399;}
div.supportersTabPage #supporters .xboxcontent{background:#e0cea3; color:#003399;}
div.eventTabPage #events .xboxcontent{background:#e0cea3; color:#003399;}
div.faqTabPage #faq .xboxcontent{background:#e0cea3; color:#003399;}
div.donationsTabPage #donations .xboxcontent{background:#e0cea3; color:#003399;}
div.volunteerTabPage #volunteer .xboxcontent{background:#e0cea3; color:#003399;}
div.contactTabPage #contact .xboxcontent{background:#e0cea3; color:#003399;}
/* ------------------------------------
   End color change for tabs - tab base
   ------------------------------------ */
a.xmenu2, a.xmenu2:visited {display:block; text-decoration:none; width:107.25px;  }
/*end tabs rounded*/
/*end pull-down menus */

ul {
	margin: 0px;
	padding: 0px;
}
li {
	margin: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}

/*welcome section*/
#billboard {
	padding-bottom:0.35em;
}

#billboard img.graphic {
	float: right;
	margin-left: 15px;
}
	
#contentbody /* container for body not including header */
{
	margin: 0px;
	padding: 0px;
	
}
/* Left and middle Sections */
div.leftLists, div.middleLists
{
	margin-bottom: 10px;
	padding: 3px;
	padding-bottom: 4px;
	border: 1px solid #e0cea3; /* gold */
	background:#fff;
}
/* IE hacks */
*html div.leftLists h3 { padding-left:-3px;}
*html div.leftLists ul li {list-style-type:circle; }

/* Left Section */
#leftNav { /* sub page left nav is listed there */
	width: 200px;
	float: left;
	margin-left:5px; /* see ie hack below */
}
/* IE hack */
*html #leftNav {margin-left:2px; }


/* Middle Section */
#homeCenter {
	width: 415px;
	float: left;
	margin-right: 10px;
	margin-left: 10px;
}
div.middleLists {}
#homeCenter div.middleLists {padding-left:15px; padding-right:5px; padding-top:0.25em;} /* center section */
div#supporterLogo {width:150px; padding:5px; font-size:9px; }
div.container div.featureStory {width:230px; margin-right:1px;}
div.container div.featurePhotos {width:160px; float:right; padding-top:7px; }
div.container div.featureStoryFullWidth {margin-right:1px;padding-right:10px;}

div#homeCenter div.featureImgDiv {
	width:170px; margin:5px; 
	text-align:center; font-size:9px; font-style:italic; line-height:105%;
	border:solid 1px #cc9933; padding-bottom:2px; 
	float:right; display:inline; position:relative;
}
div#homeCenter img.featureImg {width:168px; padding:1px; background:#797979; }	
div#homeCenter img.magnify {width:15px; position:absolute; top:112px; left:154px; cursor:pointer;}

div.largerImageContainer div img {border:solid 3px #cc9933;}


/* Begin Right Section -- Events and Announcements */
#rightNav { /* right nav */
	width: 218px;
	float:right;
	padding-right: 0px;
	padding-bottom: 5px;
	padding-left: 0px;
	margin-bottom: 0px;
	margin-top:-16px;
	margin-right:0px;
	background:#fff;
	border-left:solid 1px #003399; 
	border-bottom:solid 1px #003399;	
}
table.eventList td {vertical-align:top; padding-top:3px;}
table.eventList td.event {font-weight:bold; width:200px; padding-left:2px;}
ul.announcementList li {margin-top:3px;}
/* IE hack */
*html ul.announcementList li {list-style-type:circle;}
ul.announcementList li.readMore {list-style-type:none;}
/* End Right Section -- Events and Announcements */


/* -- Begin Sub page styles - remember to view all heading and font styles below in that section */
body.subPage div#bodyDiv,
	body.subPageWide div#bodyDiv {
	width:820px;
	background:url(/images/bg_gold.jpg); 
	padding:20px; padding-bottom:0;
	}

body.subPage div#contentbody {margin-left:-18px;} /* offsets homepage style */
	
div.content {
	float:left; display:inline; position:relative;
	width:490px;
	min-height:500px; /* see IE hack below */
	height:auto;
	background:#fff; border:solid 1px #e0cea3;
	margin-top:3px; margin-left:18px; 
	padding:20px;
	padding-top:10px;
	padding-right:60px;
}
/* for Internet Explorer */
/*\*/
*html body.subPage div.content {height: 500px;}
/*------*/

body.subPageWide div.content {width:650px; padding-right:5px;}	
div#contentbody3col div.content {width:435px; padding-right:5px;}	

div.content p.firstP {margin-top:-1em;}
body#eventsPage div.content p.firstP {line-height:140%;}

body.subPage div#leftNav {
	width: 175px;
	margin-top:2px;
	float:left; display:inline; position:relative;
}

div#rightNav.content {
	display:inline; float:right; position:relative; 
	width:150px; background:#fff; 
	padding:5px; margin:1px;
}

#sponsors {position:relative; display:inline; float:right; width:250px;}

body.subPage div#footer, body.subPageWide div#footer {margin-left:-20px; margin-right:-20px;}

/* begin these are for pages like the events page with expandable lists */
div#bodyDiv.expandable {}
div.expandable ul.announcementList li {
	list-style:none; 
	width:500px;
	margin-left:0; padding-left:0; margin-top:0.125em; padding-bottom:0; 
}
div.expandable ul.announcementList li li {list-style:disc;}
/* end these are for pages like the events page with expandable lists */

/* see services - community services */
ul.programList li.label {list-style:none;} 	 	
ul.programList li.org {
	font-weight:bold; font-size:11px; 
	list-style:square; color:#797979; 
	margin-bottom:-12px; margin-top:3px;}
ul.programList li.org li {
	font-weight:normal; font-size:11px; 
	list-style:disc; 
	margin-bottom:-2px;}
ul.programList li.org li li {list-style:none;}
/* see services - community services */

/*  End Sub page styles ----------------- */