/* MINIMAL RESET + UNRESET */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; }
:focus { outline: 0; }
body { line-height:1; color:black; background:white; }
ol, ul { list-style:none; }
table { border-collapse:separate; border-spacing:0; } /* need cellspacing="0" */
caption, th, td { text-align:left; font-weight:normal; }
blockquote:before, blockquote:after, q:before, q:after { content: ""; }
blockquote, q { quotes: "" ""; }
a img { border: 0; }
body { font-size: 62.5%; }
b, strong { font-weight: bold; }
i, em { font-style: italic; }
u, ins { text-decoration: underline; }
s, strike, del { text-decoration: line-through; }

/* DESIGN */

body { background:#777; font-family:"Lucida Grande", "Lucida Sans", "Lucida Sans Unicode", Helvetica, Arial, sans-serif; }
#page { width:100%; height:100%; color:#bbb; }
#content { position:fixed; right:0; width:250px; height:100%; padding:60px 0 0 50px; background:url("images/logo.png") 0 0 no-repeat; }

h1 { display:block; height:170px; text-indent:-9999px; overflow:hidden; background:url("images/header.png") 0 120px no-repeat; }
	h1:hover { cursor:pointer; }
h2 { color:#bbb; text-transform:uppercase; font-size:1.2em; }
ul { line-height:24px; margin:16px 0 0 0; font-size:1.2em; }
a { color:#bbb; text-decoration:none; }
ul a { display:block; padding-left:0px; }

#pages { font-size:1.4em; line-height:28px; text-transform:uppercase; margin:28px 0 0 0; }
#contacts #vcard a { text-transform:uppercase; color:#333; font-size:10px; }
#social { text-transform:lowercase; }
#contacts a, #social a, #contacts, #social { color:#777; }

#quote { position:absolute; top:50%; left:50%; width:500px; height:500px; margin:-250px -400px; }
#quote p { width:500px; height:500px; display:table-cell; vertical-align:middle; color:#e6e6e6; }
#quote q { font:5em Helvetica, Arial, sans-serif; font-weight:bold; letter-spacing:-0.05em; line-height:0.9em; }
#quote cite { font:italic 3em "Hoefler Text", Garamond, Baskerville, Georgia; display:block; margin:30px 0 0 0; }

#alt { position:absolute; top:0; left:0; width:340px; height:16px; padding:10px; color:#ddd; background:#111; background: rgba(16,16,16,0.5); font-size: 1.2em; -webkit-border-bottom-right-radius: 15px; -moz-border-radius-bottomright: 15px; }
#alt a { color: #eee; border-bottom: 1px dotted #999; }

#dribbble { z-index:20; position:absolute; bottom:0; left:0; width:216px; height:49px; background: url("images/dribbble.png"); }

#blah { position:absolute; top:20%; left:30%; width:55%; margin:-60px -210px; background:0 0 no-repeat; }
	#blah h2 { font-size:48px; font-weight:bold; text-transform:none; margin:0 0 30px; color:#fff; text-shadow:2px 2px 1px #000; }
	#blah h3 { font-size:24px; font-weight:bold; margin:0 0 15px; color:#eee; }
	#blah p { color:#eee; font-size:13px; line-height:24px; margin:0 0 15px; }
	.element { width:650px; margin:0 0 30px; color:#eee; line-height:20px; font-size:13px; }
		.element .pic { float:right; border:4px solid #eee; }
		.element .pic:hover { border:4px solid #a6e7c6; cursor:pointer; }
		.element .text { float:left; text-align:right; width:175px; }
		.element .title { font-size:16px; color:#fff; margin:0 0 15px; }
		.element em { color:#a6e7c6; font-style:normal; font-weight:bold; }
	.col { float:left; width:48%; margin:0 15px 15px 0; }
		
.clear { clear:both; height:1px; margin-top:-1px; overflow:hidden; }


.bezel { position:absolute; top:50%; left:50%; width:120px; height:120px; margin:-60px -210px; background:0 0 no-repeat; }
#bezel-blog 		{ background-image:url("images/bezels/blog.png"); }
#bezel-services		{ background-image:url("images/bezels/services.png"); }
#bezel-portfolio 	{ background-image:url("images/bezels/portfolio.png"); }
#bezel-projects 	{ background-image:url("images/bezels/projects.png"); }
#bezel-about 		{ background-image:url("images/bezels/about.png"); }
#bezel-email 		{ background-image:url("images/bezels/email.png"); }
#bezel-tel 			{ background-image:url("images/bezels/tel.png"); }
#bezel-location 	{ background-image:url("images/bezels/location.png"); }
#bezel-vcard 		{ background-image:url("images/bezels/vcard.png"); }
#bezel-tumblr 		{ background-image:url("images/bezels/tumblr.png"); }
#bezel-twitter 		{ background-image:url("images/bezels/twitter.png"); }
#bezel-behance 		{ background-image:url("images/bezels/behance.png"); }
#bezel-facebook 	{ background-image:url("images/bezels/facebook.png"); }
#bezel-linkedin 	{ background-image:url("images/bezels/linkedin.png"); }

/* code is poetry */