/****************************
 Global CSS Reset
*****************************/
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, sub, sup, tt, var,
b, u, i, center,
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-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
body {line-height: 1em;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}

/* remember to define focus styles! */
:focus {outline: 0;}

/* remember to highlight inserts somehow! */
ins {text-decoration: none;}
del {text-decoration: line-through;}

/* tables still need 'cellspacing="0"' in the markup */
table {border-collapse: collapse; border-spacing: 0;}


/****************************
 Global element types
*****************************/
html, body {height:100%;}
body {
	background-color:#fff;
	background:
		url('/images/graphics/background-winter.png') no-repeat 0 100% fixed,
		url('/images/graphics/background-dots.png') repeat 0 0,
		url('/images/graphics/background-gradient.jpg') repeat-x 0 0;
	font:69%/1.4 Helvetica, Arial, sans-serif;
	color:#333;
}

a {color:#00acee; text-decoration:none;}

a:hover, a:active {background-color:#00acee; color:#fff;}

a.arrow {background: url('/images/graphics/arrow.jpg') no-repeat 0 1px; padding-left: 12px;}
a:hover.arrow, a:active.arrow {background: url('/images/graphics/arrow.jpg') no-repeat 0 -17px;}

a img, a, img {border:none;}

abbr, acronym {border-bottom: 1px dashed #454545;}

p,
h1, h2, h3, h4, h5, h5,
ul, ol {margin: 0 0 1.4em 0;}

object, embed {display:block;}


/****************************
 Content
*****************************/
section {background:rgba(255,255,255,0.85); display:block; font-size:200%; padding:20px; position:absolute; width:350px;}

section#about {left:169px; top:120px;}
section#networks {right:362px; /*top:230px;*/ top:750px; width:370px;}
section#contact {right:258px; /*top:290px;*/ top:1250px; width:420px;}

section#about p {padding:5px 20px;}

.vcard {font-style:normal; font-size:60%; overflow:hidden; width:420px;}
.vcard p.fn, .vcard p.intro {font-size:180%;}
.vcard p.fn {font-weight:bold; margin-top:15px;}
.vcard p.resume, .vcard p.addCard, .vcard p.arrow {background:transparent url('/images/graphics/icon-matrix.png') no-repeat 0 0; float:left; padding:0 0 0 20px; width:300px;}
.vcard p.resume {background-position:0 -18px; margin-top:15px;}
.vcard p.arrow {background-position:-6px -30px; margin-top:15px; padding-left:13px;}

header {display:block; position:relative; text-align:right; width:99%}
header img {display:inline-block; margin-right:45px;}
#twitterFeed {text-align:left; position:absolute; right:240px; top:30px; width:130px;}
#twitterFeed .entry-meta {visibility:hidden;}
#footer {bottom:15px; color:#666; padding:0 0 0 50px; position:fixed; right:0; width:200px;}

.hidden {left:-9000px; position:absolute; top:-9000px;}

nav ul li {background:transparent url('/images/graphics/navigation-matrix.png') no-repeat 10px 12px; font-size:320%; line-height:0; padding:7px 10px 0 45px; z-index:1;}
nav ul li:hover, nav ul li.active {background-color:transparent; background-position:10px -36px;}
nav ul li.active {background-position:10px -84px;}
nav ul li#navAbout {background-position:120px 12px; position:absolute; left:60px; padding:7px 45px 0 10px; top:120px;}
nav ul li#navNetworks {position:absolute; right:200px; top:180px;}
nav ul li#navContact {position:absolute; right:120px; top:250px;}
/*nav ul li#navNetworks.active {background-position:64px -81px; padding-left:99px;}*/

nav ul li a {color:#545454;}
nav ul li a:hover, nav ul li.active a {background:none; color:#00acee; text-decoration:none;}

#socialBookmarks {padding:0; width:auto;}
#socialBookmarks li {padding:10px 0 10px 50px;}
.delicious, .twitter, .linkedIn, .facebook, .flickr, .skype {background:transparent url('/images/graphics/social-network-matrix-black2.png') no-repeat 0 5px;}
.twitter {background-position:0 -222px;}
.linkedIn {background-position:0 -120px;}
.facebook {background-position:0 -60px;}
.flickr {background-position:0 -168px;}
.skype {background-position:0 -280px;}