html, body  {
         margin  : 0;
         padding : 0;
         width   : 100%;
         height  : 100%;
         background: #000000;
         color: #fff;

}

@font-face {
        font-family: 'Melbourne-regular';
        src: url('../font/Melbourne-regular.otf');

}

#hauptcontainer {
        width: 980px;
        height: 430px;
        margin:-215px 0px 0px -490px;
        top: 50%;
        left: 50%;
        position:absolute;
}

.logo {
        background: url(../images/pastille_neu.png);
        width: 500px;
        position:absolute;
        margin-left:80px;
        z-index: 1;
        height: 400px;
        background-repeat:no-repeat;
}

.feed {
        width: 660px;
        color: #fff;
        position: absolute;
        bottom: 20px;
        left: 50%;
        margin-left: -330px;
}

.video {
        width: 500px;
        position:absolute;
        margin-top: -40px;
        z-index: 2;
        height: 400px;
}

a:link {
         color: #333333;
         text-decoration:none;
}

a:focus {
         color: #ff3333;
         text-decoration:none;
}

a:active {
         color: #ff3333;
         text-decoration:none;
}

a:visited {
         color: #333333;
         text-decoration:none;
}

a:hover {
         color: #ff3333;
         text-decoration:none;
}

a.button1 {
         background: url(../images/uebersicht.png);
         display:block;
         text-decoration:none;
         cursor: pointer;
         width: 80px;
         height: 80px;
         float:left;
         background-repeat:no-repeat;
}

a.button1:link {
         background: url(../images/uebersicht.png);
}

a.button1:hover {
         background: url(../images/uebersicht-over.png);
}

a.button2 {
         background: url(../images/dokumente.png);
         display:block;
         cursor: pointer;
         text-decoration:none;
         width: 80px;
         height: 80px;
         float:left;
         background-repeat:no-repeat;
}

a.button2:hover {
         background: url(../images/dokumente-over.png);
}

a.button3 {
         background: url(../images/erfassen.png);
         display:block;
         cursor: pointer;
         text-decoration:none;
         width: 80px;
         height: 80px;
         float:left;
         background-repeat:no-repeat;
}

a.button3:hover {
         background: url(../images/erfassen-over.png);
}

a.button4 {
         background: url(../images/adressbuch.png);
         display:block;
         cursor: pointer;
         text-decoration:none;
         width: 80px;
         height: 80px;
         float:left;
         background-repeat:no-repeat;
}

a.button4:hover {
         background: url(../images/adressbuch-over.png);
}

a.button5 {
         background: url(../images/suche.png);
         display:block;
         cursor: pointer;
         text-decoration:none;
         width: 80px;
         height: 80px;
         float:left;
         background-repeat:no-repeat;
}

a.button5:hover {
         background: url(../images/suche-over.png);
}

a.button6 {
         background: url(../images/materialien.png);
         display:block;
         cursor: pointer;
         text-decoration:none;
         width: 80px;
         height: 80px;
         float:left;
         background-repeat:no-repeat;
}


a.button6:hover {
         background: url(../images/materialien-over.png);
}

a.button7 {
         background: url(../images/kalkulation.png);
         display:block;
         cursor: pointer;
         text-decoration:none;
         width: 80px;
         height: 80px;
         float:left;
         background-repeat:no-repeat;
}


a.button7:hover {
         background: url(../images/kalkulation-over.png);
}

a.button8 {
         background: url(../images/nachkalkulation.png);
         display:block;
         cursor: pointer;
         text-decoration:none;
         width: 80px;
         height: 80px;
         float:left;
         background-repeat:no-repeat;
}

a.button8:hover {
         background: url(../images/nachkalkulation-over.png);
}

a.button9 {
         background: url(../images/leistungen.png);
         display:block;
         cursor: pointer;
         text-decoration:none;
         width: 80px;
         height: 80px;
         float:left;
         background-repeat:no-repeat;
}

a.button9:hover {
         background: url(../images/leistungen-over.png);
}

a.button10 {
         background: url(../images/loeschen.png);
         display:block;
         cursor: pointer;
         text-decoration:none;
         width: 80px;
         height: 80px;
         float:left;
         background-repeat:no-repeat;
}

a.button10:hover {
         background: url(../images/loeschen-over.png);
}

.left {
         width: 80px;
         min-height: 10em;
         float:left;
         margin-right:80px;
         display: table-cell;
         vertical-align: middle
}

.right {
         width: 80px;
         min-height: 10em;
         float:right;
         display: table-cell;
         vertical-align: middle
}

.center {
         width: 500px;
         min-height: 10em;
         float:left;
         display: table-cell;
         vertical-align: middle
}