/* ============================================================
   AMERICAN PUBLIC SAFETY NETWORK -- style.css
   last touched 03/14/2002 -- DO NOT EDIT, gary's backup is gone
   ============================================================ */

html { background: #C0C0C0; }
body {
  background: #C0C0C0;
  margin: 0; padding: 0;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 11px;
  color: #000000;
}
* { box-sizing: content-box; }

a { color: #0000FF; text-decoration: underline; }
a:visited { color: #800080; }
a:hover { color: #FF0000; }
a.g { color: #00FF00; }
a.g:visited { color: #00AA00; }
a.y { color: #FFFF00; }
a.y:visited { color: #CCCC00; }
a.w { color: #FFFFFF; }
a.w:visited { color: #C0C0C0; }

img { border: 0; }
td { font-size: 11px; }
form { margin: 0; }

/* ---------------- page body (full width, the site IS the page) ---------------- */
.pagebody {
  background: #C0C0C0;
  width: 100%;
}
.winbtn {
  display: inline-block; width: 16px; height: 14px;
  background: #C0C0C0; color: #000;
  border-top: 1px solid #FFFFFF; border-left: 1px solid #FFFFFF;
  border-right: 1px solid #404040; border-bottom: 1px solid #404040;
  font-family: "Marlett", "Webdings", monospace;
  font-size: 9px; font-weight: bold; text-align: center; line-height: 14px;
  margin-left: 2px; cursor: pointer;
}
.winbtn:active { border-top: 1px solid #404040; border-left: 1px solid #404040; border-right: 1px solid #FFFFFF; border-bottom: 1px solid #FFFFFF; }

/* header */
.hdrterm {
  background: #000000;
  color: #00FF00;
  font-family: "Courier New", Courier, monospace;
  text-align: center;
  padding: 4px 0 2px 0;
  border-bottom: 2px solid #00FF00;
}
.hdrterm .big {
  font-size: 26px; font-weight: bold; letter-spacing: 4px;
}
.hdrterm .sub {
  font-size: 11px; letter-spacing: 6px; color: #00CC00;
}
.hdrbanner {
  position: relative;
  height: 150px;
  overflow: hidden;
  background: #000 url('../img/banner.jpg') repeat-x center top;
  border-top: 1px solid #808080;
  border-bottom: 2px solid #000000;
  text-align: center;
  image-rendering: pixelated;
}
.hdrbanner .ov1 {
  margin-top: 26px;
  font-family: "Times New Roman", Times, serif;
  font-size: 40px; font-weight: bold; color: #FFFF00;
  text-shadow: 2px 2px 0 #FF0000, -2px -2px 0 #000000, 3px 3px 0 #000000;
  letter-spacing: 3px;
}
.hdrbanner .ov2 {
  font-family: Arial, sans-serif;
  font-size: 15px; font-weight: bold; color: #FFFFFF;
  background: #000080;
  display: inline-block;
  padding: 1px 10px;
  border: 1px solid #FFFFFF;
}
.livebar {
  background: #000000; text-align: center; padding: 2px 0;
  border-bottom: 1px solid #FF0000;
}
.livebar .live {
  color: #FF0000; font-family: Verdana, sans-serif; font-size: 12px; font-weight: bold;
  letter-spacing: 2px;
}
.tickerbar {
  background: #000000; color: #00FF00;
  font-family: "Courier New", monospace; font-size: 12px; font-weight: bold;
  border-bottom: 3px double #00FF00;
  padding: 1px 0;
}

/* blink -- like the old <blink> tag */
.blink { animation: blink 1s steps(1) infinite; }
@keyframes blink { 50% { visibility: hidden; } }
.blinkfast { animation: blink .45s steps(1) infinite; }

/* main 3col table */
.colwrap { width: 100%; border-collapse: collapse; }
.colwrap > tbody > tr > td { vertical-align: top; }
.leftcol { width: 172px; background: #C0C0C0; padding: 3px; }
.midcol  { background: #FFFFFF; padding: 5px; border-left: 2px solid #808080; border-right: 2px solid #808080; }
.rightcol { width: 168px; background: #C0C0C0; padding: 3px; }

/* generic beveled panel */
.panel {
  background: #C0C0C0;
  border-top: 2px solid #FFFFFF; border-left: 2px solid #FFFFFF;
  border-right: 2px solid #404040; border-bottom: 2px solid #404040;
  margin-bottom: 6px;
}
.panel .ptitle {
  background: #000080;
  background: linear-gradient(90deg, #000080, #1084D0);
  color: #FFFFFF;
  font-family: "MS Sans Serif", Tahoma, Arial, sans-serif;
  font-size: 11px; font-weight: bold;
  padding: 2px 4px;
}
.panel .pbody { padding: 4px; font-size: 10px; }

.inset {
  border-top: 2px solid #404040; border-left: 2px solid #404040;
  border-right: 2px solid #FFFFFF; border-bottom: 2px solid #FFFFFF;
  background: #FFFFFF;
}

/* windows push button */
.btn95 {
  background: #C0C0C0;
  border-top: 2px solid #FFFFFF; border-left: 2px solid #FFFFFF;
  border-right: 2px solid #404040; border-bottom: 2px solid #404040;
  font-family: "MS Sans Serif", Tahoma, Arial, sans-serif;
  font-size: 11px;
  padding: 2px 10px;
  cursor: pointer;
  color: #000;
}
.btn95:active { border-top: 2px solid #404040; border-left: 2px solid #404040; border-right: 2px solid #FFFFFF; border-bottom: 2px solid #FFFFFF; }
a.btn95, a.btn95:visited { color:#000; text-decoration: none; display:inline-block; }

input.f95, select.f95, textarea.f95 {
  border-top: 2px solid #404040; border-left: 2px solid #404040;
  border-right: 2px solid #FFFFFF; border-bottom: 2px solid #FFFFFF;
  background: #FFFFFF;
  font-family: "MS Sans Serif", Tahoma, Arial, sans-serif;
  font-size: 11px;
  padding: 1px 3px;
}

/* left nav */
.navpanel a, .navpanel a:visited { display:block; color: #0000FF; font-size: 10px; padding: 1px 2px; }
.navpanel a:visited { color:#800080; }
.navpanel a:hover { background: #000080; color: #FFFF00; text-decoration: none; }

/* 88x31 badges */
.b8831 {
  display: inline-block;
  width: 88px; height: 31px;
  overflow: hidden;
  margin: 1px 0;
  border: 1px solid #000000;
  font-family: Arial, sans-serif;
  font-weight: bold;
  text-align: center;
  cursor: pointer;
  image-rendering: pixelated;
  vertical-align: middle;
  line-height: 1;
}
.b8831 span { display: block; }

/* sidebar ads */
.sidead {
  width: 158px;
  margin: 0 auto 7px auto;
  border: 1px solid #000000;
  background: #FFFFFF;
  font-family: Arial, sans-serif;
  text-align: center;
  overflow: hidden;
}
.sidead img { display: block; margin: 0 auto; image-rendering: pixelated; }
.adlabel {
  background: #C0C0C0; color: #404040;
  font-size: 8px; letter-spacing: 1px;
  border-bottom: 1px solid #808080;
  text-align: center;
  font-family: Verdana, sans-serif;
}

/* content headings */
.h1old {
  font-family: "Times New Roman", Times, serif;
  font-size: 28px; font-weight: bold;
  color: #000080;
  margin: 2px 0;
}
.h2old {
  font-family: Arial, sans-serif;
  font-size: 15px; font-weight: bold;
  background: #000080; color: #FFFFFF;
  padding: 1px 5px;
  margin: 8px 0 3px 0;
}
.tiny { font-size: 9px; color: #666666; }
.tinyb { font-size: 9px; }
.warnred { color: #FF0000; font-weight: bold; }
.termgreen { color: #00FF00; font-family: "Courier New", monospace; }

hr.old { border: 0; border-top: 1px solid #808080; border-bottom: 1px solid #FFFFFF; height: 0; }

/* news box */
.newsitem { padding: 2px 0; border-bottom: 1px dotted #808080; font-size: 11px; }
.newsdate { color: #808080; font-size: 9px; font-family: "Courier New", monospace; }

/* forum tables */
.ftable { width: 100%; border-collapse: collapse; border: 2px solid #000080; background:#FFFFFF; }
.ftable th {
  background: #000080; background: linear-gradient(90deg,#000080,#1084D0);
  color: #FFFFFF; font-size: 10px; text-align: left; padding: 2px 5px;
  font-family: Verdana, sans-serif;
}
.ftable td { border: 1px solid #C0C0C0; padding: 3px 5px; font-size: 11px; }
.ftable tr.alt td { background: #EFEFEF; }
.ftable tr:hover td { background: #FFFFCC; }
.fcat {
  background: #C0C0C0 !important; font-weight: bold; font-size: 11px;
  border: 1px solid #808080 !important;
}

/* forum post view */
.post { border: 2px solid #000080; margin-bottom: 8px; border-collapse: collapse; width: 100%; background: #FFFFFF; }
.post td { vertical-align: top; }
.postuser {
  width: 130px; background: #DBDBDB; border-right: 2px solid #000080;
  padding: 4px; font-size: 10px; text-align: center;
}
.postuser .uname { font-weight: bold; font-size: 11px; }
.postbody { padding: 6px 8px; font-size: 11px; font-family: Verdana, sans-serif; }
.postdate { background: #000080; color: #FFFFFF; font-size: 9px; padding: 1px 5px; font-family: "Courier New", monospace; }
.sig { border-top: 1px dashed #808080; margin-top: 8px; padding-top: 3px; font-size: 9px; color: #666; font-style: italic; }
.avatar { border: 1px solid #000; image-rendering: pixelated; }

/* score bar */
.scorebar { font-family: "Courier New", monospace; font-weight: bold; letter-spacing: 0; }

/* terminal pages (threat center) */
.termpage {
  background: #000000; color: #00FF00;
  font-family: "Courier New", Courier, monospace;
  padding: 10px;
  font-size: 12px;
}
.termpage a, .termpage a:visited { color: #00FF00; }
.termbox { border: 1px solid #00FF00; padding: 4px 8px; display: inline-block; margin: 3px; background: #001100; }
.termbox.red { border-color: #FF0000; color: #FF0000; background: #110000; }

/* map */
.mapframe {
  position: relative;
  width: 720px; height: 540px;
  border: 3px double #000080;
  background: #000 url('../img/mapzone.jpg') no-repeat;
  background-size: 720px 669px;
  background-position: 0 -60px;
  image-rendering: pixelated;
  overflow: hidden;
  cursor: crosshair;
}
.camdot {
  position: absolute; width: 6px; height: 6px;
  background: #FF0000; border: 1px solid #FFFF00;
  cursor: pointer;
}
.camtip {
  position: absolute; z-index: 50;
  background: #FFFFCC; border: 1px solid #000000;
  font-family: "Courier New", monospace; font-size: 10px;
  padding: 3px 5px; width: 190px;
  box-shadow: 2px 2px 0 #000000;
}

/* win98 popup dialogs */
.popup98 {
  position: fixed; z-index: 999;
  width: 330px;
  background: #C0C0C0;
  border-top: 2px solid #DFDFDF; border-left: 2px solid #DFDFDF;
  border-right: 2px solid #404040; border-bottom: 2px solid #404040;
  box-shadow: 3px 3px 0 rgba(0,0,0,0.4);
  font-family: "MS Sans Serif", Tahoma, Arial, sans-serif;
  font-size: 11px;
}
.popup98 .ptop {
  background: #000080; background: linear-gradient(90deg,#000080,#1084D0);
  color: #FFF; font-weight: bold; padding: 2px 4px; cursor: move;
}
.popup98 .pmsg { padding: 12px 10px; }
.popup98 .pbtns { text-align: center; padding: 4px 0 10px 0; }
.popicon { font-family: "Times New Roman", serif; font-weight: bold; font-size: 22px;
  display: inline-block; width: 32px; height: 32px; text-align: center; line-height: 32px;
  border-radius: 0; }

/* pixel-art via box-shadow */
.px { display: inline-block; position: relative; image-rendering: pixelated; }
.px i { position: absolute; top: 0; left: 0; width: 2px; height: 2px; }

/* hit counter */
.counter {
  display: inline-block;
  background: #000000;
  border: 1px solid #808080;
  padding: 1px 2px;
  font-family: "Courier New", monospace;
  font-weight: bold;
  font-size: 13px;
  color: #00FF00;
  letter-spacing: 2px;
}
.counter.red { color: #FF0000; }

/* under construction */
.constr {
  display: inline-block;
  background: repeating-linear-gradient(45deg, #FFFF00 0 8px, #000000 8px 16px);
  color: #000000; font-weight: bold; font-family: Arial, sans-serif;
  padding: 2px 8px; font-size: 10px;
  border: 1px solid #000;
  background-size: 200% 200%;
}
.newgif {
  color: #FF0000; font-family: Arial, sans-serif; font-weight: bold; font-style: italic;
  font-size: 10px;
}

/* awards */
.award {
  display: inline-block; width: 120px; height: 44px;
  border: 2px ridge #C0A000;
  background: #FFFFCC;
  font-family: "Times New Roman", serif;
  font-size: 9px; font-weight: bold; text-align: center;
  vertical-align: middle;
  margin: 2px;
  overflow: hidden;
}
.award .aw1 { display:block; font-size: 10px; color: #806000; margin-top: 4px; }

/* marquee element still works but style fallback */
marquee { display: block; }

/* footer */
.footer {
  background: #000080; color: #FFFFFF; text-align: center;
  font-size: 9px; padding: 4px; font-family: Verdana, sans-serif;
}
.footer a, .footer a:visited { color: #FFFF00; }

/* scrollbars (for inset scroll regions) */
.scrolly { overflow-y: scroll; }
.scrolly::-webkit-scrollbar { width: 16px; background: #C0C0C0; }
.scrolly::-webkit-scrollbar-thumb {
  background: #C0C0C0;
  border-top: 1px solid #FFFFFF; border-left: 1px solid #FFFFFF;
  border-right: 1px solid #404040; border-bottom: 1px solid #404040;
}
.scrolly::-webkit-scrollbar-button {
  background: #C0C0C0; height: 16px;
  border-top: 1px solid #FFFFFF; border-left: 1px solid #FFFFFF;
  border-right: 1px solid #404040; border-bottom: 1px solid #404040;
}

/* misc */
.center { text-align: center; }
.imgframe { border: 1px solid #000000; background: #000000; }
.figcap { font-size: 9px; color: #404040; font-family: "Courier New", monospace; }
table.datatable { border-collapse: collapse; }
table.datatable td, table.datatable th {
  border: 1px solid #808080; padding: 2px 6px; font-size: 10px;
  font-family: Verdana, sans-serif;
}
table.datatable th { background: #000080; color: #FFF; text-align: left; }

/* it must still technically work small, but it should NOT look mobile-first */
@media (max-width: 1030px) {
  body { overflow-x: auto; }
}
