/* The nav pages. Same 2005 design system as the profile, plus the parts
   the profile did not need. */

.msnav a { color: #dbe9f7; text-decoration: none; }
.msnav a:hover { color: #fff; text-decoration: underline; }
.msnav a.cur { color: #fff; font-weight: bold; text-decoration: underline; }
.msnav a.mslogo { font: bold 15px Arial, sans-serif; color: #fff; margin-right: 14px; }

.pagewrap { max-width: 860px; }
.pbanner { text-align: center; padding: 16px 0 12px; }
.pbanner img { max-width: 100%; height: auto; image-rendering: pixelated; }

/* browse */
.bfilters { margin-bottom: 10px; }
.bgrid { grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); }
.bcard {
  border: 1px solid #6699cc; background: #eaf2fb;
  padding: 6px; text-align: center; position: relative;
}
.bcard img:first-child { width: 96px; height: 96px; image-rendering: pixelated; border: 1px solid #003399; }
.bname { font: bold 11px Verdana, sans-serif; margin-top: 4px; word-break: break-all; }
.bsub { color: #666; font-size: 10px; line-height: 1.5; }
.online { position: absolute; top: 2px; right: 2px; height: 14px; width: auto; }

/* search */
.sbox {
  width: 100%; padding: 8px; font: 13px Verdana, sans-serif;
  border: 2px inset #888; margin-bottom: 6px;
}
.suggs { margin-bottom: 8px; }
.sugg {
  font: 10px Verdana, sans-serif; padding: 3px 8px; margin: 2px 3px 2px 0;
  background: #dbe9f7; border: 1px solid #6699cc; cursor: pointer;
}
.sugg:hover { background: #569c3c; color: #fff; }
.sgrid { grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); margin-top: 8px; }
.scell { text-align: center; }
.scell img { width: 88px; height: 88px; image-rendering: pixelated; border: 1px solid #888; }

/* invite */
.shill {
  width: 100%; height: 130px; font: 12px "Courier New", monospace;
  border: 2px inset #888; padding: 8px; background: #fffef2; resize: vertical;
}
button.small { width: auto; padding: 8px 18px; font-size: 12px; margin-top: 8px; }

/* film */
.posters { display: flex; flex-wrap: wrap; gap: 14px; justify-content: center; }
.poster { width: 200px; text-align: center; }
.poster img { width: 200px; height: auto; image-rendering: pixelated; }
.poster .bname { font-size: 12px; }

/* mail */
.mailtable { width: 100%; }
.mailtable td { padding: 5px 6px; border-bottom: 1px dotted #ccc; vertical-align: middle; }
.mailtable tr.unread .msub { font-weight: bold; }
.mailtable tr:hover { background: #eaf2fb; }
.mava { width: 36px; height: 36px; image-rendering: pixelated; border: 1px solid #888; display: block; }
.msub { font-size: 11px; }
.mfrom { color: #003399; font-size: 10px; white-space: nowrap; }
.mwhen { color: #888; font-size: 10px; white-space: nowrap; text-align: right; }
.mopen { background: #fffef2; border: 1px dashed #c9b07a; padding: 8px; margin: 0 0 8px; }

/* blog */
.bdate { color: #888; font-size: 10px; font-style: italic; margin-top: 0; }
.binline {
  display: block; margin: 10px auto; max-width: 100%;
  image-rendering: pixelated; border: 2px solid #000;
}

/* favorites */
.t8grid { grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); }
.t8 { text-align: center; border: 2px solid #d4a017; background: #fffef2; padding: 6px; }
.t8 img { width: 96px; height: 96px; image-rendering: pixelated; }

/* forum */
.forumtable { width: 100%; }
.forumtable td { padding: 6px; border-bottom: 1px solid #dbe9f7; vertical-align: top; }
.forumtable tr.fh td {
  background: #6699cc; color: #fff; font: bold 10px Verdana, sans-serif;
  padding: 3px 6px;
}
.forumtable tr:not(.fh):hover { background: #eaf2fb; }
.ticon { width: 20px; font-size: 13px; }
.ttitle b { font-size: 12px; }
.treplies { width: 50px; text-align: center; font-weight: bold; color: #1a3d1e; }
.tlast { width: 120px; color: #003399; font-size: 10px; }

/* groups */
.gcard { border: 1px solid #6699cc; background: #eaf2fb; padding: 8px; margin-bottom: 10px; }
.gname { font: bold 13px Verdana, sans-serif; color: #003399; }
.gname .hn { font-weight: normal; color: #666; }
.gstrip { margin: 6px 0; line-height: 0; overflow-x: auto; white-space: nowrap; }
.gstrip img { width: 52px; height: 52px; image-rendering: pixelated; margin-right: 2px; }
.gblurb { font-size: 11px; color: #333; }

/* events */
.ev { display: flex; gap: 10px; border-bottom: 1px dotted #ccc; padding: 8px 0; }
.evdate {
  flex: 0 0 92px; background: #1a3d1e; color: #cee896; text-align: center;
  font: bold 11px Verdana, sans-serif; padding: 10px 4px; align-self: flex-start;
}
.evbody { font-size: 11px; line-height: 1.6; }

/* videos */
.vids { display: grid; grid-template-columns: repeat(auto-fill, minmax(196px, 1fr)); gap: 12px; }
.vthumb { cursor: pointer; text-align: center; }
.vthumb img { width: 100%; height: auto; image-rendering: pixelated; border: 1px solid #888; }
.vthumb:hover img { border-color: #569c3c; }
.buffer {
  margin-top: 10px; background: #000; color: #9ad86a; padding: 10px;
  font: 11px "Courier New", monospace; border: 2px solid #569c3c;
}

/* music */
.tracks { width: 100%; }
.tracks td { padding: 6px; border-bottom: 1px dotted #ccc; vertical-align: middle; }
.tno { width: 24px; font: bold 14px "Courier New", monospace; color: #569c3c; }
.tplay { width: 60px; text-align: right; }

/* classifieds */
.ads { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 10px; }
.ad { border: 1px solid #888; background: #fffef2; padding: 8px; font-size: 11px; }
.ad .adcat {
  display: inline-block; background: #1a3d1e; color: #cee896;
  font: bold 9px Verdana, sans-serif; padding: 1px 6px; margin-bottom: 4px;
}
.ad p { margin: 4px 0; line-height: 1.55; }