#muziek {
    position: absolute;
    width: 100%;
    height: 100%;
    min-width: 360px;
    min-height: 360px;
    font-family: "Roboto Mono" , monospace;
    overflow: hidden;
    --web-view-name: muziek;
    --web-view-id: muziek;
    --web-scale-to-fit: true;
    --web-scale-to-fit-type: fit;
    --web-scale-on-resize: true;
    --web-enable-deep-linking: true;
    --web-page-font: monospace;
    overflow: hidden;
}
#Rectangle_2 {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    position: absolute;
    width: 80%;
    height: 40%;
    left: 10%;
    top: 128px;
    margin-top: 50px;
    overflow: visible;
}
#Rectangle_3 {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    position: absolute;
    width: 80%;
    height: 40%;
    left: 10%;
    top: 305px;
    margin-top: 50px;
    overflow: visible;
}
#hf_logo {
    position: absolute;
    width: 150px;
    height: 150px;
    animation-name: rechtslinks;
    animation-duration: 1.5s;
    cursor: pointer;
}

#tekst {
    position: absolute;
    top: 290px;
    font-size: 30px;
    white-space: nowrap;
    transform: scale(1);
    transition: all 1s ease;
      display: flex;
     
}	
#tekst {
    animation: tekst 15s infinite;
    animation-timing-function: linear;
    
}	
    
#tekst:hover {
      animation-duration: 2s;
}
#tekst2 {
    position: absolute;
    top: 460px;
    font-size: 30px;
    white-space: nowrap;
    transform: scale(1);
    transition: all 1s ease;
      display: flex;
     
}	
#tekst2 {
    animation: tekst 15s infinite;
    animation-timing-function: linear;
    animation-direction: reverse;
    
}	
    
#tekst2:hover {
    animation: tekst 15s infinite reverse linear, regenboog 3s infinite;

}






@keyframes tekst {
    from {transform:translateX(0%)}
    to {transform:translateX(-50%)}
    }






@keyframes kleur1 {
from {background-color: white}
to {background-color: #f762ad81;}
}

@keyframes kleur2 {
from {background-color: rgba(72, 180, 72, 0.747)}
to {background-color: #f762ad81;}
}

@keyframes regenboog {
0% {
text-emphasis-color: #ff0000;
}
14% {
color: #ffa500;
}
28% {
color: #ffff00;
}
42% {
color: #008000;
}
56% {
color: #0000ff;
}
70% {
color: #4b0082;
}
84% {
color: #ee82ee;
}
100% {
color: #ff0000;
}
}