@charset 'utf-8';

/**********************************************************************/
/* 1. Global reset courtesy of Eric Meyer:                            */
/*    http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/    */
/*    (slightly modified version)                                     */
/**********************************************************************/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-weight: inherit;
    font-style: inherit;
    font-size: 100%;
    font-family: inherit;
    vertical-align: baseline;
}

/* remember to define focus styles! */
:focus { outline: 0; }

/* tables still need 'cellspacing="0"' in the markup */
table {
    border-collapse: separate;
    border-spacing: 0;
}

caption, th, td {
    text-align: left;
    font-weight: normal;
}

th { font-weight: bold; }


/**********************************************************************/
/* 2. Some very basic helper styles which alwaye come in handy        */
/**********************************************************************/

/* Browser scroll bar always on */
html { height: 100%; }
body { height: 101%; }

/* Hide elements the screen user doesn't need */
.invisible {
    position: absolute;
    left: -9999em;
}

a.invisible:focus {
    position: static;
    left: 0;
}

/* Easy clearing */
.clearfix { display: inline-block; }

.clearfix:after {
    clear: both;
    content: " ";
    display: block;
    font-size: 0;
    height: 0;
    visibility: hidden;
}

/* Hides from IE-mac \*/ 
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* End hide from IE-mac */

.clear {
    clear: both;
    display: block;
    overflow: hidden;
    visibility: hidden;
    width: 0;
    height: 0;
}

.no-border { border: 0 none; }


/**********************************************************************/
/* 3. Basic styles against the reset                                  */
/**********************************************************************/

body {
    background: #fff;
    color: #333;
    font-family: Verdana, sans-serif;
    line-height: 1.5;
    margin: 10px auto;
    width: 960px;
}

code, kbd, var,
tt, pre { font-family: Consolas, "Courier New", Courier, monospace; }

pre { font-size: .8125em; }

p code, p kbd,
p var, p tt { line-height: 1; }

a:link,
a:visited { text-decoration: underline; }

a:active,
a:focus { outline: 1px dotted #888; }

strong, dt { font-weight: bold; }

em, cite { font-style: italic; }

abbr[title] {
    border-bottom: 1px dotted #888;
    cursor: help;
}

a abbr { cursor: pointer!important; }

del {
    color: #888;
    text-decoration: line-through;
}

ins {
    border-bottom: 1px dashed #888;
    text-decoration: none;
}

sub { vertical-align: text-bottom; }
sup { vertical-align: text-top; }

sub, sup {
    font-size: 75%;
    line-height: 1;
}

ol { list-style-type: decimal; }
ul { list-style-type: disc; }

ol, ul { padding-left: 2.5em; }

blockquote {
    margin: 1.5em 0 1.5em 2.5em;
    padding: 0;
    text-indent: -.3em;
    width: 80%;
}

/* text-indent doesn't make sense in IE6 + IE7  */
/* because it doesn't do :before or :after      */
* html blockquote { text-indent: 0em; }
*:first-child+html blockquote { text-indent: 0; }

blockquote { quotes: "\201E" "\201C" "\201A" "\2018"; }
blockquote:lang(de) { quotes: "\201E" "\201C" "\201A" "\2018"; }
blockquote:lang(en) { quotes: "\201C" "\201D" "\2018" "\2019"; }

blockquote p:before { content: open-quote; }
blockquote p:after { content: close-quote; }

/* Safari support */
blockquote * { quotes: none; }
blockquote > *:before { content: "\201E"; }
blockquote > *:after  { content: "\201C"; }

*[lang~='de'] blockquote > *:before,
blockquote[lang~='de'] > *:before { content: "\201E"; }
*[lang~='de'] blockquote > *:after,
blockquote[lang~='de'] > *:after { content: "\201C"; }

*[lang~='en'] blockquote > *:before,
blockquote[lang~='en'] > *:before { content: "\201C"; }
*[lang~='en'] blockquote > *:after,
blockquote[lang~='en'] > *:after { content: "\201D"; }

legend, label, select,
input, textarea { font-family: Verdana, sans-serif; }

input, textarea, select { font-size: 1em; }

label { font-weight: normal; }

label, button,
input[type=button],
input[type=submit] { cursor: pointer; }

fieldset {
    display: block;
    margin: 0 0 1.5em;
}

input, textarea { padding: 2px; }

/* This positions an unstyled legend element */
/* correctly in IE6 + IE7                    */
* html legend,
*:first-child+html legend {
    position: relative;
    left: -10px;
}


/**********************************************************************/
/* 4. Screen styles                                                   */
/**********************************************************************/

/* Headings */

h1, h2, h3,
h4, h5, h6 {
    font-weight: bold;
    margin-bottom: 21px;
}

h1 {
    background: #eee;
    border-top: 1px solid #aaa;
    border-bottom: 1px solid #aaa;
    font-size: 1.5em; /* 24px */
    min-height: 75px;
    padding: 5px;
}

h2 { font-size: 1.25em; /* 20px */ }

h3 { font-size: 1em; /* 16px */ }

p, ol, ul, dl,
address, pre, table { margin-bottom: 21px; }

h4, h5, h6,
p, ol, ul,
dl, table { font-size: .875em; }

a:link,
a:visited,
a:active {
    background: transparent;
    color: #05a;
    text-decoration: underline;
}

a:hover,
a:focus {
    background: #05a;
    color: #fff;
    text-decoration: none;
}

#nav-primary {
    border-top: 1px solid #aaa;
    display: inline;
    float: left;
    list-style: none;
    margin-right: 10px;
    padding-left: 0;
    width: 357px;
}

#nav-primary li {
    background: #eee;
    border-bottom: 1px solid #aaa;
}

#nav-primary strong,
#nav-primary a {
    display: block;
    padding: 2px 4px;
}

#content {
    display: inline;
    float: right;
    margin-left: 10px;
    width: 583px;
}