/* COEF CSS Template */

/* Reset default positioning values */
@import "reset.css";

/*************** Layout */

#wrapper {
  width: 768px;
  height: auto;
  margin-left: auto;
  margin-right: auto;
  font-family: tahoma, geneva, sans-serif;
  font-size: 11px;
  line-height: 16px;
  color: #333333;
}

#content {
  float: left;
  display: inline;
  width: 752px;
  height: auto;
  margin: 64px 0px 0px 0px;
  padding: 8px;
  background: #ffffff;
}

#logo {
  float: left;
  display: block;
  width: 87px;
  height: 128px;
  font-size: 16px;
  line-height: 20px;
  margin: 25px 0px 25px 65px;
}

#left {
  float: left;
  display: inline;
  width: 217px;
  height: auto;
  margin: 10px 0px 0px 10px;
  padding: 0px 0px 10px 0px;
}

#main {
  float: right;
  display: inline;
  width: 508px;
  height: auto;
}

#nav, #nav ul {
  float: left;
  display: inline;
  width: 217px;
  height: auto;
}

#nav ul {
  list-style: none;
  margin: 0px;
  padding: 0px;
}

#nav ul li {
  float: left;
  width: 217px;
  height: auto;
  margin: 0px;
  padding: 0px;
}

#nav ul li a span {
  display: none;
}

#nav ul li a, #nav ul li a:link, #nav ul li a:visited {
  display: block;
  width: 217px;
  height: 30px;
  margin: 0px;
  padding: 0px;
  background-position: left;
  background-repeat: no-repeat;
}

#nav ul li a.here, #nav ul li a:hover, #nav ul li a:active {
  background-position: right;
}

#nav ul li.last {
  float: left;
  width: 217px;
  height: 1px;
  line-height: 1px;
  margin: 0px;
  padding: 0px;
  background: url(../image/nav_line.gif) top no-repeat;
}

#navHome {
  background-image: url(../image/nav_home.gif);
}

#navInitiatives {
  background-image: url(../image/nav_initiatives.gif);
}

#navIndividuals {
  background-image: url(../image/nav_individuals.gif);
}

#navChurches {
  background-image: url(../image/nav_churches.gif);
}

#navEvents {
  background-image: url(../image/nav_events.gif);
}

#navResources {
  background-image: url(../image/nav_forms.gif);
}

#navAbout {
  background-image: url(../image/nav_about.gif);
}

#navContact {
  background-image: url(../image/nav_contact.gif);
}

/* First Subnav */

#nav ul li ul {
  float: left;
  display: inline;
  list-style: none;
  margin: 0px;
  padding: 0px;
}

#nav ul li ul li {
  float: left;
  width: 217px;
  height: auto;
  margin: 0px;
  padding: 2px 0px 4px 0px;
  background: #eaeee3;
}

#nav ul li ul li a, #nav ul li ul li a:link, #nav ul li ul li a:visited {
  display: block;
  width: 205px;
  height: auto;
  margin: 0px;
  padding: 0px 6px 4px 6px;
  font-size: 13px;
  line-height: 14px;
  color: #446611;
}

#nav ul li ul li a:hover, #nav ul li ul li a:active {
  color: #668833;
}

/* Second Subnav */

#nav ul li ul li ul {
  float: left;
  display: inline;
  list-style: none;
  margin: 0px;
  padding: 0px;
}

#nav ul li ul li ul li {
  float: left;
  width: 217px;
  height: auto;
  margin: 0px;
  padding: 3px 0px 3px 0px;
  background: #eaeee3;
}

#nav ul li ul li ul li a, #nav ul li ul li ul li a:link, #nav ul li ul li ul li a:visited {
  display: block;
  width: 195px;
  height: auto;
  margin: 0px;
  padding: 0px 6px 2px 16px;
  font-size: 11px;
  line-height: 14px;
  color: #446611;
}

#nav ul li ul li ul li a:hover, #nav ul li ul li ul li a:active {
  color: #668833;
}

/* Third Subnav */

#nav ul li ul li ul li ul {
  float: left;
  display: inline;
  list-style: none;
  margin: 0px;
  padding: 0px;
}

#nav ul li ul li ul li ul li {
  float: left;
  width: 217px;
  height: auto;
  margin: 0px;
  padding: 2px 0px 2px 0px;
  background: #eaeee3;
}

#nav ul li ul li ul li ul li a, #nav ul li ul li ul li ul li a:link, #nav ul li ul li ul li ul li a:visited {
  display: block;
  width: 185px;
  height: auto;
  margin: 0px;
  padding: 0px 6px 2px 26px;
  font-size: 10px;
  line-height: 12px;
  color: #446611;
}

#nav ul li ul li ul li ul li a:hover, #nav ul li ul li ul li ul li a:active {
  color: #668833;
}

#footer {
  float: left;
  display: inline;
  width: 768px;
  height: auto;
  line-height: 30px;
  text-align: right;
  color: #bed0e9;
}

#footer a, #footer span {
  margin: 0px 5px 0px 5px;
}

#footer a:link, #footer a:visited {
  color: #bed0e9;
}

#footer a:hover, #footer a:active {
  color: #336677;
}


/*************** Homepage */

div.greenBar {
  float: left;
  display: inline;
  width: 508px;
  height: 25px;
  margin: 0px 0px 8px 0px;
  background: #ccd4bb;
}

div.homepage {
  float: left;
  display: inline;
  width: 508px;
  height: 215px;
  margin: 0px 0px 8px 0px;
}

div.about {
  float: left;
  display: inline;
  width: 143px;
  height: 152px;
  padding: 15px;
  margin: 0px 8px 0px 0px;
  background: #d8e3f2;
}

div.about p {
  float: left;
  display: inline;
  width: 143px;
  height: auto;
  line-height: 22px;
  margin: 0px 0px 8px 0px;
}

div.news {
  float: left;
  display: inline;
  width: 134px;
  height: 152px;
  padding: 15px;
  margin: 0px 8px 0px 0px;
  background: #cbdaee;
}

div.news p {
  float: left;
  display: inline;
  width: 134px;
  height: auto;
  line-height: 15px;
  margin: 0px 0px 8px 0px;
}

div.contact {
  float: left;
  display: inline;
  width: 125px;
  height: 152px;
  padding: 15px;
  background: #bed0e9;
}

div.contact p {
  float: left;
  display: inline;
  width: 125px;
  height: auto;
  line-height: 19px;
  margin: 0px 0px 8px 0px;
}

div.bucket h1 {
  width: 125px;
  height: auto;
  font-size: 14px;
  line-height: 14px;
  background: none;
  padding: 0px;
  font-size: 18px;
}

img.header {
  float: left;
  display: inline;
  border: solid 4px #ccd4bb;
  margin: 0px 0px 8px 0px;
}

/*************** Tags */

h1 {
  float: left;
  display: inline;
  width: 478px;
  height: auto;
  font-weight: normal;
  color: #3a81b5;
  letter-spacing: -1.0px;
  font-size: 22px;
  line-height: 22px;
  font-family: tahoma, geneva, sans-serif;
  margin: 0px 0px 8px 0px;
  padding: 15px;
  background: #d8e3f2;
}

h2 {
  float: left;
  display: inline;
  clear: left;
  width: 478px;
  height: auto;
  font-size: 16px;
  line-height: 20px;
  font-weight: bold;
  color: #486813;
  font-family: tahoma, geneva, sans-serif;
  margin: 0px 15px 8px 15px;
}

h3 {
  float: left;
  display: inline;
  clear: left;
  width: 478px;
  height: auto;
  font-size: 12px;
  line-height: 16px;
  font-weight: bold;
  color: #999999;
  font-family: tahoma, geneva, sans-serif;
  margin: 0px 15px 8px 15px;
}

h4 {
  float: left;
  display: inline;
  clear: left;
  width: 478px;
  height: auto;
  font-size: 11px;
  line-height: 16px;
  font-weight: bold;
  color: #6699cc;
  font-family: tahoma, geneva, sans-serif;
  margin: 0px 15px 8px 15px;
}

p {
  float: left;
  display: inline;
  width: 478px;
  height: auto;
  margin: 0px 15px 8px 15px;
  font-size: 13px;
}

a, a:link {
  color: #336699;
}

a:visited {
  color: #336699;
}

a:hover, a:active {
  color: #6699cc;
}

blockquote {
  float: left;
  display: inline;
  width: 469px;
  height: auto;
  padding: 12px;
  margin: 0px 0px 8px 15px;
  color: #686868;
  font-size: 11px;
  line-height: 16px;
  background: #eeeeee;
}

strong {
  font-weight: bold;
  color: #003344;
}

em {
  font-style: italic;
}

sup {
font-size: 9px;
position: relative; 
top: -0.6em; 
left: 0;
font-weight: normal;
}

/*************** Column Layout */

.half h1, .half h2, .half h3, .half h4, .half p {
  width: 229px;
  height: auto;
}

.third h1, .third h2, .third h3, .third h4, .third p {
  width: 144px;
  height: auto;
}

.twoThirds h1, .twoThirds h2, .twoThirds h3, .twoThirds h4, .twoThirds p {
  width: 334px;
  height: auto;
}


/*************** Lists */

div.list {
  float: left;
  display: inline;
  width: 478px;
  height: auto;
  margin: 0px 15px 8px 15px;
  font-size: 13px;
}

ul, ol {
  margin: 0px;
}

ul {
  list-style: square;
  padding: 0px 0px 0px 18px;
}

ol {
  list-style: decimal;
  padding: 0px 0px 0px 28px;
}

ul li, ol li {
  padding: 0px;
  margin: 0px 0px 4px 0px;
}

ul li ul {
  margin: 4px 0px;
  padding: 0px 0px 0px 18px;
}

ol li ol {
  list-style: lower-alpha;
  margin: 4px 0px;
  padding: 0px 0px 0px 18px;
}

ul li ul li, ol li ol li {ta
  padding: 0px;
  margin: 0px;
}



/*************** Tables */

table {
  float: left;
  clear: left;
  display: inline;
  width: 478px;
  height: auto;
  border-collapse: collapse;
  margin: 0px 0px 12px 15px;
}

table tr th {
  font-weight: bold;
  padding: 5px;
  vertical-align: top;
  line-height: 16px;
  background: #eeeeee;
  border: solid 1px #cccccc;
}

.blueMatch {
  background:#d8e3f2;
  }

.white  { background: #ffffff;
          border:0px;}

table tr td {
  padding: 5px;
  vertical-align: top;
  line-height: 16px;
  border: solid 1px #cccccc;
}

.tableHeader td{
  border: 0px;
}

.tableHeader {
  border: 0px;
}

.thWidth {
  width: 151px;
  height: auto;
}

/*************** Forms */

input {
  font-family: tahoma, geneva, sans-serif;
  font-size: 12px;
  line-height: 16px;
  color: #333333;
  border: solid 2px #eeeeee;
  background: #eeeeee;
}

input.submit {
  width: auto;
  height: auto;
  padding: 4px 8px;
  text-align: center;
  border: solid 1px #336699;
  background: #ddeeff;
  color: #336699;
  font-weight: bold;
  font-size: 16px;
  line-height: 20px;
}

input.submit:hover {
  cursor: pointer;
  background: #eef8ff;
  color: #6699cc;
  border-color: #6699cc;
}

input.file {
  width: 308px;
  height: auto;
}

input.text {
  width: 300px;
  height: auto;
}

input.city {
  width: 184px;
  height: auto;
}

input.zip {
  width: 50px;
  height: auto;
}

span.check {
  float: left;
  clear: left;
  display: inline;
  font-size: 12px;
  line-height: 16px;
}

span.clearLeft{
  clear: left;}

span.check input {
  float: left;
  display: inline;
  width: auto;
  height: auto;
  border: 0px;
  background: none;
  margin: 0px 8px 0px 0px;
  padding: 0px;
  font-size: 12px;
  line-height: 16px;
}

select {
  width: 308px;
  height: auto;
  font-family: tahoma, geneva, sans-serif;
  font-size: 12px;
  line-height: 16px;
  color: #333333;
  border: solid 4px #eeeeee;
  background: #eeeeee;
}

select.multiple {
  width: 308px;
  height: auto;
}

select.state {
  width: 50px;
  height: auto;
}

select.month {
  width: 80px;
  height: auto;
}

select.day {
  width: 50px;
  height: auto;
}

select.year {
  width: 80px;
  height: auto;
}

textarea {
  width: 300px;
  height: 150px;
  font-family: tahoma, geneva, sans-serif;
  font-size: 12px;
  line-height: 16px;
  color: #333333;
  border: solid 4px #eeeeee;
  background: #eeeeee;
}

a.button, a.button:link, a.button:visited {
  width: auto;
  height: auto;
  margin: 0px 8px 0px 0px;
  padding: 4px 8px;
  font-family: tahoma, geneva, sans-serif;
  font-size: 12px;
  line-height: 20px;
  color: #226699;
  font-weight: bold;
  text-align: center;
  background: #88bbdd;
  border: solid 1px #3388bb;
  text-decoration: none;
}

a.button:hover, a.button:active {
  background: #99ccee;
  text-decoration: none;
}

.error {
  float: left;
  display: inline;
  width: 493px;
  height: auto;
  font-size: 14px;
  font-weight: bold;
  color: #990000;
  background: #ee9999;
  border: 1px solid #aa2222;
  padding: 5px;
  margin: 0px 0px 12px 15px;
}

/*************** Generic Classes */

.bigGreen {
  font-size: 16px;
  line-height: 20px;
  font-weight: bold;
  color: #486813;
  font-family: tahoma, geneva, sans-serif;
}

.noParagraph {
  font-size: 16px;
}

.floatLeft 			{ float: left; display: inline; }
.floatRight 		{ float: right; display: inline; }
img.floatLeft		{ float: left; display: inline; margin: 0px 8px 8px 0px; }
img.floatRight	{ float: right; display: inline; margin: 0px 0px 8px 8px; }
.centered 			{ text-align: center; }
.alignRight 		{ text-align: right; }

.tiny 					{ font-size: 10px; line-height: 16px; }
.small 					{ font-size: 11px; line-height: 16px; }
.normal 				{ font-size: 12px; line-height: 16px; }
.medium 				{ font-size: 14px; line-height: 18px; }
.big 						{ font-size: 16px; line-height: 20px; }

.italic 				{ font-style: italic; }
.bold 					{ font-weight: bold; }
.nobold 				{ font-weight: normal; }

.grey						{ color: #999999; }
.blue						{ color: #336699; }
.green					{ color: #339933; }
.red						{ color: #993333; }
.black					{ color: #111111; }


.half 					{	width: 229px; padding: 0px 0px 8px 15px; }
.third					{ width: 144px; padding: 0px 0px 8px 15px }
.twoThirds			{	width: 334px; padding: 0px 0px 8px 15px }