@import url(http://fonts.googleapis.com/css?family=Reenie+Beanie);
@import url(http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz:regular,bold);


html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  margin:0;
  padding:0;
  border:0;
  outline:0;
  font-size:100%;
  vertical-align:baseline;
  background:transparent;
  list-style:none;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
    display:block;
}


html{height:100%;width:100%;overflow-y:scroll;}

.clearfix:before,.clearfix:after {content: '\0020';display: block;overflow: hidden;visibility: hidden;width: 0;height: 0;}
.clearfix:after{clear: both;}
.clearfix{zoom:1;}
.noshow, .hidden{display:none;}
.grayout{color:#5495AA;font-size:9px;}

body{font-family:Tahoma, Geneva, sans-serif;font-size:12px;min-height:100%;color:#666;line-height:18px; min-width:960px;
	background:#3C3022 url(/img/html8/bg_body.jpg) repeat center top;
	background:url(/img/html8/bg_fun1.png) no-repeat center 7770px,
			url(/img/html8/bg_fun3.png) no-repeat center 330px,
			url(/img/html8/bg_fun2.png) no-repeat center 1220px,
			url(/img/html8/bg_fun4.png) no-repeat center 1880px,
			url(/img/html8/bg_fun5.png) no-repeat center 3990px,
			url(/img/html8/bg_body.jpg) repeat center top #3C3022;
}
a{color:#666;}
a, a:hover, a:active {outline: none; }
a:hover{color:#000;}
p{padding:0.5em 0 0.5em 0;}

h1{color:#666;font-weight:bold;font-size:35px;padding:30px 0 10px;}
ul#portfolio li > h2{color:#000;font-size:20px;font-weight:bold;padding-bottom:5px;text-transform:uppercase;letter-spacing:0.05em;border-bottom:2px solid #777;}


.btn{ background:url(/img/html8/bg_btn.png) no-repeat;}
.highlighted{font-weight:bold;}
.border1{
	margin-bottom:10px;
    border: 10px solid #fff;
	
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border-radius:5px;
	
	behavior:url(/js/PIE.htc);
}



#header{background:#7ED8F3 url(/img/html8/bg_header.jpg) repeat-x center bottom;margin-bottom:20px;position:relative;}
#intro{position:relative;width:960px;background:transparent url(/img/html8/bg_fj.jpg) no-repeat center bottom;margin:0 auto;}
#intro .btn{position:absolute;width:113px;height:47px;text-indent:-777em;}
#intro .keywords{height:222px;}
.btn_work{left:46px;bottom:0;}
.btn_work.opened{background-position:0 -50px;}
.btn_private{right:50px;bottom:41px;background-position: -115px 0;z-index:71;}
.btn_private.opened{background-position: -115px -50px;}

.hate_ie{display:block;position:absolute;height:93px;right:0;text-indent: -7777em;bottom:44px;width:83px;background:transparent url(/img/html8/bg_ie.png) no-repeat;z-index:70;}

/* PRIVATE */
#private{display:none;margin:0 auto;width:400px;}
#private a:hover{text-decoration:none;background:#fff;}
#private .iconlist{clear:both; height:100px; padding-top:10px;}
#private .iconlist li{display:inline;}
#private .iconlist li a{ display:block; float:left; height:35px;width:42px;background:url(/img/html7/icons.png) no-repeat 0px 0px; text-indent:-7777em;}
#private .iconlist li.yt a		{background-position:0px 0px;}
#private .iconlist li.yt a:hover	{background-position:0px -40px;}
#private .iconlist li.fb a		{background-position:-135px 0px;}
#private .iconlist li.fb a:hover	{background-position:-135px -40px;}
#private .iconlist li.tt a		{background-position:-90px 0px;}
#private .iconlist li.tt a:hover	{background-position:-90px -40px;}
#private .iconlist li.lf a		{background-position:-45px 0px;width:33px;}
#private .iconlist li.lf a:hover	{background-position:-45px -40px;}

#private_record{display:none;}
#private_record h2{font-size: 22px;padding:20px 0 10px 0;}
#private_record td{padding-bottom:5px;}
#private_record .date{padding:0 10px 0 0;white-space:nowrap;}

#container{width:860px;margin:0 auto;}
#container .content{background:#fff; margin:0 12px 10px 0;padding:0 10px;position:relative;}

#filter{background:#fff;margin:0 12px 10px 0;position:relative;}
#filter li, #filter li a{float:left;}
#filter li{color:#000;}
#filter li a{padding:0 0 0 5px;}
#filter li.active a{color:#000; text-decoration:none;}

ul#portfolio{clear:both;list-style:none;}
ul#portfolio li{float:left;width:256px;position:relative;margin-right:10px;cursor:pointer;background: #fff;}
ul#portfolio li:hover{/* border-color:#9E9891;border: 10px solid rgba(255, 255, 255, 0.3);border-color:rgba(255,255,255,0.5); */}
ul#portfolio li.opened{cursor:default;}
ul#portfolio li.opened:hover{border-color:#fff;}

ul#portfolio li .more{float: right;position: relative;/*top: -25px;*/}
.project_info{display:none;border-top:1px solid #000;}

/*
dl {margin-bottom:5px;border-top: 2px solid #777;padding-top: 5px;}
.project_info dt {float:left;clear:left;width:90px;font-weight:bold; color:#000;}
.project_info dd {margin-left:90px; }
*/
dl {border-top: 2px solid #777;padding-top: 5px;}
.project_info dt, .project_info dd {float:left;height:16px;line-height:16px;}
.project_info dt {font-weight:bold; color:#000;padding-right:10px;}
.project_info dd {padding-right:50px;}
.project_info_more{clear:both;padding-top:5px;}

.project_date{font-size:11px;}
dd.project_tags{font-size:19px;font-weight:bold;display:block;line-height: 22px;}
dt.project_tags{clear:left;}

.refcontnorm{padding-bottom:10px;}
.refcontnorm h2{font-size:12px;color:#000;}

.status{background:transparent url(/img/html7/status_on.png) no-repeat center center; float:right;height:12px;width:12px; text-indent:-7777em;}
.status.on {}
.status.off	{background-image:url(/img/html7/status_off.png);}


.font1{font-family: 'Reenie Beanie', arial, serif;}
.font2{font-family: 'Yanone Kaffeesatz', arial, serif;}
.gallery_content{overflow:hidden;width:100%;height:143px;border-top:1px solid #000;}
.gallery_content img{width:100%;}

.gallery_old{overflow:hidden;width:100%;height:144px;}
.gallery_old img{width:100%;}

footer{clear:both;}

#konamibg{position:fixed;top:0px;left:0px;width:100%;height:100%;cursor:pointer;background:url(/img/html8/dance1.gif) no-repeat center center;background-color:rgba(255, 255, 255, 0.7);color:#000;z-index:9999;}
#konamibg p{padding:5px;}

/* IE6 */
#error_ie{position:absolute;width:100%;top:0px;left:0px;border-bottom:1px solid #A29330;background:#FDF2AB no-repeat 11px center url(http://browser-update.org/img/dialog-warning.gif);text-align:left;font:12px Arial,Helvetica,sans-serif;color:#000;z-index:999;}
#error_ie a{color:#000;}
#error_ie div{padding:5px 36px 5px 40px;}
* html .btn{display:none;}
* html .hate_ie{right:30%;}

@media all and (orientation:portrait) {
	
}

@media all and (orientation:landscape) {

}
@media screen and (max-device-width: 480px) {
	
}
@media print {
	* { background: transparent !important; color: #444 !important; text-shadow: none !important; }
	a, a:visited { color: #444 !important; text-decoration: underline; }
	a:after { content: " (" attr(href) ")"; }
	abbr:after { content: " (" attr(title) ")"; }
	.ir a:after { content: ""; } 
	pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
	thead { display: table-header-group; }
	tr, img { page-break-inside: avoid; }
	@page { margin: 0.5cm; }
	p, h2, h3 { orphans: 3;widows: 3; }
	 h2, h3{ page-break-after: avoid; }
}