@charset 'utf-8';
@import url(reset.css);

/* ----------------------------------------------------- All browsers */

body { background:#FFFFFF url(img/header_bg.gif) top left repeat-x;; color:#444; font-size:12px; line-height:18px; font-family:Georgia, "Times New Roman", Times, serif; margin:0; padding:0; }
.clear { clear:both; height:0 !important; display:block; }

h1 { float:left; background-image:url(img/hornergraphic.gif); width:300px; padding-top:154px; color:#FFF; height:0; overflow:hidden; }
h2 { color:#0E0E0E; margin-bottom:15px; display:block; font-style:italic; font-size:28px; background:url(img/h2_bg.gif) repeat-x top left; }

p { padding:0 0 12px 0; }
a { color:#0E0E0E; text-decoration:underline; font-weight:bold; font-style:italic; }
a:hover { text-decoration:none; }

#header { height:154px; padding:0; margin-bottom:35px; }
#header div { width:960px; }
#header p { padding:69px 0 0 25px; color:#878787; font-size:13px; font-style:italic; float:left; }

#portfolio { width:75%; float:left; }
#portfolio .item { width:345px; height:350px; float:left; padding:0 30px 75px 0; }
#portfolio .item .wrap { padding:0 0 0 25px; }
#portfolio .preview { display:block; border:1px solid #DDD; padding:9px; margin:0 0 8px 0; }
#portfolio .roles { font-size:9px; width:220px; float:left; }
#portfolio .roles ul li { margin:0 4px 0 0; color:#777; padding:3px 5px; background:#EEE; display:inline; }
#portfolio .view { text-align:right; font-size:10px; float:right; padding:0 3px; }
#portfolio h2 { width:320px; padding-left:25px; }

#sidebar { width:200px; float:left; padding:30px 30px 0 0; }
#sidebar .item { padding:10px 0 30px 0; background-image:url(img/sidebar_bg.gif); background-repeat:no-repeat; }
#sidebar h2 { font-size:19px; padding:0 0 0 10px; background:url(img/h2_bg_sidebar.gif) repeat-x top left; }
#sidebar a { padding:1px 3px; }


#sidebar #bio { background-position:118px 3px; }
#sidebar #bio p { font-size:14px; line-height:19px; }

#sidebar #experience { background-position:20px 0; }

#sidebar #twitter { background-position:7px 0; }
#sidebar #twitter li { padding:0 0 12px 0; }
#sidebar #twitter li a { font-weight:normal; padding:0 1px; }

#footer { height:410px; background:url(img/footer_bg.jpg) bottom right no-repeat; margin-top:-75px; position:relative; }

#contact { list-style:none; }
#contact li { list-style:none; display:block; width:150px; height:150px; text-align:center; padding:0 0 12px 0; position:absolute; }
#contact li a { font-style:italic; font-weight:normal; color:#FFFFFF; font-size:18px; display:block; width:108px; height:60px; padding:43px 21px 47px; background:url(img/footer_a.gif) top left no-repeat; background-color:none !important; text-decoration:none !important; }
#contact li a span { font-size:13px; color:#696969; display:block; border-bottom:1px solid #FFFC00; padding-bottom:5px; margin-bottom:5px; }
#contact li a:hover { background-position:left -150px; color:#0E0E0E; }
#contact li a:hover span { border-bottom:1px solid #FFF; }

#c_twitter { top:50px; right:772px; }
#c_linkedin { top:180px; right:390px; }
#c_blog { top:100px; right:530px; }
#c_email { top:50px; right:275px; }

#top { position:absolute; bottom:40px; left:25px; padding:1px 3px; }

#copyright { position:absolute; bottom:15px; left:25px; color:#999; font-style:italic; }

* { zoom:1; }

/* ----------------------------------------------------- JS enabled browsers */

.js div { }

/* ----------------------------------------------------- IE7 and below */

.ie7 h2 { font-weight:normal !important; font-style:normal !important; }
.ie7 #contact li a { padding:43px 0 47px !important; width:150px !important; }
.ie7 #contact li a span { width:108px; margin:0 auto 5px; }

/* ----------------------------------------------------- IE6 and below */

.ie6 h2 { font-weight:normal !important; font-style:normal !important; }
.ie6 #contact li a { padding:43px 0 47px !important; width:150px !important; }
.ie6 #contact li a span { width:108px; margin:0 auto 5px; }