/* _________________________________ RESET __________________________________ */

body, html {
	width: 100%;
	height: 100%;
	-webkit-font-smoothing: antialiased;
}

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,p,blockquote,th,td,a,span {
	margin: 0;
	padding: 0;
	font-size: 12px;
	line-height: 18px;
	font-family: Helvetica, Arial, sans-serif;
	font-weight: normal;
}

body * {
	color: #000000;
	transition: color 0.4s;
	-moz-transition: color 0.4s; /* Firefox 4 */
	-webkit-transition: color 0.4s; /* Safari and Chrome */
	-o-transition: color 0.4s; /* Opera */
}
body.wf * {
	color: #eeeeee;
	transition: color 0.4s;
	-moz-transition: color 0.4s; /* Firefox 4 */
	-webkit-transition: color 0.4s; /* Safari and Chrome */
	-o-transition: color 0.4s; /* Opera */
}

#footer {
	color: transparent;
	transition: color 0.4s;
	-moz-transition: color 0.4s; /* Firefox 4 */
	-webkit-transition: color 0.4s; /* Safari and Chrome */
	-o-transition: color 0.4s; /* Opera */
}

body.wf #footer.expanded * {
	color: #000000;
	transition: color 0.4s;
	-moz-transition: color 0.4s; /* Firefox 4 */
	-webkit-transition: color 0.4s; /* Safari and Chrome */
	-o-transition: color 0.4s; /* Opera */
}
body.wf #belowfooter * {
	color: #000000;
}

img:-moz-loading {
    visibility: hidden;
}


form,fieldset,input,textarea,select, img, embed, object {
	outline: none;
	border: 0;
	margin: 0px;
	padding: 0px;
}
input {
	font-size: 12px;
	line-height: 18px;
	font-family:  Arial, Helvetica, sans-serif;
	font-weight: normal;
	outline: none;
}

* {-webkit-text-size-adjust:none;}

div {
	float: left;
	display: block;
}

a {
	text-decoration: none;
}

a:hover {
	text-decoration: underline;
}

.selected {
	text-decoration: underline !important;
}

.right {float:right;}
.h {width: 100%;}
.dn, .nd, .hideoncollapse {display: none;}
ul, li {list-style: none;}
h1,h2 {margin-bottom: 18px;}
.pointer {cursor: pointer;}
.nf {float: none;}
.op0 {opacity: 0;}

.mbs {margin-bottom: 18px;}
.mbd {margin-bottom: 36px;}
.mbt {margin-bottom: 54px;}

.mts {margin-top: 18px;}
.mtd {margin-top: 36px;}
.mtt {margin-top: 54px;}


.ml {margin-left:24px;}
.mr {margin-right:24px;}

.mr0 {margin-right: 0px !important;}

.clear {clear: both;}
.hilight {
/* 	text-decoration: underline; */
	background: #ffcece
/* 	color: #666666; */
}


/* !This website */

#site {
	width: 100%;
	min-width: 1024px;
	height: 100%;
	position: relative;
}

#site.ofxh {
	overflow: hidden;
}



#header {
	padding: 7px 0px 15px 0px;
	margin: 0px 0px 0px 24px;
	width: 976px;
	position: fixed;
	background: #ffffff;
	left: 0px;
	top: 0px;
	z-index: 10;
}
#header.transparent {
	background: transparent;
}

#header a	{text-decoration: none;}
#logo		{width: 140px;}

.fixed {
	position: fixed;
	top: 0px;
	left: 0px;
}

#navi ul, #navi ul li, .il li, .ir li {
	display: inline;
}
#navi ul li, .il li {
	margin-right: 12px; 
}
.il, .ir {
	margin-bottom: 18px;
}

#imgarea {
	width: 976px;
	height: 720px;
	overflow: visible;
	margin: 54px 0px 0px 24px;
}


#footer {
	position: fixed;
	bottom: 0px;
	left: 0px;
	width: 100%;
	min-width: 1024px;
	height: 42px;
	padding: 7px 0px 0px 0px;
	z-index: 10;
	overflow: hidden;
}
#footer.expanded {
	background: #ffffff;	
}

#belowfooter {
	position: fixed;
	top: 100%;
	left: 0px;
	width: 100%;
	min-width: 1024px;
	padding: 7px 0px 12px 0px;
	z-index: 10;
}



.expftr {
	cursor: pointer;
}
.expftr:hover a {
	text-decoration: none;
}

.pcl {
	margin-left: 24px;
	width: 242px;
}
.pcc {
	width: 448px;
}
.pcr {
	position: relative;
	float: right;
	width: 242px;
}
.pcr .ml {
	width: 100%;
}
.plusminus {margin-left: 12px;}
.pcr .il {
	float: left;
}



/* Slideshows */

div.slideshow {
	position: relative;
	margin: 0 auto 20px auto;
	overflow:visible;
	width: 100%;
	height: 400px;
}
div.slideshow .slide {
	position: absolute;
	top: 0;
	left: 0;
	display: none;
}

div.slideshow .slide:first-child {
	display: block;
}



/* Information */

#searchbox {
	margin-left: 0px;
	margin-bottom: 0px;
	width: 250px;
	background: transparent;
	
}
#projects #searchbox {
	width: 140px;
}
#searchbox::-moz-focus-inner {
border:0;padding:0;margin:0;
}
.adjleft {
	margin-left: -1px !important;
}

a.srchtitle {
	text-decoration: none;	
}
span.srchdate {
	margin-right: 12px;
}


#infonavi {
	position: fixed;
	left: 24px;
	top: 61px;
}

#searchresults li,
#searchresults li a {
	cursor: pointer;
	color: #888888;
}
#searchresults li.selected,
#searchresults li:hover,
#searchresults li.selected a,
#searchresults li a:hover {
	color: #000000;
	text-decoration: underline;
}
.srchresults h3 {
	margin-left: 22px;
}



#information {
	position: relative;
	width: 100%;
}

.infotxtcol {
	float: none;
	width: 448px;
	margin: 0px auto 0px auto;
	display: block;
	word-wrap:break-word;
	overflow: hidden;
}
.infotxtcol div {
	width: 448px;
	overflow: hidden;
}

.infotxtcol p, .showbb {
	width: 448px;
	word-wrap:break-word;
}


.infotxtcol.mtt {
	margin: 54px auto 0px auto;
}

.indent p, p.indent {
	text-indent: 22px;
}
.indent p:first-child, .noindent p, p.noindent {
	text-indent: 0px;
}



.infoimgcol {
	float: none;
	width: 64%;
	margin: 0px auto 0px auto;
	display: block;
}


.infom1 {margin-top: 61px;overflow: auto;}
.infom3 {margin-top: 108px;overflow: auto;}
.infom2 {margin-top: 480px;overflow: auto;}


.infoimgcol .imgwrap {
	margin: 0px auto;
	display: table;
	margin-top: 90px;
	float: none;
	position: relative;
	overflow: hidden;
}






.imgwrap:first-child {
	margin-top: 0px;
}

.imgwrap img {
	width: 100%;
	display: block;
}

.imgwrap iframe {
	margin: 0px auto;
	float: none;
	display: block;
}

.xl {width: 100%;}
.l {width: 80%;}
.m {width: 60%;}
.s {width: 40%;}

.imgtxt {
	padding-top: 6px;
	display: none;
	width: 100%;
	background: #ffffff;
	position: absolute;
	bottom: -20px;
	left: 0px;
}



/* Journal */

#journal {
	width: 100%;
	padding-bottom: 300px;
}

#journalnavi {
	position: fixed;
	right: 24px;
	top: 7px;
	z-index: 20;
}


.jrnimg {
	width: 100%;
	margin: 0px auto;
	float: none;
	padding-bottom: 48px;
}
.jrnimg img, .jrnimg .ifwrap {
	margin: 0px auto;
	float: none;
	display: block;
	cursor: pointer;
}

.jrnimg img.s100, .jrnimg .ifwrap.s100 {width: 100%;}
.jrnimg img.s90, .jrnimg .ifwrap.s90 {width: 90%;}
.jrnimg img.s80, .jrnimg .ifwrap.s80 {width: 80%;}
.jrnimg img.s70, .jrnimg .ifwrap.s70 {width: 70%;}
.jrnimg img.s60, .jrnimg .ifwrap.s60 {width: 60%;}
.jrnimg img.s50, .jrnimg .ifwrap.s50 {width: 50%;}
.jrnimg img.s40, .jrnimg .ifwrap.s40 {width: 40%;}
.jrnimg img.s30, .jrnimg .ifwrap.s60 {width: 30%;}
.jrnimg img.s20, .jrnimg .ifwrap.s50 {width: 20%;}
.jrnimg img.s10, .jrnimg .ifwrap.s40 {width: 10%;}


.jrntxt {
	width: 448px;
	margin: 0px auto;
	float: none;
}
.jrntxt h3 {
	cursor: pointer;
}

a.jrnexp:hover {
	text-decoration: none;
}

.jrnwrap {
	width: 100%;
	margin-top: 90px;
	float: left;
	position: relative;	
}
.jrninfo {
	padding-top: 6px;
	background: #ffffff;
	width: 100%;
	position: absolute;
	bottom: 0px;
	left: 0px;
	padding-bottom: 24px;
}
.jrndate {
	position: absolute;
	left: 24px;
	top: 6px;
}
.jrnhidden {
	width: 448px;
	display: none;
}
.jrnhidden.vis {
	display: block;
}

.imgtxt p, .imgtxt h3 {
	max-width: 448px;
}
.imgtxt h3 {
	margin-bottom: 18px;
}

.infotxtcol .ccol1 {
	width: 224px;
	float: left;
}
.infotxtcol .ccol2 {
	width: 224px;
	float: left;
}


.empty {
	width: 100%;
	height: 300px;
}


/* Projects page */

#projects {
	background: #ffffff;
	margin: 61px 0px 0px 24px;
	position: relative;
}

#projmenu1 {
	position: fixed;
	top: 61px;
	left: 24px;
	width: 140px;
}

#projmenu2 {
	width: 320px;
	margin-left: 140px;
	padding-bottom: 114px;
}


#projmenu1 a, #projmenu2 a {
	text-decoration: none;
}
#projmenu1 a:hover, #projmenu2 a:hover {
	text-decoration: underline;
}


#projimg {
	position: fixed;
	width: 438px;
	height: 438px;
	right: 66px;
	top: 66px;
}
#projimg img {
	position: absolute;
	left: 0;
	top: 0;
	display: none;
	background: #f0f0f0;
}


div.ovnum {
	float: right;
	margin-right: 24px;
}



.pjnum {
	white-space: nowrap;	
}

.pjnum span {
	line-height: 18px;
}


a.prev {
	display: inline-block;
	background-image: url(img/arrow_lt.png);
	background-repeat: no-repeat;
	background-position: 25px 5px;
	width: 35px;
	height: 18px;
	text-indent: 2000px;
	margin-left: 0px;
}
a.next {
	display: inline-block;
	background-image: url(img/arrow_gt.png);
	background-repeat: no-repeat;
	background-position: 5px 5px;
	width: 35px;
	height: 18px;
	text-indent: 2000px;
	margin-left: 0px;
}

body.wf a.prev {
	background-image: url(img/arrow_lt_white.png);
}
body.wf a.next {
	background-image: url(img/arrow_gt_white.png);
}

.dims {
	display: none;
	float: right;
	color: #ff0000;
}


.hidprojs {
	display: none;
	margin-bottom: 18px;
}

.links {
	width: 100%;
}
.links a {
	text-decoration: none;
}
a.expand {
	display: block;
}
.expandable {
	width: 100%;
	display: none;
}

.projdesc {
	outline: none;
}


#copy {
	position: fixed;
	bottom: 24px;
	left: 24px;
}




.portrait {
	cursor: default;
	text-decoration: none;
}
.portrait:hover {
	cursor: default;
	text-decoration: none;
}

#tt {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 300px;
	height: 174px;
}

/* !BUTTONS */
video {
	cursor: url('/css/img/play.png'), e-resize;
	
}
video.playing {
	cursor: url('/css/img/pause.png'), w-resize;
}


.arrw {
	display: block;
	opacity: 0;
	position: absolute;
}
a.arrw.fxd {
	position:fixed;
	z-index: 10;
}

a.arrw.l:hover {
	cursor: url('/css/img/arrwl.png'), auto;
	cursor: -webkit-image-set(url('/css/img/arrwl.png') 1x), auto;
}
a.arrw.r:hover {
	cursor: url('/css/img/arrwr.png'), auto;
	cursor: -webkit-image-set(url('/css/img/arrwr.png') 1x), auto;
}


.arrw.l {
	width: 40%;
	height: 100%;
	left: 0;
	top: 0;
}
.arrw.r {
	width: 40%;
	height: 100%;
	right: 0;
	top: 0;
}


.iosfix {
  height: 101%;
  overflow: hidden;
}
