@charset "UTF-8";

/*

copyright and credits

	Shiira Project
	designed by: Kei SASAKI

	you may take and use elements of this style sheets and any imported files.
	but the unique combination of layout, font styles, colours and etc. is copyrighted.
	you may not use any of the graphical elements on this site.

	copyright: 2004-2005 Shiira Project and Kei Sasaki. All rights reserved.

	last updated: December 20, 2005



table of contents

	1. universal reset
	2. page layout
		: basement
		: language select buttons
		: hmdt link
		: title
		: navigation
		: main
		: extra
		: bottom
	3. contents layout
		: home
		: screenshots
		: downloads
		: icons
	4. link elements
	5. hidden elements
	6. other

*/





/* ------------------------------ */
/* 1. universal reset */
/* ------------------------------ */

* {
	margin: 0;
	padding: 0;
}





/* ------------------------------ */
/* 2. page layout */
/* ------------------------------ */

	/* basement */

body#pagetop {
	margin: 0;
	padding: 0;
	color: #333;
	background: #666 url(img/bg.gif) repeat-y 50% 0;
	font-size: 12px;
	line-height: 20px;
	font-weight: normal;
	font-family: 'Lucida Grande','Lucida Sans Unicode','ヒラギノ角ゴ Pro W3',HiraKakuPro-W3,'MS Pゴシック','MSゴシック',Helvetica,Verdana;
	text-align: center;
}

div#wrapper {
	width: 746px;
	margin: 0 auto 0 auto;
	background: url(img/bg_content.gif) repeat-y 50% 0;
	text-align: left;
}

div#header {
	height: 28px;
	padding: 10px 4px 0 4px;
	background: url(img/bg_title.jpg) no-repeat 0 0;
}

div#top {
	clear: both;
}

div#content {
	background: url(img/bg_content_top.gif) no-repeat 50% 0
}

div#main {
	width: 460px;
}
div#main, #dummy {
	float: left;
	padding: 14px 0 0 30px;
}

div#extra {
	width: 186px;
}
div#extra, #dummy {
	float: right;
	padding: 8px 20px 0 0;
	font-size: 10px;
	line-height: 16px;
}

div#bottom {
	clear: both;
	height: 28px;
	padding: 28px 0 0 0;
	color: #333;
	background: url(img/bg_bottom.gif) no-repeat 0 0;
}

	/* language select buttons */

ul#lang {
	float: left;
	width: 150px;
	height: 20px;
	background: url(img/bg_lang.gif) no-repeat 0 0;
	list-style: none;
}
ul#lang li,
ul#lang li a {
	display: block;
	height: 20px;
}
ul#lang li {
	float: left;
}
li#jp a {
	width: 75px;
}
li#en a {
	width: 65px;
}

	/* hmdt link */

p#hmdt {
	float: right;
	width: 60px;
	height: 20px;
	background: url(img/bg_hmdt.gif) no-repeat 0 0;
}

p#hmdt a {
	display: block;
	width: 60px;
	height: 20px;
}
p#hmdt a:active,
p#hmdt a:hover {
	background: url(img/bg_hmdt.gif) no-repeat 0 -20px;
}

	/* title */

h1 {
	height: 270px;
	background: url(img/bg_title.jpg) no-repeat 0 -38px;
}
h1 a {
	display: block;
	float: right;
	width: 220px;
	height: 140px;
}
h1 a:link, h1 a:visited, h1 a:active, h1 a:hover {
	background: transparent;
}

	/* main */

div#main div.container {
	margin-top: 20px;
	padding-bottom: 8px;
}

div#main div.section {
	padding-top: 9px;
}

div#main div.sectitle {
	margin: 13px 0 7px 3px;
	border-left: 3px solid #84BF36;
	padding-left: 4px;
}

div#main div.sectitle p {
	padding: 0 3px 0 3px;
	color: #84BF36;
	font-size: 11px;
	text-transform: uppercase;
}

div#main h3 {
	padding: 0 3px 0 3px;
	color: #408513;
	font-size: 16px;
	font-weight: normal;
}

div#main h4 {
	padding: 7px 3px 4px 3px;
	color: #000;
	font-size: 14px;
}

div#main .sub {
	color: #666;
	font-size: 12px;
	font-weight: normal;
}

div#main div.secbody p,
div#main div.secbody ul {
	padding: 7px 3px 7px 3px;
}

div#main ul {
	margin-left: 20px;
	list-style-image: url(img/list_forest.gif);
}
div#main ul.dl {
	list-style-image: url(img/list_ocean.gif);
}

div#main a.dl {
	margin-left: 8px;
	padding-left: 14px;
	background: url(img/list_ocean.gif) no-repeat 0 60%;
}

table {
	margin: 7px 3px 7px 3px;
}
table td {
	border-bottom: 1px solid #E2E2E2;
	padding: 3px 8px 2px 8px;
	background: #F2F2F2;
	font-size: 12px;
	line-height: 18px;
	font-family: 'Lucida Grande','Lucida Sans Unicode','ヒラギノ角ゴ Pro W3',HiraKakuPro-W3,'MS Pゴシック',Helvetica,Verdana;
}
table tr.toprow td,
table td.col1 {
	border-bottom: 1px solid #C9C9C9;
	background: #D9D9D9;
}
table tr.toprow td {
	font-weight: bold;
}
table td.col1 {
	text-align: center;
}
table td.col2 {
	border-bottom: 1px solid #D7D7D7;
	background: #E7E7E7;
	text-align: center;
}
table td.col3 {
	text-align: center;
}
table td.col4 {
	border-bottom: 1px solid #D7D7D7;
	background: #E7E7E7;
	text-align: center;
}
table td.col5 {
	text-align: center;
}
table td.col6 {
	border-bottom: 1px solid #D7D7D7;
	background: #E7E7E7;
	text-align: center;
}

pre,
p.command {
	margin: 7px 3px 7px 3px;
	border: 1px solid #E2E2E2;
	padding: 8px 12px 8px 12px;
	background: #F2F2F2;
	color: #666;
	font-size: 12px;
	line-height: 17px;
}

	/* extra */

div#extra h2,
div#extra h3 {
	padding: 9px 3px 5px 3px;
}

div#extra p,
div#extra ul {
	padding: 7px 3px 7px 3px;
}

div#extra h2 {
	color: #000;
	font-size: 13px;
	text-shadow: 0 1px #FFF;
}

div#extra h3 {
	font-size: 12px;
}

div#extra div.section {
	margin-top: 11px;
}

div#extra p.adimg {
	text-align: center;
}

div#extra ul {
	margin-left: 16px;
	list-style-image: url(img/list_grape_side.gif);
}
div#extra ul.dl {
	list-style-image: url(img/list_ocean_side.gif);
}

	/* bottom */

li#copyright {
	float: left;
	width: 466px;
	list-style: none;
	font-size: 10px;
	line-height: 10px;
	text-align: center;
}
li#copyright, #dummy {
	padding-left: 140px;
}

li#designedby {
	float: right;
	width: 110px;
	height: 10px;
	list-style: none;
}

li#designedby a {
	display: block;
	width: 110px;
	height: 10px;
}
li#designedby a:link,
li#designedby a:visited,
li#designedby a:active,
li#designedby a:hover {
	border: none;
	background: transparent;
	text-decoration: none;
}




/* ------------------------------ */
/* 3. contents layout */
/* ------------------------------ */
	
	/* home */

div#intro h2 {
	height: 24px;
	background: url(img/shead_intro.gif) no-repeat 0 100%;
}

div#whatsnew h2 {
	height: 24px;
	background: url(img/shead_news.gif) no-repeat 0 100%;
}

div#updateinfo li {
	padding: 6px 0 6px 0;
}
div#updateinfo li .date {
	display: block;
	color: #408513;
	font-size: 12px;
	font-weight: bold;
}

div#freedl ul {
	margin: 0;
	padding: 4px 0 4px 0;
	list-style: none;
}
div#freedl ul li a {
	display: block;
	height: 38px;
}

	/* screenshots */

div.screenshot div#main div.container h2 {
	height: 21px;
	padding: 0 0 0 3px;
	font-size: 20px;
	font-weight: normal;
	line-height: 20px;
	text-indent: 0;
}

	/* downloads */

div#dlfull h2 {
	height: 24px;
	background: url(img/shead_downloadtop.gif) no-repeat 0 100%;
}

div#languages h2 {
	height: 24px;
	background: url(img/shead_languages.gif) no-repeat 0 100%;
}

	/* icons */

div#iconstop h2 {
	height: 24px;
	background: url(img/shead_iconstop.gif) no-repeat 0 100%;
}

div#gallery h2 {
	height: 24px;
	background: url(img/shead_gallery.gif) no-repeat 0 100%;
}

div#install h2 {
	height: 24px;
	background: url(img/shead_install.gif) no-repeat 0 100%;
}

div#custom h2 {
	height: 24px;
	background: url(img/shead_custom.gif) no-repeat 0 100%;
}




/* ------------------------------ */
/* 4. link elements */
/* ------------------------------ */

div#header a:link,
div#header a:visited,
div#header a:active,
div#header a:hover,
div#top a:link,
div#top a:visited,
div#top a:active,
div#top a:hover {
	border: none;
	text-decoration: none;
}

a:link,
a:visited {
	border-bottom: 1px solid #70C0CC;
	color: #128099;
	text-decoration: none;
}

a:active,
a:hover {
	border-bottom: 1px solid #000;
	color: #000;
	background: #E0E0E0;
	text-decoration: none;
}

div#extra a:active,
div#extra a:hover {
	background: #CCC;
}

div#freedl ul li a:link,
div#freedl ul li a:visited,
div#freedl ul li a:active,
div#freedl ul li a:hover {
	border: none;
	background: transparent url(img/link_freedl.gif) no-repeat 0 0;
}



/* ------------------------------ */
/* 5. hidden elements */
/* ------------------------------ */

h1 a,
ul#lang li,
ul#lang li a,
p#hmdt a,
ul#menu li a,
div.container h2,
div#freedl ul li a,
li#designedby a {
	font-size: 1px;
	line-height: 1px;
	text-indent: -9999px;		
}




/* ------------------------------ */
/* 6. others */
/* ------------------------------ */

strong {
	color: #000;
	font-weight: bold;
}