﻿body, p, ul, ol, dl, dt, dd, address, blockquote, div, form, fieldset, legend, h1, h2, h3, h4, map {display: block; margin: 0; padding: 0}
body {margin:0; padding:0; text-align:center; background: black url("images/body-bg.jpg") top repeat; font:14px/22px sans-serif; color: #999999;}

form input {vertical-align: middle}
hr {display: none}
.hidden {position: absolute; top: -9999px; left: -9999px;}

a:link {text-decoration: underline; color: #ffffff}
a:visited {text-decoration: underline; color: #999999}
a:hover, a:focus, a:active {text-decoration: none; color: black; background-color: #ffffff}

#site {
	width: 960px;
	margin: 0 auto;
	position: relative;
	background: url("images/content-bg.jpg") top left repeat;
	text-align: left;
}

#header {
	height: 80px;
	background: url("images/header-bg.jpg") top left no-repeat;
}

#content {
	height: 300px;
	padding: 20px 30px;
	background: url("images/content-top-bg.jpg") top left no-repeat;
}

html > body #content {
	height: auto;
	min-height: 300px;
}

#footer {
	clear: both;
	padding: 40px 10px 45px 10px;
	background: url("images/footer-bg.jpg") top left no-repeat;
	text-transform: uppercase;
	color: #666666;
}

#footer p {
	padding: 0;
	margin: 0;
	float: left;
}

#footer p.right {
	float: right;
}

#footer a:link, #footer a:visited {text-decoration: none; color: #666666}
#footer a:hover, #footer a:focus, #footer a:active {text-decoration: none; color: black; background-color: #ffffff}

#logo a {display:block; width: 291px; height: 30px; position: relative; top: 30px; left: 10px; overflow: hidden}
#logo a span {display: block; position: absolute; left: 0; top: 0; z-index: 1; width: 291px; height: 30px; margin:0; padding:0; background: url("images/logo.jpg") no-repeat; cursor: pointer}
#logo a:hover span, #logo a:focus span, #logo a:active span {background-position: 0 -30px}

#nav {
	width: 230px;
	height: 50px;
	position: absolute;
	top: 30px;
	right: 10px;
	margin: 0;
	padding: 0;
	list-style-type: none;
}

#nav li {
	float: left;
}

#people a {display:block; width: 50px; height: 50px; position: relative; overflow: hidden}
#people a span {display: block; position: absolute; left: 0; top: 0; z-index: 1; width: 50px; height: 50px; margin:0; padding:0; background: url("images/nav-people.jpg") no-repeat; cursor: pointer}
#people a:hover span, #people a:focus span, #people a:active span {background-position: 0 -50px}
#people a.select span {background-position: 0 -100px}

#nature a {display:block; width: 70px; height: 50px; position: relative; overflow: hidden}
#nature a span {display: block; position: absolute; left: 0; top: 0; z-index: 1; width: 70px; height: 50px; margin:0; padding:0; background: url("images/nav-nature.jpg") no-repeat; cursor: pointer}
#nature a:hover span, #nature a:focus span, #nature a:active span {background-position: 0 -50px}
#nature a.select span {background-position: 0 -100px}

#world a {display:block; width: 42px; height: 50px; position: relative; overflow: hidden}
#world a span {display: block; position: absolute; left: 0; top: 0; z-index: 1; width: 42px; height: 50px; margin:0; padding:0; background: url("images/nav-world.jpg") no-repeat; cursor: pointer}
#world a:hover span, #world a:focus span, #world a:active span {background-position: 0 -50px}
#world a.select span {background-position: 0 -100px}

#other a {display:block; width: 68px; height: 50px; position: relative; overflow: hidden}
#other a span {display: block; position: absolute; left: 0; top: 0; z-index: 1; width: 68px; height: 50px; margin:0; padding:0; background: url("images/nav-other.jpg") no-repeat; cursor: pointer}
#other a:hover span, #other a:focus span, #other a:active span {background-position: 0 -50px}
#other a.select span {background-position: 0 -100px}

.photo {
	width: 644px;
	float: left;
	margin: 0 15px 20px 15px;
	text-align: center;
}

.photo-cat {
	width: 140px;
	float: left;
	padding-top: 10px;
	text-align: right;
	text-transform: uppercase;
	line-height: 16px;
	color: #cccccc;
}

.photo-cat a {
	text-decoration: none;
	color: #666666;
	padding: 0 3px;
}

.photo-cat a strong {
	background-color: white;
}

.photo-nav {
	padding-top: 10px;
	text-align: left;
}

.photo-nav p {
	font-size: 24px;
}

.photo-nav a {
	text-decoration: none;
}

.home-left {
	width: 270px;
	float: left;
	margin: 25px 0 10px 0;
	text-align: right
}

.me-img {
	float: right;
	margin: 0 0 30px 15px;
}

.home-right {
	width: 600px;
	margin: 25px 0 10px 0;
	float: right;
}

img {
	border: 2px solid black;
}

h2 {
	margin: 0;
	font-size: 24px;
	font-weight: normal;
	color: #ffffff;
}

h3 {
	margin: 11px 0 0 0;
	font-size: 14px;
	font-weight: bold;
	color: #ffffff;
}

p {
	margin: 0 0 11px 0;
}

ul, ol {
	margin: 0 0 11px 14px;
}

blockquote {
	margin: 0 0 11px 0;
	padding: 0 0 0 14px;
	border-left: 4px solid black;
}









