.snow{z-index:1;top:0;width:100%;opacity:.3;overflow:hidden}.snow,.snow__flake{position:absolute;height:100%}.snow__flake{top:-300px;left:0;width:300px;background-repeat:no-repeat;background-size:300px 1200px;background-position:0 0;background-image:url(https://andrew-hawkes-media.s3.amazonaws.com/codepen/snow/snow-flake-1.png);-webkit-animation-name:snowflake;animation-name:snowflake;-webkit-animation-timing-function:linear;animation-timing-function:linear;-webkit-animation-duration:10s;animation-duration:10s;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}.snow__flake:nth-of-type(1n){left:2.5%;-webkit-animation-duration:6583ms;animation-duration:6583ms}.snow__flake:nth-of-type(2n){left:5%;-webkit-animation-duration:5938ms;animation-duration:5938ms}.snow__flake:nth-of-type(3n){left:7.5%;-webkit-animation-duration:6074ms;animation-duration:6074ms}.snow__flake:nth-of-type(4n){left:10%;-webkit-animation-duration:5866ms;animation-duration:5866ms}.snow__flake:nth-of-type(5n){left:12.5%;-webkit-animation-duration:5203ms;animation-duration:5203ms}.snow__flake:nth-of-type(6n){left:15%;-webkit-animation-duration:4481ms;animation-duration:4481ms}.snow__flake:nth-of-type(7n){left:17.5%;-webkit-animation-duration:3581ms;animation-duration:3581ms}.snow__flake:nth-of-type(8n){left:20%;-webkit-animation-duration:5366ms;animation-duration:5366ms}.snow__flake:nth-of-type(9n){left:22.5%;-webkit-animation-duration:7411ms;animation-duration:7411ms}.snow__flake:nth-of-type(10n){left:25%;-webkit-animation-duration:6502ms;animation-duration:6502ms}.snow__flake:nth-of-type(11n){left:27.5%;-webkit-animation-duration:4358ms;animation-duration:4358ms}.snow__flake:nth-of-type(12n){left:30%;-webkit-animation-duration:3808ms;animation-duration:3808ms}.snow__flake:nth-of-type(13n){left:32.5%;-webkit-animation-duration:4427ms;animation-duration:4427ms}.snow__flake:nth-of-type(14n){left:35%;-webkit-animation-duration:5371ms;animation-duration:5371ms}.snow__flake:nth-of-type(15n){left:37.5%;-webkit-animation-duration:5956ms;animation-duration:5956ms}.snow__flake:nth-of-type(16n){left:40%;-webkit-animation-duration:3989ms;animation-duration:3989ms}.snow__flake:nth-of-type(17n){left:42.5%;-webkit-animation-duration:3393ms;animation-duration:3393ms}.snow__flake:nth-of-type(18n){left:45%;-webkit-animation-duration:3644ms;animation-duration:3644ms}.snow__flake:nth-of-type(19n){left:47.5%;-webkit-animation-duration:6115ms;animation-duration:6115ms}.snow__flake:nth-of-type(20n){left:50%;-webkit-animation-duration:7755ms;animation-duration:7755ms}.snow__flake:nth-of-type(21n){left:52.5%;-webkit-animation-duration:4384ms;animation-duration:4384ms}.snow__flake:nth-of-type(22n){left:55%;-webkit-animation-duration:3301ms;animation-duration:3301ms}.snow__flake:nth-of-type(23n){left:57.5%;-webkit-animation-duration:4868ms;animation-duration:4868ms}.snow__flake:nth-of-type(24n){left:60%;-webkit-animation-duration:6221ms;animation-duration:6221ms}.snow__flake:nth-of-type(25n){left:62.5%;-webkit-animation-duration:7221ms;animation-duration:7221ms}.snow__flake:nth-of-type(26n){left:65%;-webkit-animation-duration:7525ms;animation-duration:7525ms}.snow__flake:nth-of-type(27n){left:67.5%;-webkit-animation-duration:3449ms;animation-duration:3449ms}.snow__flake:nth-of-type(28n){left:70%;-webkit-animation-duration:7.9s;animation-duration:7.9s}.snow__flake:nth-of-type(29n){left:72.5%;-webkit-animation-duration:7579ms;animation-duration:7579ms}.snow__flake:nth-of-type(30n){left:75%;-webkit-animation-duration:7585ms;animation-duration:7585ms}.snow__flake:nth-of-type(31n){left:77.5%;-webkit-animation-duration:4277ms;animation-duration:4277ms}.snow__flake:nth-of-type(32n){left:80%;-webkit-animation-duration:5646ms;animation-duration:5646ms}.snow__flake:nth-of-type(33n){left:82.5%;-webkit-animation-duration:3066ms;animation-duration:3066ms}.snow__flake:nth-of-type(34n){left:85%;-webkit-animation-duration:5552ms;animation-duration:5552ms}.snow__flake:nth-of-type(35n){left:87.5%;-webkit-animation-duration:6446ms;animation-duration:6446ms}.snow__flake:nth-of-type(36n){left:90%;-webkit-animation-duration:5306ms;animation-duration:5306ms}.snow__flake:nth-of-type(37n){left:92.5%;-webkit-animation-duration:6.58s;animation-duration:6.58s}.snow__flake:nth-of-type(38n){left:95%;-webkit-animation-duration:4111ms;animation-duration:4111ms}.snow__flake:nth-of-type(39n){left:97.5%;-webkit-animation-duration:7079ms;animation-duration:7079ms}.snow__flake:nth-of-type(40n){left:100%;-webkit-animation-duration:4282ms;animation-duration:4282ms}.snow__flake:nth-of-type(2n){background-image:url(https://andrew-hawkes-media.s3.amazonaws.com/codepen/snow/snow-flake-2.png)}.snow__flake:nth-of-type(3n){background-image:url(https://andrew-hawkes-media.s3.amazonaws.com/codepen/snow/snow-flake-3.png)}.snow__flake:nth-of-type(4n){background-image:url(https://andrew-hawkes-media.s3.amazonaws.com/codepen/snow/snow-flake-4.png)}@-webkit-keyframes snowflake{0%{opacity:0;transform:translateZ(0)}40%{opacity:1}80%{opacity:1}to{opacity:0;transform:translate3d(60%,120%,0)}}@keyframes snowflake{0%{opacity:0;transform:translateZ(0)}40%{opacity:1}80%{opacity:1}to{opacity:0;transform:translate3d(60%,120%,0)}}