/* --------------------------
AUTHOR : Kristina Lugo
----------------------------*/
* {
margin:0;
padding:0;
}

/* MAIN */

body {
background-color: black;
background-image: url(contentbox.jpg);
background-repeat: repeat;
background-attachment: fixed!important;
background-position: center!important;
text-align: center;
min-width: 600px;
margin: 0px;
padding:0px;
}

p {
line-spacing: 1pt;
word-spacing: 0pt;
text-align: justify;
}

a {
text-decoration: none;
}

a:hover {
text-decoration: overline;
}

/* CONTENT */

#homecontent {
padding: 10px;
text-align: justify;
margin: auto 15px 15px 15px;
color: #404040;
font-family: Helvetica Narrow, sans serif;
line-height: 100%;
}

#content {
width: 800px;
margin: 75px auto 0px auto;
padding: 0px;
text-align: justify;
}

#content div {
/* borders and padding for
the div inside the main
container */
padding: 5px;
width: 750px;
}

blockquote p {
padding-top: 80px;
padding-left: 60px;
padding-right: 60px;
font-size: 13pt;
float: float;
}

blockquote {
padding: 0px;
font-size: 30pt;
color: #cccccc;
}

cite {
font-size: 10pt;
padding-right: 50px;
float: right;
color: black;
}

/* HEADINGS */

h1 {
font-family: Helvetica;
font-size: 11pt;
letter-spacing: 1pt;
color: #84ad3f; 
text-transform: uppercase;
text-align: left;
border-bottom: 1px dashed grey;
border-color: #404040;
}

h2 {
font-family: Arial;
letter-spacing: 1pt;
font-size: 10pt;
color: #404040; 
text-transform: uppercase;
text-align: left;
line-height: 200%;
}

h3 {
font-family: Times, Arial, Serif;
letter-spacing: 1pt;
font-size: 11pt;
color: #404040; 
text-align: left;
text-transform: uppercase;
line-height: 150%;
text-decoration: none;
}

/* FOOTER */

#footer {
border-top: 1px solid gray;
border-bottom: 1px solid gray;
color: gray;
text-align: right;
width: 100%;	
padding-bottom: 5px;
}

#footer a {
font-family: Lithos Pro;
font-weight: normal;
text-decoration: none;
text-transform: uppercase;
color: #cccccc;
font-size: 10pt;
}

#footer a:hover {
font-weight: bold;
letter-spacing: 0.5pt;
color: gray;
}

#footer a#home {
font-family: Arial;
font-weight: normal;
text-decoration: none;
text-transform: uppercase;
color: #fff;
font-size: 10pt;
}

/* NAVIGATION BAR */

#blackBar a{
font-weight: bold;
color: grey;
}

#blackBar a:hover{
text-decoration: none;
letter-spacing: 0.5pt;
}

#topBar {
width: 800px;
margin: 0px auto;
padding: 0px;
text-align: left;
background-color: black;
}

#topBar a {
text-decoration: none;
color: #000;
}

#topBar a:hover {
text-decoration: none;
color: #000;
}

#menuBar {
position: absolute;
left: 0px;
top: 0px;
align: left;
background-color: black;
width: 100%;
}

#navwrap {
position: relative;
font-size: 14pt;
letter-spacing: 0.5pt;
font-family: Lithos Pro;
width: 800px;
padding: 0px auto;
margin: 7px auto;
background-color: #000;
position: relative; 
}

#menu {
	border-bottom : 1px solid #ccc;
	margin : 0;
	padding-bottom : 0px;
	padding-left : 10px;
}

#menu ul, #menu li	{
	display : inline;
	list-style-type : none;
	margin : 0;
	padding : 0;
}
	
#menu li a {
	background : none;
	float : left;
	font-size : 12pt;
	font-weight : bold;
	line-height : 10px;
	margin-right : 8px;
	padding : 10px 12px;
	text-decoration : none;
	text-transform: uppercase;
	color: #999;
}

#menu li a:link.active, #menu a:visited.active	{
	color : #fff;
	text-decoration: overline;
}

#menu li a:hover	{
	color : #fff;
	letter-spacing: 1.5pt;
}

#menu li a#current	{
	color : #fff;
	text-decoration: overline;
}
	
body.section-1 #menu li#nav-1 a, 
body.section-2 #menu li#nav-2 a,
body.section-3 #menu li#nav-3 a,
body.section-4 #menu li#nav-4 a,
body.section-5 #menu li#nav-5 a,
body.section-6 #menu li#nav-6 a {
	color : #fff;
}

body.section-1 #menu li#active a:active, 
body.section-2 #menu li#active a:active,
body.section-3 #menu li#active a:active,
body.section-4 #menu li#active a:active,
body.section-5 #menu li#active a:active,
body.section-6 #menu li#active a:active {
	color : #fff;
	text-decoration: overline;
}

#menu #subnav-1,
#menu #subnav-2,
#menu #subnav-3,
#menu #subnav-4 {
	display : none;
	width: 100%;
	background: #999;
border-top: 3px solid #fff;
}

body.section-1 #menu ul#subnav-1, 
body.section-2 #menu ul#subnav-2,
body.section-3 #menu ul#subnav-3,
body.section-4 #menu ul#subnav-4 {
	display : inline;
	left : 0px;
	position : absolute;
	top : 30px;
}

body.section-1 #menu ul#subactive, 
body.section-2 #menu ul#subactive,
body.section-3 #menu ul#subactive,
body.section-4 #menu ul#subactive {
	text-decoration: none;
	letter-spacing: 1.0pt;
}

body.section-1 #menu ul#subactive li#subcurrent a:active, 
body.section-2 #menu ul#subactive li#subcurrent a:active,
body.section-3 #menu ul#subactive li#subcurrent a:active,
body.section-4 #menu ul#subactive li#subcurrent a:active {
	text-decoration: overline;
	letter-spacing: 2.0pt;
	color: #000;
}

body.section-1 #menu ul#subnav-1 a, 
body.section-2 #menu ul#subnav-2 a,
body.section-3 #menu ul#subnav-3 a,
body.section-4 #menu ul#subnav-4 a {
	background : #999;
	border : none;
	border-right: 1px solid #ccc;
	font-size : smaller;
	line-height : 25px;
	margin-right : 0px;
	padding : 0px 10px 2px 10px;
	text-transform: lowercase;
}

#menu li li a {
color: #fff;
}

#menu ul a:hover {
text-decoration: none;
letter-spacing: 1.0pt;
color: #fff;
}

#menu ul a#submenucurrent {
color: #000;
letter-spacing: 2pt;
font-weight: bold;
}

/* TABLE */

td.contentheading {
text-transform: uppercase; 
font-family: Helvetica; 
font-weight: bold;
color: #84ad3f; 
font-size: 15px; 
letter-spacing: 2px;
}

td.contentheading {
width:480px;
border-bottom: 1px dashed grey;
}

.contentpaneopen tr {
font-family: times, serif; 
font-size: 14px; 
color: #333; 
line-height: 120%;
valign: top;
}

.contentpaneopen td a {
color: #375700;}

.contentpaneopen h4 {
font-family: times, serif, arial;
text-transform: uppercase;
font-size: 10pt;
font-weight: normal;
color: #375700;
}

.contentpaneopen tr li {
font-family: times, serif; 
font-size: 13px; 
color: #333; 
line-height: 120%;
valign: top;
}

.moduletable h3 {
margin-top:0px;
padding-bottom:3px;
width:100%;
font-weight: normal; 
text-transform: uppercase; 
font-family: helvetica; 
color: #84ad3f; 
font-size: 10px; 
letter-spacing: 1px;
border-bottom:1px dashed grey;
}

.moduletable {
padding-top:0px;
}

.profiletable {
border-top: 2px solid gray;
border-bottom: 2px solid gray;
}

.contentprogram {
background: #ffffff;
}

.contentprogram td a {
color: #cccccc;
font-size: 11pt;
font-family: Helvetica Narrow, Times;
}

.contentprogram td a:hover {
font-weight: bold;
letter-spacing: 0.5pt;
text-decoration: none;
color: #ffffff;
background: #000;
}

.contenthome td a {
color: #375700;
font-weight: bold;
letter-spacing: 0.5pt;
font-family: Times New Roman, sans-serif;
font-size; 8pt;
}

.contenthome td a:hover {
text-decoration: none;
font-weight: bold;
letter-spacing: 1pt;
color: #fff;
}

.contenthome td a#main {
font-size: 16pt;
text-transform: uppercase;
padding-left: 20px;
color: #fff;
}

.contenthome td#footer {
color: #cccccc;
}

.contenthome td#footer a {
color: #cccccc;
}

.contenthome td#footer a:hover {
font-weight: bold;
}

/* program links */

.contentprogram td a#drr {
background-image: url(drr.jpg);
}

.contentprogram td a#drr:hover {
background-image: url(drrlabel.jpg);
}

/* PROGRAMS */
#navcontainer
{
margin: 0px;
padding: 0px;
}

#navcontainer ul
{
margin: 0px;
padding: 0px;
list-style-type: none;
text-align: center;
}

#navcontainer ul li { 
float: left; 
padding-right: 10px;
padding-bottom: 10px;
}

#navcontainer ul li a
{
text-decoration: none;
text-transform: uppercase;
font-size: 13pt;
float: left;
margin: 0px;
height: 50px;
width: 141px;
padding-right: 15px;
padding-bottom: 0px;
padding-left: 20px;
color: #fff;
font-weight: bold;
}

#navcontainer ul li a#drr {
padding-top: 150px;
height: 40px;
background: url(drr.jpg) no-repeat top left;
}

#navcontainer ul li a#drr:hover {
background: #000;
color: #fff;
font-weight: bold;
}

#navcontainer ul li a#relief {
background: url(relief.jpg) no-repeat top left;
padding-top: 160px;
height: 30px;
}

#navcontainer ul li a#relief:hover {
background: #000;
}

#navcontainer ul li a#watsan{
background: url(watsan.jpg) no-repeat top left;
padding-top: 150px;
height: 40px;
}

#navcontainer ul li a#watsan:hover {
background: #000;
}

#navcontainer ul li a#zap{
background: url(zap.jpg) no-repeat top left;
padding-top: 150px;
height: 40px;
}

#navcontainer ul li a#zap:hover {
background: #000;
}

#navcontainer ul li a#hazelbank{
background: url(hazelbank.jpg) no-repeat top left;
padding-top: 160px;
height: 30px;
}

#navcontainer ul li a#hazelbank:hover {
background: #000;
}

#navcontainer ul li a#churchlinks{
background: url(churchlinks.jpg) no-repeat top left;
padding-top: 160px;
height: 30px;
}

#navcontainer ul li a#churchlinks:hover {
background: #000;
}

#navcontainer ul li a#wala{
background: url(wala.jpg) no-repeat top left;
padding-top: 160px;
height: 30px;
}

#navcontainer ul li a#wala:hover {
background: #000;
}

#navcontainer ul li a#saveup{
background: url(saveup.jpg) no-repeat top left;
padding-top: 160px;
height: 30px;
}

#navcontainer ul li a#saveup:hover {
background: #000;
}

#navcontainer ul li a#ilife{
background: url(ilife.jpg) no-repeat top left;
padding-top: 160px;
height: 30px;
}

#navcontainer ul li a#ilife:hover {
background: #000;
}

/* IMAGE GALLERY */
#page-container {
margin: 0px auto;
margin-left: 20px;
width: 350px;
text-align: left;
}

.pg {
width: 700px;
list-style: none none;
}
.pg:after {
clear: both;
display: block;
content: ".";
height: 0;
visibility: hidden;
}

.pg li {
list-style: none none;
display: inline;
}

.pg li a {
margin: 2px;
border: 1px solid #CCC;
padding: 4px;
position: relative;
float: left;
display: block;
width: 100px;
height: 75px;
}

.pg li a:hover {
font-size: 100%;
z-index: 2;
}

.pg li a img {
border: 0 none;
position: absolute;
width: 100px;
height: 75px;
  /* for IE */
  filter:alpha(opacity=10);
  /* CSS3 standard */
  opacity:0.6;
}

.pg li a:hover img,.pg li a:active img,.pg li a:focus img {
z-index: 1;
  /* for IE */
  filter:alpha(opacity=100);
  /* CSS3 standard */
  opacity:1;
}

/* SIDEBAR IMAGES */

#side-container {
margin: 0px auto;
margin-left: 0px;
width: 10px;
text-align: justify;
}

.side {
margin-left: 10px;
width: 130px;
list-style: none none;
}

.side:after {
clear: both;
display: block;
content: ".";
height: 0;
visibility: hidden;
}

.side li {
list-style: none none;
display: block;
}

.side li a {
margin: 2px;
border: 1px solid #CCC;
padding: 4px;
position: relative;
float: left;
display: block;
width: 130px;
height: 95px;
}

.side li a:hover {
font-size: 100%;
z-index: 2;
}

.side li a img {
border: 0 none;
position: absolute;
width: 130px;
height: 95px;
  /* for IE */
  filter:alpha(opacity=70);
  /* CSS3 standard */
  opacity:0.7;
}

.side li a:hover img,.pg li a:active img,.pg li a:focus img {
z-index: 1;
  /* for IE */
  filter:alpha(opacity=100);
  /* CSS3 standard */
  opacity:1;
}