html, body {
 margin: 0;
 padding: 0;
 height: 100%;
}

html>body #wrap { height: 100%; }
html>body #content-wrap { height: 100%; }
html>body #content { padding: 4px 4px 24px 4px; }

#footer {
 width: 100%;
 height: 24px;
}

html>body #footer {
 clear: both;
 position: fixed;
 bottom: 0;
 z-index: 10;
}

body {
 font: normal 11pt Skia, Optima, "Lucida Grande", Verdana, Arial, sans-serif;
 color: #fff;
 background-color: #080808;
}

h1, h2, h3, ul, li {
 margin: 0;
 padding: 0;
}

ul {
 list-style: none;
}

a {
 color: #fff;
 text-decoration: none;
}
 
a:hover {
 color: #f00;
}

a img {
 border: none;
}

.clearfix:after {
 content: "";
 display: block;
 clear: both;
}

/* -------------------------------------------------------------------------- */
.buttons {
 text-align: center;
}

a.button {
 display: -moz-inline-box;
 display: inline-block;
 cursor: pointer;
 border: none;
 font-size: 0;
 line-height: 0;

 background-position: 0 0;
 background-repeat: no-repeat;
 height: 40px;
 text-decoration: none;
 font-style: normal;
 margin: 0 16px 0 0;
 padding: 0 10px 0 0;
 vertical-align: middle;
}

a.button, a.button span {
 background-image: url(img/button-long.png);
}

a.button span {
 white-space: nowrap;
 cursor: pointer;
 display: -moz-inline-box;
 display: inline-block;
 line-height: 1;
 letter-spacing: 0 !important;
 font-family: Skia, Optima, Arial !important;
 font-size: 20px !important;
 font-style: normal;
 background-color: #080808;
 background-position: 100% 0;
 background-repeat: no-repeat;
 height: 40px;
 padding: 10px 20px 0 10px;
 margin: 0 -16px 0 10px;
 border: none;
 vertical-align: text-top;
}

a.button span:hover {
 color: #f00;
 text-decoration: none;
}

/* -------------------------------------------------------------------------- */
#header {
 background: url(img/header-bg.png) repeat-x;
 height: 40px;
 padding: 4px;
}

#header h1 {
 margin-top: 4px;
 text-align: center;
 font-size: 180%;
 font-family: Skia, 'Trebuchet MS', Verdana, Helvetica, sans-serif;
 font-weight: normal;
}

#header h1 a.up {
 margin-top: -4px;
 padding: 8px 0 4px 40px;
 background: url(img/up.png) no-repeat;
}

#header h1 a.up:hover {
 color: inherit;
 background-position: left bottom;
}

/* -------------------------------------------------------------------------- */
#footer-content {
 height: 24px;
 width: 500px;
 background-position: bottom;
 background: url(img/footer-bg.png) no-repeat;
 margin: 0 auto 0 auto;
}

#footer-content p {
 margin: 0;
 padding-top: 4px;
 text-align: center;
}

/* -------------------------------------------------------------------------- */
#flash {
 min-height: 600px;
 margin-top: 16px;
 margin-bottom: 16px;
 text-align: center
}

/* -------------------------------------------------------------------------- */
.albums {
 margin: 0 16px 0 16px;
}

.album {
 float: left;
 width: 160px;
 margin: 8px 0;
 text-align: center;
}

.album:hover {
 color: #f00;
}

.album .thumb {
 width: 100px;
 height: 150px;
 margin: 0 auto;
 overflow: hidden;
}

.album img {
 border: none;
}

.album p {
 margin: .1em 0 0 0;
}

/* -------------------------------------------------------------------------- */
#photos {
 margin: 8px auto;
}

#photos td {
 padding: 8px 6px;
 text-align: center;
}

#photos a:hover {
 color: #34c;
}

/* -------------------------------------------------------------------------- */
#photo {
 position: relative;
 margin-top: 16px;
 text-align: center;
}

#photo img {
 position: relative;
 top: 0;
 left: 0;
 border: none;
 vertical-align: middle;
}

#nav-prev, #nav-next {
 display: block;
 position: absolute;
 top: 0;
 width: 50%;
 height: 100%;
}

#nav-prev span, #nav-next span {
 display: none;
}

#nav-prev {
 z-index: 10;
 left: 0;
}

#nav-next {
 z-index: 10;
 left: 50%;
}

#nav-prev:hover {
 background: url(img/nav-prev.png) no-repeat 90% 0%;
}

#nav-next:hover {
 background: url(img/nav-next.png) no-repeat 10% 0%;
}

/* -------------------------------------------------------------------------- */
.whatsnew {
 height: 164px;
 overflow: hidden;
 margin: 0 2em;
 padding-left: 60px;
 background: transparent url(img/whatsnew.png) no-repeat;
}

.whatsnew .albums {
 margin: 0 auto;
}

.whatsnew .album {
 width: 120px;
}

.whatsnew .album .name {
 white-space: nowrap;
}

.whatsnew .album .thumb {
 width: 80px;
 height: 120px;
}

.whatsnew .album .thumb img {
 width: 100%;
 height: 100%;
}
