.snow-container {
      position: absolute;
      height: calc(100vh + 100px);
      width: calc(100% + 100px);
      line-height: 100%;
      top: -100px;
      left: -100px;
      overflow: hidden;
      z-index: 1001;
      pointer-events: none;
  }

  .snow-container .snow {
      display: block;
      position: absolute;
      z-index: 2;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      pointer-events: none;
      transform: translate3d(0, -100%, 0);
      animation: snow linear infinite;
  }

  .snow-container .snow.foreground {
      background-image: url("/images/large.png");
      animation-duration: 15s;
  }

  .snow-container .snow.foreground.layered {
      animation-delay: 7.5s;
  }

  .snow-container .snow.middleground {
      background-image: url("/images/medium.png");
      animation-duration: 20s;
  }

  .snow-container .snow.middleground.layered {
      animation-delay: 10s;
  }

  .snow-container .snow.background {
      background-image: url("/images/small.png");
      animation-duration: 30s;
  }

  .snow-container .snow.background.layered {
      animation-delay: 15s;
  }

  @keyframes snow {
      0% {
          transform: translate3d(0, -100%, 0);
      }

      100% {
          transform: translate3d(15%, 100%, 0);
      }
  }