.balloon {
  background-image: url(https://i.imgur.com/QJZPw2X.png);
  width: 160px;
  height: 90px;
  background-size: contain;
  position: absolute;
  bottom: 0%;
  animation: move_y 10s linear forwards, oscil1 5s infinite;
}

@keyframes move_y {
  from {
    top: 100%;
  }
  to {
    top: 0%;
  }
}

@keyframes oscil1 {
  from {
    translate: 0 0;
    transform: rotate(0deg);
    animation-timing-function: cubic-bezier(0.1, 0.3, 0.3, 1);
  }
  25% {
    translate: 10px 0;
    transform: rotate(4deg);
    animation-timing-function: cubic-bezier(0.7, 0.0, 0.9, 0.7);
  }
  50% {
    translate: 0 0;
    transform: rotate(0deg);
    animation-timing-function: cubic-bezier(0.1, 0.3, 0.3, 1);
  }
  75% {
    translate: -10px 0;
    transform: rotate(-4deg);
    animation-timing-function: cubic-bezier(0.7, 0.0, 0.9, 0.7);
  }
  to {
    translate: 0 0;
    transform: rotate(0deg);
  }
}



.balloonfooter {
  background-image: url(https://i.imgur.com/QJZPw2X.png);
  width: 160px;
  height: 90px;
  background-size: contain;
  position: absolute;
  bottom: 0%;
  animation: move_y1 10s linear forwards, oscil1 5s infinite;
}

@keyframes move_y1 {
  from {
    top: 100%;
  }
  to {
    top: 75%;
  }
}