snowfall-up-2x.css

body {
    /*background: black url(https://lh3.googleusercontent.com/-8yGCBzF9F_s/XCHzZ5t7sJI/AAAAAAAAAlA/fnnU7Cma8UM9oE9ztOtlcqFs_aZiRI-aQCK8BGAs/s0/2018-12-25.jpg) center center no-repeat/cover;*/
    background-image: url(mountains.png);
    /*background-color: #EBE5E3;*/
}
/* customizable snowflake styling */
.snowflake {
  color: #f8f0ec;
  font-size: 1em;
  font-family: Arial;
  text-shadow: 0 0 1px #000;
}
@keyframes snowflakes-fall{
  0%{
    top: 110%
  }
  100%{
    top: -5%
    }
  }
@keyframes snowflakes-shake{
  0%{
    transform:translateX(0px)
    }
  50%{
    transform:translateX(80px)
    }
  100%{
    transform:translateX(0px)
    }
  }
.snowflake{
  position:fixed;
  top: 110%;
  z-index:9999;
  user-select:none;
  cursor:default;
  animation-name:snowflakes-fall,snowflakes-shake;
  animation-duration:6s,1.2s;
  animation-timing-function:linear,ease-in-out;
  animation-iteration-count:infinite,infinite;
  animation-play-state:running,running
}
.snowflake:nth-of-type(0){
  left:1%;
  animation-delay:0s,0s
}
.snowflake:nth-of-type(1){
  left:10%;
  animation-delay:1s,1s
  }
.snowflake:nth-of-type(2){
  left:20%;
  animation-delay:4s,.5s
  }
.snowflake:nth-of-type(3){
  left:30%;
  animation-delay:3s,1s
  }
.snowflake:nth-of-type(4){
  left:40%;
  animation-delay:1s,1.1s
  }
.snowflake:nth-of-type(5){
  left:50%;
  animation-delay:3.5s,1.6s
  }
.snowflake:nth-of-type(6){
  left:60%;
  animation-delay:1.5s,1.4s
  }
.snowflake:nth-of-type(7){
  left:70%;
  animation-delay:1s,1s
  }
.snowflake:nth-of-type(8){
  left:80%;
  animation-delay:3s,0s
  }
.snowflake:nth-of-type(9){
  left:90%;
  animation-delay:2s,1.1s
}
/* Demo Purpose Only*/
.demo {
  font-family: 'Raleway', sans-serif;
	color:#fff;
    display: block;
    margin: 0 auto;
    padding: 15px 0;
    text-align: center;
}
.demo a{
  font-family: 'Raleway', sans-serif;
color: #000;		
}