/* Pagewide stuff */

body
{
	background-color: black;
	color: white;
	font-family: Helvetica, Arial, Verdana, sans-serif;
	font-size: 9px;
	letter-spacing: 1px;
	margin: 0;
	padding: 0;
	line-height: 18px;
	font-weight: lighter;
}

img
{
	border: none;
}

#container
{
	position: relative;
	width: 768px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 45px;
	padding: 0;
}

/* Link styles */

a { text-decoration: none; }
a:link { color: #999; }
a:visited { color: #999; }
a:hover { color: white; }
a:active { color: #f00; }

li.m1 a { color: white; }
li.m1 a:visited { color: white; }
li.m1 a:hover { color: #999; }
li.m1 a:active { color: #f00; }

li.m2 a { text-decoration: none; }
li.m2 a:link { color: #999; }
li.m2 a:visited { color: #999; }
li.m2 a:hover { color: white; }
li.m2 a:active { color: #f00; }
li.m3 a { color: white; text-decoration: none; }

li#larc a { text-decoration: none; }
li#larc a:link { color: #666; }
li#larc a:visited { color: #666; }
li#larc a:hover { color: white; }
li#larc a:active { color: #f00; }

table.archive a { color: #ccc; }
table.archive a:hover { color: white; }
table.archive a:active { color: red; }

table.archive a.inactive { color: #888; }
table.archive a.inactive:hover { color: white; }
table.archive a.inactive:active { color: red; }

/* Various menu components */

#menu 
{
	position: absolute; top: 56px; left: 0px; width: 192px;
	text-align: right;
}

#menu, #projmenu, #miscmenu2, #miscmenu3, #langmenu
{
	list-style-type: none;
	list-style-position: outside;
}

#projmenu
{
	position: absolute; top: 0px; left: 0px; width: 128px;
	text-align: right;
	margin: 0; padding: 0;
}

#langmenu
{
	position: absolute; top: 0px; left: 0px;
	margin: 0; padding: 0;
}

#miscmenu2
{
	position: absolute; top: 304px; left: 0px; width: 128px;
	text-align: right;
	margin: 0; padding: 0;
}

#miscmenu3
{
	position: absolute; top: 322px; left: 0px; width: 128px;
	text-align: right;
	margin: 0; padding: 0;
}

#miscmenu3 #language { display: none; }

ul#emails 
{
	list-style-type: none;
	list-style-position: outside;
	margin-left: 0; padding-left: 0;
}

ul.address
{
	list-style-type: none;
	list-style-position: outside;
	margin-left: 0; padding-left: 0;
}
h4
{
text-decoration: underline;
}
li { margin: 0; padding: 0; }

li.m1
{
	text-transform: uppercase; 
}

li.m2, li.m3
{
	text-transform: lowercase;
	line-height: 17px;
}

li.m4
{
	margin-top: 12px;
}

#miscmenu
{
	list-style-type: none;
	list-style-position: outside;
	position: absolute; top: 253px; left: 0px; width: 128px;
	text-align: right;
	margin: 0; padding: 0;
	border: 0;
	line-height: 12px;
	text-transform: lowercase;
}

#miscmenu li.m3, li.m4 { line-height: 12px; }

/* Various components of the project navigation box */

#navbox
{
	text-transform: lowercase;
	line-height: 12px;
	position: absolute; top: 282px; left: 0px; width: 128px;
	text-align: right;
	margin: 0; padding: 0;
}

#navbox_next
{
	position: absolute; top:0px; left: 118px;
	width:10px; height: 18px;
}

#navbox_prev
{
	position: absolute; top:0px; left: 104px;
	width:10px; height: 18px;
}

#navbox_next_x {
	position: absolute; top:0px; left: 118px;
	width:10px; height: 18px;
	background-image: url("i/r1x.png"); 
}

#navbox_prev_x {
	position: absolute; top:0px; left: 104px;
	width:10px; height: 18px;
	background-image: url("i/l1x.png"); 
}

.navbox_nptext
{
	display: none;
}

#navbox_info
{
	text-transform: lowercase;
	line-height: 12px;
	position: absolute; top: 280px; left: 0px; width: 128px;
	text-align: right;
	margin: 0; padding: 0;
}

#navbox_info li
{
	position: absolute;
	text-align: right;
	margin: 0; padding: 0;
}

/* Various components of the topbar menu */

#topbar
{
	position: absolute; top: 0; left: 0;
	width: 704px; height: 60px;
				border-width: 0 0 1px 0;
				border-color: #444;
				border-style: none;
}

#randombar
{
	position: absolute; top: 0; left: 64px;
	width: 640px; height: 45px;
	background-color: #292929;
}

#logo
{
	background-image: url("i/logo.png");
}

#logo h1 { display: none; }

#topbar div
{
	padding:0;
	margin:0;
	position: absolute;
	width: 64px;
	height: 45px;
	background-color: #111;
}


#bar0 { top: 0; left: 0px; }	
#bar1 { top: 0; left: 64px; }
#bar2 { top: 0; left: 128px; }
#bar3 { top: 0; left: 192px; }
#bar4 { top: 0; left: 256px; }
#bar5 { top: 0; left: 320px; }
#bar6 { top: 0; left: 384px; }
#bar7 { top: 0; left: 448px; }
#bar8 { top: 0; left: 512px; }
#bar9 { top: 0; left: 576px; }

/* The main content area */

#content_clipper
{
	z-index: 1; overflow: hidden;
	position: absolute; top: 60px; left: 128px;
	width: 576px; height: 371px;
}

#content_clipper.non_proj
{
	z-index: 1; overflow: hidden;
	position: absolute; top: 56px; left: 128px;
	width: 576px; height: 375px;
}

#archive_clipper
{
	z-index: 1; overflow: hidden;
	position: absolute; top: 30px; left: 0px;
	width: 512px; height: 371px;
}

#content
{
	position: absolute; top: 0; left: 64px;
	width: 512px; height: 371px;			
}

#leftbay
{
	position: absolute; top: 275px; left: 0px;
	width: 252px; height: auto;
	text-align: left;
	padding: 4px 0 0 0; margin: 0;
}

#rightbay
{
		z-index: -1;
	position: absolute; left: 260px;
	width: 252px; height: auto;
	text-align: left;
	color: white;
	margin: 0; padding: 4px 0 0 0; 
}

#rightbay.noshy span
{
	display: none;
}

#rightbay_top
{
	z-index: 1;
	position: absolute; top: 271px; left: 259px;
	width: 254px; height: 8px;
	background-color: black;
}

#rightbay_scroll
{
	z-index: 1;
	position: absolute; top: 279px; left: 236px;
	width: 168px; height: 24px;
}

#archive_scroll
{
	z-index: 1;
	position: absolute; top: 30px; left: 42px;
	width: 18px; height: 24px;
}

#scroll_up
{
	width:18px; height: 10px;
}

#scroll_up_x
{
	position: absolute; width:18px; height: 10px;
	background-image: url(i/u1x.png);
}

#scroll_down
{
	position: absolute; top:14px;
	width:18px; height: 10px;
}

#copynav
{ text-transform: lowercase; }

#rightbay p, #leftbay p
{
	margin: 0; padding: 0; 
	font-family: Helvetica, Arial, Verdana, sans-serif;
	font-size: 9px;
	line-height: 13px;
	font-weight: lighter;
	text-align: justify;
}

#leftbay h2, #leftbay h3
{
	width: 238px;
}

h2
{
	font-family: Verdana, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	letter-spacing: 1px;
	line-height: 15px;
	text-transform: lowercase;
	margin: 0 0 4px 0; padding: 0;
}

h3
{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 9px;
	letter-spacing: 1px;
	line-height: 10px;
	color: #999;
	text-transform: none;
	font-weight: lighter;
	margin: 0; padding: 0 0 3px 0;
	text-transform: none;
}

#art
{
	z-index: 2;
	background-color: black;
	width: 512px;
	height: 271px;
	background-repeat: no-repeat;
}

#art h1
{
	display: none;
}

/* Content for the non-project pages */

#monobay
{
	width: 252px;
	text-align: left;
	padding: 0px 0px 0px 0px; 
	font-family: Helvetica, Arial, Verdana, sans-serif;
	font-size: 9px;
	line-height: 12px;
	font-weight: lighter;
}

#bigbay
{
	width: 512px;
	text-align: left;
	padding: 0px 0px 0px 0px; 
	font-family: Helvetica, Arial, Verdana, sans-serif;
	font-size: 9px;
	line-height: 12px;
	font-weight: lighter;
}

#profile1
{
	width: 252px;
	position: absolute; top: 0px; left: 0;
}

#profile2
{
	width: 252px;
	position: absolute; top: 0px; left: 260px;
}

#profile3 p { padding: 0; margin: 0; }

div.resume ul
{
	list-style-type: square;
	list-style-position: outside;
	margin: 0; padding: 0;
	width: 240px;
}

div.resume li
{
	margin: 4px 0 0 0; padding: 0;
}

table.resume
{
	border-spacing: 0px;
	margin: 12px 0 0 0; padding: 0;
}

table.resume tr
{
	vertical-align: top;
}

td.job
{
	color: #ccc;
	text-align: left;
	padding: 0 4px 8px 0;
}

td.date, td.city
{
	color: #999;
	text-align: left;
	width: 60px;
	margin: 0 4px 8px 0;
}

table.archive
{
	border-spacing: 4px;
	margin-top: -10px;
	text-align: left;
	padding: 0px 0px 0px 0px; 
	font-family: Helvetica, Arial, Verdana, sans-serif;
	font-size: 9px;
	line-height: 12px;
	font-weight: lighter;
}

table.archive tr.head
{
	vertical-align: bottom;
}

table.archive tr.main
{
	vertical-align: top;
	padding: 0px 0px 2px 0px;
}

table.archive th
{
	text-align: left;
	font-size: 9px;
	line-height: 20px;
	font-weight: bold;
}

table.archive td.name
{
	color: #666;
	text-align: left;
	width: 124px;
}

table.archive td.desc
{
	color: #666;
	text-align: left;
	width: 188px;
}

table.archive td.city
{
	color: #666;
	text-align: left;
	width: 124px;
}

table.comments
{
	margin: 3px 0 0 0;
	padding: 0;
	border-spacing: 0;
	border-collapse: collapse;
}

td.form_text
{
	width: 48px;
	height: 26px;
	vertical-align: top;
	text-align: left;
	text-transform: uppercase;
	color: #999;
}

td.form_input
{
	height: 26px;
	vertical-align: top;
	text-align: left;
	color: #999;
}

td.form_button
{
	width: 254px;
	text-align: left;
}


input.box
{
	border-width: 1px; border-color: #999;
	background-color: black;
	padding: 2px;
	color: #999;
	font-family: Helvetica, Arial, Verdana, sans-serif;
	font-size: 9px;
	line-height: 12px;
	font-weight: lighter;
	height: 12px; width: 202px;
	margin: 0;
}

textarea
{
	z-index: 10;
	height: 84px; width: 244px;
	border-width: 1px; border-color: #999;
	background-color: black;
	color: #999;
	padding: 2px; 
	font-family: Helvetica, Arial, Verdana, sans-serif;
	font-size: 9px;
	line-height: 12px;
	font-weight: lighter;
}

input.button
{
	border-width: 1px; border-color: #999;
	background-color: #222;
	color: #aaa;
	font-family: Helvetica, Arial, Verdana, sans-serif;
	font-size: 9px;
	line-height: 12px;
	font-weight: lighter;
	padding: 2px;
	height: 16px; width: 96px;
	text-transform: uppercase;
	margin: 0;
}

div#form_button input:hover
{
	background-color: #333;
	color: white;
}


/* Front page */

#splash_logo
{
	position: absolute; left: 128px;
}

.splash_cities
{
	color: #999;
	width: 210px; 
	text-align: left;
	font-size: 9px;
	text-transform: uppercase;
	font-weight: lighter;
	line-height: 20px;
	margin: 0; padding: 0;
}

#splash_names 
{
	position: absolute; top: 120px; left: 320px;
	width: 210px; height: 20px;
	background-image: url(i/abtext.png);
	background-repeat: no-repeat;
}

#splash_names h2 { display: none; }

#two_cities
{
	position: absolute; top: 142px; left: 322px;
	width: 210px; 
}

/* Form output */

hr { display: none; }