
div, p, li, a {font-family: Arial, Helvetica, sans-serif; color: #333;}
ul {margin: 0; padding: 0; list-style: none;}
a {}

body {width: 100%; height: 100%; margin: 0; padding: 0; font-size: 100%;}

.container {padding: 243px 0 5px 0; background: url(images/bg_header.jpg) top center no-repeat;}

/* nav */
#navigation {width: 980px; margin: -50px auto 0 auto;}
#navigation table {margin-left: auto;}
#navigation td {padding: 0 10px;}
#navigation a span {display: none;}
.bt_work, .bt_resume, .bt_contact, .bt_blog {height: 48px; display: block; background: top left no-repeat;}
#navigation .bt_work {width: 53px; background-image: url(images/bt_work.gif);}
#navigation .bt_resume {width: 52px; background-image: url(images/bt_resume.gif);}
#navigation .bt_contact {width: 69px; background-image: url(images/bt_contact.gif);}
#navigation .bt_blog {width: 39px; background-image: url(images/bt_blog.gif);}


#header {height: 159px; background: url(images/bg_namebar.jpg) bottom left repeat-x;}
h1, #content, #footer {width: 980px; margin: 0 auto;}
h1 a {display: block; width: 290px; height: 198px; background: url(images/logo_name.jpg) top left no-repeat; position: relative; top: -39px; left: 51px;}
h1 a span {display: none;}

#content {width: 930px; padding: 30px 0 0 50px;}

/* resume section*/
.resume {width: 806px; margin: 0 auto; padding: 20px; border: 1px solid #ccc;}
.resume h2 {height: 150px; background: url(images/bg_resume.jpg) center right no-repeat; border-top: 1px solid #ccc; border-bottom: 1px solid #ccc;}
.resume h2 span {display: none;}

.resume .skillbar ul {width: 241px; margin-right: 5px; float: left;}
.resume .skillbar h5 {margin: 0; font-size: 1.2em; text-transform: uppercase;}
.resume .skillbar li {font-size: 0.75em;}

.resume .history {width: 100%; margin-top: 20px; clear: left; border-top: 1px solid #ccc;}
.resume th, .resume td {padding: 4px; font-size: 0.7em; text-align: left; vertical-align: top;}
.resume th {width: 100px;}
.resume .history .companyname, .resume .history .position {font-size: 1.1em; font-weight: bold; white-space: nowrap;} 
.resume .history .role {width: 70%;}

.resume .personal {margin-top: 20px; padding: 10px; border: 1px solid #ccc;}
.resume .personal h5 {margin: 0 0 0.5em 0; color: #666;}
.resume .personal li {padding: 3px 0; font-size: 0.7em;}


/* portfolion */

/* works navigation */
.works {padding: 10px 0 20px 0; border-top: 1px solid #ddd;}
.works ul {clear: left;}
.works li {margin: 4px 20px 4px 4px; float: left; white-space: nowrap;}
.works .recent li {font-size: 0.75em;}
.works .past {margin-left: 71px;}
.works .past li {font-size: 0.7em; color: #777;}

.showcase {}
.showcase h3 {margin-bottom: 0; padding-bottom: 0; font-size: 2.5em; color: #4f781d; letter-spacing: -0.1em;}
.showcase .url {margin-top: -5px;}
.showcase .url a {color: #777; font-size: 0.7em;}
.showcase .screens {width: 776px; border: 1px solid #ddd; padding: 6px 0 4px 6px;}
.showcase .screens img {margin-right: 5px;}
.showcase .blurb {width: 60%; font-size: 0.75em;}

#footer {margin-top: 100px; border-top: 1px solid #ddd; font-size: 0.7em; text-align: right;}


/* text replacement */
.textimg span {display: none;}
.txt_work, .txt_exp, .txt_proj, .txt_edu {display: block; background: top left no-repeat;}
.txt_work {width: 47px; height: 17px; background-image: url(images/txt_work.gif);}
.txt_exp {width: 73px; height: 43px; background-image: url(images/txt_exp.gif);}
.txt_proj {width: 76px; height: 43px; background-image: url(images/txt_proj.gif);}
.txt_edu {width: 71px; height: 43px; background-image: url(images/txt_edu.gif);}