/* general style */

body {
	background-color: #fff;
	margin: 0px;
}

div {
	position: relative;
}

hr {
   border: none;
   border-bottom: 1px solid #999;
}

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

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

.description {
	font: 12px helvetica, sans-serif;
	line-height: 20px;
	color: #444;
}

.sub {
	font: bold 12px helvetica, sans-serif;
	text-transform: uppercase;			
	color: #222;	
}

.title {
	font: 30px helvetica,sans-serif;
	color: #222;	
	text-transform: uppercase;
}

img {
	border: none;
}

/* all pages */

img#bg {
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	z-index: 0;
}

#menu {
	position: absolute;
	left: 0px;
	top: 0px;
	width: 100%;
	background: url(img/trans.png);	
	padding-top: 2px;
	padding-bottom: 2px;
}


/* front page */

#projects {		
	margin:auto;
	top: 60px;
	width: 590px;
}

#projects #info {
	width: 590px;
	height: 120px;
	margin-bottom: 10px;
	background: url(img/trans.png);								
}

#projects .project {
	width: 590px;
	height: 120px;
	margin-bottom: 10px;
	background: url(img/trans.png);							
}

#projects .project #about {
	padding: 20px;			
}

#projects .project #about .kf {
	font: bold 12px helvetica, sans-serif;
	text-transform: uppercase;
	color: #222;
}

#projects .project .info {
	position: absolute;
	left: 120px;
	padding: 20px;			
	width: 400px;
}

#projects .project .info .title {	
	font: 12px helvetica, sans-serif;
	text-transform: uppercase;			
}

#projects .project .image {
	position: absolute;	
	top: 0px;
	left: 0px;
	width: 100px;
}

#projects .project .image a {
	background: none;
}


/* project page, left side */

#main {
	position: absolute;
	background: url(img/trans.png);		
	top: 60px;
	left: 0px;
	width: 540px;
}

#main div {
	padding: 20px;
	width: 500px;	
}

#main #essay img {
	margin-right: 10px;
	float:left;	
}

#main #heading {
	text-transform: uppercase;
	margin-bottom: 20px;
}

#main #credits div {
	padding: 0px;
}

#main #credits .item {
	width: 450px;
	clear: both;
	margin-bottom: 10px;
}

#main #credits .item .name {
	width: 270px;
	float: left;	
}

#main #credits .item .copy {
	width: 175px;
	float: right;
	margin-bottom: 10px;	
}

#main #copyright {
	margin-top: 100px;
	clear: both;
	font-size: 8px;
	text-align: right;
}


/* project page, right side */

#media {
	top: 60px;
	left: 600px;
	width: 420px;
}

#media div {
	width: 400px;
	margin-bottom: 10px;
	padding: 10px;
	background: url(img/trans.png);		
}

#media .drape {
	width: 380px;
	height: 320px;
	text-align: center;
	background: none;
	background-color: #111;
	margin-bottom: 0px;
}

#media .images {
	padding-bottom: 5px;
}

#media .images a {
	background: none;
}

#media .material {
	padding-bottom: 5px;
}

#media img {
	width: 36px;
	height: 36px;
}

#media #press {
	width: 380px;
	padding: 20px;
}


/* special project pages */

#paper {
	position: relative;
	margin:auto;
	top: 60px;
	width: 700px;
	padding: 10px;
	background: url(img/trans.png);		
}

#paper pre {
	white-space: pre-wrap;       /* css-3 */
	white-space: -moz-pre-wrap !important;  /* Mozilla, since 1999 */
	white-space: -pre-wrap;      /* Opera 4-6 */
	white-space: -o-pre-wrap;    /* Opera 7 */
	word-wrap: break-word;       /* Internet Explorer 5.5+ */	
}


/* about page */

#about_main {
	position: absolute;
	background: url(img/trans.png);		
	top: 60px;
	left: 0px;
	width: 400px;
	padding: 20px;
}

#about_main #heading {
	margin-bottom: 25px;
}

#about_main #about {
	margin-bottom: 100px;
}

#bios {
	top: 60px;
	left: 500px;
	width: 440px;
}

#bios div {
	background: url(img/trans.png);					
	margin-bottom: 10px;
	padding: 20px;
	width: 400px;		
}

#bios .bio img {
	margin-right: 10px;
	margin-bottom: 5px;
	float: left;	
}

#bios .separator {
	padding: 0px;
	padding-left: 20px;
	padding-right: 20px;	
}

.code {
	font-family: courier,monospace;
	margin: 0 10px 10px 10px;
	padding: 10px;
}


/* apple rtf css */

p.p1 {margin: 0.0px 10.0px 0.0px 10.0px; text-align: justify; font: 12.0px Helvetica}
p.p2 {margin: 0.0px 10.0px 0.0px 10.0px; text-align: justify; font: 12.0px Helvetica; min-height: 14.0px}
p.p3 {margin: 0.0px 10.0px 0.0px 10.0px; font: 12.0px Helvetica}
p.p4 {margin: 0.0px 10.0px 0.0px 27.0px; text-align: justify; font: 11.0px Helvetica}
p.p5 {margin: 0.0px 10.0px 0.0px 27.0px; text-align: justify; font: 11.0px Helvetica; min-height: 12.0px}
p.p6 {margin: 0.0px 10.0px 0.0px 10.0px; text-align: justify; font: 12.0px Times New Roman; min-height: 15.0px}
p.p7 {margin: 0.0px 10.0px 0.0px 37.0px; text-align: justify; text-indent: -1.0px; font: 11.0px Helvetica}
p.p8 {margin: 0.0px 10.0px 0.0px 36.0px; text-align: justify; font: 11.0px Helvetica}
p.p9 {margin: 0.0px 10.0px 0.0px 36.0px; text-align: justify; font: 12.0px Helvetica; min-height: 14.0px}
p.p10 {margin: 0.0px 10.0px 0.0px 37.0px; text-align: justify; font: 11.0px Helvetica}
p.p11 {margin: 0.0px 10.0px 0.0px 37.0px; text-align: justify; text-indent: -2.0px; font: 11.0px Helvetica}
p.p12 {margin: 0.0px 10.0px 0.0px 35.0px; text-align: justify; text-indent: 1.0px; font: 11.0px Helvetica}
p.p13 {margin: 0.0px 10.0px 0.0px 10.0px; text-align: justify; font: 10.0px Helvetica; min-height: 12.0px}
p.p14 {margin: 0.0px 10.0px 0.0px 37.0px; text-align: justify; font: 11.0px Helvetica}
p.p15 {margin: 0.0px 10.0px 0.0px 37.0px; text-align: justify; font: 11.0px Helvetica}
p.p16 {margin: 0.0px 10.0px 0.0px 10.0px; font: 10.0px Helvetica}
span.s1 {letter-spacing: 0.0px}
span.s2 {font: 12.0px Times New Roman; letter-spacing: 0.0px}
span.s3 {font: 8.0px Helvetica; letter-spacing: 0.0px}
span.s4 {font: 10.0px Times New Roman; letter-spacing: 0.0px}
span.s5 {font: 7.3px Helvetica; letter-spacing: 0.0px}
span.s6 {font: 6.7px Helvetica; letter-spacing: 0.0px}
span.s7 {font: 10.0px Helvetica; text-decoration: underline ; letter-spacing: 0.0px color: #000099}
span.Apple-tab-span {white-space:pre}