body {
    text-align: center;
    margin-top: 100px;
    font-family: "libertine";
}

a {
    text-decoration: none;
}

#box {
    position: relative;
    height: 400px;
    width: 600px;
    margin: auto;
    text-align: center;
    -moz-border-radius: 5px;
    border-radius: 5px;
    -moz-box-shadow: 0px 0px 30px 0px gray;
    -webkit-box-shadow: 0px 0px 30px 0px gray; 
    box-shadow: 0px 0px 30px 0px gray;
    background-color: #fafafa;
}

#logo {
    position: absolute;
    top: 15px;
    left: 225px;
    background-image: url("images/dhbwlogo.png");
    background-repeat: no-repeat;
    width:150px;
    height: 62px;
}

#projekte {
    position: absolute;
    top: 100px;
    left: 0px;
    width: 560px;
    height: 200px;
    padding: 20px;
}

#projekte .projekt {
    float: left;
    margin-right: 5px;
    margin-left: 5px;
    margin-top: 10px;
    margin-bottom: 10px;
    padding: 5px;
    padding: 4px;
    width: 260px; /* 280 - 2*(5+5) px*/
    height: 50px;
    -moz-transition-property: -moz-box-shadow, -webkit-transform, background-color;
    -moz-transition-duration: 0.2s,0.2s,0.2s;
    -moz-box-shadow: 0px 0px 0px 0px gray;
 
    -webkit-transition-property: -webkit-box-shadow, -webkit-transform, background-color;
    -webkit-transition-duration: 0.2s,0.2s,0.2s;
    -webkit-box-shadow: 0px 0px 0px 0px gray; 
 
    transition-property: box-shadow, transform, background-color;
    transition-duration: 0.2s,0.2s,0.2s;
    box-shadow: 0px 0px 0px 0px gray; 
}

#projekte .projekt:hover {
    -moz-box-shadow: 0px 0px 10px 5px #eee;
    -webkit-box-shadow: 0px 0px 10px 5px #eee;
    box-shadow: 0px 0px 10px 5px #eee;
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    transform: scale(1.1);
    background-color: #eee;
}

#projekte .projekt:active {
    background-color: #fafafa;
    -webkit-transform: scale(1.05);
    -moz-transform: scale(1.05);
    transform: scale(1.05);
}

#projekte .projekt .title {
    font-size: 22px;
    text-align: center;
}

#projekte .projekt .description {
    font-family: "libertine-italic";
    font-size: 13px;
}

#projekte .projekt .group {
    font-family: "libertine-italic";
    font-size: 10px;
}

#footer {
    position: absolute;
    top: 340px;
    left: 100px; /* 600/2 - 400/2 */
    width: 400px;
    height: 80px;
    font-size: 0.8em;
}

@font-face{
  font-family: "libertine";
  src: url("fonts/LinBiolinum_Re-0.6.4.otf") format("opentype");
}

@font-face{
  font-family: "libertine-italic";
  src: url("fonts/LinBiolinum_It-0.5.1.otf") format("opentype");
}