* { margin: 0; }
 body { background: #EEE url('layout/background.jpg') fixed; color: #000; font: 13pt "Courier New",monospace; }
 a { text-decoration: none; color: #00F; }
 a:hover { text-decoration: underline; }
 h1 { font: 60px normal Georgia,serif; line-height: 60px; max-width: 800px; margin: -2px auto -10px auto;  color: #000;  vertical-align: bottom; padding: 0; }
 p { text-align: justify; margin: 9px 9px 9px 0px; }
 abbr { cursor: help; }

 p.first-paragraph { margin-right: 188px; }
 div.layout { border-spacing: 0; border: 0; border: 4px solid #000; border-width: 8px 8px 0px 0px; max-width: 800px; margin: auto; position: relative; z-index: 1; }

 .center { margin: auto; text-align: center; }
 .character { margin: 38px 20px 10px 0px; position: relative; }
 .character div { background: #666; margin: 2px 10px 0px 0px;  padding: 0px 3px; color: #FFF; border: 1px solid #111; font-size: 10pt; line-height: 1em; } 
 
 span.char { width: 100px; height: 80px; border: 1px solid #000; position: absolute; right: 20px; top: -17px;  background-image: url('images/characters.jpg'); }

 .shinji  { background-position: 0px 0px; }
 .rei     { background-position: 0px -80px; }
 .asuka   { background-position: 0px -160px; }
 .mari    { background-position: 0px -320px; }
 .misato  { background-position: 0px -240px; }
 .gendo   { background-position: 0px -560px; }
 .touji   { background-position: 0px -400px; }
 .ritsuko { background-position: 0px -640px; }
 .kaji    { background-position: 0px -720px; }
 
 .story h2 { border-bottom: 1px solid #000;  text-align: center; }
 .story img { display: block; margin: 10px auto 0px auto; text-align: center; }
 .story p { padding-right: 10px; }

 .options { margin: 33px auto; border: 2px groove #000; border-spacing: 4px; }
 .options td { background: #666; padding: 15px; }
 .options a { width: 80px; height: 528px; border: 3px solid #000; display: block; background-image: url('images/menu.jpg'); }
 .options a:hover { border: 3px solid #08C; opacity: 0.8; }
 a.history    { background-position: 0px 0px;    }
 a.characters { background-position: -80px 0px;  }
 a.mecha      { background-position: -240px 0px; }
 a.story      { background-position: -160px 0px; }
 a.retro      { background-position: -320px 0px; }

 .voice { margin: 20px auto; width: 90%; border-spacing: 0; }
 .voice td, .voice th { font: 11pt Arial,sans-serif; text-align: left; }
 .voice th { font-weight: bold; background: #777; color: #FFF; }
 .voice td { padding: 3px 10px; border-bottom: 1px dotted #777; }
 .voice tr:hover { background: #FFF;  }
 .voice .vc { font-weight: bold; }

 .mailbar { text-align: right; margin: 3px 20px; }
 .mailbar img { border: 1px solid #00F;  }
 .backlink { display: block; width: 140px; background: #000; color: #FFF; margin: 0px -10px 0px auto; text-align: center;  font: 11pt Verdana,sans-serif; }
 .bottom-nav { text-align: right; border-top: 3px double #000; }
 .bottom-nav a { padding: 0px 3px; }
 .bottom-nav a:hover { background: #006; color: #FFF; }
 blockquote { padding: 10px 0px 10px 123px; font: 11pt cursive; border: 1px solid #AAA; border-width: 1px 0px;  margin: 20px 0px }

 img.corner-pic { position: absolute; top: 0px; right: -8px; margin: 0px 0px 10px 10px; }