Bootstrap Snippet animation title using HTML

"animation title"
Bootstrap 3.0.0 Snippet by evarevirus

3.0.0 animation

1.7K 0 Fav

Post to Facebook Tweet this

<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script>  <!DOCTYPE html><html lang='en' class=''> <head><script src='//production-assets.codepen.io/assets/editor/live/console_runner-079c09a0e3b9ff743e39ee2d5637b9216b3545af0de366d4b9aad9dc87e26bfd.js'></script><script src='//production-assets.codepen.io/assets/editor/live/events_runner-73716630c22bbc8cff4bd0f07b135f00a0bdc5d14629260c3ec49e5606f98fdd.js'></script><script src='//production-assets.codepen.io/assets/editor/live/css_live_reload_init-2c0dc5167d60a5af3ee189d570b1835129687ea2a61bee3513dee3a50c115a77.js'></script><meta charset='UTF-8'><meta name="robots" content="noindex"><link rel="shortcut icon" type="image/x-icon" href="//production-assets.codepen.io/assets/favicon/favicon-8ea04875e70c4b0bb41da869e81236e54394d63638a1ef12fa558a4a835f1164.ico" /><link rel="mask-icon" type="" href="//production-assets.codepen.io/assets/favicon/logo-pin-f2d2b6d2c61838f7e76325261b7195c27224080bc099486ddd6dccb469b8e8e6.svg" color="#111" /><link rel="canonical" href="https://codepen.io/YusukeNakaya/pen/KyKJBE" /> <link rel='stylesheet prefetch' href='https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css'><link rel='stylesheet prefetch' href='https://fonts.googleapis.com/css?family=Anton'> <style class="cp-pen-styles">body { background: #050a19; height: 100vh; overflow: hidden; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; color: #fff; } #ui .text { position: absolute; font-size: 10rem; color: #fff; line-height: 10rem; font-family: 'Anton', sans-serif; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); mix-blend-mode: screen; letter-spacing: 1rem; } #ui .text:nth-child(1) { color: #0223b4; -webkit-animation: clip0 12187ms ease-in-out infinite alternate; animation: clip0 12187ms ease-in-out infinite alternate; -webkit-filter: blur(10px); filter: blur(10px); } @-webkit-keyframes clip0 { 0% { -webkit-clip-path: circle(135px at 56% -6%); clip-path: circle(135px at 56% -6%); } 25% { -webkit-clip-path: circle(164px at 1% 123%); clip-path: circle(164px at 1% 123%); } 50% { -webkit-clip-path: circle(53px at 57% 119%); clip-path: circle(53px at 57% 119%); } 75% { -webkit-clip-path: circle(105px at 123% 43%); clip-path: circle(105px at 123% 43%); } 100% { -webkit-clip-path: circle(78px at -16% -4%); clip-path: circle(78px at -16% -4%); } } @keyframes clip0 { 0% { -webkit-clip-path: circle(135px at 56% -6%); clip-path: circle(135px at 56% -6%); } 25% { -webkit-clip-path: circle(164px at 1% 123%); clip-path: circle(164px at 1% 123%); } 50% { -webkit-clip-path: circle(53px at 57% 119%); clip-path: circle(53px at 57% 119%); } 75% { -webkit-clip-path: circle(105px at 123% 43%); clip-path: circle(105px at 123% 43%); } 100% { -webkit-clip-path: circle(78px at -16% -4%); clip-path: circle(78px at -16% -4%); } } #ui .text:nth-child(2) { color: #0248be; -webkit-animation: clip1 18339ms ease-in-out infinite alternate; animation: clip1 18339ms ease-in-out infinite alternate; -webkit-filter: blur(4px); filter: blur(4px); } @-webkit-keyframes clip1 { 0% { -webkit-clip-path: circle(67px at -4% 84%); clip-path: circle(67px at -4% 84%); } 25% { -webkit-clip-path: circle(86px at 9% 103%); clip-path: circle(86px at 9% 103%); } 50% { -webkit-clip-path: circle(174px at 47% -24%); clip-path: circle(174px at 47% -24%); } 75% { -webkit-clip-path: circle(142px at 59% 97%); clip-path: circle(142px at 59% 97%); } 100% { -webkit-clip-path: circle(49px at 94% 48%); clip-path: circle(49px at 94% 48%); } } @keyframes clip1 { 0% { -webkit-clip-path: circle(67px at -4% 84%); clip-path: circle(67px at -4% 84%); } 25% { -webkit-clip-path: circle(86px at 9% 103%); clip-path: circle(86px at 9% 103%); } 50% { -webkit-clip-path: circle(174px at 47% -24%); clip-path: circle(174px at 47% -24%); } 75% { -webkit-clip-path: circle(142px at 59% 97%); clip-path: circle(142px at 59% 97%); } 100% { -webkit-clip-path: circle(49px at 94% 48%); clip-path: circle(49px at 94% 48%); } } #ui .text:nth-child(3) { color: #15427e; -webkit-animation: clip2 10194ms ease-in-out infinite alternate; animation: clip2 10194ms ease-in-out infinite alternate; -webkit-filter: blur(5px); filter: blur(5px); } @-webkit-keyframes clip2 { 0% { -webkit-clip-path: circle(109px at 37% 7%); clip-path: circle(109px at 37% 7%); } 25% { -webkit-clip-path: circle(101px at 69% -25%); clip-path: circle(101px at 69% -25%); } 50% { -webkit-clip-path: circle(101px at 68% 117%); clip-path: circle(101px at 68% 117%); } 75% { -webkit-clip-path: circle(58px at 66% 0%); clip-path: circle(58px at 66% 0%); } 100% { -webkit-clip-path: circle(143px at 94% 83%); clip-path: circle(143px at 94% 83%); } } @keyframes clip2 { 0% { -webkit-clip-path: circle(109px at 37% 7%); clip-path: circle(109px at 37% 7%); } 25% { -webkit-clip-path: circle(101px at 69% -25%); clip-path: circle(101px at 69% -25%); } 50% { -webkit-clip-path: circle(101px at 68% 117%); clip-path: circle(101px at 68% 117%); } 75% { -webkit-clip-path: circle(58px at 66% 0%); clip-path: circle(58px at 66% 0%); } 100% { -webkit-clip-path: circle(143px at 94% 83%); clip-path: circle(143px at 94% 83%); } } #ui .text:nth-child(4) { color: #031df3; -webkit-animation: clip3 16313ms ease-in-out infinite alternate; animation: clip3 16313ms ease-in-out infinite alternate; -webkit-filter: blur(0px); filter: blur(0px); } @-webkit-keyframes clip3 { 0% { -webkit-clip-path: circle(38px at 74% 114%); clip-path: circle(38px at 74% 114%); } 25% { -webkit-clip-path: circle(115px at 31% 92%); clip-path: circle(115px at 31% 92%); } 50% { -webkit-clip-path: circle(132px at 103% 16%); clip-path: circle(132px at 103% 16%); } 75% { -webkit-clip-path: circle(81px at 59% 6%); clip-path: circle(81px at 59% 6%); } 100% { -webkit-clip-path: circle(83px at 76% 94%); clip-path: circle(83px at 76% 94%); } } @keyframes clip3 { 0% { -webkit-clip-path: circle(38px at 74% 114%); clip-path: circle(38px at 74% 114%); } 25% { -webkit-clip-path: circle(115px at 31% 92%); clip-path: circle(115px at 31% 92%); } 50% { -webkit-clip-path: circle(132px at 103% 16%); clip-path: circle(132px at 103% 16%); } 75% { -webkit-clip-path: circle(81px at 59% 6%); clip-path: circle(81px at 59% 6%); } 100% { -webkit-clip-path: circle(83px at 76% 94%); clip-path: circle(83px at 76% 94%); } } #ui .text:nth-child(5) { color: #07136f; -webkit-animation: clip4 17253ms ease-in-out infinite alternate; animation: clip4 17253ms ease-in-out infinite alternate; -webkit-filter: blur(8px); filter: blur(8px); } @-webkit-keyframes clip4 { 0% { -webkit-clip-path: circle(79px at 121% 29%); clip-path: circle(79px at 121% 29%); } 25% { -webkit-clip-path: circle(140px at 26% 102%); clip-path: circle(140px at 26% 102%); } 50% { -webkit-clip-path: circle(178px at 99% -25%); clip-path: circle(178px at 99% -25%); } 75% { -webkit-clip-path: circle(90px at 43% -12%); clip-path: circle(90px at 43% -12%); } 100% { -webkit-clip-path: circle(77px at 110% 64%); clip-path: circle(77px at 110% 64%); } } @keyframes clip4 { 0% { -webkit-clip-path: circle(79px at 121% 29%); clip-path: circle(79px at 121% 29%); } 25% { -webkit-clip-path: circle(140px at 26% 102%); clip-path: circle(140px at 26% 102%); } 50% { -webkit-clip-path: circle(178px at 99% -25%); clip-path: circle(178px at 99% -25%); } 75% { -webkit-clip-path: circle(90px at 43% -12%); clip-path: circle(90px at 43% -12%); } 100% { -webkit-clip-path: circle(77px at 110% 64%); clip-path: circle(77px at 110% 64%); } } #ui .text:nth-child(6) { color: #172ba9; -webkit-animation: clip5 13493ms ease-in-out infinite alternate; animation: clip5 13493ms ease-in-out infinite alternate; -webkit-filter: blur(-2px); filter: blur(-2px); } @-webkit-keyframes clip5 { 0% { -webkit-clip-path: circle(112px at 55% 10%); clip-path: circle(112px at 55% 10%); } 25% { -webkit-clip-path: circle(85px at 64% 108%); clip-path: circle(85px at 64% 108%); } 50% { -webkit-clip-path: circle(67px at 49% 117%); clip-path: circle(67px at 49% 117%); } 75% { -webkit-clip-path: circle(42px at 52% 56%); clip-path: circle(42px at 52% 56%); } 100% { -webkit-clip-path: circle(165px at 12% -12%); clip-path: circle(165px at 12% -12%); } } @keyframes clip5 { 0% { -webkit-clip-path: circle(112px at 55% 10%); clip-path: circle(112px at 55% 10%); } 25% { -webkit-clip-path: circle(85px at 64% 108%); clip-path: circle(85px at 64% 108%); } 50% { -webkit-clip-path: circle(67px at 49% 117%); clip-path: circle(67px at 49% 117%); } 75% { -webkit-clip-path: circle(42px at 52% 56%); clip-path: circle(42px at 52% 56%); } 100% { -webkit-clip-path: circle(165px at 12% -12%); clip-path: circle(165px at 12% -12%); } } #ui .text:nth-child(7) { color: #0f44e5; -webkit-animation: clip6 16604ms ease-in-out infinite alternate; animation: clip6 16604ms ease-in-out infinite alternate; -webkit-filter: blur(4px); filter: blur(4px); } @-webkit-keyframes clip6 { 0% { -webkit-clip-path: circle(138px at 129% 129%); clip-path: circle(138px at 129% 129%); } 25% { -webkit-clip-path: circle(150px at 25% -15%); clip-path: circle(150px at 25% -15%); } 50% { -webkit-clip-path: circle(113px at 111% 88%); clip-path: circle(113px at 111% 88%); } 75% { -webkit-clip-path: circle(52px at 66% 5%); clip-path: circle(52px at 66% 5%); } 100% { -webkit-clip-path: circle(145px at 12% 55%); clip-path: circle(145px at 12% 55%); } } @keyframes clip6 { 0% { -webkit-clip-path: circle(138px at 129% 129%); clip-path: circle(138px at 129% 129%); } 25% { -webkit-clip-path: circle(150px at 25% -15%); clip-path: circle(150px at 25% -15%); } 50% { -webkit-clip-path: circle(113px at 111% 88%); clip-path: circle(113px at 111% 88%); } 75% { -webkit-clip-path: circle(52px at 66% 5%); clip-path: circle(52px at 66% 5%); } 100% { -webkit-clip-path: circle(145px at 12% 55%); clip-path: circle(145px at 12% 55%); } } #ui .text:nth-child(8) { color: #0b3766; -webkit-animation: clip7 19419ms ease-in-out infinite alternate; animation: clip7 19419ms ease-in-out infinite alternate; -webkit-filter: blur(8px); filter: blur(8px); } @-webkit-keyframes clip7 { 0% { -webkit-clip-path: circle(43px at 13% 15%); clip-path: circle(43px at 13% 15%); } 25% { -webkit-clip-path: circle(161px at 129% 75%); clip-path: circle(161px at 129% 75%); } 50% { -webkit-clip-path: circle(177px at 106% 124%); clip-path: circle(177px at 106% 124%); } 75% { -webkit-clip-path: circle(66px at 28% 87%); clip-path: circle(66px at 28% 87%); } 100% { -webkit-clip-path: circle(156px at 93% 17%); clip-path: circle(156px at 93% 17%); } } @keyframes clip7 { 0% { -webkit-clip-path: circle(43px at 13% 15%); clip-path: circle(43px at 13% 15%); } 25% { -webkit-clip-path: circle(161px at 129% 75%); clip-path: circle(161px at 129% 75%); } 50% { -webkit-clip-path: circle(177px at 106% 124%); clip-path: circle(177px at 106% 124%); } 75% { -webkit-clip-path: circle(66px at 28% 87%); clip-path: circle(66px at 28% 87%); } 100% { -webkit-clip-path: circle(156px at 93% 17%); clip-path: circle(156px at 93% 17%); } } #ui .text:nth-child(9) { color: #080a73; -webkit-animation: clip8 10949ms ease-in-out infinite alternate; animation: clip8 10949ms ease-in-out infinite alternate; -webkit-filter: blur(-7px); filter: blur(-7px); } @-webkit-keyframes clip8 { 0% { -webkit-clip-path: circle(171px at 7% 56%); clip-path: circle(171px at 7% 56%); } 25% { -webkit-clip-path: circle(140px at 97% -17%); clip-path: circle(140px at 97% -17%); } 50% { -webkit-clip-path: circle(161px at 102% 118%); clip-path: circle(161px at 102% 118%); } 75% { -webkit-clip-path: circle(38px at 47% 92%); clip-path: circle(38px at 47% 92%); } 100% { -webkit-clip-path: circle(134px at 22% 58%); clip-path: circle(134px at 22% 58%); } } @keyframes clip8 { 0% { -webkit-clip-path: circle(171px at 7% 56%); clip-path: circle(171px at 7% 56%); } 25% { -webkit-clip-path: circle(140px at 97% -17%); clip-path: circle(140px at 97% -17%); } 50% { -webkit-clip-path: circle(161px at 102% 118%); clip-path: circle(161px at 102% 118%); } 75% { -webkit-clip-path: circle(38px at 47% 92%); clip-path: circle(38px at 47% 92%); } 100% { -webkit-clip-path: circle(134px at 22% 58%); clip-path: circle(134px at 22% 58%); } } #ui .text:nth-child(10) { color: #0f638a; -webkit-animation: clip9 18567ms ease-in-out infinite alternate; animation: clip9 18567ms ease-in-out infinite alternate; -webkit-filter: blur(12px); filter: blur(12px); } @-webkit-keyframes clip9 { 0% { -webkit-clip-path: circle(149px at 62% 86%); clip-path: circle(149px at 62% 86%); } 25% { -webkit-clip-path: circle(174px at 70% 66%); clip-path: circle(174px at 70% 66%); } 50% { -webkit-clip-path: circle(106px at 93% 27%); clip-path: circle(106px at 93% 27%); } 75% { -webkit-clip-path: circle(119px at 68% 93%); clip-path: circle(119px at 68% 93%); } 100% { -webkit-clip-path: circle(108px at -6% 126%); clip-path: circle(108px at -6% 126%); } } @keyframes clip9 { 0% { -webkit-clip-path: circle(149px at 62% 86%); clip-path: circle(149px at 62% 86%); } 25% { -webkit-clip-path: circle(174px at 70% 66%); clip-path: circle(174px at 70% 66%); } 50% { -webkit-clip-path: circle(106px at 93% 27%); clip-path: circle(106px at 93% 27%); } 75% { -webkit-clip-path: circle(119px at 68% 93%); clip-path: circle(119px at 68% 93%); } 100% { -webkit-clip-path: circle(108px at -6% 126%); clip-path: circle(108px at -6% 126%); } } #ui .text:nth-child(11) { color: #15548d; -webkit-animation: clip10 17209ms ease-in-out infinite alternate; animation: clip10 17209ms ease-in-out infinite alternate; -webkit-filter: blur(0px); filter: blur(0px); } @-webkit-keyframes clip10 { 0% { -webkit-clip-path: circle(118px at 51% 112%); clip-path: circle(118px at 51% 112%); } 25% { -webkit-clip-path: circle(92px at 104% 104%); clip-path: circle(92px at 104% 104%); } 50% { -webkit-clip-path: circle(55px at 69% 62%); clip-path: circle(55px at 69% 62%); } 75% { -webkit-clip-path: circle(44px at 44% 63%); clip-path: circle(44px at 44% 63%); } 100% { -webkit-clip-path: circle(132px at 116% -24%); clip-path: circle(132px at 116% -24%); } } @keyframes clip10 { 0% { -webkit-clip-path: circle(118px at 51% 112%); clip-path: circle(118px at 51% 112%); } 25% { -webkit-clip-path: circle(92px at 104% 104%); clip-path: circle(92px at 104% 104%); } 50% { -webkit-clip-path: circle(55px at 69% 62%); clip-path: circle(55px at 69% 62%); } 75% { -webkit-clip-path: circle(44px at 44% 63%); clip-path: circle(44px at 44% 63%); } 100% { -webkit-clip-path: circle(132px at 116% -24%); clip-path: circle(132px at 116% -24%); } } #ui .text:nth-child(12) { color: #1c6377; -webkit-animation: clip11 10199ms ease-in-out infinite alternate; animation: clip11 10199ms ease-in-out infinite alternate; -webkit-filter: blur(13px); filter: blur(13px); } @-webkit-keyframes clip11 { 0% { -webkit-clip-path: circle(90px at 0% 42%); clip-path: circle(90px at 0% 42%); } 25% { -webkit-clip-path: circle(179px at -9% 83%); clip-path: circle(179px at -9% 83%); } 50% { -webkit-clip-path: circle(111px at 63% 20%); clip-path: circle(111px at 63% 20%); } 75% { -webkit-clip-path: circle(46px at 47% 83%); clip-path: circle(46px at 47% 83%); } 100% { -webkit-clip-path: circle(83px at 128% 28%); clip-path: circle(83px at 128% 28%); } } @keyframes clip11 { 0% { -webkit-clip-path: circle(90px at 0% 42%); clip-path: circle(90px at 0% 42%); } 25% { -webkit-clip-path: circle(179px at -9% 83%); clip-path: circle(179px at -9% 83%); } 50% { -webkit-clip-path: circle(111px at 63% 20%); clip-path: circle(111px at 63% 20%); } 75% { -webkit-clip-path: circle(46px at 47% 83%); clip-path: circle(46px at 47% 83%); } 100% { -webkit-clip-path: circle(83px at 128% 28%); clip-path: circle(83px at 128% 28%); } } #ui .text:nth-child(13) { color: #101a7a; -webkit-animation: clip12 15203ms ease-in-out infinite alternate; animation: clip12 15203ms ease-in-out infinite alternate; -webkit-filter: blur(5px); filter: blur(5px); } @-webkit-keyframes clip12 { 0% { -webkit-clip-path: circle(51px at 6% 58%); clip-path: circle(51px at 6% 58%); } 25% { -webkit-clip-path: circle(73px at 10% -7%); clip-path: circle(73px at 10% -7%); } 50% { -webkit-clip-path: circle(33px at 71% 86%); clip-path: circle(33px at 71% 86%); } 75% { -webkit-clip-path: circle(170px at 45% 77%); clip-path: circle(170px at 45% 77%); } 100% { -webkit-clip-path: circle(124px at 108% 4%); clip-path: circle(124px at 108% 4%); } } @keyframes clip12 { 0% { -webkit-clip-path: circle(51px at 6% 58%); clip-path: circle(51px at 6% 58%); } 25% { -webkit-clip-path: circle(73px at 10% -7%); clip-path: circle(73px at 10% -7%); } 50% { -webkit-clip-path: circle(33px at 71% 86%); clip-path: circle(33px at 71% 86%); } 75% { -webkit-clip-path: circle(170px at 45% 77%); clip-path: circle(170px at 45% 77%); } 100% { -webkit-clip-path: circle(124px at 108% 4%); clip-path: circle(124px at 108% 4%); } } #ui .text:nth-child(14) { color: #1c1ba8; -webkit-animation: clip13 14950ms ease-in-out infinite alternate; animation: clip13 14950ms ease-in-out infinite alternate; -webkit-filter: blur(-3px); filter: blur(-3px); } @-webkit-keyframes clip13 { 0% { -webkit-clip-path: circle(61px at 6% -14%); clip-path: circle(61px at 6% -14%); } 25% { -webkit-clip-path: circle(163px at 96% -4%); clip-path: circle(163px at 96% -4%); } 50% { -webkit-clip-path: circle(149px at 97% 102%); clip-path: circle(149px at 97% 102%); } 75% { -webkit-clip-path: circle(60px at 126% -5%); clip-path: circle(60px at 126% -5%); } 100% { -webkit-clip-path: circle(113px at 25% -16%); clip-path: circle(113px at 25% -16%); } } @keyframes clip13 { 0% { -webkit-clip-path: circle(61px at 6% -14%); clip-path: circle(61px at 6% -14%); } 25% { -webkit-clip-path: circle(163px at 96% -4%); clip-path: circle(163px at 96% -4%); } 50% { -webkit-clip-path: circle(149px at 97% 102%); clip-path: circle(149px at 97% 102%); } 75% { -webkit-clip-path: circle(60px at 126% -5%); clip-path: circle(60px at 126% -5%); } 100% { -webkit-clip-path: circle(113px at 25% -16%); clip-path: circle(113px at 25% -16%); } } #ui .text:nth-child(15) { color: #0839e9; -webkit-animation: clip14 11101ms ease-in-out infinite alternate; animation: clip14 11101ms ease-in-out infinite alternate; -webkit-filter: blur(-6px); filter: blur(-6px); } @-webkit-keyframes clip14 { 0% { -webkit-clip-path: circle(162px at 40% 119%); clip-path: circle(162px at 40% 119%); } 25% { -webkit-clip-path: circle(89px at 27% 112%); clip-path: circle(89px at 27% 112%); } 50% { -webkit-clip-path: circle(109px at 117% 37%); clip-path: circle(109px at 117% 37%); } 75% { -webkit-clip-path: circle(86px at 115% 13%); clip-path: circle(86px at 115% 13%); } 100% { -webkit-clip-path: circle(40px at 115% -25%); clip-path: circle(40px at 115% -25%); } } @keyframes clip14 { 0% { -webkit-clip-path: circle(162px at 40% 119%); clip-path: circle(162px at 40% 119%); } 25% { -webkit-clip-path: circle(89px at 27% 112%); clip-path: circle(89px at 27% 112%); } 50% { -webkit-clip-path: circle(109px at 117% 37%); clip-path: circle(109px at 117% 37%); } 75% { -webkit-clip-path: circle(86px at 115% 13%); clip-path: circle(86px at 115% 13%); } 100% { -webkit-clip-path: circle(40px at 115% -25%); clip-path: circle(40px at 115% -25%); } } #ui .text:nth-child(16) { color: #161cbb; -webkit-animation: clip15 12191ms ease-in-out infinite alternate; animation: clip15 12191ms ease-in-out infinite alternate; -webkit-filter: blur(-3px); filter: blur(-3px); } @-webkit-keyframes clip15 { 0% { -webkit-clip-path: circle(61px at 111% 69%); clip-path: circle(61px at 111% 69%); } 25% { -webkit-clip-path: circle(144px at -17% 71%); clip-path: circle(144px at -17% 71%); } 50% { -webkit-clip-path: circle(178px at 105% 110%); clip-path: circle(178px at 105% 110%); } 75% { -webkit-clip-path: circle(111px at 63% 106%); clip-path: circle(111px at 63% 106%); } 100% { -webkit-clip-path: circle(171px at 120% -25%); clip-path: circle(171px at 120% -25%); } } @keyframes clip15 { 0% { -webkit-clip-path: circle(61px at 111% 69%); clip-path: circle(61px at 111% 69%); } 25% { -webkit-clip-path: circle(144px at -17% 71%); clip-path: circle(144px at -17% 71%); } 50% { -webkit-clip-path: circle(178px at 105% 110%); clip-path: circle(178px at 105% 110%); } 75% { -webkit-clip-path: circle(111px at 63% 106%); clip-path: circle(111px at 63% 106%); } 100% { -webkit-clip-path: circle(171px at 120% -25%); clip-path: circle(171px at 120% -25%); } } #ui .text:nth-child(17) { color: #0f286e; -webkit-animation: clip16 14049ms ease-in-out infinite alternate; animation: clip16 14049ms ease-in-out infinite alternate; -webkit-filter: blur(0px); filter: blur(0px); } @-webkit-keyframes clip16 { 0% { -webkit-clip-path: circle(144px at 96% 3%); clip-path: circle(144px at 96% 3%); } 25% { -webkit-clip-path: circle(151px at 19% 81%); clip-path: circle(151px at 19% 81%); } 50% { -webkit-clip-path: circle(122px at 80% 8%); clip-path: circle(122px at 80% 8%); } 75% { -webkit-clip-path: circle(162px at 98% -25%); clip-path: circle(162px at 98% -25%); } 100% { -webkit-clip-path: circle(164px at 7% 39%); clip-path: circle(164px at 7% 39%); } } @keyframes clip16 { 0% { -webkit-clip-path: circle(144px at 96% 3%); clip-path: circle(144px at 96% 3%); } 25% { -webkit-clip-path: circle(151px at 19% 81%); clip-path: circle(151px at 19% 81%); } 50% { -webkit-clip-path: circle(122px at 80% 8%); clip-path: circle(122px at 80% 8%); } 75% { -webkit-clip-path: circle(162px at 98% -25%); clip-path: circle(162px at 98% -25%); } 100% { -webkit-clip-path: circle(164px at 7% 39%); clip-path: circle(164px at 7% 39%); } } #ui .text:nth-child(18) { color: #0723c6; -webkit-animation: clip17 16161ms ease-in-out infinite alternate; animation: clip17 16161ms ease-in-out infinite alternate; -webkit-filter: blur(-5px); filter: blur(-5px); } @-webkit-keyframes clip17 { 0% { -webkit-clip-path: circle(115px at 105% 58%); clip-path: circle(115px at 105% 58%); } 25% { -webkit-clip-path: circle(117px at -9% 127%); clip-path: circle(117px at -9% 127%); } 50% { -webkit-clip-path: circle(40px at -10% 113%); clip-path: circle(40px at -10% 113%); } 75% { -webkit-clip-path: circle(40px at 25% 44%); clip-path: circle(40px at 25% 44%); } 100% { -webkit-clip-path: circle(112px at 95% 113%); clip-path: circle(112px at 95% 113%); } } @keyframes clip17 { 0% { -webkit-clip-path: circle(115px at 105% 58%); clip-path: circle(115px at 105% 58%); } 25% { -webkit-clip-path: circle(117px at -9% 127%); clip-path: circle(117px at -9% 127%); } 50% { -webkit-clip-path: circle(40px at -10% 113%); clip-path: circle(40px at -10% 113%); } 75% { -webkit-clip-path: circle(40px at 25% 44%); clip-path: circle(40px at 25% 44%); } 100% { -webkit-clip-path: circle(112px at 95% 113%); clip-path: circle(112px at 95% 113%); } } #ui .text:nth-child(19) { color: #0f1094; -webkit-animation: clip18 14508ms ease-in-out infinite alternate; animation: clip18 14508ms ease-in-out infinite alternate; -webkit-filter: blur(7px); filter: blur(7px); } @-webkit-keyframes clip18 { 0% { -webkit-clip-path: circle(40px at -4% -12%); clip-path: circle(40px at -4% -12%); } 25% { -webkit-clip-path: circle(169px at 97% 16%); clip-path: circle(169px at 97% 16%); } 50% { -webkit-clip-path: circle(108px at 15% 27%); clip-path: circle(108px at 15% 27%); } 75% { -webkit-clip-path: circle(157px at 63% 129%); clip-path: circle(157px at 63% 129%); } 100% { -webkit-clip-path: circle(65px at 38% 42%); clip-path: circle(65px at 38% 42%); } } @keyframes clip18 { 0% { -webkit-clip-path: circle(40px at -4% -12%); clip-path: circle(40px at -4% -12%); } 25% { -webkit-clip-path: circle(169px at 97% 16%); clip-path: circle(169px at 97% 16%); } 50% { -webkit-clip-path: circle(108px at 15% 27%); clip-path: circle(108px at 15% 27%); } 75% { -webkit-clip-path: circle(157px at 63% 129%); clip-path: circle(157px at 63% 129%); } 100% { -webkit-clip-path: circle(65px at 38% 42%); clip-path: circle(65px at 38% 42%); } } #ui .text:nth-child(20) { color: #025d7d; -webkit-animation: clip19 14763ms ease-in-out infinite alternate; animation: clip19 14763ms ease-in-out infinite alternate; -webkit-filter: blur(13px); filter: blur(13px); } @-webkit-keyframes clip19 { 0% { -webkit-clip-path: circle(88px at 69% -4%); clip-path: circle(88px at 69% -4%); } 25% { -webkit-clip-path: circle(158px at 23% -10%); clip-path: circle(158px at 23% -10%); } 50% { -webkit-clip-path: circle(62px at 116% 44%); clip-path: circle(62px at 116% 44%); } 75% { -webkit-clip-path: circle(165px at 64% 23%); clip-path: circle(165px at 64% 23%); } 100% { -webkit-clip-path: circle(53px at 98% 42%); clip-path: circle(53px at 98% 42%); } } @keyframes clip19 { 0% { -webkit-clip-path: circle(88px at 69% -4%); clip-path: circle(88px at 69% -4%); } 25% { -webkit-clip-path: circle(158px at 23% -10%); clip-path: circle(158px at 23% -10%); } 50% { -webkit-clip-path: circle(62px at 116% 44%); clip-path: circle(62px at 116% 44%); } 75% { -webkit-clip-path: circle(165px at 64% 23%); clip-path: circle(165px at 64% 23%); } 100% { -webkit-clip-path: circle(53px at 98% 42%); clip-path: circle(53px at 98% 42%); } } #ui .text:nth-child(21) { color: #0546d1; -webkit-animation: clip20 17780ms ease-in-out infinite alternate; animation: clip20 17780ms ease-in-out infinite alternate; -webkit-filter: blur(-6px); filter: blur(-6px); } @-webkit-keyframes clip20 { 0% { -webkit-clip-path: circle(111px at 100% 100%); clip-path: circle(111px at 100% 100%); } 25% { -webkit-clip-path: circle(89px at 59% 8%); clip-path: circle(89px at 59% 8%); } 50% { -webkit-clip-path: circle(36px at 78% -16%); clip-path: circle(36px at 78% -16%); } 75% { -webkit-clip-path: circle(102px at -5% 60%); clip-path: circle(102px at -5% 60%); } 100% { -webkit-clip-path: circle(172px at -19% 2%); clip-path: circle(172px at -19% 2%); } } @keyframes clip20 { 0% { -webkit-clip-path: circle(111px at 100% 100%); clip-path: circle(111px at 100% 100%); } 25% { -webkit-clip-path: circle(89px at 59% 8%); clip-path: circle(89px at 59% 8%); } 50% { -webkit-clip-path: circle(36px at 78% -16%); clip-path: circle(36px at 78% -16%); } 75% { -webkit-clip-path: circle(102px at -5% 60%); clip-path: circle(102px at -5% 60%); } 100% { -webkit-clip-path: circle(172px at -19% 2%); clip-path: circle(172px at -19% 2%); } } #ui .text:nth-child(22) { color: #0d269a; -webkit-animation: clip21 12676ms ease-in-out infinite alternate; animation: clip21 12676ms ease-in-out infinite alternate; -webkit-filter: blur(13px); filter: blur(13px); } @-webkit-keyframes clip21 { 0% { -webkit-clip-path: circle(80px at 6% 33%); clip-path: circle(80px at 6% 33%); } 25% { -webkit-clip-path: circle(136px at 26% 67%); clip-path: circle(136px at 26% 67%); } 50% { -webkit-clip-path: circle(149px at 28% 68%); clip-path: circle(149px at 28% 68%); } 75% { -webkit-clip-path: circle(138px at 53% -8%); clip-path: circle(138px at 53% -8%); } 100% { -webkit-clip-path: circle(105px at -26% 19%); clip-path: circle(105px at -26% 19%); } } @keyframes clip21 { 0% { -webkit-clip-path: circle(80px at 6% 33%); clip-path: circle(80px at 6% 33%); } 25% { -webkit-clip-path: circle(136px at 26% 67%); clip-path: circle(136px at 26% 67%); } 50% { -webkit-clip-path: circle(149px at 28% 68%); clip-path: circle(149px at 28% 68%); } 75% { -webkit-clip-path: circle(138px at 53% -8%); clip-path: circle(138px at 53% -8%); } 100% { -webkit-clip-path: circle(105px at -26% 19%); clip-path: circle(105px at -26% 19%); } } #ui .text:nth-child(23) { color: #0953e1; -webkit-animation: clip22 18481ms ease-in-out infinite alternate; animation: clip22 18481ms ease-in-out infinite alternate; -webkit-filter: blur(-5px); filter: blur(-5px); } @-webkit-keyframes clip22 { 0% { -webkit-clip-path: circle(153px at -3% -15%); clip-path: circle(153px at -3% -15%); } 25% { -webkit-clip-path: circle(152px at 4% 27%); clip-path: circle(152px at 4% 27%); } 50% { -webkit-clip-path: circle(148px at -14% 76%); clip-path: circle(148px at -14% 76%); } 75% { -webkit-clip-path: circle(95px at -20% 38%); clip-path: circle(95px at -20% 38%); } 100% { -webkit-clip-path: circle(97px at 128% 30%); clip-path: circle(97px at 128% 30%); } } @keyframes clip22 { 0% { -webkit-clip-path: circle(153px at -3% -15%); clip-path: circle(153px at -3% -15%); } 25% { -webkit-clip-path: circle(152px at 4% 27%); clip-path: circle(152px at 4% 27%); } 50% { -webkit-clip-path: circle(148px at -14% 76%); clip-path: circle(148px at -14% 76%); } 75% { -webkit-clip-path: circle(95px at -20% 38%); clip-path: circle(95px at -20% 38%); } 100% { -webkit-clip-path: circle(97px at 128% 30%); clip-path: circle(97px at 128% 30%); } } #ui .text:nth-child(24) { color: #15256c; -webkit-animation: clip23 13528ms ease-in-out infinite alternate; animation: clip23 13528ms ease-in-out infinite alternate; -webkit-filter: blur(7px); filter: blur(7px); } @-webkit-keyframes clip23 { 0% { -webkit-clip-path: circle(125px at 72% 115%); clip-path: circle(125px at 72% 115%); } 25% { -webkit-clip-path: circle(128px at 31% -6%); clip-path: circle(128px at 31% -6%); } 50% { -webkit-clip-path: circle(81px at -22% 125%); clip-path: circle(81px at -22% 125%); } 75% { -webkit-clip-path: circle(129px at 127% 113%); clip-path: circle(129px at 127% 113%); } 100% { -webkit-clip-path: circle(79px at 91% 85%); clip-path: circle(79px at 91% 85%); } } @keyframes clip23 { 0% { -webkit-clip-path: circle(125px at 72% 115%); clip-path: circle(125px at 72% 115%); } 25% { -webkit-clip-path: circle(128px at 31% -6%); clip-path: circle(128px at 31% -6%); } 50% { -webkit-clip-path: circle(81px at -22% 125%); clip-path: circle(81px at -22% 125%); } 75% { -webkit-clip-path: circle(129px at 127% 113%); clip-path: circle(129px at 127% 113%); } 100% { -webkit-clip-path: circle(79px at 91% 85%); clip-path: circle(79px at 91% 85%); } } #ui .text:nth-child(25) { color: #152371; -webkit-animation: clip24 17449ms ease-in-out infinite alternate; animation: clip24 17449ms ease-in-out infinite alternate; -webkit-filter: blur(-5px); filter: blur(-5px); } @-webkit-keyframes clip24 { 0% { -webkit-clip-path: circle(99px at 79% 47%); clip-path: circle(99px at 79% 47%); } 25% { -webkit-clip-path: circle(104px at 70% 12%); clip-path: circle(104px at 70% 12%); } 50% { -webkit-clip-path: circle(57px at 67% 27%); clip-path: circle(57px at 67% 27%); } 75% { -webkit-clip-path: circle(86px at 25% 123%); clip-path: circle(86px at 25% 123%); } 100% { -webkit-clip-path: circle(83px at -13% 122%); clip-path: circle(83px at -13% 122%); } } @keyframes clip24 { 0% { -webkit-clip-path: circle(99px at 79% 47%); clip-path: circle(99px at 79% 47%); } 25% { -webkit-clip-path: circle(104px at 70% 12%); clip-path: circle(104px at 70% 12%); } 50% { -webkit-clip-path: circle(57px at 67% 27%); clip-path: circle(57px at 67% 27%); } 75% { -webkit-clip-path: circle(86px at 25% 123%); clip-path: circle(86px at 25% 123%); } 100% { -webkit-clip-path: circle(83px at -13% 122%); clip-path: circle(83px at -13% 122%); } } #ui .text:nth-child(26) { color: #0411ed; -webkit-animation: clip25 18035ms ease-in-out infinite alternate; animation: clip25 18035ms ease-in-out infinite alternate; -webkit-filter: blur(5px); filter: blur(5px); } @-webkit-keyframes clip25 { 0% { -webkit-clip-path: circle(47px at -15% -4%); clip-path: circle(47px at -15% -4%); } 25% { -webkit-clip-path: circle(45px at 124% 32%); clip-path: circle(45px at 124% 32%); } 50% { -webkit-clip-path: circle(162px at 111% 75%); clip-path: circle(162px at 111% 75%); } 75% { -webkit-clip-path: circle(151px at 88% 74%); clip-path: circle(151px at 88% 74%); } 100% { -webkit-clip-path: circle(75px at 123% 118%); clip-path: circle(75px at 123% 118%); } } @keyframes clip25 { 0% { -webkit-clip-path: circle(47px at -15% -4%); clip-path: circle(47px at -15% -4%); } 25% { -webkit-clip-path: circle(45px at 124% 32%); clip-path: circle(45px at 124% 32%); } 50% { -webkit-clip-path: circle(162px at 111% 75%); clip-path: circle(162px at 111% 75%); } 75% { -webkit-clip-path: circle(151px at 88% 74%); clip-path: circle(151px at 88% 74%); } 100% { -webkit-clip-path: circle(75px at 123% 118%); clip-path: circle(75px at 123% 118%); } } #ui .text:nth-child(27) { color: #054b73; -webkit-animation: clip26 19994ms ease-in-out infinite alternate; animation: clip26 19994ms ease-in-out infinite alternate; -webkit-filter: blur(-6px); filter: blur(-6px); } @-webkit-keyframes clip26 { 0% { -webkit-clip-path: circle(72px at 119% 26%); clip-path: circle(72px at 119% 26%); } 25% { -webkit-clip-path: circle(70px at 6% 124%); clip-path: circle(70px at 6% 124%); } 50% { -webkit-clip-path: circle(137px at 92% 54%); clip-path: circle(137px at 92% 54%); } 75% { -webkit-clip-path: circle(111px at 117% 85%); clip-path: circle(111px at 117% 85%); } 100% { -webkit-clip-path: circle(166px at 46% 27%); clip-path: circle(166px at 46% 27%); } } @keyframes clip26 { 0% { -webkit-clip-path: circle(72px at 119% 26%); clip-path: circle(72px at 119% 26%); } 25% { -webkit-clip-path: circle(70px at 6% 124%); clip-path: circle(70px at 6% 124%); } 50% { -webkit-clip-path: circle(137px at 92% 54%); clip-path: circle(137px at 92% 54%); } 75% { -webkit-clip-path: circle(111px at 117% 85%); clip-path: circle(111px at 117% 85%); } 100% { -webkit-clip-path: circle(166px at 46% 27%); clip-path: circle(166px at 46% 27%); } } #ui .text:nth-child(28) { color: #152496; -webkit-animation: clip27 14865ms ease-in-out infinite alternate; animation: clip27 14865ms ease-in-out infinite alternate; -webkit-filter: blur(1px); filter: blur(1px); } @-webkit-keyframes clip27 { 0% { -webkit-clip-path: circle(39px at -19% 92%); clip-path: circle(39px at -19% 92%); } 25% { -webkit-clip-path: circle(55px at 58% 101%); clip-path: circle(55px at 58% 101%); } 50% { -webkit-clip-path: circle(35px at 23% -15%); clip-path: circle(35px at 23% -15%); } 75% { -webkit-clip-path: circle(77px at 102% 113%); clip-path: circle(77px at 102% 113%); } 100% { -webkit-clip-path: circle(89px at -24% 30%); clip-path: circle(89px at -24% 30%); } } @keyframes clip27 { 0% { -webkit-clip-path: circle(39px at -19% 92%); clip-path: circle(39px at -19% 92%); } 25% { -webkit-clip-path: circle(55px at 58% 101%); clip-path: circle(55px at 58% 101%); } 50% { -webkit-clip-path: circle(35px at 23% -15%); clip-path: circle(35px at 23% -15%); } 75% { -webkit-clip-path: circle(77px at 102% 113%); clip-path: circle(77px at 102% 113%); } 100% { -webkit-clip-path: circle(89px at -24% 30%); clip-path: circle(89px at -24% 30%); } } #ui .text:nth-child(29) { color: #0335f5; -webkit-animation: clip28 19097ms ease-in-out infinite alternate; animation: clip28 19097ms ease-in-out infinite alternate; -webkit-filter: blur(10px); filter: blur(10px); } @-webkit-keyframes clip28 { 0% { -webkit-clip-path: circle(47px at 25% 17%); clip-path: circle(47px at 25% 17%); } 25% { -webkit-clip-path: circle(108px at 0% 81%); clip-path: circle(108px at 0% 81%); } 50% { -webkit-clip-path: circle(48px at 94% 62%); clip-path: circle(48px at 94% 62%); } 75% { -webkit-clip-path: circle(173px at -27% 8%); clip-path: circle(173px at -27% 8%); } 100% { -webkit-clip-path: circle(165px at 14% 98%); clip-path: circle(165px at 14% 98%); } } @keyframes clip28 { 0% { -webkit-clip-path: circle(47px at 25% 17%); clip-path: circle(47px at 25% 17%); } 25% { -webkit-clip-path: circle(108px at 0% 81%); clip-path: circle(108px at 0% 81%); } 50% { -webkit-clip-path: circle(48px at 94% 62%); clip-path: circle(48px at 94% 62%); } 75% { -webkit-clip-path: circle(173px at -27% 8%); clip-path: circle(173px at -27% 8%); } 100% { -webkit-clip-path: circle(165px at 14% 98%); clip-path: circle(165px at 14% 98%); } } #ui .text:nth-child(30) { color: #05629d; -webkit-animation: clip29 16298ms ease-in-out infinite alternate; animation: clip29 16298ms ease-in-out infinite alternate; -webkit-filter: blur(-1px); filter: blur(-1px); } @-webkit-keyframes clip29 { 0% { -webkit-clip-path: circle(65px at 31% -28%); clip-path: circle(65px at 31% -28%); } 25% { -webkit-clip-path: circle(72px at -20% 109%); clip-path: circle(72px at -20% 109%); } 50% { -webkit-clip-path: circle(32px at 125% 34%); clip-path: circle(32px at 125% 34%); } 75% { -webkit-clip-path: circle(105px at 93% 33%); clip-path: circle(105px at 93% 33%); } 100% { -webkit-clip-path: circle(110px at 88% 3%); clip-path: circle(110px at 88% 3%); } } @keyframes clip29 { 0% { -webkit-clip-path: circle(65px at 31% -28%); clip-path: circle(65px at 31% -28%); } 25% { -webkit-clip-path: circle(72px at -20% 109%); clip-path: circle(72px at -20% 109%); } 50% { -webkit-clip-path: circle(32px at 125% 34%); clip-path: circle(32px at 125% 34%); } 75% { -webkit-clip-path: circle(105px at 93% 33%); clip-path: circle(105px at 93% 33%); } 100% { -webkit-clip-path: circle(110px at 88% 3%); clip-path: circle(110px at 88% 3%); } } #ui .text:nth-child(31) { color: #090ddd; -webkit-animation: clip30 17999ms ease-in-out infinite alternate; animation: clip30 17999ms ease-in-out infinite alternate; -webkit-filter: blur(11px); filter: blur(11px); } @-webkit-keyframes clip30 { 0% { -webkit-clip-path: circle(129px at 27% 11%); clip-path: circle(129px at 27% 11%); } 25% { -webkit-clip-path: circle(154px at -4% 35%); clip-path: circle(154px at -4% 35%); } 50% { -webkit-clip-path: circle(36px at 74% 14%); clip-path: circle(36px at 74% 14%); } 75% { -webkit-clip-path: circle(149px at 125% 34%); clip-path: circle(149px at 125% 34%); } 100% { -webkit-clip-path: circle(48px at 71% 18%); clip-path: circle(48px at 71% 18%); } } @keyframes clip30 { 0% { -webkit-clip-path: circle(129px at 27% 11%); clip-path: circle(129px at 27% 11%); } 25% { -webkit-clip-path: circle(154px at -4% 35%); clip-path: circle(154px at -4% 35%); } 50% { -webkit-clip-path: circle(36px at 74% 14%); clip-path: circle(36px at 74% 14%); } 75% { -webkit-clip-path: circle(149px at 125% 34%); clip-path: circle(149px at 125% 34%); } 100% { -webkit-clip-path: circle(48px at 71% 18%); clip-path: circle(48px at 71% 18%); } } #ui .text:nth-child(32) { color: #0c3be9; -webkit-animation: clip31 17133ms ease-in-out infinite alternate; animation: clip31 17133ms ease-in-out infinite alternate; -webkit-filter: blur(10px); filter: blur(10px); } @-webkit-keyframes clip31 { 0% { -webkit-clip-path: circle(72px at -19% 34%); clip-path: circle(72px at -19% 34%); } 25% { -webkit-clip-path: circle(108px at -19% 106%); clip-path: circle(108px at -19% 106%); } 50% { -webkit-clip-path: circle(57px at 40% -19%); clip-path: circle(57px at 40% -19%); } 75% { -webkit-clip-path: circle(34px at 94% 101%); clip-path: circle(34px at 94% 101%); } 100% { -webkit-clip-path: circle(136px at -3% 112%); clip-path: circle(136px at -3% 112%); } } @keyframes clip31 { 0% { -webkit-clip-path: circle(72px at -19% 34%); clip-path: circle(72px at -19% 34%); } 25% { -webkit-clip-path: circle(108px at -19% 106%); clip-path: circle(108px at -19% 106%); } 50% { -webkit-clip-path: circle(57px at 40% -19%); clip-path: circle(57px at 40% -19%); } 75% { -webkit-clip-path: circle(34px at 94% 101%); clip-path: circle(34px at 94% 101%); } 100% { -webkit-clip-path: circle(136px at -3% 112%); clip-path: circle(136px at -3% 112%); } } #ui .text:nth-child(33) { color: #0a2d6e; -webkit-animation: clip32 17944ms ease-in-out infinite alternate; animation: clip32 17944ms ease-in-out infinite alternate; -webkit-filter: blur(4px); filter: blur(4px); } @-webkit-keyframes clip32 { 0% { -webkit-clip-path: circle(178px at 69% 24%); clip-path: circle(178px at 69% 24%); } 25% { -webkit-clip-path: circle(68px at -12% 29%); clip-path: circle(68px at -12% 29%); } 50% { -webkit-clip-path: circle(156px at 53% -22%); clip-path: circle(156px at 53% -22%); } 75% { -webkit-clip-path: circle(79px at 27% -6%); clip-path: circle(79px at 27% -6%); } 100% { -webkit-clip-path: circle(95px at 19% 111%); clip-path: circle(95px at 19% 111%); } } @keyframes clip32 { 0% { -webkit-clip-path: circle(178px at 69% 24%); clip-path: circle(178px at 69% 24%); } 25% { -webkit-clip-path: circle(68px at -12% 29%); clip-path: circle(68px at -12% 29%); } 50% { -webkit-clip-path: circle(156px at 53% -22%); clip-path: circle(156px at 53% -22%); } 75% { -webkit-clip-path: circle(79px at 27% -6%); clip-path: circle(79px at 27% -6%); } 100% { -webkit-clip-path: circle(95px at 19% 111%); clip-path: circle(95px at 19% 111%); } } #ui .text:nth-child(34) { color: #056098; -webkit-animation: clip33 12867ms ease-in-out infinite alternate; animation: clip33 12867ms ease-in-out infinite alternate; -webkit-filter: blur(6px); filter: blur(6px); } @-webkit-keyframes clip33 { 0% { -webkit-clip-path: circle(87px at 103% 105%); clip-path: circle(87px at 103% 105%); } 25% { -webkit-clip-path: circle(88px at 37% 63%); clip-path: circle(88px at 37% 63%); } 50% { -webkit-clip-path: circle(39px at 46% 110%); clip-path: circle(39px at 46% 110%); } 75% { -webkit-clip-path: circle(97px at 116% 40%); clip-path: circle(97px at 116% 40%); } 100% { -webkit-clip-path: circle(88px at -17% 123%); clip-path: circle(88px at -17% 123%); } } @keyframes clip33 { 0% { -webkit-clip-path: circle(87px at 103% 105%); clip-path: circle(87px at 103% 105%); } 25% { -webkit-clip-path: circle(88px at 37% 63%); clip-path: circle(88px at 37% 63%); } 50% { -webkit-clip-path: circle(39px at 46% 110%); clip-path: circle(39px at 46% 110%); } 75% { -webkit-clip-path: circle(97px at 116% 40%); clip-path: circle(97px at 116% 40%); } 100% { -webkit-clip-path: circle(88px at -17% 123%); clip-path: circle(88px at -17% 123%); } } #ui .text:nth-child(35) { color: #101fda; -webkit-animation: clip34 11230ms ease-in-out infinite alternate; animation: clip34 11230ms ease-in-out infinite alternate; -webkit-filter: blur(14px); filter: blur(14px); } @-webkit-keyframes clip34 { 0% { -webkit-clip-path: circle(135px at 47% 80%); clip-path: circle(135px at 47% 80%); } 25% { -webkit-clip-path: circle(139px at 80% 2%); clip-path: circle(139px at 80% 2%); } 50% { -webkit-clip-path: circle(54px at 86% 87%); clip-path: circle(54px at 86% 87%); } 75% { -webkit-clip-path: circle(175px at 93% 113%); clip-path: circle(175px at 93% 113%); } 100% { -webkit-clip-path: circle(177px at -12% 123%); clip-path: circle(177px at -12% 123%); } } @keyframes clip34 { 0% { -webkit-clip-path: circle(135px at 47% 80%); clip-path: circle(135px at 47% 80%); } 25% { -webkit-clip-path: circle(139px at 80% 2%); clip-path: circle(139px at 80% 2%); } 50% { -webkit-clip-path: circle(54px at 86% 87%); clip-path: circle(54px at 86% 87%); } 75% { -webkit-clip-path: circle(175px at 93% 113%); clip-path: circle(175px at 93% 113%); } 100% { -webkit-clip-path: circle(177px at -12% 123%); clip-path: circle(177px at -12% 123%); } } #ui .text:nth-child(36) { color: #094094; -webkit-animation: clip35 15731ms ease-in-out infinite alternate; animation: clip35 15731ms ease-in-out infinite alternate; -webkit-filter: blur(8px); filter: blur(8px); } @-webkit-keyframes clip35 { 0% { -webkit-clip-path: circle(165px at 32% 61%); clip-path: circle(165px at 32% 61%); } 25% { -webkit-clip-path: circle(179px at 70% 11%); clip-path: circle(179px at 70% 11%); } 50% { -webkit-clip-path: circle(80px at 114% 24%); clip-path: circle(80px at 114% 24%); } 75% { -webkit-clip-path: circle(158px at 48% 2%); clip-path: circle(158px at 48% 2%); } 100% { -webkit-clip-path: circle(105px at 34% 66%); clip-path: circle(105px at 34% 66%); } } @keyframes clip35 { 0% { -webkit-clip-path: circle(165px at 32% 61%); clip-path: circle(165px at 32% 61%); } 25% { -webkit-clip-path: circle(179px at 70% 11%); clip-path: circle(179px at 70% 11%); } 50% { -webkit-clip-path: circle(80px at 114% 24%); clip-path: circle(80px at 114% 24%); } 75% { -webkit-clip-path: circle(158px at 48% 2%); clip-path: circle(158px at 48% 2%); } 100% { -webkit-clip-path: circle(105px at 34% 66%); clip-path: circle(105px at 34% 66%); } } #ui .text:nth-child(37) { color: #0e02b5; -webkit-animation: clip36 16345ms ease-in-out infinite alternate; animation: clip36 16345ms ease-in-out infinite alternate; -webkit-filter: blur(6px); filter: blur(6px); } @-webkit-keyframes clip36 { 0% { -webkit-clip-path: circle(103px at 117% -17%); clip-path: circle(103px at 117% -17%); } 25% { -webkit-clip-path: circle(161px at 17% 80%); clip-path: circle(161px at 17% 80%); } 50% { -webkit-clip-path: circle(113px at -7% -23%); clip-path: circle(113px at -7% -23%); } 75% { -webkit-clip-path: circle(83px at 53% 5%); clip-path: circle(83px at 53% 5%); } 100% { -webkit-clip-path: circle(33px at -24% 117%); clip-path: circle(33px at -24% 117%); } } @keyframes clip36 { 0% { -webkit-clip-path: circle(103px at 117% -17%); clip-path: circle(103px at 117% -17%); } 25% { -webkit-clip-path: circle(161px at 17% 80%); clip-path: circle(161px at 17% 80%); } 50% { -webkit-clip-path: circle(113px at -7% -23%); clip-path: circle(113px at -7% -23%); } 75% { -webkit-clip-path: circle(83px at 53% 5%); clip-path: circle(83px at 53% 5%); } 100% { -webkit-clip-path: circle(33px at -24% 117%); clip-path: circle(33px at -24% 117%); } } #ui .text:nth-child(38) { color: #0705ec; -webkit-animation: clip37 18603ms ease-in-out infinite alternate; animation: clip37 18603ms ease-in-out infinite alternate; -webkit-filter: blur(1px); filter: blur(1px); } @-webkit-keyframes clip37 { 0% { -webkit-clip-path: circle(121px at 34% 10%); clip-path: circle(121px at 34% 10%); } 25% { -webkit-clip-path: circle(58px at -27% -11%); clip-path: circle(58px at -27% -11%); } 50% { -webkit-clip-path: circle(142px at 89% -19%); clip-path: circle(142px at 89% -19%); } 75% { -webkit-clip-path: circle(60px at 18% -12%); clip-path: circle(60px at 18% -12%); } 100% { -webkit-clip-path: circle(128px at -20% -21%); clip-path: circle(128px at -20% -21%); } } @keyframes clip37 { 0% { -webkit-clip-path: circle(121px at 34% 10%); clip-path: circle(121px at 34% 10%); } 25% { -webkit-clip-path: circle(58px at -27% -11%); clip-path: circle(58px at -27% -11%); } 50% { -webkit-clip-path: circle(142px at 89% -19%); clip-path: circle(142px at 89% -19%); } 75% { -webkit-clip-path: circle(60px at 18% -12%); clip-path: circle(60px at 18% -12%); } 100% { -webkit-clip-path: circle(128px at -20% -21%); clip-path: circle(128px at -20% -21%); } } #ui .text:nth-child(39) { color: #05399f; -webkit-animation: clip38 15023ms ease-in-out infinite alternate; animation: clip38 15023ms ease-in-out infinite alternate; -webkit-filter: blur(-4px); filter: blur(-4px); } @-webkit-keyframes clip38 { 0% { -webkit-clip-path: circle(89px at -1% 77%); clip-path: circle(89px at -1% 77%); } 25% { -webkit-clip-path: circle(77px at 114% 22%); clip-path: circle(77px at 114% 22%); } 50% { -webkit-clip-path: circle(46px at 79% 50%); clip-path: circle(46px at 79% 50%); } 75% { -webkit-clip-path: circle(60px at -4% 104%); clip-path: circle(60px at -4% 104%); } 100% { -webkit-clip-path: circle(81px at 3% 115%); clip-path: circle(81px at 3% 115%); } } @keyframes clip38 { 0% { -webkit-clip-path: circle(89px at -1% 77%); clip-path: circle(89px at -1% 77%); } 25% { -webkit-clip-path: circle(77px at 114% 22%); clip-path: circle(77px at 114% 22%); } 50% { -webkit-clip-path: circle(46px at 79% 50%); clip-path: circle(46px at 79% 50%); } 75% { -webkit-clip-path: circle(60px at -4% 104%); clip-path: circle(60px at -4% 104%); } 100% { -webkit-clip-path: circle(81px at 3% 115%); clip-path: circle(81px at 3% 115%); } } #ui .text:nth-child(40) { color: #084979; -webkit-animation: clip39 17572ms ease-in-out infinite alternate; animation: clip39 17572ms ease-in-out infinite alternate; -webkit-filter: blur(4px); filter: blur(4px); } @-webkit-keyframes clip39 { 0% { -webkit-clip-path: circle(131px at 110% 121%); clip-path: circle(131px at 110% 121%); } 25% { -webkit-clip-path: circle(84px at 105% 55%); clip-path: circle(84px at 105% 55%); } 50% { -webkit-clip-path: circle(100px at 39% 20%); clip-path: circle(100px at 39% 20%); } 75% { -webkit-clip-path: circle(84px at 51% 30%); clip-path: circle(84px at 51% 30%); } 100% { -webkit-clip-path: circle(69px at -17% -21%); clip-path: circle(69px at -17% -21%); } } @keyframes clip39 { 0% { -webkit-clip-path: circle(131px at 110% 121%); clip-path: circle(131px at 110% 121%); } 25% { -webkit-clip-path: circle(84px at 105% 55%); clip-path: circle(84px at 105% 55%); } 50% { -webkit-clip-path: circle(100px at 39% 20%); clip-path: circle(100px at 39% 20%); } 75% { -webkit-clip-path: circle(84px at 51% 30%); clip-path: circle(84px at 51% 30%); } 100% { -webkit-clip-path: circle(69px at -17% -21%); clip-path: circle(69px at -17% -21%); } } #ui .text:nth-child(41) { color: #0b25de; -webkit-animation: clip40 15790ms ease-in-out infinite alternate; animation: clip40 15790ms ease-in-out infinite alternate; -webkit-filter: blur(-1px); filter: blur(-1px); } @-webkit-keyframes clip40 { 0% { -webkit-clip-path: circle(78px at -9% 20%); clip-path: circle(78px at -9% 20%); } 25% { -webkit-clip-path: circle(100px at 113% 39%); clip-path: circle(100px at 113% 39%); } 50% { -webkit-clip-path: circle(47px at 92% -25%); clip-path: circle(47px at 92% -25%); } 75% { -webkit-clip-path: circle(178px at -11% 59%); clip-path: circle(178px at -11% 59%); } 100% { -webkit-clip-path: circle(125px at 52% 96%); clip-path: circle(125px at 52% 96%); } } @keyframes clip40 { 0% { -webkit-clip-path: circle(78px at -9% 20%); clip-path: circle(78px at -9% 20%); } 25% { -webkit-clip-path: circle(100px at 113% 39%); clip-path: circle(100px at 113% 39%); } 50% { -webkit-clip-path: circle(47px at 92% -25%); clip-path: circle(47px at 92% -25%); } 75% { -webkit-clip-path: circle(178px at -11% 59%); clip-path: circle(178px at -11% 59%); } 100% { -webkit-clip-path: circle(125px at 52% 96%); clip-path: circle(125px at 52% 96%); } } #ui .text:nth-child(42) { color: #0e3efe; -webkit-animation: clip41 15846ms ease-in-out infinite alternate; animation: clip41 15846ms ease-in-out infinite alternate; -webkit-filter: blur(9px); filter: blur(9px); } @-webkit-keyframes clip41 { 0% { -webkit-clip-path: circle(87px at 14% 63%); clip-path: circle(87px at 14% 63%); } 25% { -webkit-clip-path: circle(86px at 127% 25%); clip-path: circle(86px at 127% 25%); } 50% { -webkit-clip-path: circle(144px at -11% 78%); clip-path: circle(144px at -11% 78%); } 75% { -webkit-clip-path: circle(97px at 117% 102%); clip-path: circle(97px at 117% 102%); } 100% { -webkit-clip-path: circle(100px at 73% -26%); clip-path: circle(100px at 73% -26%); } } @keyframes clip41 { 0% { -webkit-clip-path: circle(87px at 14% 63%); clip-path: circle(87px at 14% 63%); } 25% { -webkit-clip-path: circle(86px at 127% 25%); clip-path: circle(86px at 127% 25%); } 50% { -webkit-clip-path: circle(144px at -11% 78%); clip-path: circle(144px at -11% 78%); } 75% { -webkit-clip-path: circle(97px at 117% 102%); clip-path: circle(97px at 117% 102%); } 100% { -webkit-clip-path: circle(100px at 73% -26%); clip-path: circle(100px at 73% -26%); } } #ui .text:nth-child(43) { color: #0c4269; -webkit-animation: clip42 18232ms ease-in-out infinite alternate; animation: clip42 18232ms ease-in-out infinite alternate; -webkit-filter: blur(4px); filter: blur(4px); } @-webkit-keyframes clip42 { 0% { -webkit-clip-path: circle(142px at 72% 36%); clip-path: circle(142px at 72% 36%); } 25% { -webkit-clip-path: circle(158px at 74% 70%); clip-path: circle(158px at 74% 70%); } 50% { -webkit-clip-path: circle(103px at 16% 79%); clip-path: circle(103px at 16% 79%); } 75% { -webkit-clip-path: circle(46px at 74% -3%); clip-path: circle(46px at 74% -3%); } 100% { -webkit-clip-path: circle(78px at 6% 12%); clip-path: circle(78px at 6% 12%); } } @keyframes clip42 { 0% { -webkit-clip-path: circle(142px at 72% 36%); clip-path: circle(142px at 72% 36%); } 25% { -webkit-clip-path: circle(158px at 74% 70%); clip-path: circle(158px at 74% 70%); } 50% { -webkit-clip-path: circle(103px at 16% 79%); clip-path: circle(103px at 16% 79%); } 75% { -webkit-clip-path: circle(46px at 74% -3%); clip-path: circle(46px at 74% -3%); } 100% { -webkit-clip-path: circle(78px at 6% 12%); clip-path: circle(78px at 6% 12%); } } #ui .text:nth-child(44) { color: #0d5a7f; -webkit-animation: clip43 19811ms ease-in-out infinite alternate; animation: clip43 19811ms ease-in-out infinite alternate; -webkit-filter: blur(8px); filter: blur(8px); } @-webkit-keyframes clip43 { 0% { -webkit-clip-path: circle(37px at 36% 60%); clip-path: circle(37px at 36% 60%); } 25% { -webkit-clip-path: circle(53px at 23% 86%); clip-path: circle(53px at 23% 86%); } 50% { -webkit-clip-path: circle(124px at 66% 67%); clip-path: circle(124px at 66% 67%); } 75% { -webkit-clip-path: circle(62px at 125% 41%); clip-path: circle(62px at 125% 41%); } 100% { -webkit-clip-path: circle(42px at 101% 124%); clip-path: circle(42px at 101% 124%); } } @keyframes clip43 { 0% { -webkit-clip-path: circle(37px at 36% 60%); clip-path: circle(37px at 36% 60%); } 25% { -webkit-clip-path: circle(53px at 23% 86%); clip-path: circle(53px at 23% 86%); } 50% { -webkit-clip-path: circle(124px at 66% 67%); clip-path: circle(124px at 66% 67%); } 75% { -webkit-clip-path: circle(62px at 125% 41%); clip-path: circle(62px at 125% 41%); } 100% { -webkit-clip-path: circle(42px at 101% 124%); clip-path: circle(42px at 101% 124%); } } #ui .text:nth-child(45) { color: #0b41e6; -webkit-animation: clip44 12117ms ease-in-out infinite alternate; animation: clip44 12117ms ease-in-out infinite alternate; -webkit-filter: blur(9px); filter: blur(9px); } @-webkit-keyframes clip44 { 0% { -webkit-clip-path: circle(153px at 58% 99%); clip-path: circle(153px at 58% 99%); } 25% { -webkit-clip-path: circle(36px at 117% 125%); clip-path: circle(36px at 117% 125%); } 50% { -webkit-clip-path: circle(176px at 113% -15%); clip-path: circle(176px at 113% -15%); } 75% { -webkit-clip-path: circle(62px at -7% -6%); clip-path: circle(62px at -7% -6%); } 100% { -webkit-clip-path: circle(80px at -10% -10%); clip-path: circle(80px at -10% -10%); } } @keyframes clip44 { 0% { -webkit-clip-path: circle(153px at 58% 99%); clip-path: circle(153px at 58% 99%); } 25% { -webkit-clip-path: circle(36px at 117% 125%); clip-path: circle(36px at 117% 125%); } 50% { -webkit-clip-path: circle(176px at 113% -15%); clip-path: circle(176px at 113% -15%); } 75% { -webkit-clip-path: circle(62px at -7% -6%); clip-path: circle(62px at -7% -6%); } 100% { -webkit-clip-path: circle(80px at -10% -10%); clip-path: circle(80px at -10% -10%); } } #ui .text:nth-child(46) { color: #062685; -webkit-animation: clip45 13034ms ease-in-out infinite alternate; animation: clip45 13034ms ease-in-out infinite alternate; -webkit-filter: blur(6px); filter: blur(6px); } @-webkit-keyframes clip45 { 0% { -webkit-clip-path: circle(128px at 65% 68%); clip-path: circle(128px at 65% 68%); } 25% { -webkit-clip-path: circle(152px at 117% -25%); clip-path: circle(152px at 117% -25%); } 50% { -webkit-clip-path: circle(99px at 35% 75%); clip-path: circle(99px at 35% 75%); } 75% { -webkit-clip-path: circle(85px at 128% 68%); clip-path: circle(85px at 128% 68%); } 100% { -webkit-clip-path: circle(163px at 45% 3%); clip-path: circle(163px at 45% 3%); } } @keyframes clip45 { 0% { -webkit-clip-path: circle(128px at 65% 68%); clip-path: circle(128px at 65% 68%); } 25% { -webkit-clip-path: circle(152px at 117% -25%); clip-path: circle(152px at 117% -25%); } 50% { -webkit-clip-path: circle(99px at 35% 75%); clip-path: circle(99px at 35% 75%); } 75% { -webkit-clip-path: circle(85px at 128% 68%); clip-path: circle(85px at 128% 68%); } 100% { -webkit-clip-path: circle(163px at 45% 3%); clip-path: circle(163px at 45% 3%); } } #ui .text:nth-child(47) { color: #17409e; -webkit-animation: clip46 19214ms ease-in-out infinite alternate; animation: clip46 19214ms ease-in-out infinite alternate; -webkit-filter: blur(-1px); filter: blur(-1px); } @-webkit-keyframes clip46 { 0% { -webkit-clip-path: circle(162px at 24% 21%); clip-path: circle(162px at 24% 21%); } 25% { -webkit-clip-path: circle(178px at 84% 98%); clip-path: circle(178px at 84% 98%); } 50% { -webkit-clip-path: circle(178px at 30% 123%); clip-path: circle(178px at 30% 123%); } 75% { -webkit-clip-path: circle(100px at -2% 48%); clip-path: circle(100px at -2% 48%); } 100% { -webkit-clip-path: circle(55px at -1% 30%); clip-path: circle(55px at -1% 30%); } } @keyframes clip46 { 0% { -webkit-clip-path: circle(162px at 24% 21%); clip-path: circle(162px at 24% 21%); } 25% { -webkit-clip-path: circle(178px at 84% 98%); clip-path: circle(178px at 84% 98%); } 50% { -webkit-clip-path: circle(178px at 30% 123%); clip-path: circle(178px at 30% 123%); } 75% { -webkit-clip-path: circle(100px at -2% 48%); clip-path: circle(100px at -2% 48%); } 100% { -webkit-clip-path: circle(55px at -1% 30%); clip-path: circle(55px at -1% 30%); } } #ui .text:nth-child(48) { color: #1c17fd; -webkit-animation: clip47 15443ms ease-in-out infinite alternate; animation: clip47 15443ms ease-in-out infinite alternate; -webkit-filter: blur(13px); filter: blur(13px); } @-webkit-keyframes clip47 { 0% { -webkit-clip-path: circle(94px at 59% 1%); clip-path: circle(94px at 59% 1%); } 25% { -webkit-clip-path: circle(148px at 86% 35%); clip-path: circle(148px at 86% 35%); } 50% { -webkit-clip-path: circle(75px at 89% 114%); clip-path: circle(75px at 89% 114%); } 75% { -webkit-clip-path: circle(98px at 56% 25%); clip-path: circle(98px at 56% 25%); } 100% { -webkit-clip-path: circle(154px at 51% 103%); clip-path: circle(154px at 51% 103%); } } @keyframes clip47 { 0% { -webkit-clip-path: circle(94px at 59% 1%); clip-path: circle(94px at 59% 1%); } 25% { -webkit-clip-path: circle(148px at 86% 35%); clip-path: circle(148px at 86% 35%); } 50% { -webkit-clip-path: circle(75px at 89% 114%); clip-path: circle(75px at 89% 114%); } 75% { -webkit-clip-path: circle(98px at 56% 25%); clip-path: circle(98px at 56% 25%); } 100% { -webkit-clip-path: circle(154px at 51% 103%); clip-path: circle(154px at 51% 103%); } } #ui .text:nth-child(49) { color: #180ad8; -webkit-animation: clip48 14191ms ease-in-out infinite alternate; animation: clip48 14191ms ease-in-out infinite alternate; -webkit-filter: blur(2px); filter: blur(2px); } @-webkit-keyframes clip48 { 0% { -webkit-clip-path: circle(44px at -3% 59%); clip-path: circle(44px at -3% 59%); } 25% { -webkit-clip-path: circle(104px at 39% 78%); clip-path: circle(104px at 39% 78%); } 50% { -webkit-clip-path: circle(168px at 0% -3%); clip-path: circle(168px at 0% -3%); } 75% { -webkit-clip-path: circle(170px at 72% 108%); clip-path: circle(170px at 72% 108%); } 100% { -webkit-clip-path: circle(88px at 104% 11%); clip-path: circle(88px at 104% 11%); } } @keyframes clip48 { 0% { -webkit-clip-path: circle(44px at -3% 59%); clip-path: circle(44px at -3% 59%); } 25% { -webkit-clip-path: circle(104px at 39% 78%); clip-path: circle(104px at 39% 78%); } 50% { -webkit-clip-path: circle(168px at 0% -3%); clip-path: circle(168px at 0% -3%); } 75% { -webkit-clip-path: circle(170px at 72% 108%); clip-path: circle(170px at 72% 108%); } 100% { -webkit-clip-path: circle(88px at 104% 11%); clip-path: circle(88px at 104% 11%); } } #ui .text:nth-child(50) { color: #073b9d; -webkit-animation: clip49 17153ms ease-in-out infinite alternate; animation: clip49 17153ms ease-in-out infinite alternate; -webkit-filter: blur(7px); filter: blur(7px); } @-webkit-keyframes clip49 { 0% { -webkit-clip-path: circle(112px at 48% 82%); clip-path: circle(112px at 48% 82%); } 25% { -webkit-clip-path: circle(174px at 105% 78%); clip-path: circle(174px at 105% 78%); } 50% { -webkit-clip-path: circle(59px at 23% 125%); clip-path: circle(59px at 23% 125%); } 75% { -webkit-clip-path: circle(95px at 118% 99%); clip-path: circle(95px at 118% 99%); } 100% { -webkit-clip-path: circle(128px at 116% 124%); clip-path: circle(128px at 116% 124%); } } @keyframes clip49 { 0% { -webkit-clip-path: circle(112px at 48% 82%); clip-path: circle(112px at 48% 82%); } 25% { -webkit-clip-path: circle(174px at 105% 78%); clip-path: circle(174px at 105% 78%); } 50% { -webkit-clip-path: circle(59px at 23% 125%); clip-path: circle(59px at 23% 125%); } 75% { -webkit-clip-path: circle(95px at 118% 99%); clip-path: circle(95px at 118% 99%); } 100% { -webkit-clip-path: circle(128px at 116% 124%); clip-path: circle(128px at 116% 124%); } } #ui .text:nth-child(51) { color: #0e5eb3; -webkit-animation: clip50 13325ms ease-in-out infinite alternate; animation: clip50 13325ms ease-in-out infinite alternate; -webkit-filter: blur(2px); filter: blur(2px); } @-webkit-keyframes clip50 { 0% { -webkit-clip-path: circle(132px at 60% 73%); clip-path: circle(132px at 60% 73%); } 25% { -webkit-clip-path: circle(60px at -21% 55%); clip-path: circle(60px at -21% 55%); } 50% { -webkit-clip-path: circle(179px at 63% -21%); clip-path: circle(179px at 63% -21%); } 75% { -webkit-clip-path: circle(104px at 31% 121%); clip-path: circle(104px at 31% 121%); } 100% { -webkit-clip-path: circle(137px at -26% 82%); clip-path: circle(137px at -26% 82%); } } @keyframes clip50 { 0% { -webkit-clip-path: circle(132px at 60% 73%); clip-path: circle(132px at 60% 73%); } 25% { -webkit-clip-path: circle(60px at -21% 55%); clip-path: circle(60px at -21% 55%); } 50% { -webkit-clip-path: circle(179px at 63% -21%); clip-path: circle(179px at 63% -21%); } 75% { -webkit-clip-path: circle(104px at 31% 121%); clip-path: circle(104px at 31% 121%); } 100% { -webkit-clip-path: circle(137px at -26% 82%); clip-path: circle(137px at -26% 82%); } } #ui .text:nth-child(52) { color: #0743f3; -webkit-animation: clip51 14106ms ease-in-out infinite alternate; animation: clip51 14106ms ease-in-out infinite alternate; -webkit-filter: blur(13px); filter: blur(13px); } @-webkit-keyframes clip51 { 0% { -webkit-clip-path: circle(153px at 60% 69%); clip-path: circle(153px at 60% 69%); } 25% { -webkit-clip-path: circle(50px at 50% -25%); clip-path: circle(50px at 50% -25%); } 50% { -webkit-clip-path: circle(152px at 39% 77%); clip-path: circle(152px at 39% 77%); } 75% { -webkit-clip-path: circle(51px at 80% 89%); clip-path: circle(51px at 80% 89%); } 100% { -webkit-clip-path: circle(114px at 46% 36%); clip-path: circle(114px at 46% 36%); } } @keyframes clip51 { 0% { -webkit-clip-path: circle(153px at 60% 69%); clip-path: circle(153px at 60% 69%); } 25% { -webkit-clip-path: circle(50px at 50% -25%); clip-path: circle(50px at 50% -25%); } 50% { -webkit-clip-path: circle(152px at 39% 77%); clip-path: circle(152px at 39% 77%); } 75% { -webkit-clip-path: circle(51px at 80% 89%); clip-path: circle(51px at 80% 89%); } 100% { -webkit-clip-path: circle(114px at 46% 36%); clip-path: circle(114px at 46% 36%); } } #ui .text:nth-child(53) { color: #071fc8; -webkit-animation: clip52 17898ms ease-in-out infinite alternate; animation: clip52 17898ms ease-in-out infinite alternate; -webkit-filter: blur(13px); filter: blur(13px); } @-webkit-keyframes clip52 { 0% { -webkit-clip-path: circle(107px at 10% 53%); clip-path: circle(107px at 10% 53%); } 25% { -webkit-clip-path: circle(74px at -4% 30%); clip-path: circle(74px at -4% 30%); } 50% { -webkit-clip-path: circle(47px at 118% 71%); clip-path: circle(47px at 118% 71%); } 75% { -webkit-clip-path: circle(130px at 28% 13%); clip-path: circle(130px at 28% 13%); } 100% { -webkit-clip-path: circle(121px at 48% 124%); clip-path: circle(121px at 48% 124%); } } @keyframes clip52 { 0% { -webkit-clip-path: circle(107px at 10% 53%); clip-path: circle(107px at 10% 53%); } 25% { -webkit-clip-path: circle(74px at -4% 30%); clip-path: circle(74px at -4% 30%); } 50% { -webkit-clip-path: circle(47px at 118% 71%); clip-path: circle(47px at 118% 71%); } 75% { -webkit-clip-path: circle(130px at 28% 13%); clip-path: circle(130px at 28% 13%); } 100% { -webkit-clip-path: circle(121px at 48% 124%); clip-path: circle(121px at 48% 124%); } } #ui .text:nth-child(54) { color: #1a5ad5; -webkit-animation: clip53 11721ms ease-in-out infinite alternate; animation: clip53 11721ms ease-in-out infinite alternate; -webkit-filter: blur(6px); filter: blur(6px); } @-webkit-keyframes clip53 { 0% { -webkit-clip-path: circle(135px at 119% -23%); clip-path: circle(135px at 119% -23%); } 25% { -webkit-clip-path: circle(151px at 6% 122%); clip-path: circle(151px at 6% 122%); } 50% { -webkit-clip-path: circle(81px at 95% 51%); clip-path: circle(81px at 95% 51%); } 75% { -webkit-clip-path: circle(69px at 109% 43%); clip-path: circle(69px at 109% 43%); } 100% { -webkit-clip-path: circle(88px at -18% 34%); clip-path: circle(88px at -18% 34%); } } @keyframes clip53 { 0% { -webkit-clip-path: circle(135px at 119% -23%); clip-path: circle(135px at 119% -23%); } 25% { -webkit-clip-path: circle(151px at 6% 122%); clip-path: circle(151px at 6% 122%); } 50% { -webkit-clip-path: circle(81px at 95% 51%); clip-path: circle(81px at 95% 51%); } 75% { -webkit-clip-path: circle(69px at 109% 43%); clip-path: circle(69px at 109% 43%); } 100% { -webkit-clip-path: circle(88px at -18% 34%); clip-path: circle(88px at -18% 34%); } } #ui .text:nth-child(55) { color: #060869; -webkit-animation: clip54 17026ms ease-in-out infinite alternate; animation: clip54 17026ms ease-in-out infinite alternate; -webkit-filter: blur(-3px); filter: blur(-3px); } @-webkit-keyframes clip54 { 0% { -webkit-clip-path: circle(41px at 26% 100%); clip-path: circle(41px at 26% 100%); } 25% { -webkit-clip-path: circle(108px at 25% -21%); clip-path: circle(108px at 25% -21%); } 50% { -webkit-clip-path: circle(64px at 105% 54%); clip-path: circle(64px at 105% 54%); } 75% { -webkit-clip-path: circle(88px at 121% -20%); clip-path: circle(88px at 121% -20%); } 100% { -webkit-clip-path: circle(145px at 91% 98%); clip-path: circle(145px at 91% 98%); } } @keyframes clip54 { 0% { -webkit-clip-path: circle(41px at 26% 100%); clip-path: circle(41px at 26% 100%); } 25% { -webkit-clip-path: circle(108px at 25% -21%); clip-path: circle(108px at 25% -21%); } 50% { -webkit-clip-path: circle(64px at 105% 54%); clip-path: circle(64px at 105% 54%); } 75% { -webkit-clip-path: circle(88px at 121% -20%); clip-path: circle(88px at 121% -20%); } 100% { -webkit-clip-path: circle(145px at 91% 98%); clip-path: circle(145px at 91% 98%); } } #ui .text:nth-child(56) { color: #0b4899; -webkit-animation: clip55 15914ms ease-in-out infinite alternate; animation: clip55 15914ms ease-in-out infinite alternate; -webkit-filter: blur(2px); filter: blur(2px); } @-webkit-keyframes clip55 { 0% { -webkit-clip-path: circle(90px at 5% -15%); clip-path: circle(90px at 5% -15%); } 25% { -webkit-clip-path: circle(156px at 93% 127%); clip-path: circle(156px at 93% 127%); } 50% { -webkit-clip-path: circle(65px at 27% 126%); clip-path: circle(65px at 27% 126%); } 75% { -webkit-clip-path: circle(168px at 84% 22%); clip-path: circle(168px at 84% 22%); } 100% { -webkit-clip-path: circle(40px at 58% 71%); clip-path: circle(40px at 58% 71%); } } @keyframes clip55 { 0% { -webkit-clip-path: circle(90px at 5% -15%); clip-path: circle(90px at 5% -15%); } 25% { -webkit-clip-path: circle(156px at 93% 127%); clip-path: circle(156px at 93% 127%); } 50% { -webkit-clip-path: circle(65px at 27% 126%); clip-path: circle(65px at 27% 126%); } 75% { -webkit-clip-path: circle(168px at 84% 22%); clip-path: circle(168px at 84% 22%); } 100% { -webkit-clip-path: circle(40px at 58% 71%); clip-path: circle(40px at 58% 71%); } } #ui .text:nth-child(57) { color: #1d43fb; -webkit-animation: clip56 12783ms ease-in-out infinite alternate; animation: clip56 12783ms ease-in-out infinite alternate; -webkit-filter: blur(3px); filter: blur(3px); } @-webkit-keyframes clip56 { 0% { -webkit-clip-path: circle(65px at 63% 92%); clip-path: circle(65px at 63% 92%); } 25% { -webkit-clip-path: circle(145px at 127% 95%); clip-path: circle(145px at 127% 95%); } 50% { -webkit-clip-path: circle(85px at 56% 113%); clip-path: circle(85px at 56% 113%); } 75% { -webkit-clip-path: circle(95px at 100% 127%); clip-path: circle(95px at 100% 127%); } 100% { -webkit-clip-path: circle(37px at 79% 94%); clip-path: circle(37px at 79% 94%); } } @keyframes clip56 { 0% { -webkit-clip-path: circle(65px at 63% 92%); clip-path: circle(65px at 63% 92%); } 25% { -webkit-clip-path: circle(145px at 127% 95%); clip-path: circle(145px at 127% 95%); } 50% { -webkit-clip-path: circle(85px at 56% 113%); clip-path: circle(85px at 56% 113%); } 75% { -webkit-clip-path: circle(95px at 100% 127%); clip-path: circle(95px at 100% 127%); } 100% { -webkit-clip-path: circle(37px at 79% 94%); clip-path: circle(37px at 79% 94%); } } #ui .text:nth-child(58) { color: #0c63ed; -webkit-animation: clip57 18790ms ease-in-out infinite alternate; animation: clip57 18790ms ease-in-out infinite alternate; -webkit-filter: blur(11px); filter: blur(11px); } @-webkit-keyframes clip57 { 0% { -webkit-clip-path: circle(134px at 118% 30%); clip-path: circle(134px at 118% 30%); } 25% { -webkit-clip-path: circle(65px at -2% 67%); clip-path: circle(65px at -2% 67%); } 50% { -webkit-clip-path: circle(69px at 5% 84%); clip-path: circle(69px at 5% 84%); } 75% { -webkit-clip-path: circle(119px at -4% 74%); clip-path: circle(119px at -4% 74%); } 100% { -webkit-clip-path: circle(114px at 84% -2%); clip-path: circle(114px at 84% -2%); } } @keyframes clip57 { 0% { -webkit-clip-path: circle(134px at 118% 30%); clip-path: circle(134px at 118% 30%); } 25% { -webkit-clip-path: circle(65px at -2% 67%); clip-path: circle(65px at -2% 67%); } 50% { -webkit-clip-path: circle(69px at 5% 84%); clip-path: circle(69px at 5% 84%); } 75% { -webkit-clip-path: circle(119px at -4% 74%); clip-path: circle(119px at -4% 74%); } 100% { -webkit-clip-path: circle(114px at 84% -2%); clip-path: circle(114px at 84% -2%); } } #ui .text:nth-child(59) { color: #1952e2; -webkit-animation: clip58 19666ms ease-in-out infinite alternate; animation: clip58 19666ms ease-in-out infinite alternate; -webkit-filter: blur(2px); filter: blur(2px); } @-webkit-keyframes clip58 { 0% { -webkit-clip-path: circle(132px at 75% 54%); clip-path: circle(132px at 75% 54%); } 25% { -webkit-clip-path: circle(153px at 126% 24%); clip-path: circle(153px at 126% 24%); } 50% { -webkit-clip-path: circle(98px at 116% 97%); clip-path: circle(98px at 116% 97%); } 75% { -webkit-clip-path: circle(139px at 88% 21%); clip-path: circle(139px at 88% 21%); } 100% { -webkit-clip-path: circle(169px at 121% 67%); clip-path: circle(169px at 121% 67%); } } @keyframes clip58 { 0% { -webkit-clip-path: circle(132px at 75% 54%); clip-path: circle(132px at 75% 54%); } 25% { -webkit-clip-path: circle(153px at 126% 24%); clip-path: circle(153px at 126% 24%); } 50% { -webkit-clip-path: circle(98px at 116% 97%); clip-path: circle(98px at 116% 97%); } 75% { -webkit-clip-path: circle(139px at 88% 21%); clip-path: circle(139px at 88% 21%); } 100% { -webkit-clip-path: circle(169px at 121% 67%); clip-path: circle(169px at 121% 67%); } } #ui .text:nth-child(60) { color: #164775; -webkit-animation: clip59 17190ms ease-in-out infinite alternate; animation: clip59 17190ms ease-in-out infinite alternate; -webkit-filter: blur(2px); filter: blur(2px); } @-webkit-keyframes clip59 { 0% { -webkit-clip-path: circle(154px at 111% 73%); clip-path: circle(154px at 111% 73%); } 25% { -webkit-clip-path: circle(40px at 32% 60%); clip-path: circle(40px at 32% 60%); } 50% { -webkit-clip-path: circle(154px at 6% 23%); clip-path: circle(154px at 6% 23%); } 75% { -webkit-clip-path: circle(73px at -4% 82%); clip-path: circle(73px at -4% 82%); } 100% { -webkit-clip-path: circle(62px at 20% 24%); clip-path: circle(62px at 20% 24%); } } @keyframes clip59 { 0% { -webkit-clip-path: circle(154px at 111% 73%); clip-path: circle(154px at 111% 73%); } 25% { -webkit-clip-path: circle(40px at 32% 60%); clip-path: circle(40px at 32% 60%); } 50% { -webkit-clip-path: circle(154px at 6% 23%); clip-path: circle(154px at 6% 23%); } 75% { -webkit-clip-path: circle(73px at -4% 82%); clip-path: circle(73px at -4% 82%); } 100% { -webkit-clip-path: circle(62px at 20% 24%); clip-path: circle(62px at 20% 24%); } } #ui .text:nth-child(61) { color: #181c8d; -webkit-animation: clip60 17973ms ease-in-out infinite alternate; animation: clip60 17973ms ease-in-out infinite alternate; -webkit-filter: blur(-3px); filter: blur(-3px); } @-webkit-keyframes clip60 { 0% { -webkit-clip-path: circle(45px at 63% 77%); clip-path: circle(45px at 63% 77%); } 25% { -webkit-clip-path: circle(129px at 127% 79%); clip-path: circle(129px at 127% 79%); } 50% { -webkit-clip-path: circle(105px at 64% 76%); clip-path: circle(105px at 64% 76%); } 75% { -webkit-clip-path: circle(61px at 23% 89%); clip-path: circle(61px at 23% 89%); } 100% { -webkit-clip-path: circle(110px at 69% 23%); clip-path: circle(110px at 69% 23%); } } @keyframes clip60 { 0% { -webkit-clip-path: circle(45px at 63% 77%); clip-path: circle(45px at 63% 77%); } 25% { -webkit-clip-path: circle(129px at 127% 79%); clip-path: circle(129px at 127% 79%); } 50% { -webkit-clip-path: circle(105px at 64% 76%); clip-path: circle(105px at 64% 76%); } 75% { -webkit-clip-path: circle(61px at 23% 89%); clip-path: circle(61px at 23% 89%); } 100% { -webkit-clip-path: circle(110px at 69% 23%); clip-path: circle(110px at 69% 23%); } } #ui .text:nth-child(62) { color: #1229dd; -webkit-animation: clip61 17542ms ease-in-out infinite alternate; animation: clip61 17542ms ease-in-out infinite alternate; -webkit-filter: blur(-2px); filter: blur(-2px); } @-webkit-keyframes clip61 { 0% { -webkit-clip-path: circle(70px at 129% 126%); clip-path: circle(70px at 129% 126%); } 25% { -webkit-clip-path: circle(84px at 30% 58%); clip-path: circle(84px at 30% 58%); } 50% { -webkit-clip-path: circle(104px at 50% -7%); clip-path: circle(104px at 50% -7%); } 75% { -webkit-clip-path: circle(104px at 98% 100%); clip-path: circle(104px at 98% 100%); } 100% { -webkit-clip-path: circle(151px at 104% 70%); clip-path: circle(151px at 104% 70%); } } @keyframes clip61 { 0% { -webkit-clip-path: circle(70px at 129% 126%); clip-path: circle(70px at 129% 126%); } 25% { -webkit-clip-path: circle(84px at 30% 58%); clip-path: circle(84px at 30% 58%); } 50% { -webkit-clip-path: circle(104px at 50% -7%); clip-path: circle(104px at 50% -7%); } 75% { -webkit-clip-path: circle(104px at 98% 100%); clip-path: circle(104px at 98% 100%); } 100% { -webkit-clip-path: circle(151px at 104% 70%); clip-path: circle(151px at 104% 70%); } } #ui .text:nth-child(63) { color: #1d35a3; -webkit-animation: clip62 14454ms ease-in-out infinite alternate; animation: clip62 14454ms ease-in-out infinite alternate; -webkit-filter: blur(6px); filter: blur(6px); } @-webkit-keyframes clip62 { 0% { -webkit-clip-path: circle(105px at 39% 33%); clip-path: circle(105px at 39% 33%); } 25% { -webkit-clip-path: circle(88px at 79% 83%); clip-path: circle(88px at 79% 83%); } 50% { -webkit-clip-path: circle(67px at -6% 101%); clip-path: circle(67px at -6% 101%); } 75% { -webkit-clip-path: circle(138px at 93% 57%); clip-path: circle(138px at 93% 57%); } 100% { -webkit-clip-path: circle(62px at -18% 0%); clip-path: circle(62px at -18% 0%); } } @keyframes clip62 { 0% { -webkit-clip-path: circle(105px at 39% 33%); clip-path: circle(105px at 39% 33%); } 25% { -webkit-clip-path: circle(88px at 79% 83%); clip-path: circle(88px at 79% 83%); } 50% { -webkit-clip-path: circle(67px at -6% 101%); clip-path: circle(67px at -6% 101%); } 75% { -webkit-clip-path: circle(138px at 93% 57%); clip-path: circle(138px at 93% 57%); } 100% { -webkit-clip-path: circle(62px at -18% 0%); clip-path: circle(62px at -18% 0%); } } #ui .text:nth-child(64) { color: #1759cb; -webkit-animation: clip63 11432ms ease-in-out infinite alternate; animation: clip63 11432ms ease-in-out infinite alternate; -webkit-filter: blur(14px); filter: blur(14px); } @-webkit-keyframes clip63 { 0% { -webkit-clip-path: circle(164px at -7% 125%); clip-path: circle(164px at -7% 125%); } 25% { -webkit-clip-path: circle(147px at 61% 6%); clip-path: circle(147px at 61% 6%); } 50% { -webkit-clip-path: circle(63px at 27% 14%); clip-path: circle(63px at 27% 14%); } 75% { -webkit-clip-path: circle(92px at 15% 104%); clip-path: circle(92px at 15% 104%); } 100% { -webkit-clip-path: circle(136px at 83% 21%); clip-path: circle(136px at 83% 21%); } } @keyframes clip63 { 0% { -webkit-clip-path: circle(164px at -7% 125%); clip-path: circle(164px at -7% 125%); } 25% { -webkit-clip-path: circle(147px at 61% 6%); clip-path: circle(147px at 61% 6%); } 50% { -webkit-clip-path: circle(63px at 27% 14%); clip-path: circle(63px at 27% 14%); } 75% { -webkit-clip-path: circle(92px at 15% 104%); clip-path: circle(92px at 15% 104%); } 100% { -webkit-clip-path: circle(136px at 83% 21%); clip-path: circle(136px at 83% 21%); } } #ui .text:nth-child(65) { color: #1c4685; -webkit-animation: clip64 17357ms ease-in-out infinite alternate; animation: clip64 17357ms ease-in-out infinite alternate; -webkit-filter: blur(3px); filter: blur(3px); } @-webkit-keyframes clip64 { 0% { -webkit-clip-path: circle(139px at -19% 25%); clip-path: circle(139px at -19% 25%); } 25% { -webkit-clip-path: circle(118px at 64% 79%); clip-path: circle(118px at 64% 79%); } 50% { -webkit-clip-path: circle(59px at 44% 19%); clip-path: circle(59px at 44% 19%); } 75% { -webkit-clip-path: circle(94px at 31% 17%); clip-path: circle(94px at 31% 17%); } 100% { -webkit-clip-path: circle(161px at 19% -20%); clip-path: circle(161px at 19% -20%); } } @keyframes clip64 { 0% { -webkit-clip-path: circle(139px at -19% 25%); clip-path: circle(139px at -19% 25%); } 25% { -webkit-clip-path: circle(118px at 64% 79%); clip-path: circle(118px at 64% 79%); } 50% { -webkit-clip-path: circle(59px at 44% 19%); clip-path: circle(59px at 44% 19%); } 75% { -webkit-clip-path: circle(94px at 31% 17%); clip-path: circle(94px at 31% 17%); } 100% { -webkit-clip-path: circle(161px at 19% -20%); clip-path: circle(161px at 19% -20%); } } #ui .text:nth-child(66) { color: #0a2af8; -webkit-animation: clip65 18750ms ease-in-out infinite alternate; animation: clip65 18750ms ease-in-out infinite alternate; -webkit-filter: blur(9px); filter: blur(9px); } @-webkit-keyframes clip65 { 0% { -webkit-clip-path: circle(102px at 47% 86%); clip-path: circle(102px at 47% 86%); } 25% { -webkit-clip-path: circle(146px at -28% 103%); clip-path: circle(146px at -28% 103%); } 50% { -webkit-clip-path: circle(62px at 92% 111%); clip-path: circle(62px at 92% 111%); } 75% { -webkit-clip-path: circle(79px at 2% 24%); clip-path: circle(79px at 2% 24%); } 100% { -webkit-clip-path: circle(75px at -28% 26%); clip-path: circle(75px at -28% 26%); } } @keyframes clip65 { 0% { -webkit-clip-path: circle(102px at 47% 86%); clip-path: circle(102px at 47% 86%); } 25% { -webkit-clip-path: circle(146px at -28% 103%); clip-path: circle(146px at -28% 103%); } 50% { -webkit-clip-path: circle(62px at 92% 111%); clip-path: circle(62px at 92% 111%); } 75% { -webkit-clip-path: circle(79px at 2% 24%); clip-path: circle(79px at 2% 24%); } 100% { -webkit-clip-path: circle(75px at -28% 26%); clip-path: circle(75px at -28% 26%); } } #ui .text:nth-child(67) { color: #1b23ed; -webkit-animation: clip66 17595ms ease-in-out infinite alternate; animation: clip66 17595ms ease-in-out infinite alternate; -webkit-filter: blur(-1px); filter: blur(-1px); } @-webkit-keyframes clip66 { 0% { -webkit-clip-path: circle(118px at 85% 106%); clip-path: circle(118px at 85% 106%); } 25% { -webkit-clip-path: circle(47px at 22% 73%); clip-path: circle(47px at 22% 73%); } 50% { -webkit-clip-path: circle(115px at 116% -13%); clip-path: circle(115px at 116% -13%); } 75% { -webkit-clip-path: circle(155px at 15% 83%); clip-path: circle(155px at 15% 83%); } 100% { -webkit-clip-path: circle(110px at 44% 111%); clip-path: circle(110px at 44% 111%); } } @keyframes clip66 { 0% { -webkit-clip-path: circle(118px at 85% 106%); clip-path: circle(118px at 85% 106%); } 25% { -webkit-clip-path: circle(47px at 22% 73%); clip-path: circle(47px at 22% 73%); } 50% { -webkit-clip-path: circle(115px at 116% -13%); clip-path: circle(115px at 116% -13%); } 75% { -webkit-clip-path: circle(155px at 15% 83%); clip-path: circle(155px at 15% 83%); } 100% { -webkit-clip-path: circle(110px at 44% 111%); clip-path: circle(110px at 44% 111%); } } #ui .text:nth-child(68) { color: #0212ac; -webkit-animation: clip67 17507ms ease-in-out infinite alternate; animation: clip67 17507ms ease-in-out infinite alternate; -webkit-filter: blur(-7px); filter: blur(-7px); } @-webkit-keyframes clip67 { 0% { -webkit-clip-path: circle(146px at 125% 55%); clip-path: circle(146px at 125% 55%); } 25% { -webkit-clip-path: circle(110px at -19% 14%); clip-path: circle(110px at -19% 14%); } 50% { -webkit-clip-path: circle(116px at 44% 51%); clip-path: circle(116px at 44% 51%); } 75% { -webkit-clip-path: circle(102px at -25% 8%); clip-path: circle(102px at -25% 8%); } 100% { -webkit-clip-path: circle(179px at 9% 54%); clip-path: circle(179px at 9% 54%); } } @keyframes clip67 { 0% { -webkit-clip-path: circle(146px at 125% 55%); clip-path: circle(146px at 125% 55%); } 25% { -webkit-clip-path: circle(110px at -19% 14%); clip-path: circle(110px at -19% 14%); } 50% { -webkit-clip-path: circle(116px at 44% 51%); clip-path: circle(116px at 44% 51%); } 75% { -webkit-clip-path: circle(102px at -25% 8%); clip-path: circle(102px at -25% 8%); } 100% { -webkit-clip-path: circle(179px at 9% 54%); clip-path: circle(179px at 9% 54%); } } #ui .text:nth-child(69) { color: #151aa1; -webkit-animation: clip68 11519ms ease-in-out infinite alternate; animation: clip68 11519ms ease-in-out infinite alternate; -webkit-filter: blur(8px); filter: blur(8px); } @-webkit-keyframes clip68 { 0% { -webkit-clip-path: circle(48px at 40% 40%); clip-path: circle(48px at 40% 40%); } 25% { -webkit-clip-path: circle(44px at -9% 70%); clip-path: circle(44px at -9% 70%); } 50% { -webkit-clip-path: circle(140px at -25% 30%); clip-path: circle(140px at -25% 30%); } 75% { -webkit-clip-path: circle(159px at 71% 4%); clip-path: circle(159px at 71% 4%); } 100% { -webkit-clip-path: circle(102px at 98% 77%); clip-path: circle(102px at 98% 77%); } } @keyframes clip68 { 0% { -webkit-clip-path: circle(48px at 40% 40%); clip-path: circle(48px at 40% 40%); } 25% { -webkit-clip-path: circle(44px at -9% 70%); clip-path: circle(44px at -9% 70%); } 50% { -webkit-clip-path: circle(140px at -25% 30%); clip-path: circle(140px at -25% 30%); } 75% { -webkit-clip-path: circle(159px at 71% 4%); clip-path: circle(159px at 71% 4%); } 100% { -webkit-clip-path: circle(102px at 98% 77%); clip-path: circle(102px at 98% 77%); } } #ui .text:nth-child(70) { color: #1d1e8a; -webkit-animation: clip69 14203ms ease-in-out infinite alternate; animation: clip69 14203ms ease-in-out infinite alternate; -webkit-filter: blur(-6px); filter: blur(-6px); } @-webkit-keyframes clip69 { 0% { -webkit-clip-path: circle(61px at 90% 100%); clip-path: circle(61px at 90% 100%); } 25% { -webkit-clip-path: circle(42px at -8% 44%); clip-path: circle(42px at -8% 44%); } 50% { -webkit-clip-path: circle(115px at -15% 19%); clip-path: circle(115px at -15% 19%); } 75% { -webkit-clip-path: circle(130px at 85% 3%); clip-path: circle(130px at 85% 3%); } 100% { -webkit-clip-path: circle(158px at 54% 55%); clip-path: circle(158px at 54% 55%); } } @keyframes clip69 { 0% { -webkit-clip-path: circle(61px at 90% 100%); clip-path: circle(61px at 90% 100%); } 25% { -webkit-clip-path: circle(42px at -8% 44%); clip-path: circle(42px at -8% 44%); } 50% { -webkit-clip-path: circle(115px at -15% 19%); clip-path: circle(115px at -15% 19%); } 75% { -webkit-clip-path: circle(130px at 85% 3%); clip-path: circle(130px at 85% 3%); } 100% { -webkit-clip-path: circle(158px at 54% 55%); clip-path: circle(158px at 54% 55%); } } #ui .text:nth-child(71) { color: #112869; -webkit-animation: clip70 15952ms ease-in-out infinite alternate; animation: clip70 15952ms ease-in-out infinite alternate; -webkit-filter: blur(10px); filter: blur(10px); } @-webkit-keyframes clip70 { 0% { -webkit-clip-path: circle(114px at 123% 45%); clip-path: circle(114px at 123% 45%); } 25% { -webkit-clip-path: circle(78px at 7% 46%); clip-path: circle(78px at 7% 46%); } 50% { -webkit-clip-path: circle(86px at 26% 47%); clip-path: circle(86px at 26% 47%); } 75% { -webkit-clip-path: circle(109px at 36% 86%); clip-path: circle(109px at 36% 86%); } 100% { -webkit-clip-path: circle(94px at 98% 14%); clip-path: circle(94px at 98% 14%); } } @keyframes clip70 { 0% { -webkit-clip-path: circle(114px at 123% 45%); clip-path: circle(114px at 123% 45%); } 25% { -webkit-clip-path: circle(78px at 7% 46%); clip-path: circle(78px at 7% 46%); } 50% { -webkit-clip-path: circle(86px at 26% 47%); clip-path: circle(86px at 26% 47%); } 75% { -webkit-clip-path: circle(109px at 36% 86%); clip-path: circle(109px at 36% 86%); } 100% { -webkit-clip-path: circle(94px at 98% 14%); clip-path: circle(94px at 98% 14%); } } #ui .text:nth-child(72) { color: #1a129a; -webkit-animation: clip71 11127ms ease-in-out infinite alternate; animation: clip71 11127ms ease-in-out infinite alternate; -webkit-filter: blur(-8px); filter: blur(-8px); } @-webkit-keyframes clip71 { 0% { -webkit-clip-path: circle(101px at -16% 95%); clip-path: circle(101px at -16% 95%); } 25% { -webkit-clip-path: circle(90px at 49% 128%); clip-path: circle(90px at 49% 128%); } 50% { -webkit-clip-path: circle(47px at 15% 19%); clip-path: circle(47px at 15% 19%); } 75% { -webkit-clip-path: circle(178px at -18% 102%); clip-path: circle(178px at -18% 102%); } 100% { -webkit-clip-path: circle(143px at 55% 46%); clip-path: circle(143px at 55% 46%); } } @keyframes clip71 { 0% { -webkit-clip-path: circle(101px at -16% 95%); clip-path: circle(101px at -16% 95%); } 25% { -webkit-clip-path: circle(90px at 49% 128%); clip-path: circle(90px at 49% 128%); } 50% { -webkit-clip-path: circle(47px at 15% 19%); clip-path: circle(47px at 15% 19%); } 75% { -webkit-clip-path: circle(178px at -18% 102%); clip-path: circle(178px at -18% 102%); } 100% { -webkit-clip-path: circle(143px at 55% 46%); clip-path: circle(143px at 55% 46%); } } #ui .text:nth-child(73) { color: #1452db; -webkit-animation: clip72 14923ms ease-in-out infinite alternate; animation: clip72 14923ms ease-in-out infinite alternate; -webkit-filter: blur(13px); filter: blur(13px); } @-webkit-keyframes clip72 { 0% { -webkit-clip-path: circle(154px at 63% 62%); clip-path: circle(154px at 63% 62%); } 25% { -webkit-clip-path: circle(111px at 55% 64%); clip-path: circle(111px at 55% 64%); } 50% { -webkit-clip-path: circle(116px at 82% -3%); clip-path: circle(116px at 82% -3%); } 75% { -webkit-clip-path: circle(88px at 79% 5%); clip-path: circle(88px at 79% 5%); } 100% { -webkit-clip-path: circle(47px at 94% 0%); clip-path: circle(47px at 94% 0%); } } @keyframes clip72 { 0% { -webkit-clip-path: circle(154px at 63% 62%); clip-path: circle(154px at 63% 62%); } 25% { -webkit-clip-path: circle(111px at 55% 64%); clip-path: circle(111px at 55% 64%); } 50% { -webkit-clip-path: circle(116px at 82% -3%); clip-path: circle(116px at 82% -3%); } 75% { -webkit-clip-path: circle(88px at 79% 5%); clip-path: circle(88px at 79% 5%); } 100% { -webkit-clip-path: circle(47px at 94% 0%); clip-path: circle(47px at 94% 0%); } } #ui .text:nth-child(74) { color: #1345cb; -webkit-animation: clip73 18583ms ease-in-out infinite alternate; animation: clip73 18583ms ease-in-out infinite alternate; -webkit-filter: blur(-5px); filter: blur(-5px); } @-webkit-keyframes clip73 { 0% { -webkit-clip-path: circle(107px at 61% -9%); clip-path: circle(107px at 61% -9%); } 25% { -webkit-clip-path: circle(88px at 58% 26%); clip-path: circle(88px at 58% 26%); } 50% { -webkit-clip-path: circle(114px at 50% 115%); clip-path: circle(114px at 50% 115%); } 75% { -webkit-clip-path: circle(87px at -20% 125%); clip-path: circle(87px at -20% 125%); } 100% { -webkit-clip-path: circle(68px at 52% 83%); clip-path: circle(68px at 52% 83%); } } @keyframes clip73 { 0% { -webkit-clip-path: circle(107px at 61% -9%); clip-path: circle(107px at 61% -9%); } 25% { -webkit-clip-path: circle(88px at 58% 26%); clip-path: circle(88px at 58% 26%); } 50% { -webkit-clip-path: circle(114px at 50% 115%); clip-path: circle(114px at 50% 115%); } 75% { -webkit-clip-path: circle(87px at -20% 125%); clip-path: circle(87px at -20% 125%); } 100% { -webkit-clip-path: circle(68px at 52% 83%); clip-path: circle(68px at 52% 83%); } } #ui .text:nth-child(75) { color: #1a3792; -webkit-animation: clip74 12663ms ease-in-out infinite alternate; animation: clip74 12663ms ease-in-out infinite alternate; -webkit-filter: blur(13px); filter: blur(13px); } @-webkit-keyframes clip74 { 0% { -webkit-clip-path: circle(100px at 10% 76%); clip-path: circle(100px at 10% 76%); } 25% { -webkit-clip-path: circle(62px at 121% 96%); clip-path: circle(62px at 121% 96%); } 50% { -webkit-clip-path: circle(122px at 42% -22%); clip-path: circle(122px at 42% -22%); } 75% { -webkit-clip-path: circle(82px at 92% 1%); clip-path: circle(82px at 92% 1%); } 100% { -webkit-clip-path: circle(50px at 58% 7%); clip-path: circle(50px at 58% 7%); } } @keyframes clip74 { 0% { -webkit-clip-path: circle(100px at 10% 76%); clip-path: circle(100px at 10% 76%); } 25% { -webkit-clip-path: circle(62px at 121% 96%); clip-path: circle(62px at 121% 96%); } 50% { -webkit-clip-path: circle(122px at 42% -22%); clip-path: circle(122px at 42% -22%); } 75% { -webkit-clip-path: circle(82px at 92% 1%); clip-path: circle(82px at 92% 1%); } 100% { -webkit-clip-path: circle(50px at 58% 7%); clip-path: circle(50px at 58% 7%); } } #ui .text:nth-child(76) { color: #1d5195; -webkit-animation: clip75 17467ms ease-in-out infinite alternate; animation: clip75 17467ms ease-in-out infinite alternate; -webkit-filter: blur(-2px); filter: blur(-2px); } @-webkit-keyframes clip75 { 0% { -webkit-clip-path: circle(101px at 18% 62%); clip-path: circle(101px at 18% 62%); } 25% { -webkit-clip-path: circle(60px at 23% 18%); clip-path: circle(60px at 23% 18%); } 50% { -webkit-clip-path: circle(106px at 20% 26%); clip-path: circle(106px at 20% 26%); } 75% { -webkit-clip-path: circle(55px at 47% -6%); clip-path: circle(55px at 47% -6%); } 100% { -webkit-clip-path: circle(138px at 40% 69%); clip-path: circle(138px at 40% 69%); } } @keyframes clip75 { 0% { -webkit-clip-path: circle(101px at 18% 62%); clip-path: circle(101px at 18% 62%); } 25% { -webkit-clip-path: circle(60px at 23% 18%); clip-path: circle(60px at 23% 18%); } 50% { -webkit-clip-path: circle(106px at 20% 26%); clip-path: circle(106px at 20% 26%); } 75% { -webkit-clip-path: circle(55px at 47% -6%); clip-path: circle(55px at 47% -6%); } 100% { -webkit-clip-path: circle(138px at 40% 69%); clip-path: circle(138px at 40% 69%); } } #ui .text:nth-child(77) { color: #164bfc; -webkit-animation: clip76 15893ms ease-in-out infinite alternate; animation: clip76 15893ms ease-in-out infinite alternate; -webkit-filter: blur(-4px); filter: blur(-4px); } @-webkit-keyframes clip76 { 0% { -webkit-clip-path: circle(100px at 30% -25%); clip-path: circle(100px at 30% -25%); } 25% { -webkit-clip-path: circle(41px at 102% 94%); clip-path: circle(41px at 102% 94%); } 50% { -webkit-clip-path: circle(173px at 72% -24%); clip-path: circle(173px at 72% -24%); } 75% { -webkit-clip-path: circle(35px at 54% -5%); clip-path: circle(35px at 54% -5%); } 100% { -webkit-clip-path: circle(99px at 38% 99%); clip-path: circle(99px at 38% 99%); } } @keyframes clip76 { 0% { -webkit-clip-path: circle(100px at 30% -25%); clip-path: circle(100px at 30% -25%); } 25% { -webkit-clip-path: circle(41px at 102% 94%); clip-path: circle(41px at 102% 94%); } 50% { -webkit-clip-path: circle(173px at 72% -24%); clip-path: circle(173px at 72% -24%); } 75% { -webkit-clip-path: circle(35px at 54% -5%); clip-path: circle(35px at 54% -5%); } 100% { -webkit-clip-path: circle(99px at 38% 99%); clip-path: circle(99px at 38% 99%); } } #ui .text:nth-child(78) { color: #0e34fd; -webkit-animation: clip77 19807ms ease-in-out infinite alternate; animation: clip77 19807ms ease-in-out infinite alternate; -webkit-filter: blur(-2px); filter: blur(-2px); } @-webkit-keyframes clip77 { 0% { -webkit-clip-path: circle(101px at 1% 79%); clip-path: circle(101px at 1% 79%); } 25% { -webkit-clip-path: circle(175px at 124% 17%); clip-path: circle(175px at 124% 17%); } 50% { -webkit-clip-path: circle(164px at 41% -11%); clip-path: circle(164px at 41% -11%); } 75% { -webkit-clip-path: circle(57px at 64% 21%); clip-path: circle(57px at 64% 21%); } 100% { -webkit-clip-path: circle(178px at 75% 38%); clip-path: circle(178px at 75% 38%); } } @keyframes clip77 { 0% { -webkit-clip-path: circle(101px at 1% 79%); clip-path: circle(101px at 1% 79%); } 25% { -webkit-clip-path: circle(175px at 124% 17%); clip-path: circle(175px at 124% 17%); } 50% { -webkit-clip-path: circle(164px at 41% -11%); clip-path: circle(164px at 41% -11%); } 75% { -webkit-clip-path: circle(57px at 64% 21%); clip-path: circle(57px at 64% 21%); } 100% { -webkit-clip-path: circle(178px at 75% 38%); clip-path: circle(178px at 75% 38%); } } #ui .text:nth-child(79) { color: #1b319c; -webkit-animation: clip78 16712ms ease-in-out infinite alternate; animation: clip78 16712ms ease-in-out infinite alternate; -webkit-filter: blur(12px); filter: blur(12px); } @-webkit-keyframes clip78 { 0% { -webkit-clip-path: circle(142px at 87% 87%); clip-path: circle(142px at 87% 87%); } 25% { -webkit-clip-path: circle(142px at -18% 19%); clip-path: circle(142px at -18% 19%); } 50% { -webkit-clip-path: circle(39px at 1% 9%); clip-path: circle(39px at 1% 9%); } 75% { -webkit-clip-path: circle(139px at 107% 1%); clip-path: circle(139px at 107% 1%); } 100% { -webkit-clip-path: circle(49px at 32% 21%); clip-path: circle(49px at 32% 21%); } } @keyframes clip78 { 0% { -webkit-clip-path: circle(142px at 87% 87%); clip-path: circle(142px at 87% 87%); } 25% { -webkit-clip-path: circle(142px at -18% 19%); clip-path: circle(142px at -18% 19%); } 50% { -webkit-clip-path: circle(39px at 1% 9%); clip-path: circle(39px at 1% 9%); } 75% { -webkit-clip-path: circle(139px at 107% 1%); clip-path: circle(139px at 107% 1%); } 100% { -webkit-clip-path: circle(49px at 32% 21%); clip-path: circle(49px at 32% 21%); } } #ui .text:nth-child(80) { color: #1206cf; -webkit-animation: clip79 11629ms ease-in-out infinite alternate; animation: clip79 11629ms ease-in-out infinite alternate; -webkit-filter: blur(2px); filter: blur(2px); } @-webkit-keyframes clip79 { 0% { -webkit-clip-path: circle(75px at 9% 79%); clip-path: circle(75px at 9% 79%); } 25% { -webkit-clip-path: circle(36px at 69% 67%); clip-path: circle(36px at 69% 67%); } 50% { -webkit-clip-path: circle(161px at 118% 129%); clip-path: circle(161px at 118% 129%); } 75% { -webkit-clip-path: circle(105px at 116% 113%); clip-path: circle(105px at 116% 113%); } 100% { -webkit-clip-path: circle(94px at 78% 6%); clip-path: circle(94px at 78% 6%); } } @keyframes clip79 { 0% { -webkit-clip-path: circle(75px at 9% 79%); clip-path: circle(75px at 9% 79%); } 25% { -webkit-clip-path: circle(36px at 69% 67%); clip-path: circle(36px at 69% 67%); } 50% { -webkit-clip-path: circle(161px at 118% 129%); clip-path: circle(161px at 118% 129%); } 75% { -webkit-clip-path: circle(105px at 116% 113%); clip-path: circle(105px at 116% 113%); } 100% { -webkit-clip-path: circle(94px at 78% 6%); clip-path: circle(94px at 78% 6%); } } #ui .text:nth-child(81) { color: #075eab; -webkit-animation: clip80 15995ms ease-in-out infinite alternate; animation: clip80 15995ms ease-in-out infinite alternate; -webkit-filter: blur(10px); filter: blur(10px); } @-webkit-keyframes clip80 { 0% { -webkit-clip-path: circle(166px at 42% 91%); clip-path: circle(166px at 42% 91%); } 25% { -webkit-clip-path: circle(126px at 106% 111%); clip-path: circle(126px at 106% 111%); } 50% { -webkit-clip-path: circle(152px at 120% 1%); clip-path: circle(152px at 120% 1%); } 75% { -webkit-clip-path: circle(164px at 17% 38%); clip-path: circle(164px at 17% 38%); } 100% { -webkit-clip-path: circle(124px at 34% 93%); clip-path: circle(124px at 34% 93%); } } @keyframes clip80 { 0% { -webkit-clip-path: circle(166px at 42% 91%); clip-path: circle(166px at 42% 91%); } 25% { -webkit-clip-path: circle(126px at 106% 111%); clip-path: circle(126px at 106% 111%); } 50% { -webkit-clip-path: circle(152px at 120% 1%); clip-path: circle(152px at 120% 1%); } 75% { -webkit-clip-path: circle(164px at 17% 38%); clip-path: circle(164px at 17% 38%); } 100% { -webkit-clip-path: circle(124px at 34% 93%); clip-path: circle(124px at 34% 93%); } } #ui .text:nth-child(82) { color: #1421d1; -webkit-animation: clip81 16040ms ease-in-out infinite alternate; animation: clip81 16040ms ease-in-out infinite alternate; -webkit-filter: blur(7px); filter: blur(7px); } @-webkit-keyframes clip81 { 0% { -webkit-clip-path: circle(153px at -14% 41%); clip-path: circle(153px at -14% 41%); } 25% { -webkit-clip-path: circle(61px at -10% 111%); clip-path: circle(61px at -10% 111%); } 50% { -webkit-clip-path: circle(130px at -28% -13%); clip-path: circle(130px at -28% -13%); } 75% { -webkit-clip-path: circle(136px at -10% -15%); clip-path: circle(136px at -10% -15%); } 100% { -webkit-clip-path: circle(111px at 90% 63%); clip-path: circle(111px at 90% 63%); } } @keyframes clip81 { 0% { -webkit-clip-path: circle(153px at -14% 41%); clip-path: circle(153px at -14% 41%); } 25% { -webkit-clip-path: circle(61px at -10% 111%); clip-path: circle(61px at -10% 111%); } 50% { -webkit-clip-path: circle(130px at -28% -13%); clip-path: circle(130px at -28% -13%); } 75% { -webkit-clip-path: circle(136px at -10% -15%); clip-path: circle(136px at -10% -15%); } 100% { -webkit-clip-path: circle(111px at 90% 63%); clip-path: circle(111px at 90% 63%); } } #ui .text:nth-child(83) { color: #1b0999; -webkit-animation: clip82 16540ms ease-in-out infinite alternate; animation: clip82 16540ms ease-in-out infinite alternate; -webkit-filter: blur(-8px); filter: blur(-8px); } @-webkit-keyframes clip82 { 0% { -webkit-clip-path: circle(120px at -2% 67%); clip-path: circle(120px at -2% 67%); } 25% { -webkit-clip-path: circle(128px at 28% 94%); clip-path: circle(128px at 28% 94%); } 50% { -webkit-clip-path: circle(155px at 52% 17%); clip-path: circle(155px at 52% 17%); } 75% { -webkit-clip-path: circle(92px at 100% 107%); clip-path: circle(92px at 100% 107%); } 100% { -webkit-clip-path: circle(124px at -26% 95%); clip-path: circle(124px at -26% 95%); } } @keyframes clip82 { 0% { -webkit-clip-path: circle(120px at -2% 67%); clip-path: circle(120px at -2% 67%); } 25% { -webkit-clip-path: circle(128px at 28% 94%); clip-path: circle(128px at 28% 94%); } 50% { -webkit-clip-path: circle(155px at 52% 17%); clip-path: circle(155px at 52% 17%); } 75% { -webkit-clip-path: circle(92px at 100% 107%); clip-path: circle(92px at 100% 107%); } 100% { -webkit-clip-path: circle(124px at -26% 95%); clip-path: circle(124px at -26% 95%); } } #ui .text:nth-child(84) { color: #0e30d2; -webkit-animation: clip83 19443ms ease-in-out infinite alternate; animation: clip83 19443ms ease-in-out infinite alternate; -webkit-filter: blur(13px); filter: blur(13px); } @-webkit-keyframes clip83 { 0% { -webkit-clip-path: circle(75px at -4% 29%); clip-path: circle(75px at -4% 29%); } 25% { -webkit-clip-path: circle(137px at 4% 36%); clip-path: circle(137px at 4% 36%); } 50% { -webkit-clip-path: circle(96px at 126% 45%); clip-path: circle(96px at 126% 45%); } 75% { -webkit-clip-path: circle(55px at -12% 2%); clip-path: circle(55px at -12% 2%); } 100% { -webkit-clip-path: circle(117px at -21% 99%); clip-path: circle(117px at -21% 99%); } } @keyframes clip83 { 0% { -webkit-clip-path: circle(75px at -4% 29%); clip-path: circle(75px at -4% 29%); } 25% { -webkit-clip-path: circle(137px at 4% 36%); clip-path: circle(137px at 4% 36%); } 50% { -webkit-clip-path: circle(96px at 126% 45%); clip-path: circle(96px at 126% 45%); } 75% { -webkit-clip-path: circle(55px at -12% 2%); clip-path: circle(55px at -12% 2%); } 100% { -webkit-clip-path: circle(117px at -21% 99%); clip-path: circle(117px at -21% 99%); } } #ui .text:nth-child(85) { color: #08169f; -webkit-animation: clip84 11555ms ease-in-out infinite alternate; animation: clip84 11555ms ease-in-out infinite alternate; -webkit-filter: blur(10px); filter: blur(10px); } @-webkit-keyframes clip84 { 0% { -webkit-clip-path: circle(175px at 76% 115%); clip-path: circle(175px at 76% 115%); } 25% { -webkit-clip-path: circle(137px at 83% 90%); clip-path: circle(137px at 83% 90%); } 50% { -webkit-clip-path: circle(104px at 62% 93%); clip-path: circle(104px at 62% 93%); } 75% { -webkit-clip-path: circle(114px at 44% 38%); clip-path: circle(114px at 44% 38%); } 100% { -webkit-clip-path: circle(60px at -21% 5%); clip-path: circle(60px at -21% 5%); } } @keyframes clip84 { 0% { -webkit-clip-path: circle(175px at 76% 115%); clip-path: circle(175px at 76% 115%); } 25% { -webkit-clip-path: circle(137px at 83% 90%); clip-path: circle(137px at 83% 90%); } 50% { -webkit-clip-path: circle(104px at 62% 93%); clip-path: circle(104px at 62% 93%); } 75% { -webkit-clip-path: circle(114px at 44% 38%); clip-path: circle(114px at 44% 38%); } 100% { -webkit-clip-path: circle(60px at -21% 5%); clip-path: circle(60px at -21% 5%); } } #ui .text:nth-child(86) { color: #112bc9; -webkit-animation: clip85 17278ms ease-in-out infinite alternate; animation: clip85 17278ms ease-in-out infinite alternate; -webkit-filter: blur(14px); filter: blur(14px); } @-webkit-keyframes clip85 { 0% { -webkit-clip-path: circle(126px at -14% 87%); clip-path: circle(126px at -14% 87%); } 25% { -webkit-clip-path: circle(160px at 121% 59%); clip-path: circle(160px at 121% 59%); } 50% { -webkit-clip-path: circle(48px at 40% -27%); clip-path: circle(48px at 40% -27%); } 75% { -webkit-clip-path: circle(32px at 68% 35%); clip-path: circle(32px at 68% 35%); } 100% { -webkit-clip-path: circle(47px at 74% -6%); clip-path: circle(47px at 74% -6%); } } @keyframes clip85 { 0% { -webkit-clip-path: circle(126px at -14% 87%); clip-path: circle(126px at -14% 87%); } 25% { -webkit-clip-path: circle(160px at 121% 59%); clip-path: circle(160px at 121% 59%); } 50% { -webkit-clip-path: circle(48px at 40% -27%); clip-path: circle(48px at 40% -27%); } 75% { -webkit-clip-path: circle(32px at 68% 35%); clip-path: circle(32px at 68% 35%); } 100% { -webkit-clip-path: circle(47px at 74% -6%); clip-path: circle(47px at 74% -6%); } } #ui .text:nth-child(87) { color: #0d0d7b; -webkit-animation: clip86 18177ms ease-in-out infinite alternate; animation: clip86 18177ms ease-in-out infinite alternate; -webkit-filter: blur(8px); filter: blur(8px); } @-webkit-keyframes clip86 { 0% { -webkit-clip-path: circle(129px at 82% -19%); clip-path: circle(129px at 82% -19%); } 25% { -webkit-clip-path: circle(41px at 7% 80%); clip-path: circle(41px at 7% 80%); } 50% { -webkit-clip-path: circle(175px at 24% 71%); clip-path: circle(175px at 24% 71%); } 75% { -webkit-clip-path: circle(55px at -10% 63%); clip-path: circle(55px at -10% 63%); } 100% { -webkit-clip-path: circle(143px at 57% 107%); clip-path: circle(143px at 57% 107%); } } @keyframes clip86 { 0% { -webkit-clip-path: circle(129px at 82% -19%); clip-path: circle(129px at 82% -19%); } 25% { -webkit-clip-path: circle(41px at 7% 80%); clip-path: circle(41px at 7% 80%); } 50% { -webkit-clip-path: circle(175px at 24% 71%); clip-path: circle(175px at 24% 71%); } 75% { -webkit-clip-path: circle(55px at -10% 63%); clip-path: circle(55px at -10% 63%); } 100% { -webkit-clip-path: circle(143px at 57% 107%); clip-path: circle(143px at 57% 107%); } } #ui .text:nth-child(88) { color: #171bda; -webkit-animation: clip87 15178ms ease-in-out infinite alternate; animation: clip87 15178ms ease-in-out infinite alternate; -webkit-filter: blur(13px); filter: blur(13px); } @-webkit-keyframes clip87 { 0% { -webkit-clip-path: circle(81px at 29% 110%); clip-path: circle(81px at 29% 110%); } 25% { -webkit-clip-path: circle(78px at 98% 54%); clip-path: circle(78px at 98% 54%); } 50% { -webkit-clip-path: circle(78px at -20% 30%); clip-path: circle(78px at -20% 30%); } 75% { -webkit-clip-path: circle(89px at 110% -25%); clip-path: circle(89px at 110% -25%); } 100% { -webkit-clip-path: circle(179px at 32% 88%); clip-path: circle(179px at 32% 88%); } } @keyframes clip87 { 0% { -webkit-clip-path: circle(81px at 29% 110%); clip-path: circle(81px at 29% 110%); } 25% { -webkit-clip-path: circle(78px at 98% 54%); clip-path: circle(78px at 98% 54%); } 50% { -webkit-clip-path: circle(78px at -20% 30%); clip-path: circle(78px at -20% 30%); } 75% { -webkit-clip-path: circle(89px at 110% -25%); clip-path: circle(89px at 110% -25%); } 100% { -webkit-clip-path: circle(179px at 32% 88%); clip-path: circle(179px at 32% 88%); } } #ui .text:nth-child(89) { color: #065aca; -webkit-animation: clip88 18290ms ease-in-out infinite alternate; animation: clip88 18290ms ease-in-out infinite alternate; -webkit-filter: blur(11px); filter: blur(11px); } @-webkit-keyframes clip88 { 0% { -webkit-clip-path: circle(144px at 22% 81%); clip-path: circle(144px at 22% 81%); } 25% { -webkit-clip-path: circle(104px at 77% 18%); clip-path: circle(104px at 77% 18%); } 50% { -webkit-clip-path: circle(171px at 91% 104%); clip-path: circle(171px at 91% 104%); } 75% { -webkit-clip-path: circle(100px at 3% 29%); clip-path: circle(100px at 3% 29%); } 100% { -webkit-clip-path: circle(54px at 11% 116%); clip-path: circle(54px at 11% 116%); } } @keyframes clip88 { 0% { -webkit-clip-path: circle(144px at 22% 81%); clip-path: circle(144px at 22% 81%); } 25% { -webkit-clip-path: circle(104px at 77% 18%); clip-path: circle(104px at 77% 18%); } 50% { -webkit-clip-path: circle(171px at 91% 104%); clip-path: circle(171px at 91% 104%); } 75% { -webkit-clip-path: circle(100px at 3% 29%); clip-path: circle(100px at 3% 29%); } 100% { -webkit-clip-path: circle(54px at 11% 116%); clip-path: circle(54px at 11% 116%); } } #ui .text:nth-child(90) { color: #0e20ad; -webkit-animation: clip89 14486ms ease-in-out infinite alternate; animation: clip89 14486ms ease-in-out infinite alternate; -webkit-filter: blur(-5px); filter: blur(-5px); } @-webkit-keyframes clip89 { 0% { -webkit-clip-path: circle(143px at 33% 65%); clip-path: circle(143px at 33% 65%); } 25% { -webkit-clip-path: circle(73px at -20% 122%); clip-path: circle(73px at -20% 122%); } 50% { -webkit-clip-path: circle(92px at 114% 92%); clip-path: circle(92px at 114% 92%); } 75% { -webkit-clip-path: circle(125px at 110% 108%); clip-path: circle(125px at 110% 108%); } 100% { -webkit-clip-path: circle(112px at 16% 41%); clip-path: circle(112px at 16% 41%); } } @keyframes clip89 { 0% { -webkit-clip-path: circle(143px at 33% 65%); clip-path: circle(143px at 33% 65%); } 25% { -webkit-clip-path: circle(73px at -20% 122%); clip-path: circle(73px at -20% 122%); } 50% { -webkit-clip-path: circle(92px at 114% 92%); clip-path: circle(92px at 114% 92%); } 75% { -webkit-clip-path: circle(125px at 110% 108%); clip-path: circle(125px at 110% 108%); } 100% { -webkit-clip-path: circle(112px at 16% 41%); clip-path: circle(112px at 16% 41%); } } #ui .text:nth-child(91) { color: #064e81; -webkit-animation: clip90 18661ms ease-in-out infinite alternate; animation: clip90 18661ms ease-in-out infinite alternate; -webkit-filter: blur(-5px); filter: blur(-5px); } @-webkit-keyframes clip90 { 0% { -webkit-clip-path: circle(84px at 37% 12%); clip-path: circle(84px at 37% 12%); } 25% { -webkit-clip-path: circle(45px at 121% -21%); clip-path: circle(45px at 121% -21%); } 50% { -webkit-clip-path: circle(61px at 68% 14%); clip-path: circle(61px at 68% 14%); } 75% { -webkit-clip-path: circle(161px at 33% 71%); clip-path: circle(161px at 33% 71%); } 100% { -webkit-clip-path: circle(80px at 21% 59%); clip-path: circle(80px at 21% 59%); } } @keyframes clip90 { 0% { -webkit-clip-path: circle(84px at 37% 12%); clip-path: circle(84px at 37% 12%); } 25% { -webkit-clip-path: circle(45px at 121% -21%); clip-path: circle(45px at 121% -21%); } 50% { -webkit-clip-path: circle(61px at 68% 14%); clip-path: circle(61px at 68% 14%); } 75% { -webkit-clip-path: circle(161px at 33% 71%); clip-path: circle(161px at 33% 71%); } 100% { -webkit-clip-path: circle(80px at 21% 59%); clip-path: circle(80px at 21% 59%); } } #ui .text:nth-child(92) { color: #0c1ed1; -webkit-animation: clip91 12178ms ease-in-out infinite alternate; animation: clip91 12178ms ease-in-out infinite alternate; -webkit-filter: blur(-2px); filter: blur(-2px); } @-webkit-keyframes clip91 { 0% { -webkit-clip-path: circle(103px at 102% 42%); clip-path: circle(103px at 102% 42%); } 25% { -webkit-clip-path: circle(140px at 40% -26%); clip-path: circle(140px at 40% -26%); } 50% { -webkit-clip-path: circle(107px at 104% 38%); clip-path: circle(107px at 104% 38%); } 75% { -webkit-clip-path: circle(60px at 22% 55%); clip-path: circle(60px at 22% 55%); } 100% { -webkit-clip-path: circle(112px at 89% 75%); clip-path: circle(112px at 89% 75%); } } @keyframes clip91 { 0% { -webkit-clip-path: circle(103px at 102% 42%); clip-path: circle(103px at 102% 42%); } 25% { -webkit-clip-path: circle(140px at 40% -26%); clip-path: circle(140px at 40% -26%); } 50% { -webkit-clip-path: circle(107px at 104% 38%); clip-path: circle(107px at 104% 38%); } 75% { -webkit-clip-path: circle(60px at 22% 55%); clip-path: circle(60px at 22% 55%); } 100% { -webkit-clip-path: circle(112px at 89% 75%); clip-path: circle(112px at 89% 75%); } } #ui .text:nth-child(93) { color: #0e28de; -webkit-animation: clip92 16099ms ease-in-out infinite alternate; animation: clip92 16099ms ease-in-out infinite alternate; -webkit-filter: blur(9px); filter: blur(9px); } @-webkit-keyframes clip92 { 0% { -webkit-clip-path: circle(73px at 56% 77%); clip-path: circle(73px at 56% 77%); } 25% { -webkit-clip-path: circle(131px at 38% 0%); clip-path: circle(131px at 38% 0%); } 50% { -webkit-clip-path: circle(136px at 67% -27%); clip-path: circle(136px at 67% -27%); } 75% { -webkit-clip-path: circle(131px at 69% 117%); clip-path: circle(131px at 69% 117%); } 100% { -webkit-clip-path: circle(44px at 78% 114%); clip-path: circle(44px at 78% 114%); } } @keyframes clip92 { 0% { -webkit-clip-path: circle(73px at 56% 77%); clip-path: circle(73px at 56% 77%); } 25% { -webkit-clip-path: circle(131px at 38% 0%); clip-path: circle(131px at 38% 0%); } 50% { -webkit-clip-path: circle(136px at 67% -27%); clip-path: circle(136px at 67% -27%); } 75% { -webkit-clip-path: circle(131px at 69% 117%); clip-path: circle(131px at 69% 117%); } 100% { -webkit-clip-path: circle(44px at 78% 114%); clip-path: circle(44px at 78% 114%); } } #ui .text:nth-child(94) { color: #0856b3; -webkit-animation: clip93 10644ms ease-in-out infinite alternate; animation: clip93 10644ms ease-in-out infinite alternate; -webkit-filter: blur(7px); filter: blur(7px); } @-webkit-keyframes clip93 { 0% { -webkit-clip-path: circle(74px at 7% 78%); clip-path: circle(74px at 7% 78%); } 25% { -webkit-clip-path: circle(170px at 2% 52%); clip-path: circle(170px at 2% 52%); } 50% { -webkit-clip-path: circle(134px at -22% 24%); clip-path: circle(134px at -22% 24%); } 75% { -webkit-clip-path: circle(91px at 103% 13%); clip-path: circle(91px at 103% 13%); } 100% { -webkit-clip-path: circle(121px at 20% 124%); clip-path: circle(121px at 20% 124%); } } @keyframes clip93 { 0% { -webkit-clip-path: circle(74px at 7% 78%); clip-path: circle(74px at 7% 78%); } 25% { -webkit-clip-path: circle(170px at 2% 52%); clip-path: circle(170px at 2% 52%); } 50% { -webkit-clip-path: circle(134px at -22% 24%); clip-path: circle(134px at -22% 24%); } 75% { -webkit-clip-path: circle(91px at 103% 13%); clip-path: circle(91px at 103% 13%); } 100% { -webkit-clip-path: circle(121px at 20% 124%); clip-path: circle(121px at 20% 124%); } } #ui .text:nth-child(95) { color: #120fd8; -webkit-animation: clip94 14980ms ease-in-out infinite alternate; animation: clip94 14980ms ease-in-out infinite alternate; -webkit-filter: blur(8px); filter: blur(8px); } @-webkit-keyframes clip94 { 0% { -webkit-clip-path: circle(42px at 120% 65%); clip-path: circle(42px at 120% 65%); } 25% { -webkit-clip-path: circle(91px at -9% 0%); clip-path: circle(91px at -9% 0%); } 50% { -webkit-clip-path: circle(89px at -10% 13%); clip-path: circle(89px at -10% 13%); } 75% { -webkit-clip-path: circle(52px at 94% 5%); clip-path: circle(52px at 94% 5%); } 100% { -webkit-clip-path: circle(163px at 5% 128%); clip-path: circle(163px at 5% 128%); } } @keyframes clip94 { 0% { -webkit-clip-path: circle(42px at 120% 65%); clip-path: circle(42px at 120% 65%); } 25% { -webkit-clip-path: circle(91px at -9% 0%); clip-path: circle(91px at -9% 0%); } 50% { -webkit-clip-path: circle(89px at -10% 13%); clip-path: circle(89px at -10% 13%); } 75% { -webkit-clip-path: circle(52px at 94% 5%); clip-path: circle(52px at 94% 5%); } 100% { -webkit-clip-path: circle(163px at 5% 128%); clip-path: circle(163px at 5% 128%); } } #ui .text:nth-child(96) { color: #1942c4; -webkit-animation: clip95 14218ms ease-in-out infinite alternate; animation: clip95 14218ms ease-in-out infinite alternate; -webkit-filter: blur(-8px); filter: blur(-8px); } @-webkit-keyframes clip95 { 0% { -webkit-clip-path: circle(142px at 92% 96%); clip-path: circle(142px at 92% 96%); } 25% { -webkit-clip-path: circle(138px at 83% 31%); clip-path: circle(138px at 83% 31%); } 50% { -webkit-clip-path: circle(171px at 56% -25%); clip-path: circle(171px at 56% -25%); } 75% { -webkit-clip-path: circle(32px at 26% 5%); clip-path: circle(32px at 26% 5%); } 100% { -webkit-clip-path: circle(164px at 71% 102%); clip-path: circle(164px at 71% 102%); } } @keyframes clip95 { 0% { -webkit-clip-path: circle(142px at 92% 96%); clip-path: circle(142px at 92% 96%); } 25% { -webkit-clip-path: circle(138px at 83% 31%); clip-path: circle(138px at 83% 31%); } 50% { -webkit-clip-path: circle(171px at 56% -25%); clip-path: circle(171px at 56% -25%); } 75% { -webkit-clip-path: circle(32px at 26% 5%); clip-path: circle(32px at 26% 5%); } 100% { -webkit-clip-path: circle(164px at 71% 102%); clip-path: circle(164px at 71% 102%); } } #ui .text:nth-child(97) { color: #021ce8; -webkit-animation: clip96 18086ms ease-in-out infinite alternate; animation: clip96 18086ms ease-in-out infinite alternate; -webkit-filter: blur(6px); filter: blur(6px); } @-webkit-keyframes clip96 { 0% { -webkit-clip-path: circle(126px at -14% 80%); clip-path: circle(126px at -14% 80%); } 25% { -webkit-clip-path: circle(71px at 110% 82%); clip-path: circle(71px at 110% 82%); } 50% { -webkit-clip-path: circle(124px at -7% -15%); clip-path: circle(124px at -7% -15%); } 75% { -webkit-clip-path: circle(58px at 30% -22%); clip-path: circle(58px at 30% -22%); } 100% { -webkit-clip-path: circle(173px at 101% -17%); clip-path: circle(173px at 101% -17%); } } @keyframes clip96 { 0% { -webkit-clip-path: circle(126px at -14% 80%); clip-path: circle(126px at -14% 80%); } 25% { -webkit-clip-path: circle(71px at 110% 82%); clip-path: circle(71px at 110% 82%); } 50% { -webkit-clip-path: circle(124px at -7% -15%); clip-path: circle(124px at -7% -15%); } 75% { -webkit-clip-path: circle(58px at 30% -22%); clip-path: circle(58px at 30% -22%); } 100% { -webkit-clip-path: circle(173px at 101% -17%); clip-path: circle(173px at 101% -17%); } } #ui .text:nth-child(98) { color: #135dd8; -webkit-animation: clip97 15009ms ease-in-out infinite alternate; animation: clip97 15009ms ease-in-out infinite alternate; -webkit-filter: blur(-2px); filter: blur(-2px); } @-webkit-keyframes clip97 { 0% { -webkit-clip-path: circle(146px at -25% 120%); clip-path: circle(146px at -25% 120%); } 25% { -webkit-clip-path: circle(138px at 104% 21%); clip-path: circle(138px at 104% 21%); } 50% { -webkit-clip-path: circle(160px at 106% 53%); clip-path: circle(160px at 106% 53%); } 75% { -webkit-clip-path: circle(78px at 2% 6%); clip-path: circle(78px at 2% 6%); } 100% { -webkit-clip-path: circle(52px at 61% -2%); clip-path: circle(52px at 61% -2%); } } @keyframes clip97 { 0% { -webkit-clip-path: circle(146px at -25% 120%); clip-path: circle(146px at -25% 120%); } 25% { -webkit-clip-path: circle(138px at 104% 21%); clip-path: circle(138px at 104% 21%); } 50% { -webkit-clip-path: circle(160px at 106% 53%); clip-path: circle(160px at 106% 53%); } 75% { -webkit-clip-path: circle(78px at 2% 6%); clip-path: circle(78px at 2% 6%); } 100% { -webkit-clip-path: circle(52px at 61% -2%); clip-path: circle(52px at 61% -2%); } } #ui .text:nth-child(99) { color: #0e1f6d; -webkit-animation: clip98 19499ms ease-in-out infinite alternate; animation: clip98 19499ms ease-in-out infinite alternate; -webkit-filter: blur(-6px); filter: blur(-6px); } @-webkit-keyframes clip98 { 0% { -webkit-clip-path: circle(173px at 61% 101%); clip-path: circle(173px at 61% 101%); } 25% { -webkit-clip-path: circle(137px at 110% -9%); clip-path: circle(137px at 110% -9%); } 50% { -webkit-clip-path: circle(36px at -6% 57%); clip-path: circle(36px at -6% 57%); } 75% { -webkit-clip-path: circle(75px at 48% -25%); clip-path: circle(75px at 48% -25%); } 100% { -webkit-clip-path: circle(163px at -21% -12%); clip-path: circle(163px at -21% -12%); } } @keyframes clip98 { 0% { -webkit-clip-path: circle(173px at 61% 101%); clip-path: circle(173px at 61% 101%); } 25% { -webkit-clip-path: circle(137px at 110% -9%); clip-path: circle(137px at 110% -9%); } 50% { -webkit-clip-path: circle(36px at -6% 57%); clip-path: circle(36px at -6% 57%); } 75% { -webkit-clip-path: circle(75px at 48% -25%); clip-path: circle(75px at 48% -25%); } 100% { -webkit-clip-path: circle(163px at -21% -12%); clip-path: circle(163px at -21% -12%); } } #ui .text:nth-child(100) { color: #1b35c6; -webkit-animation: clip99 15121ms ease-in-out infinite alternate; animation: clip99 15121ms ease-in-out infinite alternate; -webkit-filter: blur(9px); filter: blur(9px); } @-webkit-keyframes clip99 { 0% { -webkit-clip-path: circle(136px at 28% 49%); clip-path: circle(136px at 28% 49%); } 25% { -webkit-clip-path: circle(56px at 87% 31%); clip-path: circle(56px at 87% 31%); } 50% { -webkit-clip-path: circle(132px at 124% 18%); clip-path: circle(132px at 124% 18%); } 75% { -webkit-clip-path: circle(73px at 48% 61%); clip-path: circle(73px at 48% 61%); } 100% { -webkit-clip-path: circle(64px at 101% 99%); clip-path: circle(64px at 101% 99%); } } @keyframes clip99 { 0% { -webkit-clip-path: circle(136px at 28% 49%); clip-path: circle(136px at 28% 49%); } 25% { -webkit-clip-path: circle(56px at 87% 31%); clip-path: circle(56px at 87% 31%); } 50% { -webkit-clip-path: circle(132px at 124% 18%); clip-path: circle(132px at 124% 18%); } 75% { -webkit-clip-path: circle(73px at 48% 61%); clip-path: circle(73px at 48% 61%); } 100% { -webkit-clip-path: circle(64px at 101% 99%); clip-path: circle(64px at 101% 99%); } } #ui .text:nth-child(101) { color: #0c467e; -webkit-animation: clip100 17008ms ease-in-out infinite alternate; animation: clip100 17008ms ease-in-out infinite alternate; -webkit-filter: blur(8px); filter: blur(8px); } @-webkit-keyframes clip100 { 0% { -webkit-clip-path: circle(177px at 43% 73%); clip-path: circle(177px at 43% 73%); } 25% { -webkit-clip-path: circle(74px at 8% 109%); clip-path: circle(74px at 8% 109%); } 50% { -webkit-clip-path: circle(175px at -18% 6%); clip-path: circle(175px at -18% 6%); } 75% { -webkit-clip-path: circle(88px at 16% 8%); clip-path: circle(88px at 16% 8%); } 100% { -webkit-clip-path: circle(65px at 0% 92%); clip-path: circle(65px at 0% 92%); } } @keyframes clip100 { 0% { -webkit-clip-path: circle(177px at 43% 73%); clip-path: circle(177px at 43% 73%); } 25% { -webkit-clip-path: circle(74px at 8% 109%); clip-path: circle(74px at 8% 109%); } 50% { -webkit-clip-path: circle(175px at -18% 6%); clip-path: circle(175px at -18% 6%); } 75% { -webkit-clip-path: circle(88px at 16% 8%); clip-path: circle(88px at 16% 8%); } 100% { -webkit-clip-path: circle(65px at 0% 92%); clip-path: circle(65px at 0% 92%); } } </style></head><body>  <div id="ui"> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> <div class="text">MERRY CHRISTMAS</div> </div> </body></html>

Related: See More

Vue Now UI Kit

Ripple Dot Animation

Ripple Dot Animation

Success and Error Icon Animation

Success and Error Icon Animation

Bootstrap4 navigation border animation

Bootstrap4 navigation border animation

Questions / Comments:

Posting GuidelinesFormatting