@charset "utf-8";
article,aside,figure,footer,header,nav,section{
	display:block;
}

body{
	background-color:#fff;
}
div{
	margin:0;
	padding:0;
}
a{
	text-decoration:none;
}
ul{
	list-style-type:none;
}
img{
    border:none;
}

div#header{
	position:fixed;
	z-index:1;
	overflow:visible;
	left:0;
	top:0;
	width:800px;
	height:60px;
	background-color:rgba(255,255,255,0.8);
}
div#nav{
	position:fixed;
	z-index:1;
	overflow:auto;
	left:0;
	top:60px;
	bottom:0;
	width:200px;
}
div#article{
	position:absolute;
	left:200px;
	top:60px;
	width:600px;
	background-color:#eee;
	border-radius:10px;
}
div.mark{
	position:relative;
	top:-60px;
}

header#site img.site{
	display:block;
	position:absolute;
	left:12px;
	top:12px;
}
header#site span.site{
	display:block;
	position:absolute;
	left:76px;
	bottom:0;
	line-height:24px;
	font-size:24px;
	color:#000;
}
header#site span.pagetitle{
	display:block;
	position:absolute;
	bottom:0;
	right:20px;
	line-height:24px;
	font-size:24px;
	font-weight:bold;
	color:#666;
	text-shadow:1px 1px 3px #aaa;
}

nav#index{
	margin:0 3px 0 20px;
}
	nav#index>h1{
		display:block;
		margin-top:20px;
		text-align:right;
		font-size:22px;
		color:#ccc;
	}
	nav#index ul{
		padding:0;
	}
	nav#index ul.pages{
		padding-left:10px;
	}
	nav#index ul.sect{
		padding-left:10px;
	}
	nav#index ol.sect{
		padding:0;
		list-style:none;
		counter-reset:li;
	}
		nav#index ol.sect>li{
			position:relative;
			padding-left:26px;
		}
		nav#index ol.sect>li:before{
			position:absolute;
			left:4px;
			top:0;
			width:24px;
			font-size:12px;
			text-align:center;
			background-color:#fff;
			color:#888;
			font-family:sans-serif;
			content:counter(li);
			counter-increment:li;
		}
	nav#index li.folder>span{
		display:block;
		text-align:center;
		font-size:16px;
		color:#888;
	}
	nav#index li>a{
		display:block;
		margin:2px;
		border-left:2px solid #eee;
		border-bottom:1px solid #eee;
		padding-left:4px;
		color:#111
	}
		nav#index ul.chapter>li>a{
			font-size:18px;
			color:#666;
		}
		nav#index ul.pages>li>a{
			font-size:14px;
			color:#444;
		}
		nav#index ul.sect>li>a,nav#index ol.sect>li>a{
			font-size:12px;
			color:#222;
		}
	nav#index li>a:hover{
		background-color:#eee;
	}
	nav#index li.current{
		background-color:#ddd;
	}
#index span.exit{
    display:block;
    font-size:12px;
    color:#666;
}
#index span.exit:hover{
    background-color:#eee;
}


article#main{
	margin:20px 20px 20px 10px;
}
	article#main{
		font-size:14px;
		line-height:1.5em;
		color:#333;
	}
	article#main>p.summary{
		display:block;
		margin:30px 40px 30px 30px;
		border:1px solid #bbb;
		padding:20px 40px;
		background-color:#fff;
		border-radius:20px;
		box-shadow:1px 1px 5px #aaa;
	}
	article#main>section{
		border-right:1px solid #bbb;
		border-bottom:1px solid #bbb;
		border-left:1px solid #bbb;
		background-color:#fff;
		border-radius:5px;
		box-shadow:1px 1px 5px #aaa;
	}
	article#main>section>h1{
		margin-right:-1px;
		margin-left:-1px;
		border-top:1px solid #bbb;
		border-right:1px solid #bbb;
		border-left:1px solid #bbb;
		padding-top:18px;
		padding-right:30px;
		text-align:right;
		background-color:#ddd;
		color:#fff;
		font-size:22px;
 		border-radius:5px 5px 0 0;
        text-shadow:1px 2px 3px #aaa;
	}
	article#main>section>p{
		margin:20px;
		text-indent:1em;
	}
	article#main>section>p.summary{
		display:block;
		margin:20px 40px 20px 30px;
		border:1px solid #ddd;
		padding:20px 30px;
		background-color:#fff;
		color:#444;
		border-radius:20px;
	}
	article#main>section>span{
		margin:20px;
	}
	article#main span.smaller{
		font-size:0.875em;
	}
    article#main a{
        margin:-1px;
        border:1px solid #ccc;
        color:#000;
        border-radius:3px;
    }
    article#main a:hover{
		background-color:#eee;
        text-decoration:underline;
    }
	article#main>section>ul,article#main>section>ol,article#main>section>dl{
		margin:10px 20px 30px 20px;
	}
    article#main li,article#main dt{
        margin-left:16px;
        margin-right:30px;
    }
    article#main li>a,article#main dt>a{
        color:#444;
    }
    article#main li>a:hover,article#main dt>a:hover{
        color:#000;
        text-decoration:underline;
    }
    article#main dt{
        font-size:16px;
        font-weight:bold;
    }
    article#main dd{
        margin-top:5px;
        margin-bottom:15px;
        color:#555;
    }
    article#main .warning{
        background-color:#fdd;
    }
    article#main .quote{
        color:#040;
        background-color:#EFD;
    }
    article#main .keytop{
        color:#008;
        background-color:#DEF;
    }
    article#main .keyin{
        color:#00D;
    }
    article#main>section>img,article#main>section>canvas{
		margin:0 20px;
    }
    article#main>section>p>img,article#main>section>p>canvas{
		margin:10px;
    }
    .floatleft{
        float:left;
    }
    .clearleft{
        clear:left;
    }
    .floatright{
        float:right;
    }
    .clearright{
        clear:right;
    }
    .afterclear:after{
        content:"";
        clear:both;
        display:block;
    }