@import url("/css/reset.css");
@import url("/css/slimbox.css");

body {
background: black;
color: white;
font: normal 82%/140% "Trebuchet MS", Arial, sans-serif;
}

a {
color: gray;
text-decoration: none;
}

a:hover {
color: white;
text-decoration: underline;
}

a.selected {
color: white;
}

.clear {
clear: both;
}

.hide {
display:none;
}

em {
font-style: italic;
}

#wrapper {
margin: 0 auto;
width: 750px;
}

.home-page {
background: url(/images/home-page-3-top2.jpg) no-repeat center 80px;
}

.faq-page {
background: url(/images/home-page-2.jpg) no-repeat 4px 60px;
}

.synopsis-page {
background: url(/images/home-page.jpg) no-repeat 4px 60px;
}

#header, #content, #footer {
margin: 0 55px;
width: 640px;
margin-bottom: 10px;
}

.comic-nav {
width: 640px;
margin-bottom: 20px;
}

#content, #footer {
font-size: .9em;
}

#header {
position: relative;
height: 76px;
background: url(/images/header_bg.png) no-repeat 0 0;
}

.home-page #header {
margin-bottom: 442px;
}

.synopsis-page #header, .faq-page #header {
margin-bottom: 355px;
}

#logo {
text-transform: uppercase;
position: absolute;
top: 19px;
left: 28px;
text-indent: -9999px;
display: block;
width: 188px;
height: 31px;
background: url(/images/logo.png) no-repeat 0;
}

#sub-title {
position: absolute;
top:45px;
right:15px;
}

#nav {
text-transform: lowercase;
position: absolute;
top:2px;
right:0;
}

#nav li {
float: left;
display: block;
padding: 5px;
margin-right: 15px;
}

#content p {
margin-bottom: 10px;
}

.col1 {
width: 300px;
float: left;
}

.col2 {
width: 300px;
float: right;
}

a.previous {
position: relative;
top: 3px;
margin-right: 10px;
}

a.next {
position: relative;
top: 3px;
margin-left: 10px;
}

.comic-nav {
text-align: center;
}

.comic-page img.page, .gallery-group {
margin-bottom: 20px;
}

.comic-page #content {
text-align: center;
}

#copyright {
text-align: right;
color: gray;
font-weight: 700;
}

dt {
font-size: 1.2em;
margin-top:20px;
color: gray;
font-weight: 700;
}

.gallery-page #content {
margin: 0 65px;
}

.gallery-page #content h2 {
text-indent: -9999px;
margin-bottom: 20px;
height: 16px;
}

.gallery-page #content h2.characters {
background: url(/images/heading-characters.gif) no-repeat 0;
}

.gallery-page #content h2.mechs {
background: url(/images/heading-mechs.gif) no-repeat 0;
}

.gallery-page #content h2.locations {
background: url(/images/heading-locations.gif) no-repeat 0;
}

.gallery-page #content h2.misc {
background: url(/images/heading-misc.gif) no-repeat 0;
}

.gallery-page #content h2.scenes {
background: url(/images/heading-scenes.gif) no-repeat 0;
}

.gallery-group li {
float: left;
margin:0 20px 15px 0;
}

.desc {
margin-top: 5px;
border-top: 1px solid #ccc;
padding-top: 5px;
margin-bottom: 5px;
}

#flash-content {
position: relative;
left: -13px;
}

.facebook {
background: url(/images/facebook.gif) no-repeat top right;
padding-right: 11px;
}

a.facebook, a.myspace, a.twitter {
text-decoration: none;
}

.myspace {
background: url(/images/myspace.gif) no-repeat top right;
padding-right: 11px;
}

.twitter {
background: url(/images/twitter.png) no-repeat top right;
padding-right: 11px;
}

h3 {
font-size: 1.2em;
color: gray;
margin-bottom: 10px;
}

.content-link { display: block; width: 120px; float: left; }
.content-desc { display: block; width: 510px; float: left; }

#content.links-page p { margin-bottom: 0; }
.links-page h3 { margin: 15px 0 0 0; text-decoration: underline; }
.paypal-donate { text-align: center;}

#js-comic-pages { margin-bottom: 10px; }
#js-comic-pages li { text-align: center; }