/* Front page. Values measured from 4chan's live front page (computed styles, 2026-09-18); no 4chan assets used.
   The background fade is vichan's own Yotsuba fade. */
html, body, div, h1, h2, h3, ul, li, p { margin: 0; padding: 0; }
li { list-style: none; }
img { border: 0; }

body {
	background: #ffe url('img/fade-yotsuba.png') repeat-x 50% 0%;
	color: #800;
	font: 13px/1.231 arial, helvetica, clean, sans-serif;
	text-align: center;
}
#doc { width: 750px; margin: auto; text-align: left; }

#hd { height: 120px; }
/* logo + wordmark side by side in a 120px band, like the 4chan front page header */
#logo-fp { height: 120px; text-align: center; overflow: hidden; }
#logo-fp a { display: inline-flex; align-items: center; gap: 6px; height: 120px; color: #800; text-decoration: none; }
#logo-fp img { width: 100px; height: 100px; }
#logo-fp span { font-size: 46px; font-weight: 700; letter-spacing: -2px; }
#announce .site-ca-line { margin: 0 0 4px; }
#announce .site-ca-line a { color: #000; text-decoration: none; font-family: monospace; }

.box-outer { background: #fff; border: 1px solid #800; margin-bottom: 6.5px; padding-bottom: 6.5px; }
.boxbar { background: #fca; color: #800; height: 26px; line-height: 26px; padding-left: 6.5px; }
.boxbar h2 { font-size: 17.03px; font-weight: 700; }
.boxcontent { font-size: 12.09px; line-height: 15.717px; padding: 3px 6px 0; overflow: hidden; }
.boxcontent a { color: #800; text-decoration: none; }
.boxcontent a:hover { color: #e00; }

#announce { border-color: #000; }
#announce .boxbar { background: #800; color: #fff; }
#announce .boxcontent { color: #000; line-height: 18.135px; }
#announce .boxcontent p { margin-bottom: 9px; }
#announce .boxcontent a { color: #00e; text-decoration: underline; }

#boards .column { float: left; width: 145px; }
#boards h3 { display: inline; font-size: 12.09px; font-weight: 700; text-decoration: underline; }

#popular-threads .boxcontent { text-align: center; }
.c-thread { display: inline-block; vertical-align: top; width: 175px; margin: 5px 0 10px; padding: 5px 0 3px; overflow: hidden; text-align: center; }
.c-board { font-weight: 700; margin-bottom: 5px; overflow: hidden; }
.c-thumb { border: 1px solid #800; max-width: 150px; max-height: 150px; }
.c-teaser { margin-bottom: 5px; padding: 0 2px; color: #000; }
.c-teaser b { color: #0f0c5d; }

#site-stats .boxcontent { text-align: center; }
.stat-cell { display: inline-block; width: 242px; }
.best-call { margin: 4px 0 2px; color: #000; }
.best-call .poster_id { font-weight: 700; }
.best-call .up { color: #789922; }
.best-call .down { color: #af0a0f; }
#site-stats .boxcontent .best-call a { text-decoration: underline; }

#ft { clear: both; font-size: 12.09px; margin-top: 12px; }
#ft ul { display: table; margin: 0 auto; border-top: 1px solid #800; }
#ft ul li { float: left; margin-top: -1px; padding: 2px 12px 4px; background: #ffe; border-top: 1px solid #800; text-align: center; }
#ft a { color: #800; text-decoration: none; }
#ft a:hover { color: #e00; }
#copyright { margin: 11px 0; font-size: 11px; text-align: center; }
#copyright a { text-decoration: underline; }