* {
    margin:     0;
    padding:    0;
    font-family:Arial, sans-serif;
    color:      #666666;
    font-size:  small;
    border:     none;
}

/* The body has to span over the whole document height so the spacer (fubeplaz)
 * can be set accordingly. But to force the body to span over the whole height,
 * it's parent element has to "reserve" the needed space: */
html { height:100%; }

body {
    background: #FFFFFF url(../images/bg_body.jpg) top right no-repeat;
    height:     100%;
}

.hide { display:none; }
.einwort { white-space:nowrap; }
.rahmen { border:1px solid #666666; }
.fussnote { 
    font-size:  70%;
    font-weight:bold; 
    vertical-align:top;
}

#behaelter {
    background: url(../images/bg_behaelter.png);
}

#inhalt {
    background: url(../images/bg_inhalt.png) repeat-y;
    padding-top:35px;
    padding-left:40px;
    margin-left:1px;
}

#hauber {
    background: #FFFFFF url(../images/bg_hauber) repeat-y;
    width:      470px;
    border:     1px solid #FF6666;
    border-bottom:none;
}

#fuber {
    height:     114px;
    width:      684px;
    background: url(../images/bg_fuber.png) no-repeat;
    margin-left:-41px;
    position:   relative;
}

/* This container is used as placeholder to allow the site to span till the
 * bottom of the browser window. The height of this container is set via
 * JavaScript, since it seems impossible to set 100% heights in XHTML like it
 * was done when using tables. */
#fubeplaz {
    background: url(../images/bg_fubeplaz.png) repeat-y;
    width:      684px;
    margin-left:-41px;
}

#navbehaelter {
    position:   absolute;
    top:        50px;
    left:       480px;
}

#navigation { 
    background: url(../images/bg_nav.png) no-repeat;
    width:      290px;
    padding-top:10px;
}

#navigation ul {
    background: url(../images/bg_nav_ul.png) bottom left no-repeat;
    padding-bottom:25px;
    padding-left:55px;
    list-style-type:none;
}

#navigation ul li { 
    margin-bottom:2px; 
}

#navigation ul li a {
    display:    block;
    width:      214px;
    height:     20px;
    border:     1px solid #FFFFFF;
    background: #FF0000;
    color:      #FFFFFF;
    text-decoration:none;
    padding-left:5px;
    line-height:20px;
    /* The font size gets fixed because the position of the navsel container is
     * set absolute thus requires a fixed font size. */
    font-size:  12px;
}
#navigation ul li.anfrage a,
#navigation ul li.anfahrt a, 
#navigation ul li.kontakt a {
    background: #999999;
}
#navigation ul li a:hover { background: #CC0000; }
#navigation ul li.anfrage a:hover,
#navigation ul li.anfahrt a:hover, 
#navigation ul li.kontakt a:hover {
    background: #666666;
}
#navigation ul li a:visited { background: #CC0000; }
#navigation ul li.anfrage a:visited,
#navigation ul li.anfahrt a:visited,
#navigation ul li.kontakt a:visited {
    background: #666666;
}

#navigation ul li a img { border:none; }

#adresse {
    margin-top: 13px;
    margin-left:40px;
    background: #999999;
    border-bottom:2px solid #000000;
    padding:    4px;
}

#adresse h5 { 
    color:      #FFFFFF;
    font-weight:normal;
    border-bottom:1px solid #FFFFFF; 
}

#adresse h5 img {
    margin-bottom:5px;
    margin-top: 1px;
}

#adresse p {
    color:      #FFFFFF;
    font-size:  11px;
    line-height:140%;
    padding-top:5px;
    padding-bottom:5px;
}

#adresse p a {
    color:      #FFFFFF;
    font-size:  11px;
}

#adresse p a:hover { text-decoration:none; }

#seber {
    padding-right:35px;
    padding-left:20px;
}

#seber h1 {
    font-family:"Arial Black",sans-serif;
    margin-bottom:10px;
    color:      #FF0000;
    background: url(../images/bg_seber_h1.png) center left no-repeat;
    padding-left:25px;
    margin-left:-20px;
}

#seber p {
    line-height:140%;
    color:      #666666;
    font-size:  90%;
    padding-bottom:7px;
}
#seber p.fussnote_klaerung {
    font-size:  80%;
}

#seber a { 
    text-decoration:underline;
    font-size:  100%; 
}

#navsel {
    background: url(../images/bg_navsel.png) no-repeat;
    width:      30px;
    height:     30px;
    margin-bottom:-30px;
    position:   relative;
    top:        0;
    left:       20px;
}
#unternehmen #navsel        { top:-289px; }
#tragende_waende #navsel    { top:-265px; }
#zwischen_waende #navsel    { top:-241px; }
#decken_ueberlagen #navsel  { top:-217px; }
#sonder_ziegel #navsel      { top:-193px; }
#mauer_ziegel #navsel       { top:-169px; }
#kamin #navsel              { top:-145px; }
#lehm_ton #navsel           { top:-121px; }
#anfrage #navsel            { top:-97px; }
#lageplan #navsel           { top:-73px; }
#kontakt #navsel            { top:-49px; }

#kober {
    height:     75px;
    background: url(../images/bg_kober.png) repeat-x;
    margin-left:1px;
    margin-bottom:20px;
}

#kober a img {
    margin-top: -33px;
    border:     none;
}

#kober a {
    font-family:"Arial Black", sans-serif;
    font-size:  large;
    color:      #000000;
    text-decoration:none;
    line-height:400%;
}

#webdesign  {
    position:   relative;
    padding-left:70px;
    padding-top: 80px;
}
#webdesign img {
    border:     none;
    position:   relative;
    top:        -37px;
    left:       1px;
}
#webdesign, #webdesign a {
    font-size:  11px;
    color:      #FF0000;
}

#seber table.auswahl {
    margin-bottom:10px;
}

#seber table.auswahl tr th {
    text-align: left;
    background: #FF5A5A;
    border-bottom:3px solid #CC0000;
    color:      #FFFFFF;
    padding:    2px;
    font-size:  90%;
}

#seber table.auswahl tr td {
    background: #DBDBDB;
    border-top: 1px solid #FFFFFF;
    padding:    2px;
    line-height:140%;
    font-size:  90%;
    padding-right:15px;
}

#fotos { 
    display:    block; 
    margin-top: 20px;
    padding-top:2px;
    margin-left:-20px;
}

#fotos ul { 
    list-style-type:none; 
}

#fotos ul li { 
    float:      left;
    margin-right:5px;
    margin-bottom:5px; 
}

#fotos img { border:1px solid #999999; }

#seber h3 {
    text-align: left;
    background: #FF5A5A;
    border-bottom:3px solid #CC0000;
    color:      #FFFFFF;
    padding:    2px;
    font-size:  90%;
    margin-top: 20px;
    margin-bottom:7px;
}

#seber h5 {
    color:      #CC0000;
    margin-bottom:5px;
}

#seber ul { margin-left:20px; }
#seber ul li { line-height:140%; }

#seber div.toplink {
    text-align: right;
    height:     20px;
}