* { 
	padding:0;
	margin:0; 
}
.c {
	clear:both !important;
	float:none !important;
	display:block !important;
	width:0 !important;
	height:0 !important;
}
a img {
}
body {
	font-family:arial,verdana,sans-serif;
	font-size:12px;
	text-align:center;
	background:#181617 url(bg-dark.gif);
	color:#5f5f5f;
}
a {
	color:#989898;
}
a:hover {
	color:#b7b7b7;
}
a:active {
	color:#f2f8ff;
}
h1 {
	color:#e2e2e2;
	font-size:35px;
	text-transform:lowercase;
	letter-spacing:-2px;
	margin:0 0 10px 0;
	text-shadow:1px 1px 0 #000;
	font-weight:bold;
	font-family:Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
}
h1.topspace {
	padding-top:25px;
}
h2 {
	color:#d0d0d0;
	text-transform:uppercase;
	font-size:15px;
	margin-bottom:10px;
}
h2.subtitle {
	font-family: Constantia, "Lucida Bright", Lucidabright, "Lucida Serif", Lucida, "DejaVu Serif," "Bitstream Vera Serif", "Liberation Serif", Georgia, serif;
	color:#656667;
	text-transform:uppercase;
	font-size:15px;
	margin:-15px 0 0 0;
}
#page h2.subtitle {
	margin-bottom:20px;
}
h2.subtitle.ruled {
	border-bottom:1px dotted #222324;
	padding-bottom:10px;
}
h4 {
	color:#d0d0d0;
	font-size:15px;
	font-weight:bold;
	text-transform:uppercase;
	margin-bottom:10px;
}
h5 {
	color:#6a6c6d;
	font-size:12px;
	font-weight:bold;
	margin-bottom:10px;
}
.shadow {
	-webkit-box-shadow:2px 2px 2px #101010;
	-moz-box-shadow:2px 2px 2px #101010;
	box-shadow:2px 2px 2px #101010;
}
#page {
	padding:25px 0 40px 0;
}
#page p {
	line-height:20px;
}
p strong {
	color:#dfdfdf;
}
p.lined {
	background:url(p-lined.gif) top left repeat;
	line-height:30px;
	font-size:17.5px;
	margin-top:-3px;
}
#page p + p {
	margin-top:10px;
}
#page p + h4 {
	margin-top:10px;
}
#page ul, #page ol {
	margin-left:15px;
	margin-bottom:15px;
}
#page li {
	margin:10px 0;
}

#page p strong {
	color:#8e8f8f;
}
#top {
	height:40px;
	background:url(bg-dark-top.png) bottom left repeat-x;
}
body.home #top {
	height:120px;
}
.wrap {
	width:630px;
	margin:0 auto;
	text-align:left;
}
.wrap .pullleft {
	width:125px;
	margin-left:-160px;
	position:absolute;
}
.home .wrap .pullleft {
	margin-left:-145px;
}
.threecol .col {
	float:left;
	width:198px;
	margin:0 18px 0 0;
}
.threecol .col.last {
	margin-right:0;
}
#logo {
	display:block;
	height:119px;
	width:130px;
	overflow:hidden;
	text-indent:-1000em;
	margin:20px 0 0 0;
	background:url(logo.png) top left no-repeat;
}

.home #logo {
	margin:40px 0 0 0;
}
#logo:hover {
	background-position:bottom left;
}
.home #logo:hover {
	background-position:top left;
} 
.breadcrumbs {
	text-align:center;
	font-size:13px;
}
.breadcrumbs a, .breadcrumbs span {
	font-weight:bold;
	text-decoration:none;
	display:block;
	margin:5px 0;
}
.breadcrumbs a {
	display:block;
	height:28px;
	background:url(crumb-bg.png) top center no-repeat;
}
.breadcrumbs a:hover {
	background-position:bottom center;
	color:#202020;
}
.breadcrumbs a strong { 
	display:block;
	padding-top:5px;
}

#tabs {
	list-style:none;
	width:630px;
	margin:-35px auto 10px auto;
	text-align:left;
}
#tabs li {
	display:inline;
	margin-right:10px;
}
#tabs li a {
	font-size:14px;
	text-decoration:none;
	text-transform:lowercase;
	background:#1f1f20;
	
	padding:5px 15px;
	-webkit-border-radius:3px;
}
#tabs li.active a {
	color:#202020;
	background:#fff;
	letter-spacing:-1px;
	border:0 none;
	font-weight:bold;
}
/*
#tabs {
	width:630px;
	height:33px;
	overflow:hidden;
	list-style:none;
	margin:-35px auto 0 auto;
	padding:0;
}
#tabs li a {
	height:33px;
	width:122px;
	display:block;
	float:left;
	background-position:top left;
	text-indent:-1000em;
	overflow:hidden;
	margin:0 4px 0 0;
}
#tabs li a:hover {
	background-position:bottom left;
}
#tabs .tab-home a { background-image:url(tab-home.png); }
#tabs .tab-aboutme a { background-image:url(tab-aboutme.png); }
#tabs .tab-work a { background-image:url(tab-work.png); }
#tabs .tab-projects a { background-image:url(tab-projects.png); }
#tabs .tab-contact a { background-image:url(tab-contact.png); }
*/

.home #body {
	margin-bottom:25px;
}
#body {
	margin-bottom:5px;
}
#timeline {
	padding-top:105px;
	position:relative;
}
#timeline .bar {
	height:38px;
	width:632px;
	overflow:hidden;
	background:url(timeline.png) top left no-repeat;
}
#timeline .archives {
	display:block;
	width:63px;
	height:38px;
	background:url(timeline-older.png) top left;
	text-indent:-1000em;
	overflow:hidden;
	right:0;
	position:absolute;
	margin:-38px -2px 0 0;
}
#timeline .archives:hover {
	background-position:center left;
}
#timeline .archives:active {
	background-position:bottom left;
}
#timeline .axis {
	display:block;
	width:54px;
	height:19px;
	text-indent:-100em;
	overflow:hidden;
	margin-left:9px;
	background:url(timeline-axis.gif) top left no-repeat;
}
#timeline .bar ul {
	margin:0 0 0 20px;
	padding:1px 0 0 0;
}
#timeline .bar ul li {
	background:url(timeline-bar.gif) top center no-repeat;
	width:17px;
	margin:0 11px 0 -8px;
	height:36px;
	float:left;
	display:none;
}
#timeline .bar ul li a {
	display:block;
	width:17px;
	height:36px;
}
#timeline .bar ul li a img {
	width:17px;
	height:17px;
	margin-top:10px;
	background-position:top left;
}
#timeline .bar ul li.blurb a img { background-image:url(pt-tweet.png); }
#timeline .bar ul li.video a img { background-image:url(pt-video.png); }
#timeline .bar ul li.photo a img { background-image:url(pt-photo.png); }
#timeline .bar ul li.article a img { background-image:url(pt-article.png); }

#timeline .bar ul li a:hover img {
	background-position:bottom left;
}
.home #body .threecol {
	margin:15px 0 0 0;
}

.threecol.topborder .col {
	border-top:1px solid #2c2d2f;
	padding-top:20px;
}
.twocol .col {
	width:300px;
	float:left;
	border-top:1px solid #2c2d2f;
	padding-top:20px;
}
.twocol.noborder .col {
	border-top:0 none;	
	padding-top:0;
}
.twocol .col + .col {
	margin-left:25px;
}
.twocol.bottomspace {
	border-bottom:1px solid #2c2d2f;
	padding-bottom:10px;
	margin-bottom:15px;
}

.col h2 {
	padding:12px;
	background:url(col-header.gif) top left repeat-x;
	font-size:11px;
	text-transform:lowercase;
	color:#979797;
	position:relative;
}
.col h2 a {
	margin:-2px 0 0 0;
	padding:2px 4px;
	display:block;
	right:12px;
	top:12px;
	text-decoration:none;
	position:absolute;
	-webkit-box-shadow:-1px -1px 0 #0f0f11;
	-moz-box-shadow:-1px -1px 0 #0f0f11;
	box-shadow:-1px -1px 0 #0f0f11;
	background:#4c4c4f url(col-header-more.gif) bottom left repeat-x;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;
}
.col h2 a:hover {
	background:#27272b;
	margin-top:-1px;
}
.col h2 a:active {
	background:#1a1a1b;
}
#bio {
	background:#191a1a url(bg-darklight.gif);
	padding:12px;
	border-bottom:1px solid #1f2122;
	line-height:16px;
}
#bio strong {
	color:#929292;
}

#bio-buttons {
	margin:10px 0 0 0;
	height:28px;
	overflow:hidden;
}
#bio-buttons .button {
	width:63px;
	height:27px;
	text-indent:-1000em;
	overflow:hidden;
	display:block;
	float:left;
	margin-right:4px;
}
#bio-buttons .button.last { margin-right:0; }
.button.bio { background:url(button-bio.png) top left; }
.button.contact { background:url(button-contact.png) top left; }
.button.hire { background:url(button-hire.png) top left; }
.button:hover { background-position:center left; }
.button:active { background-position:bottom left; margin-top:1px; }

#subbody {
	background:#141516 url(bg-darkdark.gif);
	border-bottom:1px solid #1c1d1f;
}
#subbody .sep {
	height:17px;
	background:url(sep-pat-dark.png) top left repeat-x;
}
#subbody .wrap {
	padding:10px 0 25px 0;
}
h3.side {
	text-align:right;
	font-size:13px;
	color:#878787;
	text-transform:lowercase;
}
#colophon {
	padding:15px 0 15px 0;
	color:#2e2f31;
	font-size:11px;
}

/* articles list */

ul.articles {
	list-style:none;
}
ul.articles li {
	font-size:18px;
	height:50px;
	border-top:1px solid #212122;
}
ul.articles li a {
	color:#6d6d6d;
	padding:13px 15px 13px 25px;
	display:block;
	position:relative;
	text-decoration:none;
	background:url(doc.gif) 0 17px no-repeat;
}
ul.articles li a strong {
	color:#989898;
	text-decoration:underline;
}
ul.articles li span.read {
	cursor:pointer;
	font-size:11px;
	display:block;
	position:absolute;
	right:0;
	top:13px;
	color:#303033;
	padding:3px 5px;
	background:#1a1a1b;
	border:1px solid #1c1c1e;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;
}
ul.articles li a:hover {
	color:#f2f2f2;
}
ul.articles li a:hover strong {
	color:#fff;
}
ul.articles li a:hover span.read {
	color:#cbcbd1;
	border-color:#cbcbd1;
}
ul.articles li a:active span.read {
	background:#cbcbd1;
	color:#454545;
}

ul.socialmedia {
	list-style:none;
	margin:10px 0 0 0 !important;
	padding:0;
}
ul.socialmedia.horiz {
	margin:0 !important;
	height:40px !important;
}
ul.socialmedia li {
	height:40px !important;
}
ul.socialmedia.horiz li {
	float:left;
	margin-right:25px !important;
}
ul.socialmedia li a {
	display:block;
	padding:5px 0 5px 25px;
	text-decoration:none;
	color:#474849;
	background-position:0 5px;
	background-repeat:no-repeat;
	font-size:11px;
}
ul.socialmedia li strong {
	display:block;
	color:#92979c;
	font-size:14px;
}
ul.socialmedia li a:hover {
	color:#696969;
}
ul.socialmedia li a:hover strong {
	color:#f2f2f2;
}
ul.socialmedia li.twitter a { background-image: url(social-twitter.gif); }
ul.socialmedia li.facebook a { background-image: url(social-facebook.gif); }
ul.socialmedia li.vimeo a { background-image: url(social-vimeo.gif); }
ul.socialmedia li.flickr a { background-image: url(social-flickr.gif); }

#timeline-legend {
	list-style:none;
	margin:15px 0 0 0;
}
#timeline-legend li {
	height:17px;
	background-position:top right;
	background-repeat:no-repeat;
	padding-right:25px;
	text-align:right;
	text-transform:lowercase;
	font-size:11px;
	margin:0 0 3px 0;
}
#timeline-legend li span {
	padding-top:1px;
	display:block;
}
#timeline-legend li.blurb { background-image:url(pt-tweet.png); } 
#timeline-legend li.video { background-image:url(pt-video.png); } 
#timeline-legend li.photo { background-image:url(pt-photo.png); } 
#timeline-legend li.article { background-image:url(pt-article.png); } 

.project-space {
	height:149px;
}
.project-thumb {
	display:block;
	margin:15px 0 0 -1px;
	border-top:1px solid #191b1d;
	border-bottom:1px solid #191b1d;
	text-decoration:none;
}
.project-thumb.huge {
	width:415px;
}
.project-thumb p {
	background:#0e0e0f;
	padding:5px;
	font-size:11px;
	color:#4a4a4a;
}

.project-thumb p.type {
	margin-top:-22px;
	position:absolute;
	opacity:0.9;
	filter:alpha(opacity=90);
	-moz-opacity:0.9;
	-khtml-opacity: 0.9;
	font-size:10px;
}
.project-thumb p strong {
	color:#939393;
}
.project-thumb:hover p {
	color:#6a6a6a;
}
.project-thumb:hover p strong {
	color:#fff;
}
.project-thumb .new {
	display:block;
	height:41px;
	padding:0;
	margin:-2px 0 -39px 0;
	background:url(new.png) top right no-repeat;
	position:relative;
	z-index:100;
	text-indent:-1000em;
	overflow:hidden;
}

#callout {
	position:absolute;
	top:30px;
	left:100px;
	display:none;
}
#callout .b { 
	float:left;
	background:url(callout-center.gif) bottom left repeat-x;
}
#callout .bl { 
	background:url(callout-left.gif) bottom left no-repeat;
}
#callout .br { 
	background:url(callout-right.gif) bottom right no-repeat;
	padding:3px;
}
#callout .m {
	background:#0b0b0b;
	padding:10px;
	-moz-border-radius:2px;
	-webkit-border-radius:2px;
	border-radius:2px;
	border-top:1px solid #171719;
	overflow:hidden;
}
#callout .arrow {
	background:url(callout-pointer.png);
	width:30px;
	height:29px;
	position:absolute;
	bottom:-28px;
}
#callout .imgwrap {
	display:block;
	max-height:200px;
	overflow:hidden;
}
#callout .m .caption {
	text-align:left;
	font-size:11px;
	text-align:left;
	padding:5px 0 0 0;
}
#callout .m .caption p {
	display:inline;
}
#callout .m div.blurb {
	display:block;
	text-decoration:none;
	font-size:18px;
	font-style:italic;
	text-align:left;
	width:300px;
	padding:10px;
	font-family: Constantia, "Lucida Bright", Lucidabright, "Lucida Serif", Lucida, "DejaVu Serif," "Bitstream Vera Serif", "Liberation Serif", Georgia, serif;
}
#callout .m div.blurb p {
	display:inline;
}
#callout .m div.blurb p.ontwitter, #callout .m div.blurb p.blurbtitle, #callout .m div.blurb p.follow {
	font-family:arial,verdana,sans-serif;
	font-size:11px;
	font-weight:bold;
	font-style:normal;
	color:#b5b5b5;
}
#callout .m div.blurb p.ontwitter, #callout .m div.blurb p.blurbtitle {
	font-size:10px;
	text-transform:uppercase;
	display:block;
	margin-bottom:7px;
	height:14px;
}
#callout .m div.blurb p.ontwitter {
	padding-left:18px;
	background:url(callout-tweet.gif) top left no-repeat;
}
#callout .m div.blurb .time {
	color:#3a3a3a;
}
#callout .m .ontwitter a, #callout .m .follow a {
	text-decoration:none;
}
#callout .m .follow a {
	background:#141414;
	border:1px solid #191919;
	padding:2px 5px;
	margin-left:0.5em;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;
	color:#434343;
}
#callout .m .follow a:hover {
	color:#f2f2f2;
	border-color:#181818;
	background:#0d0d0d;
}
.fblike {
	margin-bottom:15px;
}
p.simplecaption {
	font-size:15px;
	margin-top:10px !important;
	padding:15px;
	background:#101010;
	line-height:20px
}

code {
	padding:10px;
	border-top: 1px dotted #212123;
	border-bottom: 1px dotted #212123;
	display: block;
	color: #777879;
	overflow: hidden;
	margin:10px 0;
	background:#101010;
	line-height:15px;
}
code strong {
	color: #f3e3c1;
	border: 1px solid #2a2a2a;
	padding: 5px;
	background: #212121;
}
code .comment {
	color: #2f3132;
}

hr {
	height:1px;
	border:0 none;
	color:#2c2d2f;
	background:#2c2d2f;
	margin:15px 0;
}


.caption-top, .caption-bottom {
	color: #ffffff;
	padding:5px;
	font-weight: bold;
	font-size: 11px;	
	font-family: arial;	
	cursor: default;
	background: #0d0e0e;
	text-shadow: 1px 1px 0 #202020;
}
.caption-top {
}
.caption-bottom {
}
.caption a, .caption a {
	border: 0 none;
	text-decoration: none;
	background: #000000;
	padding: 0.3em;
}
.caption a:hover, .caption a:hover {
	background: #202020;
}
.caption-wrapper {
	float: left;
}

a.button.download {
	width:128px;
	height:38px;
	display:block;
	text-indent:-1000em;
	overflow:hidden;
	background:url(download.png) top left;
}
a.button.download:hover {
	background-position:bottom left;
}
