body {
background: url(bg.jpg) repeat #a47f3c;
font:16px/22px  "Lato", "lucida sans unicode", "lucida grande", helvetica, arial, verdana, sans-serif;
color:#fff;
}

div#container {
margin:-20px auto;
width:800px;
}


header {
margin:0px auto;
width:800px;
height:460px;
background:url(layout.png);
}

header img {
border:0;
padding:0;
margin:0;
background:none;
}


nav {
position:relative;
}

nav a { display:block; }

nav span { display:none; }

nav a#clear {
position:relative;
top:358px;
left:162px;
width:400px;
height:17px;
}

nav a#about {
position:relative;
top:379px;
left:313px;
width:55px;
height:18px;
}

nav a#fan {
position:relative;
top:361px;
left:397px;
width:117px;
height:18px;
}

nav a#site {
position:relative;
top:343px;
left:536px;
width:48px;
height:18px;
}



nav a#clear:hover { background:url(title.jpg) 0px 0px no-repeat; }
nav a#about:hover { background:url(nav.jpg) 0px 0px no-repeat; }
nav a#fan:hover { background:url(nav.jpg) -84px 0px no-repeat; }
nav a#site:hover { background:url(nav.jpg) -223px 0px no-repeat; }

div#content {
width:600px;
margin:0px auto 0px;
text-align:left;
}

div#content p {
margin:10px 0px;
padding:0;
}

h1 {
margin:0px 0px 5px;
font: bold 15px abel, 'lucida sans unicode', arial, sans-serif;
color:#04070a;
text-transform:uppercase;
border-radius:5px;
padding:5px;
background:url(bg.gif);
-webkit-box-shadow: 10px 10px 15px -2px rgba(134,110,67,1);
-moz-box-shadow: 10px 10px 15px -2px rgba(134,110,67,1);
box-shadow: 10px 10px 15px -2px rgba(134,110,67,1);
}

h2, h4 {
margin:5px 0px 5px;
font: bold 14px abel, 'lucida sans unicode', arial, sans-serif;
color:#04070a;
text-transform:uppercase;
border-radius:5px;
padding:5px;
background:url(bg.gif);
-webkit-box-shadow: 10px 10px 15px -2px rgba(134,110,67,1);
-moz-box-shadow: 10px 10px 15px -2px rgba(134,110,67,1);
box-shadow: 10px 10px 15px -2px rgba(134,110,67,1);
}

h3 {
margin:10px 0px;
font: bold 18px abel, 'lucida sans unicode', arial, sans-serif;
color:#eee;
text-align:center;
text-transform:lowercase;
clear:both;
text-shadow:0px 2px 2px #9a7f4d;
}

a { color:#dddac1; font-weight:bold; cursor:crosshair; }
a:hover { color:#fff; }


b, strong { font-family:Lato, 'lucida sans unicode', arial, sans-serif; color:#dddac1; }
i, em { font-family:Lato, 'lucida sans unicode', arial, sans-serif; color:#dddac1; }
.center { text-align:center; }
p.right { text-align:right; line-height:15px; padding-bottom:0px; clear:right; }
small { font-size:14px; line-height:18px; }
span { color:#dddac1; }


blockquote {
border-left:5px solid #594725;
margin:10px 10px 0px;
}
blockquote p { margin:0px !important; padding:0px 5px 0px !important; }
blockquote:hover { border-color:#e7c78a; }


img, a img { border:3px solid #e7c78a; padding:5px; margin-right:6px; background:none; }
img:hover { border-color:#e2ddc5; background:#F8F8F8; }
img.right { float:right; margin:0px 0px 5px 5px; }
img.left { float:left; margin:0px 5px 5px 0px; }


span.site {
font: 24px PrintBoldRegular, 'lucida sans unicode', arial, sans-serif;
color:#624555;
text-transform:uppercase;
}


ul li { list-style-type:square; }


input, textarea {
background:rgba(200,200,200,0.2);
padding:2px;
border:3px solid #594725;
font:16px/22px Lato, "trebuchet ms", tahoma, verdana, arial, sans-serif;
color:#000;
margin:5px 0px;
}

option, select { 
padding:2px;
border:3px solid #594725;
font:16px/22px Lato, "trebuchet ms", tahoma, verdana, arial, sans-serif;
color:#000;
margin:5px 0px;
background:rgba(200,200,200,0.2);
}

.help {
cursor:help;
}

code {
font-family:"Ubuntu Mono", "courier new", monospace;
}