.hide{
	display: none;
}

@media print {
	.hide-on-print {
		display: none;
	}
}

body{
	color: black;
	background-image: url(bg.png);
	background-color: #eee;

	margin: .5em;
	padding-top: 2em;
	padding-right: 4em;
	padding-bottom: 4em;
	padding-left: 2em;
}

h1{
	text-align: center;
}

a:link {
	color: blue;
}

a:visited {
	color: purple;
}

/* 主にフッタになるもの */

div.author {
}

div.validlogo {
	text-align: right;
}

@media print {
	div.validlogo {
		display: none;
	}
}

/* メニュー関連 */

@media all {
	div.menugroup {
		display: none;
	}
}

@media screen {
	div.menugroup {
		display: block;
	}

	body {
		padding-right: 10em;
		padding-left: 2em;
	}
}

/* IEでは A > Bが効かないことを利用。邪道。 */
/* 他の解決法があったら誰か教えて〜 */
div.menugroup {
	position: absolute;
	top: 1em;
	right: 1em;

	padding: 0;
	margin: 0;

	width: 8em;
}

/* で、IE以外のもの用設定 */
body > div.menugroup {
/* div.menugroup { */
	position: fixed;
	top: 1em;
	right: 1em;

	padding: 0;
	margin: 0;

	width: 8em;
	/* width: auto; */
}

div.menu{
	padding: 4px;

	margin: 1ex 0px;

	background-image: url("menu_back.png"); 
	background-attachment: scroll;

	border: 3px outset #ccf;
	font-size: 75%;
}

div.menu span{
	text-align: center;
}

div.menu span.menutitle{
	display: block;
	line-height: 110%;
	margin: 2px 2px;
	background-image: url("menutitle_back.png"); 
	background-attachment: scroll;
	border: 2px groove #ccf;
	font-weight: bold;
}

div.menu span.menuitem{
	display: block;
	margin: 2px 4px;
	border-bottom: 2px groove #ccf;
}

div.menu span.menuitem-sel{
	display: block;
	margin: 2px 4px;
	border-bottom: 2px groove #ccf;
	font-weight: bold;
	background-image: url("menu_back_sel.png"); 
	background-attachment: scroll;
}

div.menu span.menuitem-sel:before {
	content: ">>";
}

div.menu span.menuitem-sel:after {
	content: "<<";
}

div.menu a:hover {
	color: blue;
	background: #ff0;
}

div.menu a:active{
	color: red;
	background: #ff8;
}