.particle{position: absolute;border-radius: 50%;}@-webkit-keyframes particle-animation-1 {100% { -webkit-transform: translate3d(5vw, 74vh, 17px);transform: translate3d(5vw, 74vh, 17px);}}@keyframes particle-animation-1 {100% { -webkit-transform: translate3d(5vw, 74vh, 17px);transform: translate3d(5vw, 74vh, 17px);}}.particle:nth-child(1){-webkit-animation: particle-animation-1 60s infinite;animation: particle-animation-1 60s infinite;opacity: 0.65;height: 44px;width: 44px;-webkit-animation-delay: -0.2s;animation-delay: -0.2s;-webkit-transform: translate3d(16.6vw, 80vh, 27px);transform: translate3d(16.6vw, 80vh, 27px);background: rgba(255,255,255,0.1);}@-webkit-keyframes particle-animation-2 {100% { -webkit-transform: translate3d(88vw, 74vh, 29px);transform: translate3d(88vw, 74vh, 29px);}}@keyframes particle-animation-2 {100% { -webkit-transform: translate3d(88vw, 74vh, 29px);transform: translate3d(88vw, 74vh, 29px);}}.particle:nth-child(2){-webkit-animation: particle-animation-2 60s infinite;animation: particle-animation-2 60s infinite;opacity: 0.26;height: 100px;width: 100px;-webkit-animation-delay: -0.4s;animation-delay: -0.4s;-webkit-transform: translate3d(23vw, 49vh, 25px);transform: translate3d(23vw, 49vh, 25px);background: rgba(255,255,255,0.3);}@-webkit-keyframes particle-animation-3 {100% { -webkit-transform: translate3d(90vw, 20vh, 19px);transform: translate3d(90vw, 20vh, 19px);}}@keyframes particle-animation-3 {100% { -webkit-transform: translate3d(90vw, 20vh, 38px);transform: translate3d(90vw, 20vh, 38px);}}.particle:nth-child(3){-webkit-animation: particle-animation-3 60s infinite;animation: particle-animation-3 60s infinite;opacity: 0.5;height: 50px;width: 50px;-webkit-animation-delay: -0.6s;animation-delay: -0.6s;-webkit-transform: translate3d(80vw, 48vh, 19px);transform: translate3d(80vw, 48vh, 19px);background: rgba(255,255,255,0.3);}@-webkit-keyframes particle-animation-4 {100% { -webkit-transform: translate3d(54vw, 7vh, 30px);transform: translate3d(54vw, 7vh, 30px);}}@keyframes particle-animation-4 {100% { -webkit-transform: translate3d(54vw, 7vh, 30px);transform: translate3d(54vw, 7vh, 30px);}}.particle:nth-child(4){-webkit-animation: particle-animation-4 60s infinite;animation: particle-animation-4 60s infinite;opacity: 0.22;height: 6px;width: 6px;-webkit-animation-delay: -0.8s;animation-delay: -0.8s;-webkit-transform: translate3d(55vw, 58vh, 91px);transform: translate3d(55vw, 58vh, 91px);background: rgba(255,255,255,0.3);}@-webkit-keyframes particle-animation-5 {100% { -webkit-transform: translate3d(40vw, 59vh, 35px);transform: translate3d(40vw, 59vh, 35px);}}@keyframes particle-animation-5 {100% { -webkit-transform: translate3d(40vw, 59vh, 35px);transform: translate3d(40vw, 59vh, 35px);}}.particle:nth-child(5){-webkit-animation: particle-animation-5 60s infinite;animation: particle-animation-5 60s infinite;opacity: 0.47;height: 8px;width: 8px;-webkit-animation-delay: -1s;animation-delay: -1s;-webkit-transform: translate3d(8vw, 53vh, 23px);transform: translate3d(8vw, 53vh, 23px);background: rgba(255,255,255,0.3);}@-webkit-keyframes particle-animation-6 {100% { -webkit-transform: translate3d(7vw, 88vh, 89px);transform: translate3d(7vw, 88vh, 89px);}}@keyframes particle-animation-6 {100% { -webkit-transform: translate3d(7vw, 88vh, 89px);transform: translate3d(7vw, 88vh, 89px);}}.particle:nth-child(6){-webkit-animation: particle-animation-6 60s infinite;animation: particle-animation-6 60s infinite;opacity: 0.94;height: 6px;width: 6px;-webkit-animation-delay: -1.2s;animation-delay: -1.2s;-webkit-transform: translate3d(78vw, 12vh, 24px);transform: translate3d(78vw, 12vh, 24px);background: rgba(255,255,255,0.3);}*/@-webkit-keyframes particle-animation-7 {100% { -webkit-transform: translate3d(15vw, 30vh, 12px);transform: translate3d(15vw, 30vh, 12px);}}@keyframes particle-animation-7 {100% { -webkit-transform: translate3d(15vw, 30vh, 12px);transform: translate3d(15vw, 30vh, 12px);}}.particle:nth-child(7){-webkit-animation: particle-animation-7 60s infinite;animation: particle-animation-7 60s infinite;opacity: 0.44;height: 8px;width: 8px;-webkit-animation-delay: -1.4s;animation-delay: -1.4s;-webkit-transform: translate3d(57vw, 68vh, 47px);transform: translate3d(57vw, 68vh, 47px);background: rgba(255,255,255,0.3);}@-webkit-keyframes particle-animation-8 {100% { -webkit-transform: translate3d(44vw, 78vh, 27px);transform: translate3d(44vw, 78vh, 27px);}}@keyframes particle-animation-8 {100% { -webkit-transform: translate3d(44vw, 78vh, 27px);transform: translate3d(44vw, 78vh, 27px);}}.particle:nth-child(8){-webkit-animation: particle-animation-8 60s infinite;animation: particle-animation-8 60s infinite;opacity: 0.54;height: 10px;width: 10px;-webkit-animation-delay: -1.6s;animation-delay: -1.6s;-webkit-transform: translate3d(66vw, 83vh, 80px);transform: translate3d(66vw, 83vh, 80px);background: rgba(255,255,255,0.3);}@-webkit-keyframes particle-animation-9 {100% { -webkit-transform: translate3d(55vw, 12vh, 67px);transform: translate3d(55vw, 12vh, 67px);}}@keyframes particle-animation-9 {100% { -webkit-transform: translate3d(55vw, 12vh, 67px);transform: translate3d(55vw, 12vh, 67px);}}.particle:nth-child(9){-webkit-animation: particle-animation-9 60s infinite;animation: particle-animation-9 60s infinite;opacity: 0.85;height: 8px;width: 8px;-webkit-animation-delay: -1.8s;animation-delay: -1.8s;-webkit-transform: translate3d(80vw, 26vh, 96px);transform: translate3d(80vw, 26vh, 96px);background: rgba(255,255,255,0.3);}@-webkit-keyframes particle-animation-10 {100% { -webkit-transform: translate3d(74vw, 84vh, 28px);transform: translate3d(74vw, 84vh, 28px);}}@keyframes particle-animation-10 {100% { -webkit-transform: translate3d(74vw, 84vh, 28px);transform: translate3d(74vw, 84vh, 28px);}}.particle:nth-child(10){-webkit-animation: particle-animation-10 60s infinite;animation: particle-animation-10 60s infinite;opacity: 0.85;height: 8px;width: 8px;-webkit-animation-delay: -2s;animation-delay: -2s;-webkit-transform: translate3d(90vw, 12vh, 5px);transform: translate3d(90vw, 12vh, 5px);background: rgba(255,255,255,0.3);}@-webkit-keyframes particle-animation-11 {100% { -webkit-transform: translate3d(59vw, 43vh, 98px);transform: translate3d(59vw, 43vh, 98px);}}@keyframes particle-animation-11 {100% { -webkit-transform: translate3d(59vw, 43vh, 98px);transform: translate3d(59vw, 43vh, 98px);}}.particle:nth-child(11){-webkit-animation: particle-animation-11 60s infinite;animation: particle-animation-11 60s infinite;opacity: 0.23;height: 8px;width: 8px;-webkit-animation-delay: -2.2s;animation-delay: -2.2s;-webkit-transform: translate3d(85vw, 4vh, 85px);transform: translate3d(85vw, 4vh, 85px);background: rgba(255,255,255,0.3);}@-webkit-keyframes particle-animation-12 {100% { -webkit-transform: translate3d(14vw, 59vh, 86px);transform: translate3d(14vw, 59vh, 86px);}}@keyframes particle-animation-12 {100% { -webkit-transform: translate3d(14vw, 59vh, 86px);transform: translate3d(14vw, 59vh, 86px);}}.particle:nth-child(12){-webkit-animation: particle-animation-12 60s infinite;animation: particle-animation-12 60s infinite;opacity: 0.47;height: 9px;width: 9px;-webkit-animation-delay: -2.4s;animation-delay: -2.4s;-webkit-transform: translate3d(36vw, 90vh, 32px);transform: translate3d(36vw, 90vh, 32px);background: rgba(255,255,255,0.3);}@-webkit-keyframes particle-animation-30 {100% { -webkit-transform: translate3d(12vw, 79vh, 22px);transform: translate3d(12vw, 79vh, 22px);}}@keyframes particle-animation-30 {100% { -webkit-transform: translate3d(12vw, 79vh, 22px);transform: translate3d(12vw, 79vh, 22px);}}.particle:nth-child(30){-webkit-animation: particle-animation-30 60s infinite;animation: particle-animation-30 60s infinite;opacity: 1;height: 9px;width: 9px;-webkit-animation-delay: -6s;animation-delay: -6s;-webkit-transform: translate3d(46vw, 49vh, 37px);transform: translate3d(46vw, 49vh, 37px);background: rgba(255,255,255,0.3);}View SCSS CodeRerun