/* -------------------------------------------------------------- 
  
   Boilerplate Screen Styles
   * Version:   0.5 (2007-11-19)
   
-------------------------------------------------------------- */

@import "lib/reset.css";
@import "lib/typography.css";
@import "lib/ie.css";
@import "lib/forms.css";


/* Layout
-------------------------------------------------------------- */

.wrapper { margin: 0 auto; width: 750px; position: relative; padding-right: 20px; }


/* Header
-------------------------------------------------------------- */

#header { background: #131312; border-bottom: 18px solid #fff; }
#logo { padding: 27px 0; }

ul#nav {
  position: absolute;
  top: 0;
  right: 0;
  background: transparent url(../img/bg-nav.gif) no-repeat 100% 0;
}
ul#nav li {
  display: inline;
  line-height: 1em;
}
ul#nav li a {
  text-indent: -9999px;
  display: block;
  height: 55px;
  overflow: hidden;
  float: left;
  margin-top: 30px;

}
li#t-about a {
  background: transparent url(../img/bg-t-about.gif) no-repeat 0 0;
  width: 58px;
}
li#t-portfolio a {
  background: transparent url(../img/bg-t-portfolio.gif) no-repeat 0 0;
  width: 87px;
}
li#t-blog a {
  background: transparent url(../img/bg-t-blog.gif) no-repeat 0 0;
  width: 53px;
}
li#t-contact a {
  background: transparent url(../img/bg-t-contact.gif) no-repeat 0 0;
  width: 69px;
}
li#t-about a:hover, li#t-portfolio a:hover, li#t-blog a:hover, li#t-contact a:hover {
  background-position: 0 -55px;
}


/* Title
-------------------------------------------------------------- */

#title { background: #f7d700; border-top: 1px solid #edce00;}
#title h1 { font-size: 2.5em; padding-top: 26px; }
#title h1 span { font-size: 1.6em; display: inline; letter-spacing: -0.02em; }


/* Body
-------------------------------------------------------------- */

#body {
  background: #fff url(../img/bg-body.png) repeat-x 0 0;
}
#portfolio {
  background: #fff url(../img/bg-tip.png) no-repeat 0 0; 
  padding-top: 2em; 
}
.portfolio-item {
  float: left;
  margin: 0 20px 20px 0;
  width: 230px;
}
.last-item {
  margin: 0 0 20px 0;
}


/* Footer
-------------------------------------------------------------- */

#footer { clear: both; margin-top: 20px; }