@font-face {
    font-family: 'Fabrikat';
    src: url('fonts/Fabrikat-Regular.eot');
    src: url('fonts/Fabrikat-Regular.eot?#iefix') format('embedded-opentype'),
    url('fonts/Fabrikat-Regular.woff2') format('woff2'),
    url('fonts/Fabrikat-Regular.woff') format('woff'),
    url('fonts/Fabrikat-Regular.svg#Fabrikat-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
}


* {
    margin:0;
    padding:0;
    box-sizing: border-box;
    font-family: 'Fabrikat';
}

body {
    height: 100vh;
    width:100vw;
    background-color: #000;
    display: flex;
    flex-flow: column wrap;
    justify-content: flex-start;
    align-items: center;
    justify-content: center;
}

.logo {
    display: flexbox;
    margin: 0 auto;
    padding:1em;
    width:25vw;
    height:25vh;
    background: url(../img/h82-logo-gelb.svg) center center no-repeat transparent;
    background-size:contain;
    text-align:center;
    vertical-align: text-bottom;
    animation: glowing 1800ms infinite alternate;
}

.logo:hover {
    transform: scale(1.05);
    transform-origin: center;
}

a {
    text-decoration:none;
}

p {
    margin-top:1em;
    display: flexbox;
    clear: both;
    color: #fff;
    font-size: 0.8em;
    font-weight: 100;
}

@keyframes glowing {
    from {
        /*filter: drop-shadow(0 0 -10px rgba(255, 255, 0, 0.2));*/
        filter: drop-shadow(0 0 -10px rgba(255, 0, 0, 0.2)) 
                drop-shadow(0 0 -10px rgba(0, 255, 0, 0.2))
                drop-shadow(0 0 -10px rgba(0, 0, 255, 0.2));
      }
      to {
        
        /*filter: drop-shadow(0px 0px 15px rgba(255, 255, 0, 0.8));*/
        filter: drop-shadow(5px 0 15px rgba(255, 0, 0, 0.8)) 
                drop-shadow(-5px 0 15px rgba(0, 255, 0, 0.8))
                drop-shadow(0 0 15px rgba(0, 0, 255, 0.5));
      }
  }