.bulles {position: absolute; z-index: -1; bottom: -200px; left: 0; height: 100%; width: 100%; overflow: hidden;}.bulle {display: block;  border-radius: 100%;  opacity: 0;  position: absolute;  background: rgba(255, 255, 255, 0.2);}.bulle:nth-child(1) {  width: 63px;  height: 63px;  left: 16%;  bottom: 45vh;}.onScroll .bulle:nth-child(1) {  animation: move1 infinite linear 14s;}@keyframes move1 {  0% {opacity: 0;width: 63px-20;height: 63px-20; }  10% {opacity: 0.8; }  30% {opacity: 0.8; }  100% {width: 63px;height: 63px;bottom: 42vh;transform: translate(-7px, -7px), rotate(15deg);opacity: 0; } }.bulle:nth-child(2) {width: 46px;height: 46px;left: 58%;bottom: 30vh;}.onScroll .bulle:nth-child(2) {animation: move2 infinite linear 6s;}@keyframes move2 {  0% { opacity: 0; width: 46px; height: 46px; }  10% {opacity: 0.8; }  30% {opacity: 0.8; }  100% {width: 46px; height: 46px; bottom: 40vh;transform: translate(-1px, -1px), rotate(15deg); opacity: 0;} }.bulle:nth-child(3) {width: 126px;height: 126px;left: 78%; bottom: 44vh;}  .onScroll .bulle:nth-child(3) {animation: move3 infinite linear 15s;}@keyframes move3 {  0% {opacity: 0;width: 126px-20;height: 126px-20; }  10% {opacity: 0.8; }  30% {opacity: 0.8; }  100% {width: 126px;height: 126px;bottom: 42vh;transform: translate(98px, 98px), rotate(15deg);opacity: 0; } }.bulle:nth-child(4) {width: 52px;height: 52px;left: 42%;bottom: 87vh;}  .onScroll .bulle:nth-child(4) {animation: move4 infinite linear 14s;}@keyframes move4 {  0% {opacity: 0;width: 52px-20;height: 52px-20; }  10% {opacity: 0.8; }  30% {opacity: 0.8; }  100% {width: 52px;height: 52px;bottom: 13vh;transform: translate(27px, 27px), rotate(15deg); opacity: 0; } }.bulle:nth-child(5) {width: 143px;height: 143px;left: 92%;bottom: 59vh; }.onScroll .bulle:nth-child(5) {animation: move5 infinite linear 16s; }@keyframes move5 {  0% {opacity: 0;width: 143px-20;height: 143px-20; }  10% {    opacity: 0.8; }  30% {    opacity: 0.8; }  100% {    width: 143px;    height: 143px;    bottom: 37vh;    transform: translate(-8px, -8px), rotate(15deg);    opacity: 0; } }.bulle:nth-child(6) {  width: 91px;  height: 91px;  left: 25%;  bottom: 20vh; }  .onScroll .bulle:nth-child(6) {    animation: move6 infinite linear 5s; }@keyframes move6 {  0% {    opacity: 0;    width: 91px-20;    height: 91px-20; }  10% {    opacity: 0.8; }  30% {    opacity: 0.8; }  100% {    width: 91px;    height: 91px;    bottom: 69vh;    transform: translate(-39px, -39px), rotate(15deg);    opacity: 0; } }.bulle:nth-child(7) {  width: 40px;  height: 40px;  left: 90%;  bottom: 55vh; }  .onScroll .bulle:nth-child(7) {    animation: move7 infinite linear 5s; }@keyframes move7 {  0% {    opacity: 0;    width: 40px-20;    height: 40px-20; }  10% {    opacity: 0.8; }  30% {    opacity: 0.8; }  100% {    width: 40px;    height: 40px;    bottom: 43vh;    transform: translate(82px, 82px), rotate(15deg);    opacity: 0; } }.bulle:nth-child(8) {  width: 83px;  height: 83px;  left: 71%;  bottom: 69vh; }  .onScroll .bulle:nth-child(8) {    animation: move8 infinite linear 12s; }@keyframes move8 {  0% {    opacity: 0;    width: 83px-20;    height: 83px-20; }  10% {    opacity: 0.8; }  30% {    opacity: 0.8; }  100% {    width: 83px;    height: 83px;    bottom: 43vh;    transform: translate(-79px, -79px), rotate(15deg);    opacity: 0; } }.bulle:nth-child(9) {  width: 132px;  height: 132px;  left: 90%;  bottom: 22vh; }  .onScroll .bulle:nth-child(9) {    animation: move9 infinite linear 14s; }@keyframes move9 {  0% {    opacity: 0;    width: 132px-20;    height: 132px-20; }  10% {    opacity: 0.8; }  30% {    opacity: 0.8; }  100% {    width: 132px;    height: 132px;    bottom: 98vh;    transform: translate(98px, 98px), rotate(15deg);    opacity: 0; } }.bulle:nth-child(10) {  width: 40px;  height: 40px;  left: 97%;  bottom: 47vh; }  .onScroll .bulle:nth-child(10) {    animation: move10 infinite linear 15s; }@keyframes move10 {  0% {    opacity: 0;    width: 40px-20;    height: 40px-20; }  10% {    opacity: 0.8; }  30% {    opacity: 0.8; }  100% {    width: 40px;    height: 40px;    bottom: 56vh;    transform: translate(60px, 60px), rotate(15deg);    opacity: 0; } }.bulle:nth-child(11) {  width: 41px;  height: 41px;  left: 53%;  bottom: 76vh; }  .onScroll .bulle:nth-child(11) {    animation: move11 infinite linear 10s; }@keyframes move11 {  0% {    opacity: 0;    width: 41px-20;    height: 41px-20; }  10% {    opacity: 0.8; }  30% {    opacity: 0.8; }  100% {    width: 41px;    height: 41px;    bottom: 71vh;    transform: translate(94px, 94px), rotate(15deg);    opacity: 0; } }.bulle:nth-child(12) {  width: 72px;  height: 72px;  left: 51%;  bottom: 43vh; }  .onScroll .bulle:nth-child(12) {    animation: move12 infinite linear 5s; }@keyframes move12 {  0% {    opacity: 0;    width: 72px-20;    height: 72px-20; }  10% {    opacity: 0.8; }  30% {    opacity: 0.8; }  100% {    width: 72px;    height: 72px;    bottom: 62vh;    transform: translate(-99px, -99px), rotate(15deg);    opacity: 0; } }