/*
Theme Name: YCDN
Theme URI: http://yoshicandesignnow.com/
Description: YoshiCanDesignNow Portfolio Theme.
Version: 1.0
Author: Yoshifumi Uemura
Author URI: http://yoshicandesignnow.com
Tags: fantastic
*/

@charset "utf-8"

*, :focus, a:active { outline:none;}

body,div,ol,ul,li,h1,h2,h3,h4,h5,h6,small,p,address
form,label,fieldset,input,textarea,select,pre,blockquote,
option,dl,dt,dd,table,th,td,embed,object { margin: 0; padding: 0; vertical-align: baseline; outline:none;}

html, body { background:#F9F8EE; color:#444; font:normal 12px/20px Georgia, serif; height:100%;}

.nicegray {background:#131512;}
.green {background:#6DF678;}
.nicebage{color:#f4f5d3;}


html { overflow-x:hidden;}
	
img, a img { border: none; outline:none;}

ul, li { list-style:none; position:relative;}

h1,h2,h3,h4,h5,h6 { font-weight:normal;}

h1{ color:#197718; font-size:14px; font-weight:normal; line-height:18px;}

h2 { font-size:18px;}

h3 { font-size:16px; line-height:18px;}

a { color:#111; text-decoration:underline; }

a:active {background:#eee; color:#111; outline:none;}

a:hover { background:#111; color:#fff; text-decoration:none;}

a:visited { color:#444; text-decoration:none;}

.clear {clear:both;}
.fL { float: left; height:auto; position:relative;}
.fR {float: right; height:auto; position:relative;}

/*__________________________________________________________________ start contents*/

#wrapper { float:left; width:100%; height:100%;}

/*__________________________________________________________________ header*/

#header { float:left; padding:0 0 100px; position:relative; width:100%;}

#contact {border-top:#197718 solid 4px; display:block; float:left; height:40px; width:100%;}
.email {color:#197718; font:bold 12px/20px "Times New Roman", Monospace; display:block; float:left;}

#logo, #home, #profile, #cv { float:left; width: 160px;}
#home a, #home a:visited , #profile a, #profile a:visited, #cv a, #cv a:visited {
	display:block; 
	font:normal 16px/18px Georgia, serif;
	height: 98px;
	padding:2px 0 0; 
	text-decoration:none;
	width: 160px;
}	
#home a:hover, #profile a:hover, #cv a:hover { background:#197718; color:#fff; height: 98px; width: 160px;}
#home a:active, #profile a:active, #cv a:active { background:#777; }

/*__________________________________________________________________ header thumbnails*/

.thumbBox{ color:#111; float:left; height:100px; margin:0; overflow:hidden; position:relative; width:160px; }

.thumbBox img{ color:#111; left:0; position:absolute; top:0;}

.captionBox{ float: left; height: 38px; position: absolute; width: 90%;}

.thumbBox .captionBox { left:0; top:2px;}
.thumbBox h3 a, .thumbBox h3 a:active, .thumbBox h3 a:hover { background:transparent; color:#111; display:block; padding:1px 8px 1px 1px;}
.thumbBox h3 a:visited { color:#111; padding:1px 8px 1px 2px; text-decoration:none;}

/*__________________________________________________________________ projects*/

#content { clear:both; float:left;}

.projectBox{
	background: rgba(255,255,255,.95); 
	display:block; 
	height:auto;
	position:absolute; 
	top:0px;
	width:984px; /*  total mini-width: 984+24 = 1008px*/
	z-index:10;
}

.projectDesc { float:left; font-size:14px; padding:0px 0; width:228px;}
.projectDesc h2 { border-top:#444 solid 3px; color:#444; line-height:20px; margin:33px 0 18px; padding:0px 2px;}

.nav {background:#F9F8EE; border-top:#ccc solid 1px; float:left; font:normal 14px/14px Monospace; margin: 0 0 18px; width:228px;}
.nav a, .nav a:visited{ 
	color:#444; 
	display:block; 
	float:left; 
	line-height:14px; 
	padding:6px 7px;
	width:12px;
	text-align:center;
}
.nav a:active { background: #eee; color:#444; outline:none;}
.nav a:hover{ color:#fff; font-weight:bold; text-decoration:none;}
.nav a.activeSlide { background:#197718; color:#fff; font-weight:bold; line-height:14px; outline:none; text-decoration:none;}

.projectDesc p { clear:both; color:#444; line-height:20px; padding:0 2px 14px;}

.projectDesc p a, .projectDesc p a:visited, ul.nextPro li a{ background:none; color:#197718; text-decoration:underline;}
.projectDesc p a:active, ul.nextPro li a:active { background:#eee; color:#fff; outline:none;}
.projectDesc p a:hover { color:#000; text-decoration:none;}

ul#myacco { background: url('images/myacco_a.gif') no-repeat top right; border-top:#aaa dotted 1px; height:21px;  display:block; padding:0 0 3px; margin: 0;}
ul#myacco li:first-child h5 a{ color:#aaa; display:block; font-size:12px; padding:0 0 0 2px; text-decoration:none; outline:none;}
ul#myacco li:first-child h5 a:hover { color:#fff;}
ul#myacco li:first-child h5.cur{ background:#ddd url('images/myacco_a_o.gif') no-repeat top right; }
ul#myacco li:first-child h5.cur a{color:#222;}
ul#myacco li:first-child h5.cur a:hover {color:#fff;}

ul.nextPro { clear:both; margin:6px 0px 8px; width:228px;}
ul.nextPro li { display:block; padding: 0 0 4px 0;}
ul.nextPro li a { border-left:#197718 solid 6px; font-size:12px; display:block; padding: 0 0 0 4px; text-decoration:none;}
ul.nextPro li a:visited { color:#777; text-decoration:none;}
ul.nextPro li a:hover { border-left:#000 solid 6px; color:#111; text-decoration:none;}

ul.nextPro li.nextP a {background:url('images/next_a.gif') no-repeat top right;}
ul.nextPro li.nextP a:hover {background:url('images/next_a_o.gif') no-repeat top right;}
ul.nextPro li.prevP a {background:url('images/prev_a.gif') no-repeat top right;}
ul.nextPro li.prevP a:hover {background:url('images/prev_a_o.gif') no-repeat top right;}

.slideshow {float:right; height:auto; width:744px;}
.slideshow img { clear:right; float:left;}

div.closeB { margin:0px; padding:0;}
div.closeB a, div.closeB a:visited{
	background:url('images/close_b.gif') no-repeat;
	color:#197701; 
	display:block;
	height:100%;
	outline:none;
	position:absolute;
	top:0;
	left:984px;
	text-align:left; 
	width:39px;
	z-index:1000;
	}
	
div.closeB a:active { background:#111; outline:none;}
div.closeB a:hover{ background: #222 url('images/close_b.gif') no-repeat;}

p.goThumb a, p.goThumb a:visited { color:#aaa; font-size:12px; text-decoration: none;}
p.goThumb a:active { background:#ccc; color:#fff; outline:none;}
p.goThumb a:hover { color:#197718; text-decoration: underline;}

.projectBack {cursor:pointer; position:absolute; min-height:840px; height:100%; width:100%;, left:0; top:0;}

.profile h2 { border-top:#444 solid 1px; color:#444; font-size:24px; line-height:20px; margin:24px 0; padding:0px 2px;}
.profile p { clear:both; color:#444; font-size:24px; line-height:32px; padding:0 2px 24px;}


#archive {
	background: #197718;
	display:block; 
	position:absolute; 
	top:2px;
	left:480px;
	width:320px; /*  total mini-width: 984+24 = 1008px*/
	z-index:10;
}

#archive h2 {color:#fff; font-size:14px; padding:0 0 0 1px;}

#error{
	background: rgba(255,255,255,.95); 
	display:block; 
	height:300px;
	position:absolute; 
	top:44px;
	width:984px; /*  total mini-width: 984+24 = 1008px*/
	z-index:10;
}

#error h2 {font:bold 48px/48px "Arial Black", sans-serif;}
	
/*__________________________________________________________________ sidebar*/

#thirdNav { clear: both; text-align:left;}

.sitemap { float:left; padding:0 10px 40px 0; width:310px;}
.sitemap h3 { border-top:#197718 solid 1px; color:#197718; padding:0 0 14px;}
.sitemap li { line-height:14px; margin:0 0 4px;}
.sitemap li a { color:#777; display:block; padding:2px 0;}
.sitemap li a:active { background:#eee;}
.sitemap li a:hover {color:#fff; padding-left:4px;}
.sitemap li#current a { background:#197718; color:#fff; padding-left:4px;}

/*__________________________________________________________________ footer*/
#footer { border-top:#777 dotted 1px; clear: both; padding:0 0 40px; text-align:left; width:960px;}	
#cpright { display:block;}