.decoration {
  position: absolute;
  pointer-events: none;
  z-index: -2;
}

.decoration img {
  display: block;
}

#lavender {
  left: -8vw;
  top: -90%;
  transform: scale(.5) translate(0%, 100vh);
  transform-origin: right;
}

#black {
  left: -8vw;
  top: -74%;
  transform: scale(.5) translate(0%, 100vh);
  transform-origin: right;
}

#red {
  right: 2vw;
  top: -80%;
  transform: scale(.5) translate(0%, 100vh);
  transform-origin: right;
}

#blue {
  right: 10vw;
  top: -68%;
  transform: scale(.4) translate(0, 135vh);
  transform-origin: right;
}

#yellow {
  transform: scale(.3) translate(-45%, 51vh);
  transform-origin: left;
}

#pink {
  transform: scale(.3) translate(-30%, 47vh);
  transform-origin: left;
}

#green {
  bottom: -5vw;
  transform: scale(.4) translate(171%, -23vh);
  z-index: -3;
}

@media only screen and (max-width: 1040px) {
  .decoration {
    display: none;
  }

  #yellow {
    display: none;
  }

  #yellow {
    transform: scale(.4) translate(-50%, 130vh);
  }

}