@font-face {
	font-family: 'My Variable Font';
  src: url(../fonts/ABCGintoNormalVariable-Trial.ttf);
	font-weight: 100 1000;
	font-stretch: 25% 200%;
}

@font-face {
	font-family: 'My Variable Font';
  src: url(../fonts/ABCGintoNordVariable-Trial.ttf);
	font-weight: 100 1000;
}

:root {
  font-size: 200%;
}

h1{
  font-family: 'Recursive'; /* Dieser Name korrespondiert mit den Einstellungen in fonts.css */
  color:rgb(116, 201, 31);
  font-size: 8vw;
  /* font-style: oblique 10deg;  */
  /* font-variation-settings: 'slnt' -30; */
  animation: my-slant 2s infinite alternate;
}
h2{
font-family: 'ABCGintoNormal'; /* Dieser Name korrespondiert mit den Einstellungen in fonts.css */
font-size: 8vw;
animation: my-weight 2s infinite alternate;
}
/* .wide {
  font-stretch: 200%
} */

img{
  width: 50%;}



@keyframes my-slant {
  from {  
    font-variation-settings: 'slnt' -15, "CRSV" 0;
  }
  to{  
    font-variation-settings: 'slnt' 15, "CRSV" 1;
  }
}

  @keyframes my-weight {
    from {
      font-weight: 100;
      font-stretch: 50%
    }
    to {
      font-weight: 800;
      font-stretch: 800%
    }
}