@font-face {
    font-family: 'dejavusansmini';
    src: url('../fonts/dejavusans-webfont.woff2') format('woff2'),
         url('../fonts/dejavusans-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
body,h1 {font-family: "dejavusansmini", sans-serif}
body, html {margin:0;height: 100%}
a {color:inherit}
@keyframes fadein{from{opacity:0} to{opacity:1}}
body {
    background-image: url('../img/rainbow.svg');
    background-repeat: no-repeat;
    background-attachment: fixed;
    min-height: 100vh;
    background-position: center;
    background-size: cover;
    position: relative;
    animation: fadein 0.8s;
    color: black;
}
@media (min-width: 600px) {
    #maincontent {
        position: absolute;
        left: 50%;
        transform: translate(-50%,0);
        -ms-transform: translate(-50%,0);
        max-width: 100vw;
    }
}
#maincontent.verticalcenter {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
}
.contentbox{
    background-color: #1f6aa1;
    color: white;
    padding: 20px;
    min-height: 100%;
    box-sizing: border-box;
}
@keyframes animatetop{from{top:-300px;opacity:0} to{top:0;opacity:1}}
#title {
    position: relative;
    animation: animatetop 0.4s;
    font-size: 3em;
    text-align:center
}
.textpiece {
    font-size: 36px;
    text-align:center
}
.socialicon {
    margin: auto;
    width: 15%;
}
.partners {
    width: 25%;
}
#impressumlink {
    position: fixed;
    left: 0;
    bottom: 0;
    padding: 12px 24px;
    font-size: 0.8em;
}
#credits {
    position: fixed;
    text-align: right;
    right: 0;
    bottom: 0;
    padding: 12px 24px;
    font-size: 0.8em;
}

