/* ============================================================
   FORLENZASTEIN -- official shareware homepage stylesheet
   Best viewed in Internet Explorer at 800x600, 256 colors.
   Plain CSS1/CSS2.1 only -- works in Internet Explorer 5/6.
   No gradients, no shadows, no scripting. Just like back then.
   ============================================================ */

body {
  /* deep-night sky color from the game's title screen */
  background-color: #150d1d;
  color: #d0d0d0;
  font-family: "Times New Roman", Times, serif;
  font-size: 16px;
  margin: 0;
  padding: 12px 0 40px 0;
  text-align: center;
}

/* The whole page lives in a centered panel, table-of-old style */
.page {
  width: 760px;
  margin-left: auto;
  margin-right: auto;
  background-color: #2a1810;
  border: 4px ridge #e8c840;
  text-align: left;
}

.inner { padding: 18px 26px; }

/* -------- the gold wordmark -------- */
.wordmark {
  text-align: center;
  font-family: "Impact", "Arial Black", Arial, sans-serif;
  letter-spacing: 4px;
  color: #e8c840;
  font-size: 52px;
  margin: 6px 0 0 0;
}
.wordmark-sub {
  text-align: center;
  color: #d0d0d0;
  font-size: 13px;
  letter-spacing: 2px;
  margin: 2px 0 10px 0;
}

/* -------- scrolling marquee tagline (an IE/Netscape classic) -------- */
.tagbar {
  background-color: #551010;
  border-top: 2px groove #e8c840;
  border-bottom: 2px groove #e8c840;
  color: #e8c840;
  font-weight: bold;
  font-size: 15px;
  padding: 5px 0;
  font-family: "Courier New", Courier, monospace;
}

/* -------- navigation bar -------- */
.navbar {
  text-align: center;
  background-color: #160d1d;
  padding: 8px 0;
  border-top: 2px solid #e8c840;
  border-bottom: 2px solid #e8c840;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 14px;
  font-weight: bold;
}
.navbar a {
  color: #e8c840;
  text-decoration: none;
  padding: 0 8px;
}
.navbar a:hover { color: #ffffff; background-color: #551010; }
.navbar .sep { color: #80604a; }

/* -------- generic links -------- */
a { color: #ffd24a; }
a:visited { color: #c89a30; }

/* -------- headings -------- */
h2 {
  color: #e8c840;
  font-family: "Impact", "Arial Black", sans-serif;
  letter-spacing: 2px;
  border-bottom: 2px solid #551010;
  padding-bottom: 4px;
}
h3 { color: #ffd24a; font-family: Arial, Helvetica, sans-serif; margin-bottom: 4px; }

p { line-height: 1.5; }

/* -------- the big DOWNLOAD button -------- */
.downloadbox { text-align: center; margin: 18px 0; }
a.download {
  display: inline-block;
  background-color: #205520;
  color: #ffffff;
  font-family: "Impact", "Arial Black", sans-serif;
  font-size: 26px;
  letter-spacing: 2px;
  text-decoration: none;
  padding: 14px 30px;
  border: 4px outset #60e060;
}
a.download:hover { background-color: #2a6a2a; border-style: inset; }
.download-note { font-size: 12px; color: #b0a070; margin-top: 6px; }

/* -------- system requirements box -------- */
.sysreq {
  border: 3px ridge #e8c840;
  background-color: #160d1d;
  padding: 10px 16px;
  margin: 16px 0;
}
.sysreq h3 { color: #60e060; margin-top: 0; }
.sysreq .ok { color: #60e060; font-weight: bold; }

/* -------- FAQ entries -------- */
.faq {
  border-left: 4px solid #e8c840;
  background-color: #160d1d;
  padding: 8px 14px;
  margin: 14px 0;
}
.faq .q { color: #ff6060; font-weight: bold; font-family: Arial, Helvetica, sans-serif; }

/* -------- controls table -------- */
table.controls {
  width: 100%;
  border-collapse: collapse;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 14px;
}
table.controls th {
  background-color: #551010;
  color: #e8c840;
  padding: 6px 10px;
  border: 1px solid #e8c840;
}
table.controls td {
  border: 1px solid #80604a;
  padding: 6px 10px;
  background-color: #160d1d;
}
table.controls td.key {
  text-align: center;
  font-family: "Courier New", Courier, monospace;
  font-weight: bold;
  color: #60e060;
  white-space: nowrap;
}

/* -------- screenshot mockups (positioned blocks -- no images, no SVG) -------- */
.shot { text-align: center; margin: 22px 0; }
.screen {
  position: relative;
  width: 640px;
  height: 480px;
  margin-left: auto;
  margin-right: auto;
  border: 3px ridge #e8c840;
  background-color: #000000;
  overflow: hidden;
}
.screen div { position: absolute; overflow: hidden; }
.screen .lbl {
  left: 0;
  width: 640px;
  text-align: center;
  background-color: transparent;
}
.shot .cap { font-size: 13px; color: #b0a070; margin-top: 6px; }

/* -------- badges -------- */
.badge-netscape {
  display: inline-block;
  font-family: "Courier New", Courier, monospace;
  font-size: 11px;
  font-weight: bold;
  padding: 3px 6px;
  border: 2px solid #000000;
  background-color: #000000;
  color: #9090ff;
}
.badge-new {
  display: inline-block;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 11px;
  font-weight: bold;
  padding: 3px 6px;
  border: 2px solid #000000;
  background-color: #ff0000;
  color: #ffff00;
}

.construction {
  background-color: #e8c840;
  color: #000000;
  font-weight: bold;
  font-family: Arial, Helvetica, sans-serif;
  padding: 4px 10px;
  display: inline-block;
  border: 3px ridge #c8a820;
}

/* fake odometer hit counter */
.counter {
  display: inline-block;
  background-color: #000000;
  color: #00ff00;
  font-family: "Courier New", Courier, monospace;
  font-size: 18px;
  font-weight: bold;
  letter-spacing: 3px;
  padding: 2px 8px;
  border: 2px inset #444444;
}

/* -------- footer -------- */
.footer {
  text-align: center;
  font-size: 12px;
  color: #b0a070;
  margin-top: 20px;
  border-top: 2px groove #e8c840;
  padding-top: 12px;
}
hr.rule { border: 0; border-top: 2px groove #e8c840; margin: 18px 0; }