/* ./css/layout.css
 * ---------------
 * Styledefinitionen fuer Seitenlayout-Basis
 *
 * 04.06.2009; jgoepel
 */

body {
        margin: 0px;
        text-align: center; /* IE - DIVs zentriert ausrichten */
        background-image: url(../img/bg_body.gif);
        background-repeat: repeat-x;
        background-position: top;
        background-attachment: fixed;
        background-color: #d1d1d1;
}
div {
    text-align: left; /* Textausrichtung */
}

.container {
        width: 998px;
        margin-top: 15px;
    margin-left: auto;
        margin-bottom:15px;
        margin-right: auto;
}

.shadow_container {
        width: inherit;
        background-image: url(../img/bg_container.png);
        background-repeat: repeat-y;
        _behavior: url(css/iepngfix.htc);
}

.layout_container {
        width: 980px;
        margin-left: 9px;
}

.header {
        position: relative;
        width: inherit;
        height: 144px;
        background-color: #FFFFFF;
        background-image: url(../img/bg_header.gif);
        background-repeat: repeat-x;
        background-position: top;
}
.header .logo {
        position: absolute;
        left: 18px;
        top: 30px;
        width: 379px;
        height: 59px;
        overflow: hidden;
}
.header .items {
        position: absolute;
        right: 16px;
        top: 17px;
        font-family: Verdana, Arial, Helvetica, sans-serif;
        font-size: 10px;
}
.header .items a {
        color: #5e5e5d;
        text-decoration: none;
}
.header .items a:hover {
        text-decoration: underline;
}
.header .navigation {
        position: absolute;
        top: 112px;
        width: 980px;
        height: 32px;
        color: #FFF;
        background-image: url(../img/bg_breadcrumb.gif);
}
.header .navigation .menutop {
        position: absolute;
        width: 203px;
        height: 32px;
        padding-top: 10px;
        font-weight: bold;
        background-image: url(../img/bg_menutop.gif);
}
.header .navigation .breadcrumb {
        position: absolute;
        left: 203px;
        height: 32px;
        padding-top: 10px;
        padding-left: 10px;
        font-size: 11px;
        width: 331px;
}
.header .navigation .breadcrumb span {
        font-weight: bold;
}

/* ----- MENU STYLES ----- */
.menu {
        position: relative;
        float: left;
        width: 203px;
        background-color: #e9e9e9;
}
.menu .menuitems a {
        margin-left: 18px;
        padding-left: 18px;
        line-height: 30px;
        color: #000;
        text-decoration: none;
        background-image: url(../img/bull_gray.gif);
        background-repeat: no-repeat;
        background-position: center left;
        display:block;
        width:167px;
        height:30px;
}
.menu .menuitems a:hover {
        color: #de0020;
        text-decoration: underline;
        background-image: url(../img/bull_red.gif);
        display:block;
        width:167px;
        height:30px;
}
.menu .menuitems .active a {
        color: #de0020;
        font-weight: bold;
        background-image: url(../img/bull_red.gif);
        display:block;
        width:167px;
        height:30px;
}
.menu .menuitems ul {
        margin: 0; padding: 0;
}
.menu .menuitems ul li {
        display: block;
        width: 203px;
        height: 30px;
        list-style: none;
        margin: 0; padding: 0;
        background-image: url(../img/bg_menuitem.gif);
}

.supmenu a:hover {
color:#000000;
text-decoration: underline;
font-weight:bold;}

.supmenu a:active {
color:#000000;
text-decoration:none;
font-weight:bold;}

.supmenu a:selected {
color:#000000;
text-decoration:none;
font-weight:bold;}

.supmenu a:link {
color:#000000;
text-decoration:none;
font-weight:bold;}

.supmenu a:visited {
color:#000000;
text-decoration:none;
font-weight:bold;}

/* ----- MENU STYLES ENDE ----- */

.middle {
        position: relative;
        overflow: visible;
        width: 980px;
}

.middle .center {
        position: relative;
        float: left;
        width: 777px;
}

.middle .center .kopf {
        height: 176px;
        background-image: url(../img/kopf_home.jpg);
        background-repeat:no-repeat;
}

.middle .center .kopf_planung {
        height: 176px;
        background-image: url(../img/kopf_planung.jpg);
        background-repeat:no-repeat;
}

.middle .center .kopf_blockbau {
		height: 176px;
		background-image: url(../img/kopf_blockhaus.jpg);
		background-repeat:no-repeat;
}

.middle .center .kopf_dachkonstruktion {
        height: 176px;
        background-image: url(../img/kopf_dachkonstruktion.jpg);
        background-repeat:no-repeat;
}

.middle .center .kopf_hallen {
        height: 176px;
        background-image: url(../img/kopf_hallenkonstr.jpg);
        background-repeat:no-repeat;
}

.middle .center .kopf_holzrahmenbau {
        height: 176px;
        background-image: url(../img/kopf_hallenkonstruktionen.jpg);
        background-repeat:no-repeat;
}

.middle .center .kopf_holzhauskonstruktion {
        height: 176px;
        background-image: url(../img/kopf_holzhauskonstruktion.jpg);
        background-repeat:no-repeat;
}

.middle .center .kopf_impressum {
        height: 176px;
        background-image: url(../img/kopf_impressum.jpg);
        background-repeat:no-repeat;
}

.middle .center .kopf_skelett {
		height: 176px;
		background-image:url(../img/kopf_holzskelettbau.jpg);
		background-repeat:no-repeat;
}
		
.middle .center .kopf_konzeptplanung {
        height: 176px;
        background-image: url(../img/kopf_konzeptplanung.jpg);
        background-repeat:no-repeat;
}

.middle .center .kopf_projekte-holzbau {
        height: 176px;
        background-image: url(../img/kopf_projekte-holzbau.jpg);
        background-repeat:no-repeat;
}

.middle .center .kopf_ueberdachung {
        height: 176px;
        background-image: url(../img/kopf_ueberdachung.jpg);
        background-repeat:no-repeat;
}

.middle .center .kopf_kundenbereich {
        height: 176px;
        background-image: url(../img/kopf_kundenbereich.jpg);
        background-repeat:no-repeat;
}

.middle .center .kopf_kontakt {
        height: 176px;
        background-image: url(../img/kopf_kontakt.jpg);
        background-repeat:no-repeat;
}

.middle .center .kopf_anfahrt {
        height: 176px;
        background-image: url(../img/kopf_anfahrt.jpg);
        background-repeat:no-repeat;
}

.middle .center .content {
background-color:#FFFFFF;
        background-image:url(../img/content_verlauf.jpg);
        background-position:top left;
        background-repeat:repeat-x;
        padding-top: 0px;
        padding-bottom: 15px;
        padding-left: 15px;
        padding-right: 15px;
        line-height: 130%;
}

.footer {
        position: relative;
        clear: both;
        width: inherit;
        height: 89px;
        background-image: url(../img/bg_footer.gif);
        background-repeat: repeat-x;
        background-position: bottom;
}
.footer .footerbar {
        position: relative;
        overflow: hidden;
        width: inherit;
        height: 5px;
        background-image: url(../img/bg_contentbottom.gif);
}
.footer .footerbar .menubottom {
        width: 204px;
        height: 5px;
        background-image: url(../img/bg_menubottom.gif);
}
.footer .footertext {
        padding-top: 24px;
        color: #000;
        font-size: 11px;
        line-height: 18px;
        text-align: center;
}
.footer small {
        font-size: 10px;
}



/*Texte*/

.slogan {
        _behavior: url(css/iepngfix.htc);
        position:absolute;
        height:101px;
        width:373px;
        padding-left:3px;
        left: 5px;
        top: 86px;
}

* html b\ody .slogan {
        _behavior: url(css/iepngfix.htc);
        position:absolute;
        height:120px;
        width:373px;
        padding-left:3px;
        padding-top:0px;
        left: 5px;
        top: 106px;
}

*+ html b\ody .slogan {
        _behavior: url(css/iepngfix.htc);
        position:absolute;
        height:120px;
        width:373px;
        padding-left:3px;
        padding-top:0px;
        left: 5px;
        top: 106px;
}

:root .slogan {
        position:absolute;
        height:101px;
        width:373px;
        padding-left:4px;
        left: 5px;
        top: 86px;
}

h2 {
        font-family:Arial, Helvetica, sans-serif;
        font-weight:bold;
        font-size:21px;
}

.ueber {
        padding-top:15px;
        color:#de0020;
        font-family:Verdana, Arial, Helvetica, sans-serif;
        font-size:12px;
        font-weight:bold;
}