body {
  background-color: #8a878e;

  background-image: url(img/body-bg-light.png),
                    url(img/body-bg-tree.png),
                     url(img/body-bg-grid.png),
                    url(img/body-bg-graytile.jpg);
                    
  background-repeat: no-repeat,
                     no-repeat,
                     repeat-y,
                     repeat;

  background-position: top left,
                       bottom left,
                       top left,
                       top left;
                       
  background-attachment: fixed,
                         scroll,
                         scroll,
                         scroll;

  min-height: 900px;
  
  font-family: 'Helvetica Neue', Arial, sans-serif;
  font-size: 11px;
  line-height: 18px;
  color: rgba(39, 34, 37, .75);
  text-shadow: rgba(0,0,0,0.01) 0 0 0;
  margin: 0; padding: 0 40px;
}

#wrap { margin: 4px 0 0 0; padding: 0 0 108px 0; width: 920px; position: relative; }

a { color: rgba(39, 34, 37, .75); text-decoration: none; background: transparent url(img/a-underline.png) left bottom repeat-x; padding-bottom: 2px; -webkit-transition: all .35s ease-out; } 
a:hover { color: rgba(11, 7, 9, .95); }

h1 { margin: 0; padding: 0; margin-bottom: 36px; }
h1 a { display: block; width: 220px; height: 90px; text-indent: -1000px; background: transparent url(img/sprites.png) 0 0 no-repeat; }
h1 a:hover { background-position: -220px 0; text-decoration: none; }

h2 { width: 220px; height: 36px; float:left; margin: 0 10px 0 0; padding: 0; text-indent: -1000px; background: transparent url(img/sprites.png) 0 -300px no-repeat; }
#title-info {  background-position-y: -350px; }
#title-misc {  background-position-y: -400px; }

h3 { font-size: 10px; line-height: 18px; color: rgba(242, 242, 242, .9); text-transform: uppercase; margin: 0; padding: 0; }

ul { margin: 0; padding: 0; }
li { list-style: none; margin: 0; padding: 0; }
p { margin: 0 0 18px 0; padding: 0; }
em { font-weight: bold; font-style: normal; }

#nav { width: 220px; height: 20px; position: absolute; right: 0; top: 71px; } /* Place #nav to the far right of #wrap, align bottom to baseline of H1 */
#nav a { display: inline-block; width: 20px; height:20px; text-indent: -1000px; background: transparent url(img/sprites.png) 0 -200px no-repeat; }
#nav a:hover { background-position-y: -220px; text-decoration: none; }
#nav a.inactive { background-position-y: -240px; }
#nav a#prev { margin-left: 69px; }
#nav a#next { background-position-x: -20px; }
#nav a#show-toc { background-position-x: -40px; }

.section { display: inline-table; margin-bottom: 49px; }
.col-1,.col-2,.col-3,.col-4 { float: left; margin-right: 10px; margin-top: 18px; }
.col-1 { width: 105px; }
.col-2 { width: 220px; }
.col-4 { width: 450px; }
.col-3 .col-1 { margin-top: 0px; }
.col-3 .col-1:last-child { margin-right: 0; }
.col-first {	padding-left: 230px; }


.list {  }
.list li { background: transparent url(img/a-list-blue.png) left center no-repeat; margin-left: -13px; padding-left: 13px; }
#categories li { background-image: url(img/a-list-pink.png); }
.list a { display:block; padding:0 0 0 5px; margin: 0 13px 0 -5px; background-image:none; background-color: rgba(255, 255, 255, 0); -webkit-border-radius:3px; -moz-border-radius:3px; }
.list a:hover { background-color: rgba(255, 255, 255, .33); }

.client-list li { font-style: italic; }

#keyword-graph { width: 680px; float: left; padding-top: 18px; }
a.keyword	{ display: block; margin: 0 0 9px 0; width: 200px; text-align: right; padding: 0 10px; background-color: rgba(255,255,255,.75); font-size: 10px; line-height: 18px; text-transform: uppercase; font-weight: bold; background-image: none; -webkit-border-radius:4px; -moz-border-radius:4px; -webkit-transition: all .25s ease-out; }
a.keyword:hover { text-decoration: none; background-color: rgba(127, 225, 241, .75); color: rgba(255, 255, 255, .75); }
#keyword-iphone { margin-left: 0; width: 200px; }
#keyword-flash { margin-left: 90px; width: 450px; background-color: rgba(255,204,221,.75); }
#keyword-flash:hover { background-color: rgba(127, 225, 241, .75); }
#keyword-webstandards { margin-left: 60px; width: 320px; background-color: rgba(127, 225, 241, .75); }
#keyword-design { margin-left: 150px; width: 280px; }

#holding { width:380px; height:52px; background-position:0px -450px; margin-top: 133px; }
