/*//////////////////////////////////////////////////////////////////////////////
// 
// author:  Christoph Schuessler (schreib@herr-schuessler.de)
//
// Content:
// 
// 1    browser reset
// 2    hidden elements
// 3    typography
// 4.1  layout - container
// 4.2  layout - generic classes
// 4.3  layout - lists
// 4.4  layout - tables
// 4.5  layout - forms
// 5    navigation
// 6    object - font resizer
//  
//////////////////////////////////////////////////////////////////////////////*/



/* 1   browser reset
------------------------------------------------------------------------------*/
html, body, div, span, object, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a,
abbr, acronym, cite, code, del, em, img, strong, sub, sup, dl, dt, dd, ol, ul,
li, fieldset, form, label, table, 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;
}
ol, ul {
    list-style:     none;
}
table {
    border-collapse:collapse;
    border-spacing: 0;
}
th, td {
    text-align:     left;
    font-weight:    normal;
}

/* 2    hidden elements
------------------------------------------------------------------------------*/
.skip, .hide, .print, dfn {
    position:       absolute;
    left:           -10000em;
    top:            -10000em;
  }

/* 3    typography
------------------------------------------------------------------------------*/
body {
    font:           normal 0.8125em/1.48em Arial, Helvetica, sans-serif;
}
select,
input,
textarea  {
    font:           normal 0.9em/1.2em Arial, Helvetica, sans-serif;
}
a {
    color:          #b5123e;
    text-decoration:none;
}
a:hover {
    text-decoration:underline;
}
a:visited {
    /* TODO */
}
h2 {
    color:          #000000;
    font-size:      1.167em;
    line-height:    1.2em;
    font-weight:    normal;
}
h3, h4, h5, h6 {
    color:          #000000;
    margin:         0 0 0.5em 0;
    line-height:    1.2em;
    font-weight:    normal;
}
p, table, ul, ol {
    margin-bottom:  1.2em;
}
.dimmed {
    color:          #676d6e;
    font-size:      0.92em;
    line-height:    1.2em;
}
.caps {
    display:        block;
    font-size:      3em;
    float:          left;
    color:          #b5123e;
    padding:        0.15em 0.2em 0 0;
    font-weight:    bold;
}
#footer {
    color:          #b7b7b7;
    font-size:      0.92em;
    line-height:    1.2em;
}

/* 4.1    layout - container
------------------------------------------------------------------------------*/
html { height: 100.1%; margin-bottom: 1px; }
html,body {
    background:     #fff;
    color:          #676d6e;
}
.page-margins {
    width:          960px;
    margin:         0 auto 0 auto;
    position:       relative;
}
#header {
    position:       relative;
    height:         140px;
    background:     url(../images/hr-dark.png) repeat-x left bottom;
}
#logo {
    position:       absolute;
    top:            20px;
    left:           0px;
}
#nav {
    position:       absolute;
    top:            100px;
    left:           240px;
}
#search {
    position:       absolute;
    top:            20px;
    right:          0px;
}
#fp #info,
#cp #page {
    background:     #f4f4f4 url(../images/hr-dark.png) repeat-x left bottom;
    padding:        30px 0;
    overflow:       hidden;
}
#info h2 {
    background:     url(../images/hr-dark.png) repeat-x left center;
    background:     #f4f4f4;
    display:        inline;
    white-space:    nowrap;
    padding:        0 0.3em 0 0;
}
#info .hwrap {
    background:     url(../images/hr-dark.png) repeat-x left 0.9em;
}
#fp #info .fl {
    width:          300px;
}
#fp #info .middle {
    margin:         0 20px;
}
.columns {
    overflow:       hidden;
    width:          100%;
}
.columns-top,
.columns-bottom {
    height:         30px;
    clear:          both;
}
#fp .columns {
    background:     url(../images/fp-info-border.png) repeat-y 310px center;
}
#fp .columns-top {
    background:     url(../images/fp-info-border-top.png) no-repeat 310px center;
}
#fp .columns-bottom {
    background:     url(../images/fp-info-border-bottom.png) no-repeat 310px center;
}
#cp .columns {
    background:     url(../images/cp-info-border.png) repeat-y 300px center;
}
#cp .columns-top {
    background:     url(../images/cp-info-border-top.png) no-repeat 300px center;
}
#cp .columns-bottom {
    background:     url(../images/cp-info-border-bottom.png) no-repeat 300px center;
}
#fp #content {
    background:     #fff url(../images/hr-light.png) repeat-x left bottom;
    padding:        30px 0 60px 0;
    overflow:       hidden;
}
#cp #info {
    width:          280px;
    margin:         0.5em 40px 0 0;
}
#cp #content {
    width:          620px;
}
#cp #info .item {
    margin:         0 0 35px 0;
}
#content h3,
#content h4,
#content h5,
#content h6 {
    padding-top:     1.5em;
}
#content h2 {
    margin-bottom:  1em;
}
#footer {
    margin:         1em 0 0 0;
    height:         140px; 
}
#slideshow-wrap {
    float:          right;
    width:          300px;
    height:         149px;
    margin:         0.3em 0 0.3em 1em;
    background:     #f4f4f4;
}
#slideshow,
#slideshow-overlay {
    position:       absolute;
    z-index:        1;
}
#slideshow-overlay {
    z-index:        100;
}
#breadcrumbs {
    margin:         0 0 1.5em 0;
    padding:        0 0 0.5em 0;
    background:     url(../images/hr-dark.png) repeat-x left bottom;
}


/* 4.2    layout - generic classes
------------------------------------------------------------------------------*/
.fl {
    float:          left;
}
.fr {
    float:          right;
}
.cb {
    clear:          both;
    overflow:       hidden;
}
img.fl {
    margin:         0.3em 1em 0.3em 0;
}
img.fr {
    margin:         0.3em 0 0.3em 1em;
}

/* 4.3    layout - lists
------------------------------------------------------------------------------*/
#content ul,
#content ol {
    margin-left:    2.5em;
}
#content ul {
    list-style:     square;
}
#content ol {
    list-style:     decimal;
}
#content li {
    padding:        0 0 0.5em 0;
}

/* 4.4    layout - tables
------------------------------------------------------------------------------*/
table {
    width:          100%;
    caption-side:   bottom;
}
caption {
    text-align:     left;
    font-size:      0.917em;
    line-height:    1.2em;
    color:          #b7b7b7;
    margin:         -1em 0 1.5em 0;
}
th {
    color:          #000;
    font-size:      0.917em;
    line-height:    1.2em;
    padding:        5px 10px 3px 0;
    font-weight:    bold;
}
tr.odd td{
    background:     #fff;
}
td {
    border:         1px solid #ccccce;
    padding:        5px;
}

/* 4.5    layout - forms
------------------------------------------------------------------------------*/
.type-text input,
.type-text textarea {
    border-top:     1px solid #bcbcbc;
    border-right:   1px solid #fff;
    border-bottom:  1px solid #fff;
    border-left:    1px solid #d4d4d4;
    background:     #fff;
    padding:        3px;
    width:          200px;
    margin:         0;
}
.type-text textarea {
    width:          420px;
}
.input-small input {
    width:          50px;
}
fieldset .type-text {
    float:          left;
    padding:        0 1em 0 0;
}
fieldset {
    overflow:       hidden;
    width:          100%;
    margin:         0 0 0.5em 0;
}
.type-text {
    margin:         0 0 0.5em 0;
}
.type-text label {
    font-size:      0.92em;
    line-height:    1.2em;
}
.type-button {
    padding:        1em 0;
    width:          420px;
    text-align:     center;
}
.with-error input,
.with-error textarea {
    border:         2px solid #b5123e;
    padding:        2px;
}
.error {
    font-size:      0.92em;
    background:     #b5123e;
    padding:        4px;
    color:          #fff;
    -moz-border-radius:     0 0 4px 4px;
    -webkit-border-radius:  0 0 4px 4px;
    border-radius:          0 0 4px 4px;
    position:       relative;
}

/* 5    navigation
------------------------------------------------------------------------------*/
#footer a {
    text-decoration:underline;
    color:          #b7b7b7;
}
#footer a:hover {
    text-decoration:none;
}
#breadcrumbs a {
    padding:        0 6px 0 0;
    background-image:url(../images/arrow.png);
    background-repeat:no-repeat;
    background-position:right 0.5em;
}

/* nav-horizontal */
.hlist, .hlist ul {
    list-style: none;
    position:       relative;
}
.hlist a {
    color:          #67676e;
}
.hlist a:hover {
    text-decoration:none;
}
.hlist li {
    display:        block;
    float:          left;
    padding:        2px;
    position:       relative;
}
.hlist .hlist-head-wrap,
.hlist .hlist-head-selected {
    display:        block;
    color:          #67676e;
    font-size:      1.08em;
    padding:        3px 4px 2px 4px;
}
.hlist .hlist-head-wrap a:hover,
.hlist .hlist-head-selected a:hover {
    color:          #333;
}
.hlist a.selected {
    color:          #000;
    text-decoration:underline;
}
.hlist li ul {
    position:       absolute;
    width:          140px;
    left:           -999em;
    background:     #fff;
    border:         1px solid #cacacc;
    z-index:        100;
    padding:        1px;
}
.hlist li:hover,
.hlist li.hover {
    background:     #fff;
    border:         1px solid #cacacc;
    padding:        1px;
}
.hlist li:hover .hlist-head-wrap,
.hlist li:hover .hlist-head-selected,
.hlist li.hover .hlist-head-wrap,
.hlist li.hover .hlist-head-selected {
    background:     #f2f2f3;
    color:          #b5123e;
}
.hlist li:hover ul,
.hlist li.hover ul {
    left:           auto;
    margin-left:    -2px;
}
.hlist ul li {
    float:          none;
    padding:        0;
    margin:         0 !important;
}
.hlist ul li a {
    color:          #333;
    display:        block;
    padding:        6px 10px;
    font-size:      0.9em !important;
    line-height:    1.2em;
}
.hlist ul li:hover,
.hlist ul li.hover {
    background:     none;
    border:         none;
    padding:        0;
}
.hlist ul li a:hover {
    background:     #f2f2f3;
    color:          #b5123e;
}




/* 6    object - font resizer
------------------------------------------------------------------------------*/
.fontResizer {
    position:       absolute;
    top:            22px;
    right:          280px;
}
.fontResizer a {
    display:        block;
    float:          left;
    width:          17px;
    height:         17px;
    text-align:     center;
    border:         1px solid #cacacc;
    line-height:    15px;
    color:          #676d6e;
    text-decoration:  none;
    margin:         0 3px 0 0;
}
.fontResizer a:hover {
    background:     #f2f2f3;
    color:          #b5123e;; 
}
/* The following control the way the font-resizer links appear only */
.smallFont { font-size:     11px; }
.medFont { font-size:       13px; }
.largeFont { font-size:     16px; }
.curFont { background:      #EEEEF7; }