/* Color definition */

    .brown                              { color: #3f342e; }
    .pink                               { color: #edb3e4; }
    .accent                             { color: #584648; }

    /* Page elements */

    html, body                          { height: 100%; }
    body#main                           { margin: 0; padding: 0; background-color: #fff; text-align: center; }
    #container                          { min-height: 100%; width: 800px; margin: 0 auto; text-align: left; background-color: #3f342e; }
    * html #container                   { height: 100%; }

    #container #hat                     { width: 800px; height: 32px; background: url(./images/header-hat.gif) repeat-x; }
    #container #head                    { height: 60px; background: #fff url(./images/header-bg.gif) -25px 0 repeat-y; text-align: right; }
    #container #head #logo              { width: 315px; height: 60px; background: url(./images/header-logo.gif) no-repeat; float: right; }
    #container #tie                     { width: 800px; height: 10px; background: url(./images/header-tie.gif) repeat-x; }
    #container #foot                    { font-size: 12px; text-transform: uppercase; letter-spacing: 2px; color: #3f342e; padding: 10px 25px; margin: -15px 0 0 0; background-color: #584648; text-align: center; }

    #navigation                         { text-align: center; }
    #navigation div                     { width: 400px; margin: 0 auto; text-align: left; }
    #navigation div span.decor          { width: 36px; height: 36px; display: block; float: left; }
    #navigation div span.decor.left     { background: url(./images/nav-decor-left.gif); }
    #navigation div span.decor.right    { background: url(./images/nav-decor-right.gif); }
    #navigation ul                      { margin: 0; padding: 0; list-style: none; }
    #navigation ul li                   { margin: 0; padding: 0; float: left; }
    #navigation ul li a span            { height: 36px; display: block; background-image: url(./images/nav.gif); }
    #navigation ul li a span.home       { background-position: 0 0; width: 74px; }
    #navigation ul li a span.portfolio  { background-position: -75px 0; width: 95px; }
    #navigation ul li a span.blog       { background-position: -170px 0; width: 62px; }
    #navigation ul li a span.contact    { background-position: -232px 0; width: 90px; }
    #navigation ul li a:hover span.home,
    #navigation ul li a span.home.sel           { background-position: 0 -36px; }
    #navigation ul li a:hover span.portfolio,
    #navigation ul li a span.portfolio.sel      { background-position: -75px -36px; }
    #navigation ul li a:hover span.blog,
    #navigation ul li a span.blog.sel           { background-position: -170px -36px; }
    #navigation ul li a:hover span.contact,
    #navigation ul li a span.contact.sel        { background-position: -232px -36px; }
    
    #portfolio                          { text-align: center; }
    #portfolio div                      { margin: 0 auto; text-align: left; }
    #portfolio div span                 { width: 400px; height: 350px; display: block; float: left; background: url(./images/portfolio-side.gif); }
    #portfolio ul                       { margin: 0; padding: 0; list-style: none; float: left; }
    #portfolio ul li                    { width: 300px; height: 50px; margin: 0; padding: 0; display: block; }
    #portfolio ul li a span             { width: 300px; height: 50px; display: block; background-image: url(./images/portfolio-nav.gif); }
    #portfolio ul li a span.nature      { background-position: 0 0; }
    #portfolio ul li a span.sunsets     { background-position: 0 -50px; }
    #portfolio ul li a span.flowers     { background-position: 0 -100px; }
    #portfolio ul li a span.structures  { background-position: 0 -150px; }
    #portfolio ul li a span.animals     { background-position: 0 -200px; }
    #portfolio ul li a span.weddings    { background-position: 0 -250px; display: none; }
    #portfolio ul li a span.people      { background-position: 0 -300px; display: none; }
    #portfolio ul li a:hover span.nature        { background-position: 0 -350px; }
    #portfolio ul li a:hover span.sunsets       { background-position: 0 -400px; }
    #portfolio ul li a:hover span.flowers       { background-position: 0 -450px; }
    #portfolio ul li a:hover span.structures    { background-position: 0 -500px; }
    #portfolio ul li a:hover span.animals       { background-position: 0 -550px; }
    #portfolio ul li a:hover span.weddings      { background-position: 0 -600px; }
    #portfolio ul li a:hover span.people        { background-position: 0 -650px; }
    
    #album .book                        { margin-left: 50px; }

    #container #torso                   { margin: 15px 15px; }

    /* Common */
    span.invis                          { display: none; }
    body, div, table                    { font-family: Tahoma, Arial, sans-serif; font-size: 11px; color: #edb3e4; }
    a                                   { color: #fff; text-decoration: none; }
    a:hover                             { text-decoration: underline; }
    
    .albumlink                          { display: none; }
    
    h1, h2, h3, h4, h5, h6              { font-family: Trebuchet MS; font-weight: normal; text-transform: uppercase; letter-spacing: 2px; background-color: #584648; color: #3f342e; margin: 20px -15px; padding: 10px; text-align: right; }
    h1 a, h2 a, h3 a, h4 a, h5 a, h6 a  { text-decoration: none; color: #3f342e; }
    h1                                  { font-size: 36px; }
    h2                                  { font-size: 30px; }
    h3                                  { font-size: 24px; }
    h4                                  { font-size: 20px; }
    h5, h6                              { font-size: 18px; }

    .post                               { clear: both; }
    .post .entry                        { padding: 0 15px; font-size: 18px; line-height: 150%; font-family: "Times New Roman", serif; text-align: justify; }
    .post small                         { font-size: 12px; text-align: center; text-transform: uppercase; letter-spacing: 2px; color: #3f342e; padding: 10px 25px; margin: 0 15px; float: left; background-color: #584648; }
    .post small a                       { color: #3f342e; }
    
    .comment                            { margin: 15px; padding: 15px; border: solid 1px #584648; font-size: 12px; text-transform: uppercase; color: #584648; letter-spacing: 2px; }
    .comment span                       { display: block; margin: 10px 15px 0 15px; font-size: 18px; line-height: 150%; letter-spacing: normal; text-transform: none; font-family: "Times New Roman", serif; text-align: justify; color: #edb3e4; }
    .comment span p                     { margin: 0; padding: 0; }
    
    input#author, input#email, input#url, textarea  { margin: 2px; padding: 4px; font-size: 18px; line-height: 150%; font-family: "Times New Roman", serif; color: #edb3e4; background-color: #3f342e; border: solid 1px #584648; line-height: 150%; }
    label small                         { text-indent: 20px; font-size: 12px; text-transform: uppercase; letter-spacing: 2px; color: #584648; }

    /* Items */

    .slideshowlink                      { text-transform: uppercase; color: #584648; letter-spacing: .2em; text-indent: 5px; line-height: 150%; }