/* hole.css  --  rebuilt 11/2013, patched ever since */
/* everything here is hand-tuned. do not reformat. */
/* yes the layout breaks under 800px. i know. */

body {
	background-color: #070804;
	background-image:
		repeating-linear-gradient(0deg,
			rgba(0,0,0,.55) 0px, rgba(0,0,0,.55) 1px,
			transparent 1px, transparent 3px),
		repeating-conic-gradient(#080a05 0% 25%, #0b0d07 0% 50%);
	background-size: auto, 4px 4px;
	color: #a29e86;
	font-family: Verdana, Geneva, Arial, sans-serif;
	font-size: 11px;
	image-rendering: pixelated;
	line-height: 1.5;
	margin: 0;
	padding: 14px 0 48px 0;
}

#wrap { width: 764px; margin: 0 auto; }

/* ---------- banner ---------- */

#banner {
	background: #030402;
	background-image:
		repeating-linear-gradient(0deg,
			rgba(0,0,0,.6) 0px, rgba(0,0,0,.6) 1px,
			transparent 1px, transparent 2px),
		repeating-linear-gradient(115deg,
			#0a0c05 0px, #0a0c05 7px,
			#060803 7px, #060803 14px);
	box-shadow:
		inset 0 0 0 1px #1d2113,
		0 0 0 3px #030402,
		0 0 0 5px #2e3320;
	margin-bottom: 5px;
	padding: 16px 18px 13px 18px;
}

#banner h1 {
	color: #c9b83a;
	font-family: "Courier New", Courier, monospace;
	font-size: 27px;
	font-weight: bold;
	letter-spacing: -1.5px;
	line-height: 1.1;
	margin: 0;
	text-shadow:
		2px 0 0 #8e2b16,
		-1px 0 0 #050603,
		0 2px 0 #050603;
	text-transform: uppercase;
}

#banner h1 a { color: #c9b83a; text-decoration: none; }
#banner h1 a:hover { color: #e6d24a; }

#banner .sub {
	color: #5f6349;
	font-family: "Courier New", Courier, monospace;
	font-size: 10px;
	letter-spacing: .5px;
	margin: 5px 0 0 0;
}

#banner .rule {
	color: #2e3320;
	font-family: "Courier New", Courier, monospace;
	font-size: 10px;
	letter-spacing: -1px;
	margin: 6px 0 0 0;
	overflow: hidden;
	white-space: nowrap;
}

/* ---------- nav ---------- */

#navbar {
	background: #12150b;
	background-image: repeating-linear-gradient(90deg,
		rgba(0,0,0,.25) 0px, rgba(0,0,0,.25) 2px,
		transparent 2px, transparent 4px);
	box-shadow:
		inset 0 0 0 1px #2e3320,
		0 0 0 2px #030402;
	font-family: "Courier New", Courier, monospace;
	font-size: 11px;
	letter-spacing: 1px;
	padding: 5px 16px;
	text-align: center;
}

#navbar a { padding: 0 4px; }
#navbar .sep { color: #2e3320; }

/* ---------- columns ---------- */

#cols { display: table; margin-top: 11px; width: 100%; }

#side {
	display: table-cell;
	padding-right: 11px;
	vertical-align: top;
	width: 174px;
}

#main {
	background: #0c0e07;
	background-image: repeating-conic-gradient(#0c0e07 0% 25%, #0e1009 0% 50%);
	background-size: 4px 4px;
	box-shadow:
		inset 0 0 0 1px #1d2113,
		0 0 0 2px #030402,
		0 0 0 4px #2e3320;
	display: table-cell;
	padding: 16px 19px 22px 19px;
	vertical-align: top;
}

/* ---------- sidebar boxes ---------- */

.box {
	background: #0c0e07;
	box-shadow:
		inset 0 0 0 1px #1d2113,
		0 0 0 2px #030402,
		0 0 0 3px #2e3320;
	margin-bottom: 13px;
	padding: 8px 9px 10px 9px;
}

.box h3 {
	background: #23281a;
	background-image: repeating-linear-gradient(90deg,
		rgba(0,0,0,.3) 0px, rgba(0,0,0,.3) 1px,
		transparent 1px, transparent 3px);
	box-shadow: inset 0 0 0 1px #3b4127;
	color: #c9b83a;
	font-family: "Courier New", Courier, monospace;
	font-size: 10px;
	letter-spacing: 1.5px;
	margin: -8px -9px 8px -9px;
	padding: 3px 9px;
	text-shadow: 1px 0 0 #050603;
	text-transform: uppercase;
}

.box ul { list-style: none; margin: 0; padding: 0; }
.box li { padding: 1px 0; }
.box li:before {
	color: #4a5132;
	content: "\25AA ";
	font-family: "Courier New", Courier, monospace;
}

.btn88 {
	background: #030402;
	background-image: repeating-linear-gradient(45deg,
		#0a0c05 0px, #0a0c05 3px,
		#050703 3px, #050703 6px);
	box-shadow: inset 0 0 0 1px #2e3320;
	color: #6d7255;
	display: block;
	font-family: "Courier New", Courier, monospace;
	font-size: 9px;
	line-height: 1.25;
	margin-bottom: 5px;
	padding: 5px 3px;
	text-align: center;
	text-shadow: 1px 0 0 #000;
	width: 88px;
}

/* ---------- headings ---------- */

#main h2 {
	background: linear-gradient(90deg, #1a1e11 0%, transparent 78%);
	border-bottom: 2px solid #2e3320;
	color: #c9b83a;
	font-family: "Courier New", Courier, monospace;
	font-size: 15px;
	font-weight: bold;
	letter-spacing: .5px;
	margin: 26px 0 10px 0;
	padding: 2px 0 3px 5px;
	text-shadow: 1px 1px 0 #050603, 2px 0 0 rgba(142,43,22,.5);
	text-transform: uppercase;
}

#main h2:first-child { margin-top: 0; }

#main h3 {
	color: #a83a1e;
	font-size: 12px;
	letter-spacing: .3px;
	margin: 18px 0 5px 0;
	text-shadow: 1px 1px 0 #050603;
}

#main h3:before { color: #4a5132; content: "\2593\2592 "; }

p { margin: 0 0 12px 0; }

/* ---------- links ---------- */

a         { color: #7fae3d; text-shadow: 1px 0 0 rgba(0,0,0,.8); }
a:visited { color: #9a6fb5; }
a:hover   { background: #23281a; color: #cbe87a; }
a:focus   { outline: 1px dotted #c9b83a; outline-offset: 1px; }

hr {
	background: none;
	border: none;
	border-top: 1px dashed #2e3320;
	border-bottom: 1px solid #12150b;
	height: 2px;
	margin: 18px 0;
}

/* ---------- update log ---------- */

.log {
	border-left: 3px solid #23281a;
	margin-bottom: 15px;
	padding-left: 9px;
}

.log .date {
	color: #6d7255;
	font-family: "Courier New", Courier, monospace;
	font-size: 10px;
	letter-spacing: .5px;
	text-shadow: 1px 0 0 #050603;
}

/* ---------- character record ---------- */

.rec {
	background: #050603;
	background-image: repeating-linear-gradient(0deg,
		rgba(0,0,0,.5) 0px, rgba(0,0,0,.5) 1px,
		transparent 1px, transparent 3px);
	box-shadow:
		inset 0 0 0 1px #1d2113,
		-4px 0 0 0 #8e2b16,
		0 0 0 2px #030402;
	font-family: "Courier New", Courier, monospace;
	font-size: 11px;
	line-height: 1.75;
	margin: 14px 0 18px 4px;
	padding: 10px 13px;
}

.rec b { color: #5f6349; font-weight: normal; }

/* ---------- callouts ---------- */

.warn {
	background: #1a0e07;
	background-image: repeating-linear-gradient(45deg,
		rgba(142,43,22,.12) 0px, rgba(142,43,22,.12) 4px,
		transparent 4px, transparent 8px);
	box-shadow: inset 0 0 0 1px #8e2b16, 0 0 0 2px #030402;
	color: #bf8563;
	margin: 15px 0;
	padding: 9px 11px;
}

.spoiler {
	background: #050603;
	box-shadow: inset 0 0 0 1px #23281a;
	margin: 14px 0;
	padding: 9px 11px;
}

ul.plain { list-style: none; padding-left: 4px; }
ul.plain li {
	margin-bottom: 6px;
	padding-left: 14px;
	position: relative;
}
ul.plain li:before {
	color: #4a5132;
	content: "\25AA";
	left: 0;
	position: absolute;
}

/* ---------- footer ---------- */

#foot {
	border-top: 2px solid #2e3320;
	color: #4e523c;
	font-family: "Courier New", Courier, monospace;
	font-size: 10px;
	line-height: 1.7;
	margin-top: 16px;
	padding: 10px 4px;
	text-align: center;
	text-shadow: 1px 0 0 #030402;
}

#foot a { color: #5f6349; }

.ascii {
	color: #23281a;
	font-family: "Courier New", Courier, monospace;
	font-size: 10px;
	letter-spacing: -1px;
	line-height: 1;
	margin: 10px 0;
	overflow: hidden;
	white-space: nowrap;
}
