:root {
  font-size: 200%;
  font-family: "Jabin"; /* Dieser Name korrespondiert mit den Einstellungen in fonts.css */
  
}







svg {

opacity: 0;

}

svg:hover {  

opacity: 1;

}



.cls-1, .cls-2, .cls-3 {
  opacity: .98;
}

.cls-1, .cls-4 {
  fill: #d62300;
}

.cls-5 {
  fill: rgba(214, 35, 0, .98);
}

.cls-6, .cls-3 {
  fill: #f5ebdc;
}




h1 {
  
font-size: 400%;
position: absolute;
align-self: center;
margin-left: 20vw;
margin-top: 20vh;

animation: cheese 2s alternate infinite;
animation-delay: var(--delay);
overflow: hidden;
z-index: 1;


}

.img {

opacity: 0;  

}


h1:hover {  

animation: cheese 1s alternate infinite;
animation-delay: var(--delay);
overflow: hidden;

}


body {
  background-color: #f5ebdc;
}









@keyframes cheese {
  0% {
    font-variation-settings:   "wght" 40, "wdth" 0, "XXXX" 1;
    color: blue;
  }

  100% {
    font-variation-settings:   "wght" 120, "wdth" 0, "XXXX" 100;
    color:#d62300;
  }


}



@keyframes salad {
  0% {
    font-variation-settings:  "wght" 400, "SWSH" 0;
    color: rgb(255, 255, 255);
  }

  100% {
    font-variation-settings:  "wght" 800, "SWSH" 1000;
    color:#ffffff;
  }


}
