body { color: #fff; }

a { color: #ff0; }

a:visited { color: #cc0; }

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

p { color: #fff; }



body { 
margin: 0; 
background-image: url('files/bg.jpg'); 
font-family: verdana, arial, sans-serif; 
}

#header { 
text-align: left; 
background-image: url('files/header.jpg'); background-repeat: repeat-x; 
}

#header img { 
display: inline; 
white-space: nowrap; 
vertical-align: top; 
}

#sidebartop { 
width: 200px; 
background-color: #002157; 
background-image: url('files/header.jpg'); background-repeat: repeat-x; 
}

#sidebar { 
width: 200px; 
vertical-align: top; 
background-color: #002157; 
}

#sidebar p { 
margin: 10px; 
text-align: left; 
}

#sidebar ol { 
margin: 10px 10px 10px 0px; 
text-align: left; 
}

#sidebar img { 
display: block; 
margin-top: 20px; 
margin-left: auto; 
margin-right: auto; 
}

.sig { text-align: right; }

.sig a { color: white; }

#body { 
text-align: center; 
vertical-align: top; 
}

#comic { 
display: block; 
margin: 0 auto; 
background-image: url('files/comic-bg.jpg'); 
background-repeat: no-repeat; 
background-position: center; 
}

#comic img { 
margin: 20px; 
}

#art { 
display: block; 
margin: 0 auto; 
}

#art img { 
border: solid black 8px; 
margin: 20px; 
}


#footer { 
height: 2em; 
text-align: center; 
background-color: #002157; 
}



/* MAIN NAVIGATION */

#nav { 
position: absolute; top: 120px; left: 200px; 
width: 600px; height: 40px; 
white-space: nowrap; 
}

#nav a { 
float: left; 
height: 40px; 
display: inline; 
margin: 0 18px; 
}

#nav-comic a { 
width: 100px; 
background-image: url('files/nav-comic-roll.jpg'); 
}

#nav-database a { 
width: 140px; 
background-image: url('files/nav-database.jpg'); 
}

#nav-database a:hover { 
background-image: url('files/nav-database-roll.jpg'); 
}

#nav-forums a { 
width: 120px; 
background-image: url('files/nav-forums.jpg'); 
}

#nav-forums a:hover { 
background-image: url('files/nav-forums-roll.jpg'); 
}

#nav-shop a { 
width: 80px; 
background-image: url('files/nav-shop.jpg'); 
}

#nav-shop a:hover { 
background-image: url('files/nav-shop-roll.jpg'); 
}


/* COMIC NAVIGATION */

.comicnav { 
display: block; 
width: 420px; height: 40px; 
margin: 0 auto; 
}

.comicnav a { 
float: left; 
height: 40px; 
display: inline; 
white-space: no-wrap; 
margin: 0 20px; 
}

.comic-first a { 
width: 50px; 
background-image: url('files/comic-first.jpg'); 
}

.comic-first a:hover { 
background-image: url('files/comic-first-roll.jpg'); 
}

.comic-back a { 
width: 40px; 
background-image: url('files/comic-back.jpg'); 
}

.comic-back a:hover { 
background-image: url('files/comic-back-roll.jpg'); 
}

.comic-archive a { 
width: 40px; 
background-image: url('files/comic-archive.jpg'); 
}

.comic-archive a:hover { 
background-image: url('files/comic-archive-roll.jpg'); 
}

.comic-next a { 
width: 40px; 
background-image: url('files/comic-next.jpg'); 
}

.comic-next a:hover { 
background-image: url('files/comic-next-roll.jpg'); 
}

.comic-last a { 
width: 50px; 
background-image: url('files/comic-last.jpg'); 
}

.comic-last a:hover { 
background-image: url('files/comic-last-roll.jpg'); 
}