/*
Theme Name: Toukinohi
Author: Toukinohi Web Team
Template: twentyeleven
Version: 0.1
*/

@import url('../twentyeleven/style.css');
@import url('style.css');

/* Search Form */
#branding #searchform {
	position: absolute;
	top: 20px;
	right: 30px;
	text-align: right;
}
#branding #searchform div {
	margin: 0;
}
#branding #s {
	float: right;
	-webkit-transition-duration: 400ms;
	-webkit-transition-property: width, background;
	-webkit-transition-timing-function: ease;
	-moz-transition-duration: 400ms;
	-moz-transition-property: width, background;
	-moz-transition-timing-function: ease;
	-o-transition-duration: 400ms;
	-o-transition-property: width, background;
	-o-transition-timing-function: ease;
	width: 72px;
}
#branding #s:focus {
	background-color: #f9f9f9;
	width: 196px;
}
#branding #searchsubmit {
	display: none;
}
#branding .only-search #searchform {
	top: 5px;
	z-index: 1;
}
#branding .only-search #s {
	background-color: #666;
	border-color: #000;
	color: #222;
}
#branding .only-search #s,
#branding .only-search #s:focus {
	width: 85%;
}
#branding .only-search #s:focus {
	background-color: #bbb;
}
#branding .with-image #searchform {
	top: auto;
	bottom: -27px;
	max-width: 195px;
}
#branding .only-search + #access div {
	padding-right: 205px;
}

/* Assistive text */
.assistive-text {
	position: absolute !important;
	clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
	clip: rect(1px, 1px, 1px, 1px);
}
#access a.assistive-text:active,
#access a.assistive-text:focus {
	background: #eee;
	border-bottom: 1px solid #ddd;
	color: #1982d1;
	clip: auto !important;
	font-size: 12px;
	position: absolute;
	text-decoration: underline;
	top: 0;
	left: 7.6%;
}


/* =top navigation
----------------------------------------------- */

#top-navi {
	position:relative;
	clear:both;
	z-index:0;
	}
#top-navi ul,li {
	margin:0;
	padding:0;
	list-style:none;
	}
#top-navi .navi {
	float:left;
	}
#top-navi .navi-image {
	width:600px;
	margin-right:20px;	
	float:left;
	background:#eee;
	}
#top-navi .navi-image img {
	border:none;
	}
#top-navi ul li > a {
	display:block;
	width:298px;
	height:80px;
	margin-left:30px;
	border: solid 1px;
	border-color:#ddd #ddd #fff #fff;
	color:#333;
	line-height:80px;
	text-align:center;
	}
#top-navi ul li > a {
	background: #eee;
	/* Webkit */
	background: -webkit-gradient(linear,left top,left bottom,from(#fff),to(#ccc));
	/* FF */
	background: -moz-linear-gradient(top,#fff,#ccc);
	/* IE */
	filter:progid:DXImageTransform.Microsoft.Gradient(startColorstr=#ffffffff,endColorstr=#ffcccccc);
	zoom: 1;
}
#top-navi ul li > a.active {
	background:#666;
	/* Webkit */
	background: -webkit-gradient(linear,left top,left bottom,from(#aaa),to(#333));
	/* FF */
	background: -moz-linear-gradient(top,#aaa,#333);
	/* IE */
	filter:progid:DXImageTransform.Microsoft.Gradient(startColorstr=#ffaaaaaa,endColorstr=#ff333333);
	zoom: 1;
	color: #fff;
	font-weight: bold;
}
#top-navi .navi-image { position:relative;}
#top-navi .navi-image a { display:block; }
#top-navi .navi-image a { position:absolute; top:0; left:0; z-index:8; }
#top-navi .navi-image a.active { z-index:10; }
#top-navi .navi-image a.last-active { z-index:9; }



/* =Content
----------------------------------------------- */

h1{
	margin:10px 0;
	padding:10px;
	font-size:24px;
	font-weight:bold;
	color:#000;
}

h2 {
	margin:10px 0;
	padding:0 10px;
	border-right:solid 1px #666;
	border-bottom:solid 1px #666;
	font-size:14px;
	font-weight:bold;
	line-height: 2.5em;
	color:#000;
	text-shadow: 0px 1px 0px #ccc;
	background:#999;
	/* Webkit */
	background: -webkit-gradient(linear,left top,left bottom,from(#ccc),to(#999));
	/* FF */
	background: -moz-linear-gradient(top,#ccc,#999);
	/* IE */
	filter:progid:DXImageTransform.Microsoft.Gradient(startColorstr=#ffcccccc,endColorstr=#ff999999);
	}
h2.section {
	margin:10px 0;
	padding:0 10px;
	border-right:solid 1px #666;
	border-bottom:solid 1px #666;
	font-size:14px;
	font-weight:bold;
	line-height: 2.5em;
	color:#fff;
	background-color:#999;
}
#main p{
	line-height:150%;
}
li.articlelist {
	margin-left:30px;
	list-style:circle outside;
	font:14px;
	line-height:24px;
	}