@charset 'utf-8';

/*
 * common styles
 */
body
{
	color: #764;
	background-color: #f90;
}

/*
 * site title
 */
header h1
{
	text-align: right;
	font-size: 2.5em;
	font-family: 'Comic Sans MS', cursive;
}

header a
{
	text-decoration: none;
	color: white;
}

/*
 * global menu
 */
nav
{
	height: 2.5em;
	background-color: #965042;
	border: solid 1px #965042;
	margin-bottom: 1em;
}

nav h1
{
	display: none;
}

nav ul
{
	margin: 0;
	padding: 0;
}

nav li
{
	display: table;
	float: left;
	width: 15%;
	height: 2em;		/* the `height' require to fit subitems */
	margin: .25em 2%;
}

nav a
{
	/*
	 * if you browse this site with IE7 or earlier versions,
	 * the menu looks like broken layout,
	 * but you can use it.
	 */
	display: table-cell;
	height: 100%;
	text-align: center;
	vertical-align: middle;
	font-weight: bold;
	text-decoration: none;
	color: white;
}

nav a:hover
{
	color: orange;
}

/*
 * article
 */
article
{
	float: left;
	width: 70%;
	padding: 0 .5em;
	border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	background-color: #ff9;
	font-family: 'メイリオ', 'Meiryo',
		'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro',
		'Osaka',
		'ＭＳ Ｐゴシック', 'MS P Gothic',
		Verdana, Arial, Helvetica, sans-serif;
}

article p
{
	line-height: 1.5em;
}

article a:link
{
	color: #69d;
}

article a:visited
{
	color: #96d;
}

article a:hover
{
	color: orange;
}

article h1
{
	border-bottom: solid 2px #f30;
	font-size: 1.8em;
}

article h1 + p.revision
{
	text-align: right;
	margin-top: -2.8em;
	color: #666;
}

article section
{
	width: 98%;
	margin-left: auto;
}

article h2
{
	margin-top: 2em;
	padding: 5px 0 5px 15px;
	color: #dcdcdc;
	background-color: #552;
	font-size: 1.2em;
}

article h3
{
	font-size: 1em;
}

article ul
{
	padding: 0;
}

article ul li
{
	list-style-type: none;
	border-left: solid .5em #f30;
	padding-left: .5em;
	margin: 1em 0 .5em 1em;
}

article dt
{
	margin: 2em 0 .5em 1em;
	border-left: solid .5em #f30;
	padding-left: .5em;
}

article dd
{
	margin-left: 2em;
}

article pre
{
	overflow: auto;
	margin-left: 2em;
	border: solid 1px #006633;
	padding: .5em;
	color: #006633;
	background-color: white;
	font-family: monospace;
}

article .note
{
	margin: 0 2em;
	padding: 2px 1em;
	background-color: #9f6;
	position: relative;	/* for dog-ear */
}

article .note:before
{
	content: "";
	border-width: 0 16px 16px 0;
	border-style: solid;
	border-color: #ff9 #ff9 #9c9 #9c9;
	background-color: #000;
	position: absolute;
	top: 0;
	right: 0;
}

/*
 * aside
 */
aside
{
	width: 25%;
	float: right;
	margin-bottom: 1em;
	padding: 3px;
	background-color: #fc3;
	border: solid 3px #390;
	font-size: .9em;
}

aside h1
{
	margin: 1px;
	border: solid 1px black;
	padding: 3px;
	color: white;
	background-color: #552;
	font-size: 1em;
}

aside ul
{
	padding: 0 1em;
}

aside ul li
{
	display: block;
	margin-bottom: .5em;
}

aside a:link
{
	color: #69d;
}

aside a:visited
{
	color: #96d;
}

aside a:hover
{
	color: orange;
}

/*
 * footer
 */
footer
{
	clear: both;
	padding: 5em 0 0 2em;
	font-size: .7em;
}