@charset "utf-8";
/* CSS Document */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body { 	line-height: 1; }
nav { padding-top:40px; }
ol, ul { list-style: none; }
blockquote, q {quotes: none; }
blockquote:before, blockquote:after,
q:before, q:after {	content: ''; content: none; }
table { border-collapse: collapse; border-spacing: 0; }
::selection{ background: #000;color: #fff; }
*:focus {outline: none;}
h2{ font-family: 'Crete Round', serif;font-size: 24px;line-height: 36px;margin-bottom: 20px; }
a{ text-decoration: none;border-bottom: 1px dotted #fff;color: #fff; }
a:hover{ border-bottom: 1px solid #fff; }
.no-border{ border: none; }
.no-border:hover{ border: none; }
body{background: #f3f3f3;color: #fff;font-family: 'Open Sans', sans-serif;font-size: 12px;overflow-x:hidden; }
#bodypad{background: #fafafa;position: absolute;left: 50%;margin-left: 480px;width: 100%;height: 1110px;z-index: -99; }
header{width: 960px;overflow: auto;padding-top: 50px;margin: 0 auto; }
header img{float: left;}
#name{ border-top: 5px solid #000;border-bottom: 5px solid #000;color: #000;font-family: 'Open Sans', sans-serif;font-weight: bold;font-size: 30px;width: 300px;float: left;padding: 15px 0;text-align:right;}
nav{float: left;}
nav a,#leri a{width: 160px;height: 42px;padding-top: 28px;color: #000;font-size: 14px;display: block;float: left;text-align: center;border-bottom: none;}
#leri a{height:122px;padding-top:40px; }
nav a:hover, #leri a:hover{background:#000000; color: #fff;border: none;}
nav a:first-child {width: 160px;}
#name,header img:hover,#scroller-left,#scroller-right,.back,#leri{cursor: pointer;}
.cursornext{cursor:url(../../img/cursornext.cur);cursor:url(../../img/cursornext.gif) 0 0 auto;}
.cursorprev{cursor:url(../../img/cursorprev.gif)  0 0 auto;}
.project>img:last-child{cursor: auto;}
#scroller{background: #e6e6e6;width: 100%;height: 460px;position: relative;}
#scroller-content{position: relative;left: 50%;margin-left: -320px;height: 460px;overflow:hidden;}
#scroller-left,#scroller-right{position: absolute;width: 50%;height: 460px;z-index: 29;}
#scroller-all { position:absolute;width:100%,height:460px;z-index: 29;left: -320px;}
#scroller-left{left: -320px;}
#scroller-right{left: 50%;margin-left: 480px;}
#details{position: relative;left: 50%;margin-left: -480px;z-index: 49;}
#left{background: url(../../img/blank.png) #aaa center no-repeat;width: 80px;height: 80px;float: left;}
#right{background: url(../../img/blank.png) #aaa center no-repeat;width: 80px;height: 80px;float: left;}
#leri { background-color:#aaa; center no-repeat; width:160px; height:150px; margin:0 0 0 0;text-align:center; vertical-align:middle; float: left;color:#FFF; }
.pleft{abackground: url(../../img/blank.png) #aaa center no-repeat;width: 80px;height: 80px;float: left;}
.pright{abackground: url(../../img/blank.png) #aaa center no-repeat;width: 80px;height: 80px;float: left;}
#left:hover{abackground: url(../../img/left-hover.png) #000 center no-repeat;cursor: pointer;}
#right:hover{abackground: url(../../img/right-hover.png) #000 center no-repeat;cursor: pointer;}
.back{float: left;background: #aaa;width: 112px;height: 110px;padding: 50px 0 0 48px;position: relative;z-index: 49;}
.back:hover{background: #000;}

.project{
	float:left;
	position: relative;
	background: #aaa;
	width: 800px;
	height: 460px;
}

.project > *{
	position: absolute;	
}

.project-details{
	width: 700px;
	height: 330px;
	padding-top: 30px;
	border-top: 1px solid #fff;
	border-bottom: 1px dotted #fff;	
	margin-left: 55px;
	margin-top: 30px;
	line-height: 24px;
}

.project-details h2{
	width: 300px;
}

.project-details a:hover{
	border-bottom: 1px solid #fff;
}

.project-contribution{
	position: relative;
	float: right;
	margin-right: 100px;
	margin-top: 420px;	
}
.project-contribution img{
	vertical-align: sub;
	margin-right: 10px;
}


.project-title{
	background: #aaa;
	width: 140px;
	height: 50px;
	padding: 15px 10px;
	float: left;
	font-size: 14px;
	font-weight: bold;
	line-height: 24px;
}

.project-title:hover{
	background: #000;
	cursor: pointer;	
}

.project-gallery *{
	position: absolute;
}

.up{
	width: 800px;
	height: 360px;
}

.down{
	width: 800px;
	height: 100px;
	margin-top: 360px;
}

#splash-text{
	font-size: 42px;
	line-height: 77px;
	padding-left: 40px;	
	cursor: pointer;
}

#splash-text span{
	font-size: 48px;
	font-weight: bold;	
}

#about, #agb, #info{
	width: 800px;
	height: 460px;	
	background: #aaa;
	position: absolute;
	left:50%;
	margin-left: -320px;
	z-index: 99;
	display: none;
}

#about-title, #agb-title, #info-title {
	background: #aaa;
	width: 120px;
	height: 20px;
	padding: 30px 0 30px 40px;
	float: left;
	overflow: hidden;
	font-size: 14px;
	font-weight: bold;
	line-height: 24px;
	margin-right: 60px;
}

#about-content, #agb-content, #info-content{
	width: 700px;
	height: 330px;
	padding-top: 30px;
	border-top: 1px solid #fff;
	margin-left: 55px;
	margin-top: 30px;
	line-height: 24px;
}
#info-content {
	color: #000;
	border-top: 1px solid #000;
}

#about-content article, #agb-content arcticle, #info-content article{
	float: left;
	width: 600px;
}

#about-links {
	width: 	110px;
	float: left;
	margin-left: 100px;
}

#about-links img{
	vertical-align: sub;
	margin-right: 10px;
}

#gallery{
	width: 960px;
	margin: 0 auto;
	overflow: auto;
}

.section-title{
	width: 125px;
	height: 100px;
	padding: 60px 0 0 35px;
	font-size: 24px;
	font-weight: bold;
	background: #aaa;
	float: left;
}

.section-mail{
	width: 160px;
	height: 160px;
	padding: 0 0 0 0;
	background: #aaa;
	float: left;
}

#mail {
	background:url(../../img/mail.png) no-repeat #aaa;
}

#mail:hover {
	background:url(../../img/smail.png) no-repeat #000;
}

#keynav{
	width: 105px;
	height: 110px;
	padding: 50px 0 0 55px;
	background: #e6e6e6;
	float: right;
}

.gallery-item{
	width: 400px;
	height: 240px;
	background: url(../../img/t000.png) center no-repeat #000;
	cursor: pointer;
	clear: left;
	float: right;		
}

.gallery-item img:hover{
	opacity: 0;
}

.gallery-to-top{
	width: 110px;
	height: 112px;
	padding: 48px 0 0 50px;
	background: #aaa;
	cursor: pointer;
	clear: both;
	float: right;
}

.gallery-to-top:hover{	
	background: #000;
}

h1 {
	font-size:14px;
}

h3 {
	font-size:16px;
}
