@charset "utf-8";
/* Internal CSS */
/* indentation is used to indicate inheritance from parent */

/* -------------------------------------------------- */
/* ===== GENERAL STYLES ============================= */
/* -------------------------------------------------- */
body {
	background: #aee35e url(../images/green-bg.gif) bottom center no-repeat;
}


/* -------------------------------------------------- */
/* ===== STRUCTURE + LAYOUT ========================= */
/* -------------------------------------------------- */
#headerArea { 
	/*background: #353535 url(../images/black-bg.jpg) top left repeat-x; */
	background: #353535; /* Old browsers */
	background: -moz-linear-gradient(top,  #5c5c5c 0%, #353535 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#5c5c5c), color-stop(100%,#353535)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #5c5c5c 0%,#353535 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #5c5c5c 0%,#353535 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #5c5c5c 0%,#353535 100%); /* IE10+ */
	background: linear-gradient(top,  #5c5c5c 0%,#353535 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5c5c5c', endColorstr='#353535',GradientType=0 ); /* IE6-9 */
}
#contentArea { min-height: 450px; }
#extraArea { border-top: 1px solid #98c652; }
#header {
	height: 50px;
	position: relative;
	background: url(../images/lil-alien.gif) bottom right no-repeat;
}
#content {
	background: url(../images/content-bg.gif) bottom center no-repeat;
}
#main {
	float: right;
	width: 520px;
}
.aside {
	float: left;
	position: relative;
	left: -275px;
	width: 220px;
	margin: 1px -220px 0 0; /* margin-right equal to width above */
	clear: both;
}
	.screenshot { 
		left: -367px;
		width: 312px;
		margin: -2.1em -312px 0 0;
	}
	.aboutPic {
		width: 186px;
		margin-right: -186px;
	}
#extraContent {	
	padding: 20px 0 15px 0;
}


/* -------------------------------------------------- */
/* ===== HEADINGS =================================== */
/* -------------------------------------------------- */
h1 a#homeLink {
/*	width: 280px;
	height: 16px;
	background: url(../images/logo.gif) top left no-repeat;
	text-indent: -9000px;
	overflow: hidden;
	position: absolute;
	top: 20px;
*/
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 1.6em;
	text-transform: uppercase;
	text-shadow: 1px 1px 1px #000;
	color: #fff;
	line-height: 55px;
}
	a#homeLink:hover {
		text-decoration: none;
	}
	a #logoTitle {
		color: #ade600;
	}
h2 {
	font: 4.5em/2 "Trebuchet MS", Arial, Helvetica, sans-serif;
	color: #838383;
	text-transform: lowercase;
}
h3 {
	font: bold 1.5em/2 "Lucida Sans Unicode", "Lucida Sans", Arial, Helvetica, sans-serif;
	color: #8cbb00;
	text-transform: uppercase;
	letter-spacing: 1px;
	margin-bottom: 0.1em;
}
p + h3, ul + h3 {
	margin-top: 1.5em;
}
h3 + table, .aside + table {
	margin-top: 0.6em;
}
	h3.projectTitle {
		margin-top: 2em;
	}
	h3 a, h3 a:hover, h3 a:focus {
		color: #8cbb00;
		text-decoration: none;
	}


/* -------------------------------------------------- */
/* ===== TYPOGRAPHY ================================= */
/* -------------------------------------------------- */
p, td, ul.bullet, span.caption { 
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; 
}
dl, th, .aside p, .aside dd, .project  dd, #extraContent { 
	font-family: "Lucida Sans Unicode", "Lucida Sans", Arial, Helvetica, sans-serif; 
}
code { font: 0.9em "Courier New", Courier, monospace; color: #78a000; }
p, ul.bullet {
	font-size: 1.4em;
	line-height: 1.65;
	color: #666; 
}
	.aside p {
		font-size: 1.1em;
		line-height: 1.5;
		color: #808080;
	}
	ul.bullet li {
		line-height: 1.3;
	}
	ul.tweets li {
		line-height: 1.2;
	}
dt {
	font-size: 1.1em;
	font-weight: bold;
	line-height: 1.6;
	text-transform: uppercase;
	letter-spacing:	1px;
	color: #777;
}
	.aside dt {
		font-size: 0.9em;
		line-height: 1.4;
	}
	#extraContent dt, .extraHeading {
		font-weight: bold;
		font-size: 1.3em;
		line-height: 1;
		text-transform: uppercase;
		letter-spacing: 1px;
		color: #fff;
		text-shadow: 1px 1px 1px #789c41;
		margin-bottom: 0.8em;
	}
dd { }
	#extraContent dd {
		font-size: 1.3em;
		text-transform: capitalize;
		line-height: 1.4;
		color: #4e4e4e;
	}
	.aside dd {
		font-size: 1.1em;
		line-height: 1.5;
		color: #808080;
	}
	.project dd {
		font-size: 1.2em;
		line-height: 1.6;
		color: #666;
	}
	dl.siteURL dd { 
		line-height: 1.4;
	}
th {
	font-size: 1.3em;
	font-weight: bold;
	background: #9c0;
	color: #fff;
}
td {
	font-size: 1.2em;
	line-height: 1.2;
	background: #fff;
	color: #666;
}
.caption {
	font-size: 1.1em;
	text-align: center;
	color: #777;
}
.tweetText {
	font-size: 1.3em;
	line-height: 1.4;
	color: #4e4e4e;
}
.tweetTime, .tweetLink, .tweetReply {
	font-size: 1em;
	line-height: 1.7;
}
.tweetTime {
	color: #7f7f7f;
}


/* -------------------------------------------------- */
/* ===== MAIN ======================================= */
/* -------------------------------------------------- */
p, ul, ol, table, form, .screenshot {
	margin-bottom: 1.2em !important;
}
ul.bullet {
	margin-left: 20px;
}
	ul.bullet li {
		background: url(../images/bullet.gif) 0 0.5em no-repeat;
		padding-left: 1em;
		margin-bottom: 0.4em;
	}
.aside dt {
	margin: 0.2em 0;
}
table.tableBox {
	border-collapse: collapse;
	border-top: 2px solid #8cbb00;
	border-bottom: 2px solid #8cbb00;
}
	.tableBox th, .tableBox td {
		border-bottom: 1px solid #ade600;
		padding: 0.5em 1em;
	}
.framed {
	background: #fff;
	border: 1px solid #666;
	box-shadow: 0px 0px 3px #838383;
	-moz-box-shadow: 0px 0px 3px #838383;
	-webkit-box-shadow: 0 0px 3px #838383;
}
	img.profilePic { 
		margin-top: 5px;
		padding: 2px;
	}
	a.lightbox {
		display: inline-block;
		padding: 5px;
	}
	a.lightbox:hover, a.lightbox:focus {
		border: 1px solid #8cbb00;
		box-shadow: 0px 0px 8px #aee35e;
		-moz-box-shadow: 0px 0px 8px #aee35e;
		-webkit-box-shadow: 0px 0px 8px #aee35e;
	}
.caption {
	margin: 0.5em 0;
	display: block;
}
.projectArea {
	margin-top: 40px;
}
.project {
	border-top: 1px dashed #ccc;
	padding-bottom: 35px;
	clear: both;
}
.screenshot img {
	width: 300px;
}
dl.specList {
	float: left;
	width: 40%;
}
dl.completionDate {
	margin-bottom: 20px;
}
dl.specList dd {
	background: url(../images/bullet.gif) 1px 52% no-repeat;
	padding-left: 13px;
}
dl.siteURL dd {
	margin-bottom: 0.2em;
}


/* -------------------------------------------------- */
/* ===== EXTRAS ===================================== */
/* -------------------------------------------------- */
#extraContent dl {
	float: left;
	width: 215px;
}
.tweet {
	float: left;
	width: 520px;
}
ul.tweets {
	margin: 10px 0 0;
}
	ul.tweets li {
		margin-bottom: 10px;
	}
		.tweetText {
			display: block;
		}
		.tweetLink, .tweetReply {
			margin-left: 1.5em;
		}

			
/* -------------------------------------------------- */
/* ===== MISC ======================================= */
/* -------------------------------------------------- */

/* portfolio */
body#portfolioPage #content {
	background: none;
}
