﻿/********************************************************************* Base **/
html {
	background: #000;
	color: #fff;
	font-family: "Verdana", "Arial";
	font-size: 12px;
}
body {
	background: #f0f0f6 url('images/body_background.gif') repeat-x;
	color: #000;
	margin: 21px auto;
	padding: 27px 0 0 0;
	width: 800px;
	position: relative;
}
/********************************************************************* Content **/
#content {
	padding: 0 20px;
	text-align: justify;
}
#home_content {
	text-align: center;
}
h1 {
	margin: 10px;
	padding: 0;
}
#family_name {
	clear: both;
	text-align: center;
}
#family_name a img {
	border: none;
}
p#person {
	float: left;
	margin: 0 21px 0 0;
  text-align: center;
}
.captionedpic {
	float: right;
	margin: 0 0 10px 21px;
	clear: right;
}
.captionedpic.even {
	float: left;
	margin: 0 21px 10px 0;
	clear: left;
}
/********************************************************************* Name Navigation Bar **/
#name_nav {
	background: #000 url('images/names_bar_background.gif') repeat-x;
	text-align: center;
	color: #fff;
	height: 36px;
	line-height: 36px;
	clear: both;
}
#name_nav ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
#name_nav li {
	display: inline;
	padding: 0 10px;
}
#name_nav a {
	text-decoration: none;
	color: #fff;
}
/********************************************************************* Footer **/
#footer {
	background: #c5c5ca;
	color: #000;
	height: 197px;
	padding: 21px 11px 21px 0;
	clear: both;
}
.fbox {
	background-color: #404042;
	color: #fff;
	width: 212px;
	height: 142px;
	float: left;
	margin: 0 10px 0 21px;
	padding: 45px 10px 10px;
	text-align: center;
}
#footer #family {
	background-image: url('images/our_family_background.gif');
}
#footer #prayer_letters {
	background-image: url('images/prayer_letters_background.gif');
}
#footer #pictures {
	background-image: url('images/pictures_background.gif');
}
.fbox ul {
	margin: 0;
	padding: 0;
	list-style: none;
}
.fbox a {
	color: #fff;
	text-decoration: none;
	font-size: 14px;
	line-height: 22px;
}

.featured_person {
	border: solid 2px #c5c5ca;
	border-bottom: solid 6px #c5c5ca;
}
#date {
	font-weight: bold;
	font-size: 16px;
}
div.captionedpic {
float: right;
padding: .5em;
margin-top: 1em;
text-align: center;
width: 200px;
}
div.captionedpic.even {
float: left;
}
div.captionedpic strong {
display: block;
font-size: .8em;
}

/*Letter List******/
#letterList, #letterList ul {
	margin-left: 0;
	padding-left: 0;
	list-style-type: none;
}
#letterList {
	margin: 20px 0 50px 0;
}
#letterList ul {
	position: absolute;
	left: 0;
	top: 0;
	width: 300px;
	height: 260px;
	border: solid 1px #ccc;
	background: #fff;
	margin: 86px 0 0 300px;
	display: none;
}
#letterList ul.current {
	display: block;
}
#letterList ul li {
	padding: 10px;
}
#letterList h2 {
	background: #fff;
	border: solid 1px #ccc;
	margin: 0 100px 0 150px;
	padding: 0;
	width: 100px;
	cursor: pointer;
}
#letterList h2.current {
	width: 200px;
}
#letterList a {
	color: #000;
	font-size: 14px;
	text-decoration: none;
}
#letterList a:hover {
	text-decoration: underline;
}
