body,html {
	color: #060;
	background-color: #f3ffe0;
	margin: 0;
	scrollbar-base-color: #f3ffe0;
	scrollbar-face-color: #f3ffe0;
	scrollbar-track-color: #f3ffe0;
	scrollbar-arrow-color: #060;
	scrollbar-3dlight-color: #060;
	scrollbar-highlight-color: #f3ffe0;
	scrollbar-shadow-color: #f3ffe0;
	scrollbar-darkshadow-color: #060;
}

a:link {
	color: #060;
	background-color: #fff;
	text-decoration: none;
}

a:visited {
	color: #060;
	background-color: #fff;
	text-decoration: none;
}

a:active {
	color: #F00 background-color :   #fff;
}

a:hover {
	color: #060;
	background-color: #afa;
	border-style: none none solid none;
	border-color: #3C3;
	border-width: thin;
}

ul li {
	list-style-image: url("images/list-symbol.png");
	margin-bottom: 0.7em;
}

ol li {
	list-style-type: circle;
	margin-bottom: 0.5em;
	margin-left: 1.3em;
}

h2 {
	color: #360;
	background-color: #FFF;
	border-bottom-style: solid;
	border-bottom-color: #390;
	margin-top: 0.8em;
}

h3 {
	color: #693;
	background-color: #FFF;
	font-family: verdana, arial, helvetica, sans-serif;
	border-bottom-style: solid;
	border-bottom-color: #3C3;
	border-bottom-width: thin;
	margin-bottom: -0.5em;
}

p.menu {
	margin-left: 1em;
}

p.title {
	color: #000;
	text-indent: 1em;
}

.button {
	color: #000;
	background-color: #f3ffe0;
}

p.footer {
	font-size: x-small;
}

p.honbun {
	text-indent: 1em;
	margin-left: 25px;
	margin-right: 25px;
}

p.list-bun {
	margin-left: 1.3em;
	margin-top: 0.3em;
}

p.simple {
	text-indent: 1em;
	margin-left: 1em;
	line-height: 1.2;
}
/* Shown by lesson-left.php when a lesson has no paragraphs. Without it, an
   unloaded database and a crashed page look the same. */
p.asunaro-empty {
	margin: 1.5em 25px;
	color: #666;
	line-height: 1.4;
}

/* The 2001 frame, as the two reading panes use it.
 *
 * Every other page draws this frame in a table of a fixed 700 pixels, where
 * the four columns -- a 35-pixel border strip, two content columns, another
 * 35-pixel strip -- all fit inside the width the author chose. left.php and
 * lesson-left.php instead set the table to width="100%", so it takes whatever
 * the frame is given, and in automatic table layout a browser hands the
 * surplus to EVERY column in proportion to its specified width. The border
 * strips are not exempt: past roughly 1,300 pixels of pane each one is wide
 * enough to draw its 35-pixel-wide background image a second time, and the
 * frame appears doubled down both sides.
 *
 * So the column model has to say which column absorbs the surplus, which the
 * markup never did. Declaring it once in a <colgroup> is the mechanism HTML
 * has for exactly this, and it leaves every <td> alone: column three stays
 * shrink-to-fit for the UP arrow it holds, and column two takes the rest.
 *
 * Not table-layout: fixed, which also stops the doubling but re-wraps the
 * content at narrow widths -- under fixed layout the two content columns
 * split the remaining space evenly instead of column two taking it.
 */
col.frame-edge {
	width: 35px;
}

col.frame-fill {
	width: 100%;
}