@font-face {
	font-family: "Delicious Roman";
	src: url(fonts/Delicious-Roman.otf) format("opentype");
}

@font-face {
	font-family: "Delicious Bold";
	src: url(fonts/Delicious-Bold.otf) format("opentype");
}

/*
Copyright (c) 2009, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version: 2.7.0
*/
/**
 * YUI Reset
 * @module reset
 * @namespace
 * @requires 
 */
html {
	color: #000;
	background: #FFF;
}

body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
code,
form,
fieldset,
legend,
input,
button,
textarea,
p,
blockquote,
th,
td,
dl,
dt,
dd {
	margin: 0;
	padding: 0;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

fieldset,
img {
	border: 0;
}

address,
caption,
cite,
code,
dfn,
em,
strong,
th,
var,
optgroup {
	font-style: inherit;
	font-weight: inherit;
}

del,
ins {
	text-decoration: none;
}


caption,
th {
	text-align: left;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-size: 100%;
	font-weight: normal;
}

q:before,
q:after {
	content: '';
}

abbr,
acronym {
	border: 0;
	font-variant: normal;
}

sup {
	vertical-align: baseline;
}

sub {
	vertical-align: baseline;
}

/*because legend doesn't inherit in IE */
legend {
	color: #000;
}

input,
button,
textarea,
select,
optgroup,
option {
	font-family: inherit;
	font-size: inherit;
	font-style: inherit;
	font-weight: inherit;
}



/*
Copyright (c) 2009, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version: 2.7.0
*/
/**
 * YUI Base
 * @module base
 * @namespace yui-
 * @requires reset, fonts
*/

body {
	/* For breathing room between content and viewport. */
	margin:10px;
}

h1 {
	/* 18px via YUI Fonts CSS foundation. */
	font-size: 138.5%;
}

h2 {
	/* 16px via YUI Fonts CSS foundation. */
	font-size: 123.1%;
}

h3 {
	/* 14px via YUI Fonts CSS foundation. */
	font-size: 108%;
}

h1,h2,h3 {
	/* bottom margin based on font size. */
	margin: 0 0 1em;
}

h1,h2,h3,h4,h5,h6,strong,dt {
	/* Bringing boldness back to headers and the strong element. */
	font-weight: bold;
}
optgroup {
	font-weight:normal;
}

abbr,acronym {
	/* Indicating to users that more info is available. */
	border-bottom: 1px dotted #000;
	cursor: help;
}

em {
	/* Bringing italics back to the em element. */
	font-style: italic;
}

del {
	/* Striking deleted phrases. */
	text-decoration: line-through;
}

blockquote,ul,ol {
	/* Giving blockquotes and lists room to breath. */
	margin: 1em;
}

ol,ul {
	/* Bringing lists on to the page with breathing room. */
	margin-left: 2em;
}

ol {
	/* Giving OL's LIs generated numbers. */
	list-style: decimal outside;
}

ul {
	/* Giving UL's LIs generated disc markers. */
	list-style: disc outside;
}

/*dl dd {
	margin-left: 1em;
}
*/

th,td {
	/* Borders and padding to make the table readable. */
	border: 1px solid #ccc;
	padding: .5em;
}

th {
	/* Distinguishing table headers from data cells. */
	font-weight: bold;
}

caption {
	/* Coordinated margin to match cell's padding. */
	margin-bottom: .5em;
	/* Centered so it doesn't blend in to other content. */
	text-align: center;
}

sup {
	/* to preserve line-height and selector appearance */
	vertical-align: super;
}

sub {
	/* to preserve line-height and selector appearance */
	vertical-align: sub;
}

p,
fieldset,
table,
pre {
	/* So things don't run into each other. */
	margin-bottom: 1em;
}
/* Opera requires 1px of passing to render with contemporary native chrome */
button,
input[type="checkbox"],
input[type="radio"],
input[type="reset"],
input[type="submit"] {
	padding:1px;
}html {
	margin:40px 0;
	background:#fff fixed repeat 50% 0;
	font:normal 14px/1.8 "Lucida Grande",helvetica,arial,sans-serif;
}

body {
	width:873px;
	margin:0 auto;
	padding:0 0 0 70px;
	+margin-bottom:800px;
	color:#212629;
}

a {
	outline:0;
}

a,
span.phone {
	color:#ff5933;
	text-decoration:none;
}

a:hover {
	background:#FF5933;
	color:#fff;
}

h2,
div.details {
	width:300px;
	margin:0 0 20px -203px;
	padding:0;
	font:normal 30px/30px "Delicious Roman",helvetica,arial,sans-serif;
	letter-spacing:0.05em;
	color:#333;
	text-align:center;
/*	background:url(gfx/headings.png) no-repeat 0 0;
	text-indent:-999em;
*/}

div.details {
	width:120px;
	margin-left:-150px;
}

	h2 span,
	div.details ul {
		position:relative;
		top:-10px;
		background:#e8e9e9;
		padding:2px 15px 4px;
		margin:0 0 0;
		border:1px dashed #666;
		border-width:1px;
		line-height:1;
	}
	
	div.details ul {
		padding:0;
		list-style:none;
		font-size:14px;
	}
	
		div.details ul li {
			padding:5px 5px 5px 23px;
			border-bottom:1px dashed #666;
			background:url(gfx/sprite-icons-mini.png) -100px 0 no-repeat;
			line-height:1;
			text-align:left;
			font-size:11px;
		}
		
		div.details ul li.tags { background-position:5px 7px; }
		div.details ul li.date { background-position:5px -194px; }
		div.details ul li.comments { background-position:5px -392px; }
		div.details ul li.perma { background-position:5px -594px; }		
		div.details ul li.notes { background-position:5px -792px; }
	
h3 {
	font:normal 15px "Lucida Grande",helvetica,arial,sans-serif;
	letter-spacing:0.05em;
}

#header {
	position:fixed;
	top:0;
	left:0;
	width:100%;
	padding:30px 0;
	background:#212629;
	z-index:100;
}

	#header div.inner {
		width:873px;
		margin:0 auto;
	}
	
	
	h1 {
		float:left;
		width:346px;
		height:53px;
		margin:0 0 0 33px;
		background:url(gfx/logo.png);
		text-indent:-999em;
	}
	
		h1 a {
			display:block;
			height:100%;
		}
		
		h1 a:hover {
			background:none;
		}
	
	ul#nav {
		float:right;
		width:auto;
		list-style:none;
		margin:3px 50px 0 0;
		font:normal 18px "Delicious Roman",helvetica,arial,sans-serif;
	}

		ul#nav li {
			float:left;
			line-height:1;
		}
		
			ul#nav li a {
				float:left;
				padding:10px;
				margin:0 0 0 8px;
				border:1px dashed transparent;
			}
			
			ul#nav li a:hover {
				color:#FF5933;
				border-color:#666;
				background:#422e2a;
			}
			
			ul#nav li.sel a {
				border-color:#666;
				background:#212629;
			}
						
			ul#nav li a:active {
				background:#fff;
				color:#212629;
				border-color:#422E2A;
			}
	


div.intro {
	margin:0 0 30px;
	font-size:18px;
	border-bottom:1px dashed #666;
}

div.section	{
	width:auto;
	padding:140px 0 0;
}

.js-on div.section	{
	margin:800px 0;
}

	div.section div.inner {
		float:left;
		width:819px;
		margin:-50px 0 0;
		padding:0 0 10px 53px;
		border:1px dashed #666;
		border-width:0 0 1px 1px;
	}

.js-on div.section {
	/*margin:800px 0 0;*/
}


p.go-next {
	padding:30px 0 0;
	clear:both;
}
	
	p.go-next a,
	p.go-prev a {
		margin:0 auto;
		display:block;
		width:47px;
		height:80px;
		text-indent:-999em;
		background:url(gfx/sprite-arrows2.png) no-repeat 0 0;
	}
	
	p.go-next a.ad-1 { background-position:0 0; }
	p.go-next a.ad-2 { background-position:0 -100px; }
	p.go-next a.ad-3 { background-position:0 -200px; }
	
	p.go-prev a.au-1 { background-position:0 -300px; }
	p.go-prev a.au-2 { background-position:0 -400px; }
	p.go-prev a.au-3 { background-position:0 -500px; }
	

.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}

.clearfix {
	display: inline-block;
}

html[xmlns] .clearfix {
	display: block;
}

* html .clearfix {
	height: 1%;
}

div#contact h2 {
	
}

	#contact div.inner {
		zoom:1;
	}
	
		#contact div.inner p {
			font-size:16px;
			text-align:center;
		}div#intro {
	width:680px;
	margin:0 0 0 55px;
	padding:180px 0 30px 0;
	/*background:url(gfx/arrow-up.png) no-repeat 90% 50%;*/
	border-bottom:1px dashed #666;
	font-family:"Delicious Roman",helvetica,arial,sans-serif;
}

	div#intro p {
		font-size:24px;
		line-height:1.8;
	}
	
	div#intro p.last {
		text-align:right;
	}
	
		div#intro p.last strong {
			
		}

		div#intro p strong {
			font-weight:normal;
			background:#dedfdf;
			
			padding:0 3px;
			
		}
		
		div#intro p em {
			text-decoration:underline;
			font-style:normal;
		}
		
	
		#skills {
	
}

#skills div.inner {
	
}

#skills div.intro {
	margin:0 20px 30px;
}

#skills ul {
	list-style:none;
	float:left;
	width:auto;
	margin:0 0 20px -40px;
}

	#skills ul li {
		float:left;
		width:369px;
		text-align:left;
		margin:0 0 20px 40px;
		padding:3px 0 3px 20px;
		background:url(gfx/symbols.png) no-repeat 0 6px;
		font-size:12px;
	}
	
	#skills ul.expanded li {
		float:none;
		width:auto;
	}
		#skills ul li p {
		}
		
		#skills ul.expanded li p {
			position:static;
			left:0;
		}

		#skills h3 {
			font:normal 18px/18px "Delicious Roman",helvetica,arial,sans-serif;
			margin:0 0 8px;
		}
		

#skills p.show-details {
	display:none;
	padding:0 0 0 20px;
}

.js-on #skills p.show-details {
	display:block;
}#work {
	
}
	
	
	
	#work ul {
		list-style:none;
		float:left;
		width:auto;
		margin:0 0 20px -40px;
	}
	
		#work li {
			position:relative;
			float:left;
			width:389px;
			text-align:left;
			margin:0 0 20px 40px;
			padding:0 0 15px;
			border-bottom:1px dashed #ccc;
			font-size:12px;
		}
		
			#work li span {
				display:block;
				float:left;
				height:77px;
				border:3px solid #ccc;
				line-height:1;
			}
				
				#work li img {
					border:1px solid #777;
				}
	
			#work li h3,
			#work li p,
			#work li ul {
				width:280px;
				float:right;
				margin:0;
			}
			
			#work li h3 {
				margin:0 0 6px;
				font:normal 18px/18px "Delicious Roman",helvetica,arial,sans-serif;
			}
			
			#work li p {
				margin:0 0 8px;
			}
			
			#work li p.visit {
				width:auto;
				position:absolute;
				right:0;
				top:-2px;
				margin:0;
			}
			
			#work li p.visit:before {
				content:"» ";
			}
					
			#work li ul {
				margin:0 0 10px;
				padding:0;
			}
			
				#work li ul li {
					float:left;
					width:auto;
					margin:0 5px 5px 0;
					padding:2px;
					font-size:10px;
					line-height:1;
					color:#fff;
					text-transform:uppercase;
					border:0;
					background:#83ae57;
					word-wrap:break-word;
				}
				
				#work li ul li.design {
					background-image:url(gfx/clearbits/edit.gif);
				}
				
				#work li ul li.shop {
					background-image:url(gfx/clearbits/cart.gif);
				}
				
				#work li ul li.frontend {
					background-image:url(gfx/clearbits/html.gif);
				}
				
				#work li ul li.backend {
					background-image:url(gfx/clearbits/tools.gif);
				}