/* 
   Stylesheet for the Fade webcomic

   Feel free to copy the CSS commands, but not the associated graphics
   files, as those are my original work.

   Copyright 2008 Jack Stalnaker
*/

/* Reset everything to zero */
* {
  padding: 0px;
  margin: 0px;
  border: none;
}

body {
  font-family: Tahoma, 'Trebuchet MS', Arial, Helvetica, sans-serif;
  text-align: center;
  color: #000;
  background: #fff url("images/bodybgnew.jpg") left 305px no-repeat;
  font-size: 80%;
}

img {
  padding: 2px;
  border: 3px #3a2a02 double;
}

blockquote {
  border: 1px dashed #3a2a02;
  background: #ecece6;
  padding: 5px;
  margin: 10px 20px 10px 55px;
}

a:link { color: #00007c; }
a:hover { color: #0000ff; }
a:visited { color: #663166; }
a:active, a:focus { outline: none; }

h1#maintitle {
  text-align: center;
  background: url("images/newpageheader.jpg") left top no-repeat;
  height: 305px;
}

h1#maintitle a span { display: none; }
h1#maintitle a { 
  display: block;
  width: 200px;
  height: 170px;
  position: relative;
  top: 10px;
  left: 125px;
}

div#sitenav {
   text-align: left;
   line-height: 1.5em;
   letter-spacing: 0.2em;
   font-size: 110%;
   width: 100px;
   position: absolute;
   top: 110px;
   left: 60px;
}

div#sitenav ul li {
   list-style-type: none;
   font-weight: bold;
}

div#sitenav ul li a:link, div#sitenav ul li a:visited {
  color: #5b5b5b;
  text-decoration: none;
}

div#sitenav ul li a:hover {
  color: #000000;
}

div#content {
   position: absolute;
   top: 150px;
   left: 100px;
   width: 780px;
   font-size: 90%;
   text-align: justify;
}

div#googlead { 
   position: relative;
   left: 950px;
   top: 72px;
   clear: both;
   width: 120px;
}

div#comic {
   width: 620px;
   margin: 50px 0 0 150px;
   text-align: center;
}
div#contentlvl2 {
   width: 620px;
   margin: 50px 0 0 150px;
   text-align: justify;
}

div#issue_information {
   position: absolute;
   top: 520px;
   left: 15px;
   width: 130px;
   text-align: right;
}
div#issue_information h2 {
   font-size: 200%;
   padding: 10px;
}
div#issue_information h3 {
   border-top: 2px solid #000;
   border-bottom: 2px solid #000;
   padding: 10px;
   font-style: italic;
}
div#issue_information div#issue_details {
   font-size: 90%;
   padding: 10px;
   border-bottom: 2px solid #000;
}
div#issue_information form {
   padding: 10px;
   border-bottom: 2px solid #000;
}
div#issue_information form p#issuejump { margin-bottom: 5px; }
div#issue_information p#permalink { padding: 10px; }
div#issue_information p#permalink a { text-decoration: none; color: #000; }
div#issue_information p#permalink a:hover { text-decoration: none; color: #00f; }

div.comicnav {
   clear: both;
   margin-top: 15px;
}

div.comicnav ul { list-style: none; margin-left: 90px;}
div.comicnav ul li { display: inline; }
div.comicnav ul li span { 
   display: block;
   float: left;
   cursor: pointer;
}

div.comicnav ul li span.beginnav {
   width: 103px;
   height: 29px;
   background: url("images/beginnew.gif") left top no-repeat;
}
div.comicnav ul li span.prevnav {
   width: 125px;
   height: 29px;
   background: url("images/prevnew.gif") left top no-repeat;
}
div.comicnav ul li span.nextnav {
   margin-left: 30px;
   width: 100px;
   height: 29px;
   background: url("images/nextnew.gif") left top no-repeat;
}
div.comicnav ul li span.endnav {
   width: 90px;
   height: 29px;
   background: url("images/endnew.gif") left top no-repeat;
}
div.comicnav ul li span span { display: none; }
div.comicnav form { 
  float: right;
  padding-top: 4px;
}

div#page { clear: both; }
div#page img { cursor: pointer; }

div#commentary {
   clear: both;
   text-align: justify;
   margin-top: 60px;
   padding: 5px 10px 0 10px;
}

div#synopsis {
   clear: both;
   text-align: justify;
   padding: 0px 10px 0 10px;
   margin-top: 20px;
}

div.subcontent {
   clear: both;
   margin-top: 30px;
}
div.subcontent h2 { 
}

div#news h2 {
   background: url("images/newsnew.gif") left top no-repeat;
   height: 47px;
}
div#links h2 {
   background: url("images/linksnew.gif") left top no-repeat;
   height: 47px;
}
div#cast h2 {
   background: url("images/castnew.gif") left bottom no-repeat;
   height: 47px;
}
div#gallery h2 {
   background: url("images/gallerynew.gif") left bottom no-repeat;
   height: 47px;
}
div#faq h2 {
   background: url("images/faqnew.gif") left bottom no-repeat;
   height: 47px;
}
div#contact_info h2 {
   background: url("images/contactnew.gif") left bottom no-repeat;
   height: 47px;
}
div#archive_listing h2 {
   background: url("images/issuenew.gif") left bottom no-repeat;
   height: 47px;
}
div.subcontent h2 span { display: none; }
div#news h2 a {
   display: block;
   height: 48px;
   width: 153px;
}

div.newsitem {
  padding: 15px;
}
div.newsitem h4 {
  background: url("images/listnew.gif") left center no-repeat;
  padding: 0 0 0px 30px;
}
div.newsitem p.date {
   padding: 0 0 5px 30px;
   font-style: oblique;
}
div.newsitem ul { padding: 0 0 0 20px; }

div#links { text-align: center; }
div#links img { border: none; }
div#links ul { list-style: none; }
div#links ul li { display: inline; }

div#contact_info div.infoblock {
   margin: 80px 20px 200px 20px;
   text-align: center;
   font-size: 130%;
}
div#contact_info div.infoblock h4 { letter-spacing: 0.2em; margin-bottom: 10px; }

div#page_footer {
   margin-top: 30px;
   padding: 80px 0 80px 0;
   text-align: left;
   background: url("images/mapornament.gif") center right no-repeat;
}

div#listnav {
   text-align: center;
   font-size: 130%;
   font-weight: bold;
}
div#listnav a { margin: 0 2em 0 2em; }

div.galleryblock {
 display: inline-block;
 width: 600px;
 padding: 20px 10px 30px 20px; 
 border-bottom: 1px solid #3e2a02; 
}
div.galleryblock#last { border: none; }

/* Hide from IE Mac \*/
* html div.galleryblock {
  height: 1%;
  width: auto;
}

div.galleryblock { display: table; }
/* End hide from IE Mac */

div.galleryblock img { float: left; }
div.galleryblock ul.gallerydesc {
  margin: 0px 0 0 150px;
}
div.galleryblock ul { padding: 0 0 0 30px; }

ol#faqlist {
  margin: 20px 0 0 20px;
}
ol#faqlist li { margin: 10px 10px 10px 10px; }

span.drop {
  font-weight: bold;
  font-style: normal;
  letter-spacing: 0.2em;
}

form#loginform label, form#sqlform label { display: block; }
form#loginform input.txt, form#sqlform input.txt,
form#loginform input.btn, form#sqlform input.btn, div#redirectnotice input.btn { 
  width: 100%; 
  border: 1px #3e2a02 solid; 
}

form#loginform input.btn, #sqlform input.btn, div#redirectnotice input.btn  { 
  padding: 10px 0px 10px 0px; font-style: oblique; 
}

form#loginform div { padding: 0 0 10px 0; }
form#sqlform { padding: 10px 0 10px 0; }
form#loginform { padding-bottom: 200px; margin: 30px 10px 20px 10px; }

div.itemblock {
   border-bottom: 1px solid #3e2a02; 
   padding: 20px;
}

div#errblock {
   padding-bottom: 200px;
}
div#errblock p { padding: 20px 10px 20px 10px; }


input.txt, textarea.txt { width: 100%; }

textarea.txt { height: 10em; border: 1px solid #000; }

div#redirectnotice {
   width: 580px;
   margin: 50px 0 200px 200px;
   text-align: left;
}
div#redirectnotice p {
   margin: 20px 0 20px 0;
}
