html {background:#fff}
body {font-family:Arial,sans-serif;font-size:15px;margin:0;padding:0}
html>body {font-size:15px}

p {line-height:1.5em;margin:0 0 15px;padding:0}

h1 {color:#000;font-family:helvetica,arial,sans-serif;font-size:41px;letter-spacing:-2px;margin:0;padding:30px 0;text-align:center}
h2 {color:#777;font-family:georgia,times,serif;font-size:25px;font-weight:normal;margin:0;padding:0 0 10px;text-align:center}
h3 {color:#666;font-family:georgia,times,serif;font-size:16px;font-weight:normal;line-height:1.4em;margin:0;padding:0 0 20px}
h4 {font-family:georgia,times,serif;font-size:15px;font-weight:bold;margin:0;letter-spacing:-1px;padding:0;text-transform:uppercase}

div#topbar-container {background:#ddd}
div#topbar {margin:0 auto;overflow:auto;padding:0;width:960px}
    div#topbar h5 {display:inline;float:left;line-height:52px;margin:0;padding:0}
        div#topbar h5 a,
        div#topbar h5 span {background:url(/images/jb-logo.png) left top no-repeat;display:block;height:50px;text-indent:-999em;width:175px}
    div#topbar p {color:#ccc;display:inline;float:right;line-height:52px;margin:0;padding:0}
    div#topbar p a {color:#888;padding:0 10px;text-decoration:none}
    div#topbar p a:hover {color:#fff;text-decoration:underline}

div#opening {margin:0 auto;overflow:auto;width:960px}
    div#opening h2 {color:#333}
    div.detail {display:inline;float:left;margin:0 90px 40px;width:300px}
    div.detail a {background:#666;color:#fff;display:block;margin:0 10px 0 0;padding:10px;text-align:center}

div#testimonials {border-top:1px solid #aaa;overflow:auto;padding:20px 0}
    #testimonials h2 {color:#777;padding:0 0 20px}
    div#quotes {margin:0 auto;width:960px}
    #testimonials p {color:#888;display:inline;font-style:italic;float:left;padding:0 20px;width:200px}
    #testimonials p cite {display:block;font-style:normal;font-weight:bold;padding:10px 0 0;text-align:right}

div#contact {background:#666;color:#ccc;padding:20px 0}
    #contact h2 {color:#ddd;padding:0 0 20px}
    div#media {margin:0 auto;width:800px}
        #contact h4 {display:inline;float:left;margin:0;padding:0;text-align:center;width:200px}
        #contact h4 a, span.subline {color:#fff;display:block;font-size:17px;font-weight:normal;padding:5px 0 0;text-transform:lowercase}
    p#footer {clear:both;color:#888;font-size:11px;margin:0;padding:40px 0 0;text-align:center}

/* Freelance */

div#skills {border-top:1px solid #aaa;overflow:auto;padding:20px 0}
    div#skills h2 {padding-bottom:20px}
    div#column-holder {margin:0 auto;overflow:auto;width:805px}
        div#column-holder div {border-left:1px solid #ddd;display:inline;float:left;margin:0;padding:0;width:200px}
        div#column-holder div ul {color:#555}
    div#skills div#seo {border-right:1px solid #ddd}
    div#column-holder h3 {color:#000;font-size:18px;padding:0;text-align:center}

div#portfolio {border-top:1px solid #aaa;padding:20px 0}
    div#portfolio p {color:#888}
    div#latest,div#work-container {margin:0 auto;overflow:auto;padding:0;width:960px}
    div#latest {padding:0 0 40px}
        div#latest h3 {color:#333;font-size:26px;margin:0;padding:0 0 5px}
        div#latest h3 span {color:#aaa;font-size:16px;font-weight:bold;padding:0 10px}
        div#latest h4 {color:#888;font-size:17px;font-weight:normal;line-height:1.4em;text-transform:none}
    div.work {display:inline;float:left;width:460px}
        div.portfolio-item {height:140px;overflow:auto;padding:0}
        div.work h4 {color:#888;padding:0 0 5px}
        div.work h4 a.thumbnail {background:#aaa;display:block;float:left;height:100px;margin:0 10px 0 0;width:150px}
        div.work h4 a img {border:none}
    div#flash-work {padding: 0 40px 0 0}


/* Menu */

table {border:1px solid #444}
table th, table td, p.key {border:1px dotted #444;padding:.5em}
table th {background:#999;border-bottom: 1px solid #333;font-weight:bold}
tr.special td {border-bottom:1px solid #333;border-top:1px solid #333}
tr.beginner td, p.key {background:#dfd}
td.day, td.block, td.date {font-weight:bold}