html, body {
	margin: 0;
	}

body {
	background-color: #000;
	font: 10pt Trebuchet MS, Lucida Grande, Verdana, Sans-serif;
	line-height: 1.3em;
	}
	
#wrap {
	position: relative;
	background-color: #fff;
	width: 550px;
	margin: 30px auto 0 auto;
	}
	
#top {
	position: relative;
	height: 170px;
	width: 550px;
	background-color: #fff;
	}

#logo {
	margin: 30px 0 0 30px;
	}

#top ul {
	position: absolute;
	top: 100px;
	left: 30px;
	margin: 0;
	padding: 0;
	}

#top ul br {
	clear: both;
	}

#top li {
	display: inline;
	line-height: 2em;
	margin: 0 5px 0 0;
	}

#content {
	position: relative;
	margin: 0 30px;
	width: 496px;
	}

#footer {
	position: relative;
	left: 30px;
	width: 520px;
	height: 30px;
	color: #aeaeae;
	}

h2 {
	font: 18px Trebuchet MS, Lucida Grande, Sans-serif;
	margin: 0;
	color: #9D0000;
	}

h3 {
	font: 16px Lucida Grande, Sans-serif;
	margin: 5px 0 0 0;
	color: #A51333;
}

h4 {
	font: 12px Lucida Grande, Sans-serif;
	margin: 6px 0 -4px 0;
	color: #575757;
}

.dark h2 {color: #BB110B;}

p {
	margin-top: 5px;
	}

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

a:hover {
	text-decoration: underline;
	}

a.active {
	color: #9D0000;
	}
	

#saimg img {
	margin: 0;
	border: 0;
	padding: 0;
}

#saimg {
	position: relative;
	left: -2px;
}

#saom {
	width: 290px;
	margin: 20px 0 0 0px;
}

#sasi {
	width: 180px;
	position: absolute;
	left: 310px;
	top: 120px;
	font-size: 8pt;
}

	
img a {border:0;}
a img {border:0;}

#grpback {
	background: url('../images/grupp.jpg');
	width: 500px;
	height: 333px;
}

#grpback:hover {
	position: relative;
	background: url('../images/grupp_dark.jpg');
}

#grparea1, #grparea2, #grparea3, #grparea4, #grparea5 {
	position: absolute;
	background: transparent;
}

#grparea1 {
	top: 0px;
	left: 0px;
	width: 164px;
	height: 333px;
}

#grparea2 {
	top: 0px;
	left: 145px;
	width: 144px;
	height: 241px;
}

#grparea3 {
	top: 91px;
	left: 95px;
	width: 188px;
	height: 242px;
}

#grparea4 {
	top: 0px;
	left: 305px;
	width: 195px;
	height: 333px;
}

#grparea5 {
	top: 0px;
	left: 251px;
	width: 132px;
	height: 333px;
}

#grparea1:hover { background: url('../images/1.jpg'); }
#grparea2:hover { background: url('../images/2.jpg'); }
#grparea3:hover { background: url('../images/3.jpg'); }
#grparea4:hover { background: url('../images/4.jpg'); }
#grparea5:hover { background: url('../images/5.jpg'); }

#grpback a:hover {
	cursor: hand;
}

/* These styles are used in the popups with info about the family members */
body.fam {
	background-color: #000;
	width: 570px;
}

.fam .copyr {
	text-align: right;
}

body.piccenter {
	background-color: #000;
	text-align: center;
}


img.photo.left { margin: 10px 0 10px 10px; }
img.photo.right { margin: 10px; }

.left {	float: left; }

.right { float: right; }

p.copy {
	color: #333;
	clear: both;
	margin: 10px;
}


#faminfo {
	width: 250px;
	margin: 15px 0 0 20px;
	color: #fff;
}