.noise {
  animation: 3s steps(6) 0s infinite normal none running noise;
  background-position: 50% center;
  position: absolute;
  z-index: 10;
  pointer-events: none;
  left: -10rem;
  top: -10rem;
  background-image: url(./noise.png);
  background-size: 10% 10%;
  position: fixed;
  inset: -20rem;
}

body {
  margin: 0;
  padding: 20px;
  font-family: 'Arial', sans-serif;
  background-color: #f0f0f0;
}

.bio {
  position: relative;
}

.bio span {
  font-weight: bold;
}

@keyframes noise {
  0% {
    transform: translate(0, 0);
  }
  10% {
    transform: translate(-5rem, -5rem);
  }
  30% {
    transform: translate(3rem, -8rem);
  }
  50% {
    transform: translate(10rem, 10rem);
  }
  70% {
    transform: translate(9rem, 3rem);
  }
  90% {
    transform: translate(-1rem, 7rem);
  }
}
