.snow, .snow:before, .snow:after {
    position: absolute;
    top: -600px;
    left: 0;
    bottom: 0;
    right: 0;
    background-image: radial-gradient(5px 5px at 536px 386px, rgba(255, 255, 255, 0.9) 50%, rgba(0, 0, 0, 0)),  radial-gradient(6px 6px at 267px 34px, rgba(255, 255, 255, 0.9) 50%, rgba(0, 0, 0, 0)), radial-gradient(5px 5px at 329px 262px, rgba(255, 255, 255, 0.6) 50%, rgba(0, 0, 0, 0)), radial-gradient(5px 5px at 321px 479px, white 50%, rgba(0, 0, 0, 0)), radial-gradient(5px 5px at 508px 29px, rgba(255, 255, 255, 0.7) 50%, rgba(0, 0, 0, 0)), radial-gradient(4px 4px at 348px 538px, rgba(255, 255, 255, 0.7) 50%, rgba(0, 0, 0, 0)), radial-gradient(4px 4px at 189px 550px, white 50%, rgba(0, 0, 0, 0)), radial-gradient(4px 4px at 478px 403px, rgba(255, 255, 255, 0.7) 50%, rgba(0, 0, 0, 0));
    background-size: 600px 600px;
    animation: snow 3s linear infinite;
    content: "";
  }
  
  .snow:after {
    margin-left: -200px;
    opacity: 0.4;
    animation-duration: 6s;
    animation-direction: reverse;
    filter: blur(3px);
  }
  
  .snow:before {
    animation-duration: 9s;
    animation-direction: reverse;
    margin-left: -300px;
    opacity: 0.65;
    filter: blur(1.5px);
  }
  
  @keyframes snow {
    to {
      transform: translateY(600px);
    }
  }