/*
    Default vandervossen.net stylesheet
    Copyright 2003, 2004 Thijs van der Vossen - thijs@vandervossen.net

    You are not allowed to copy my visual design. Read http://www.vandervossen.net/2003/12/copyright
*/
html,
body
{
    margin:                 0;
    padding:                0;
    color:                  #000;
    background-color:       #fff;
}
body
{
    padding:                3em 9% 1em 9%;
    font-family:            baskerville, palatino, "Palatino Linotype", georgia, serif;
}
#header
{
    color:                  #777;
    font-size:              3em;
    text-decoration:        none;
}
@media screen, projection
{
    span[id=thijs]
    {
        display:                block;
        z-index:                0;
        position:               absolute;
        top:                    -.21em;
        left:                   0;
        color:                  #eee;
        font-size:              4.1em;
    }
    span[id=vandervossen]
    {
        display:                block;
        z-index:                1;
        position:               relative;
        top:                    .1em;
        left:                   -.1em;
    }
}
#main
{
    line-height:            1.2em;
}
@media screen, projection
{
    div[id=main]
    {
        z-index:                1;
        position:               relative;
    }
}
#main ul,
#main ol
{
    margin:                 0;
    padding:                0;
}
#main li
{
    margin:                 0;
    padding:                0;
}
ul#navigation
{
    margin:                 0 0 1.6em 0;
    padding:                0;
    list-style-type:        none;
    font-variant:           small-caps;
    letter-spacing:         .3em;
}
ul#navigation li
{
    display:                inline;
    margin:                 0 1em 0 0;
    padding:                0;
    font-size:              .8em;
}
#navigation a:link, 
#navigation a:visited   
{
    color:                  #666;
    text-decoration:        none;
}
body.home #navigation li.home a,
body.archive #navigation li.archive a,
body.item #navigation li.archive a,
body.categories #navigation li.categories a
{
    color:                  #000;
    font-weight:            bold;
}
#navigation a:hover   
{
    color:                  #333;
}
#navigation a em
{
    font-style:             normal;
    text-decoration:        none;
}
#navigation a:hover em
{
    color:                  #000;
}
@media screen
{
    #contentcontainer
    {
        width:                  100%;
        float:                  left;
        margin-right:           -30%;
    }
    #content
    {
        margin:                 0 30% 1em 0;
    }
    #sidebar
    {
        float:                  right;
        width:                  20%;
        margin:                 0%;
        padding:                0%;
    }
}
#sidebar
{
    color:                  #666;
}
#sidebar dl,
#sidebar ul,
#sidebar dd,
#sidebar dt,
#sidebar li
{
    margin:                 0;
    padding:                0;
}
#sidebar dl,
#sidebar ul
{
    list-style-type:        none;
}
#sidebar dd
{
    margin-bottom:          2em;
    font-size:              .8em;
    line-height:            1.6em;
}
#sidebar dd,
#sidebar li+li
{
    padding-top:            .6em;
}
#sidebar dt
{
    margin-bottom:          .6em;
    font-variant:           small-caps;
    letter-spacing:         .3em;
}
#sidebar li
{
    line-height:            1.2em;
}
.sublink
{
    text-align:             right;
}
ul#nearby
{
    margin:                 0;
    padding:                0;
    list-style-type:        none;
    color:                  #777;
    font-size:              .8em;
}
#nearby li
{
    display:                inline;
    margin:                 0;
    padding:                0;
}
#nearby li.prev
{
    float:                  left;
    padding-right:          1em;
}
#nearby li.next
{
    float:                  right;
    padding-left:           1em;
}
#footer
{
    margin:                 1em 0;
    text-align:             center;
    clear:                  both;
    color:                  #666;
    font-size:              .7em;
}
div.item
{
    margin:                 0 0 1em 0;
}
h1,
h2,
h3
{
    text-align:             left;
    font-weight:            normal;
    letter-spacing:         .1em;
    word-spacing:           .1em;
    line-height:            1.1em;
}
h1
{
    margin-top:             0;
}
h1
{
    font-size:              1.6em;
}
h2,
h3
{
    margin-top:             1.6em;
    font-size:              1.2em;
}
h3
{
    font-style:             italic;
}
h3.tt
{
    font-size:              1em;
    font-style:             normal;
    font-family:            monospace;
}
/* Move publication date closes to item header */
h1+div.pubdate,
h2+div.pubdate
{
    margin:                 -.8em 0 1em 0;
}
/* Margin between the page header and item (headers) on archive pages */
h1+div.item
{
    margin-top:             2em;
}
/* Margin between the items on the home page */
div.item+div.item
{
    margin-top:             2.4em;
}
div.pubdate
{
    font-size:              .8em;
    color:                  #777;
}
p,
div.description
{
    margin:                 .4em 0 1em 0;
}
div.example,
div.code
{
    margin:                 1em 0;
    padding:                .4em;
    border:                 1px dotted #999;
    text-align:             left;
    line-height:            1em;
}
div.example
{
    font-size:              1.4em;
    line-height:            1.2em;
}
div.code
{
    background-color:       #eee;
}
code
{
    display:                block;
}
div.code code:before
{
    content:                "\00b7\0020";
    color:                  #999;
}
div.code img.callout
{
    float:                  right;
}
tt
{
    background-color:       #eee;
    border:                 1px solid #eee;
    font-family:            monospace;
}
a:link
{
    color:                  #740;
    text-decoration:        none;
}
a:link:hover
{
    color:                  #740;
    text-decoration:        underline;
}
a:visited
{
    color:                  #406;
    text-decoration:        none;
}
a:visited:hover
{
    color:                  #406;
    text-decoration:        underline;
}
a.tr,
a.gl
{
    vertical-align:         top;
    font-size:              .7em;
    font-variant:           small-caps;
}
h1 a:link,
h1 a:link:hover,
h1 a:visited,
h1 a:visited:hover
{
    color:                  #740;
}
.pubdate a:link,
.pubdate a:link:hover,
.pubdate a:visited,
.pubdate a:visited:hover
{
    color:                  #777;
}
.button
{
    padding:                3px 1em;
    border:                 1px solid #eee;
    font-family:            sans-serif;
    font-size:              .8em;
    color:                  #000;
    background-color:       #ddd;
    border-color:           #eee #aaa #aaa #eee;
    cursor:                 default;
}
.button:hover
{
    background-color:       #eee;
}
.button:active
{
    background-color:       #ccc;
    border-color:           #999 #ddd #ddd #999;
}
img
{
    border:                 0;
}
img.photo,
img.illustration,
img.screenshot
{
    display:                block;
    margin:                 1em 0;
    border:                 0;
}
img.photo,
img.screenshot
{
    border:                 1px solid #666;
}
abbr
{
    font-variant:           small-caps;
    font-style:             normal;
}
abbr[title]
{
    border-bottom:          1px dotted #000;
    cursor:                 help;
}
q:lang(en)
{ 
    quotes:                 "\2018" "\2019";
}
q:lang(nl)
{ 
    quotes:                 "\2018" "\2019";
}
blockquote
{
    margin:                 1em 0;
    padding:                0 0 0 1em;
    border-left:            2px solid #999;
    font-style:             italic;
}
q:before
{
    content:                open-quote;
}
q:after
{
    content:                close-quote;
}
#ad
{
    z-index:                10;
    position:               absolute;
    top:                    1em;
    right:                  9%;
    margin:                 0;
    padding:                0;
}
#ad img
{
    border:                 1px solid #000;
}
#betterbrowser
{
/*
    position:               absolute;
    top:                    1em;
    right:                  1em;
    width:                  30%;
*/
    margin:                 0;
    padding:                4px;
    background-color:       #ffffe0;
    border:                 1px solid #999;
    font-size:              .8em;
    font-family:            verdana, sans-serif
}
#betterbrowser .readmore
{
    font-size:              .8em;
    text-align:             right;
}
@media screen, projection
{
    /* This selector is only supported by Opera 7, Mozilla and KHTML/Safari */
    div[id=betterbrowser]
    {
        display:                none;
    }
}
@media print
{
    #betterbrowser,
    #ad
    {
        display:                none;
    }
}
table.data
{
    border-collapse:        collapse;
    font-size:              .8em;
    font-family:            verdana, sans-serif;
}
table.data td,
table.data th
{
    padding:                .1em .4em;
    vertical-align:         top;
    text-align:             left;
    font-weight:            normal;
}
table.data thead
{
    background-color:       #eee;
    border-bottom:          1px solid #999;
}
table.data colgroup+colgroup
{
    border-left:            1px solid #999;
}
table.data thead tr+tr
{
    font-size:              .8em;
}
table.data .num
{
    text-align:             right;
}
@media projection
{
    body
    {
        font-size:          200%;
    }
    #main
    {
        font-size:          75%;
    }
    ul#navigation li
    {
        display:                block;
    }
    body.home div.item
    {
        page-break-after:  always;
    }
    #sidebar,
    #footer
    {
        display:            none;
    }   
}