@font-face{
    font-family: "bariol";
    src: url("./fonts/bariol_regular-webfont.woff") format("woff"),
        url("./fonts/bariol_regular-webfont.woff2") format("woff2")
}

@font-face{
    font-family: "bariolSerif";
    src: url("./fonts/bariol_serif_regular-webfont.woff") format("woff"),
        url("./fonts/bariol_serif_regular-webfont.woff2") format("woff2")
}

div.main{
    min-width: 100vw;
}

hr{
    background-color: whitesmoke;
    height: 1px;
    margin-top: 5vw;
    margin-bottom: 0px;
}

body{
    background-color: black;
    font-family: "bariolSerif";
    color: whitesmoke;
    display:flex; flex-direction:column; 
    justify-content:center;
    min-height:100vh;
}
a:hover{
    text-decoration: none;
}


.header{
    font-family: 'Audiowide', cursive;

    line-height: vw;
   
    color: white;
    
}

p#jahreszahl{
    font-size: 7vw;
    letter-spacing:  5vw;
    text-indent: 5vw;
}
div.swichtige p{
    text-shadow:  0 0 80px #ffffff,0 0 30px #008000,0 0 6px #09ff00

}
p.header#titel{
    font-size: 7vw;
}
/* Blink for Webkit and others
(Chrome, Safari, Firefox, IE, ...)
*/

 @-webkit-keyframes blinker {
    from {opacity: 1.0;}
    to {opacity: 0.0;}
  }
  
  .swichtige{
      text-decoration: blink;
      -webkit-animation-name: blinker;
      -webkit-animation-duration: 3s;
      -webkit-animation-iteration-count:infinite;
      -webkit-animation-timing-function:cubic-bezier(.04,.8,.97,-0.03);
      -webkit-animation-direction: alternate;

  }
  
div.moto{
    font-size: 5vw;
    text-shadow:  0 0 80px #ffffff,0 0 30px #008000,0 0 6px #09ff00;

}

div.teaser{
  
    color: white;
    margin-top: 5vw;
    margin-bottom: 5vw;
    text-decoration: none;
   
}

div.teaser p{
    text-shadow:  3px 0px 3px #178d05,-3px 0px 3px #178d05;
    font-size: 3.4vw;
    margin-bottom: 0.5vw;
    
}

div.teaser p#date{
    font-size: 5.5vw;
    border-top-width: 2px;
    border-top: whitesmoke;
}

div button#infoButton{
    font-size: 3.4vw;
    text-shadow:  3px 0px 3px #178d05,-3px 0px 3px #178d05;
    font-family: "bariolSerif";
    padding-left: 10vw;
    padding-right: 10vw;
}


#raveRow { 
  background: linear-gradient(124deg, #ff0000,  #e8b71d, #e3e81d, #1de840, #1ddde8,#006af5, #2b1de8, #7100f3, #4100f3);
  background-size: 180% 180%;
  
  
  
  -webkit-animation: rainbow 10s ease infinite;
  -z-animation: rainbow 10s ease infinite;
  -o-animation: rainbow 10s ease infinite;
    animation: rainbow 10s ease infinite;
}
  
@-webkit-keyframes rainbow {
    0%{background-position:0% 82%}
    50%{background-position:100% 19%}
    100%{background-position:0% 82%}
}
@-moz-keyframes rainbow {
    0%{background-position:0% 82%}
    50%{background-position:100% 19%}
    100%{background-position:0% 82%}
}
@-o-keyframes rainbow {
    0%{background-position:0% 82%}
    50%{background-position:100% 19%}
    100%{background-position:0% 82%}
}
@keyframes rainbow { 
    0%{background-position:0% 82%}
    50%{background-position:100% 19%}
    100%{background-position:0% 82%}
}