/* _______________________________________________ALLGEMEIN____________ */

html,body{
width:95vw;
height:101vh;
margin:0;
padding:0;
font-family:"Modern No. 20", "Times New Roman", "Times", "Georgia", serif; 
}


/* _______________________________________________VERLAUF____________ */

#background{

background-image:url("img/Verlauf.png");
background-repeat:repeat-x;
background-position:top 0 left 0;
background-size:5px 50vw;
position:fixed;
top:0;
left:0;
width:100vw;
height:100vh;
}

/* _______________________________________________Trennlinie___________ */

#trennung{
position:fixed;
top:4vw;
width:100vw;
height:1vw;
border-top:0.2vw solid white;
border-bottom:0.1vw solid white;
}

/* _______________________________________________Tanzpaar____________ */

#tanzpaar{
background-image:url("img/Tanzpaar_Schatten.png");
background-repeat:no-repeat;
background-position:left 0 top 0;
background-size:60vw;
position:fixed;
top:0;
left:0;
width:100vw;
height:100vh;
}

/* ______________________________________________Post-it_______________ */
#postit{
background-image:url("img/Postit.png");
background-repeat:no-repeat;
background-position:left 0 top 0;
background-size:15vw;
position:fixed;
top:1vw;
left:30vw;
width:100vw;
height:100vh;
}

/* _______________________________________________ANREISSER____________ */

#anreisser1{
position:fixed;
width:100vw;
height:100vh;
background-repeat:no-repeat;
background-image:url("img/Willkommen.png");
background-size:45%;
left:50vw;
top:6vw;
}


#anreisser2{
position:fixed;
width:100vw;
height:100vh;
background-repeat:no-repeat;
background-image:url("img/antanzen.png");
background-size:35%;
left:55vw;
top:33vw;
}

/* _______________________________________________Button____________ */

#button a{
position:fixed;
width:20vh;
height:20vh;
left:67vw;
top:20vw;
border-radius:1vw;
border:0.15vw solid black;
background-size:100% 100%;
background-repeat:no-repeat;
background-image:url("img/Takt7.png");
animation-duration: 8s;
animation-name: takt;
animation-iteration-count: infinite;
display:block;
text-indent:-9999px;
text-decoration:none;
}

#button:hover{
border-color:white;
}

/* _______________________________________________Lauftext____________ */
#ticker {
position:fixed;
height:3vw;
top:0.5vw;
right:0vw;
left:0vw;
color:white;
font-size:3vw;
}

#ticker a{
color:white;
}

/* _______________________________________________ANIMATION____________ */

@keyframes takt {
   11% {
  background-image:url("img/Takt6.png");
  }
   22% {
   background-image:url("img/Takt1.png");
  }
    33% {
   background-image:url("img/Takt2.png");
  }
    44% {
   background-image:url("img/Takt3.png");
  }
    55% {
   background-image:url("img/Takt4.png");
  }
   66% {
  background-image:url("img/Takt5.png");
  }
   77% {
  background-image:url("img/Takt6.png");
  }
   100% {
  background-image:url("img/Takt7.png");
  }
}