@import url("base.css");
/* social book mark */
.sbm * {
	vertical-align: bottom;;
}

article {
	margin:24px;
	border-bottom:dashed 1px #2759d0;
	font-size:12pt;
	clear:both;
}
article>section {
	min-height:560px;
}
article>section>figure {
	top:-100px;
	width:400px;
	float:right;
	position:static;
}

/* speach-balloon */
article>section>h3 {
	float:left;
	margin: 20px 20px 20px 40px;
	border-radius: 5px;
	box-shadow: 0px 1px 1px #4c4c4c;
	padding: 4px 8px;
	position: relative;
	border: 1px #ddd solid;
}
article>section p {
	clear:left;
}
/* charactor */
article>section>h3:before {
	position: absolute;
	top: 0px;
	left: -40px;
}
article>section>h3.base:before { content: url("../ICON/tonbi/base.png");}
article>section>h3.shout:before { content: url("../ICON/tonbi/shout.png");}
article>section>h3.book:before { content: url("../ICON/tonbi/book.png");}
article>section>h3.game:before { content: url("../ICON/tonbi/game.png");}
article>section>h3.paint:before { content: url("../ICON/tonbi/paint.png");}
article>section>h3.program:before { content: url("../ICON/tonbi/program.png");}
article>section>h3:after{
	content: "";  
	position: absolute;
	top: 10px;
	left: -17px;
	width: 0;
	height: 0;
	border-width: 4px 8px;
	border-style: solid;
	border-color: transparent;
	border-right-color: #ddd;
}


/* navigation */
header>nav {
	background: -moz-linear-gradient( white, white, white, white, #eee );
	background: -webkit-gradient( linear, left top, left bottom, from(white),color-stop(0.8, white), to(#eee) ); 
}
footer>nav {
	background: -moz-linear-gradient( #eee, white, white, white, white );
	background: -webkit-gradient( linear, left top, left bottom, from(#eee),color-stop(0.2, white), to(white) ); 
}

/* tabbed menu */
nav>ul {
	display: block;
	margin: 0px;
	padding: 0px;
	position: relative;
}

nav>ul>li {
	display: inline-block;
	background-color: #eee;
	border: 1px silver solid;
	padding: 8px;
	margin: 0px;
}

header>nav>ul { top: 2px;}
footer>nav>ul { top: -2px;}
header>nav>ul>li { border-radius: 9px 9px 0px 0px;}
footer>nav>ul>li { border-radius: 0px 0px 9px 9px;}

nav>ul>li.currentpage { background-color :white;}
header>nav>ul>li.currentpage { border-bottom: 2px white solid;}
footer>nav>ul>li.currentpage { border-top: 2px white solid;}

/* cascade menu */
nav menu {
	z-index:255;
	border: 1px silver solid;
	border-radius: 0px 0px 9px 9px;
	background-color:white;
	box-shadow: 0px 3px 3px #4c4c4c;
}
nav menu li {
	margin:0px;
	padding:2px;
	list-style:none;
}
nav menu a {
	display:block;
	margin:0px;
	padding:4px;
}

nav menu hr {
	margin:0;
}

nav menu a:hover {
	background-color:#b3b3b3;
}

nav menu {
	display:none;
	position:absolute;

	margin-top:0;
	padding:0;
}

nav li:hover menu {
	display:block;
}