* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
body {
  height: 100vh;
  width: 100vw;
  background-color: #1e002a;
  overflow-x: hidden;
  color: white;
  font-family: 'Comic Sans MS', cursive, sans-serif;
  position: relative;
  z-index: 0;
}
.cont {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  filter: url("#goo");
  z-index: 0;
  pointer-events: none;
}
.cont .drip {
  position: absolute;
  border-radius: 50%;
  background: #8000ff;
  top: -100%;
  animation: falling 6s linear infinite;
}
@keyframes falling {
  0% { top: -100%; }
  50% { top: 0%; }
  80% { top: 80%; }
  100% { top: 100%; }
}

.cont .drip:nth-child(1) {
  height: 23px;
  width: 42px;
  animation-delay: -3.08s;
  background: #8000ff;
  left: 813px;
}
.cont .drip:nth-child(2) {
  height: 36px;
  width: 5px;
  animation-delay: -1.0s;
  background: #8000ff;
  left: 150px;
}
.cont .drip:nth-child(3) {
  height: 49px;
  width: 35px;
  animation-delay: -3.34s;
  background: #8000ff;
  left: 832px;
}
.cont .drip:nth-child(4) {
  height: 17px;
  width: 8px;
  animation-delay: -1.11s;
  background: #8000ff;
  left: 498px;
}
.cont .drip:nth-child(5) {
  height: 50px;
  width: 36px;
  animation-delay: -4.75s;
  background: #8000ff;
  left: 1138px;
}
.cont .drip:nth-child(6) {
  height: 48px;
  width: 40px;
  animation-delay: -5.53s;
  background: #8000ff;
  left: 264px;
}
.cont .drip:nth-child(7) {
  height: 21px;
  width: 40px;
  animation-delay: -0.21s;
  background: #8000ff;
  left: 271px;
}
.cont .drip:nth-child(8) {
  height: 17px;
  width: 20px;
  animation-delay: -1.62s;
  background: #8000ff;
  left: 1070px;
}
.cont .drip:nth-child(9) {
  height: 18px;
  width: 35px;
  animation-delay: -5.31s;
  background: #8000ff;
  left: 239px;
}
.cont .drip:nth-child(10) {
  height: 40px;
  width: 36px;
  animation-delay: -4.62s;
  background: #8000ff;
  left: 359px;
}
.cont .drip:nth-child(11) {
  height: 27px;
  width: 32px;
  animation-delay: -1.92s;
  background: #8000ff;
  left: 229px;
}
.cont .drip:nth-child(12) {
  height: 6px;
  width: 11px;
  animation-delay: -4.31s;
  background: #8000ff;
  left: 610px;
}
.cont .drip:nth-child(13) {
  height: 30px;
  width: 22px;
  animation-delay: -3.61s;
  background: #8000ff;
  left: 699px;
}
.cont .drip:nth-child(14) {
  height: 16px;
  width: 15px;
  animation-delay: -3.85s;
  background: #8000ff;
  left: 210px;
}
.cont .drip:nth-child(15) {
  height: 32px;
  width: 8px;
  animation-delay: -3.47s;
  background: #8000ff;
  left: 102px;
}
.cont .drip:nth-child(16) {
  height: 23px;
  width: 31px;
  animation-delay: -5.25s;
  background: #8000ff;
  left: 48px;
}
.cont .drip:nth-child(17) {
  height: 44px;
  width: 29px;
  animation-delay: -1.86s;
  background: #8000ff;
  left: 71px;
}
.cont .drip:nth-child(18) {
  height: 13px;
  width: 6px;
  animation-delay: -5.23s;
  background: #8000ff;
  left: 618px;
}
.cont .drip:nth-child(19) {
  height: 6px;
  width: 42px;
  animation-delay: -5.85s;
  background: #8000ff;
  left: 510px;
}
.cont .drip:nth-child(20) {
  height: 15px;
  width: 24px;
  animation-delay: -3.11s;
  background: #8000ff;
  left: 374px;
}
.cont .drip:nth-child(21) {
  height: 34px;
  width: 21px;
  animation-delay: -3.11s;
  background: #8000ff;
  left: 163px;
}
.cont .drip:nth-child(22) {
  height: 44px;
  width: 38px;
  animation-delay: -3.16s;
  background: #8000ff;
  left: 1329px;
}
.cont .drip:nth-child(23) {
  height: 18px;
  width: 33px;
  animation-delay: -4.01s;
  background: #8000ff;
  left: 1344px;
}
.cont .drip:nth-child(24) {
  height: 19px;
  width: 34px;
  animation-delay: -1.33s;
  background: #8000ff;
  left: 995px;
}
.cont .drip:nth-child(25) {
  height: 32px;
  width: 16px;
  animation-delay: -0.44s;
  background: #8000ff;
  left: 716px;
}
.cont .drip:nth-child(26) {
  height: 42px;
  width: 6px;
  animation-delay: -5.24s;
  background: #8000ff;
  left: 261px;
}
.cont .drip:nth-child(27) {
  height: 28px;
  width: 36px;
  animation-delay: -4.89s;
  background: #8000ff;
  left: 215px;
}
.cont .drip:nth-child(28) {
  height: 15px;
  width: 13px;
  animation-delay: -4.1s;
  background: #8000ff;
  left: 1004px;
}
.cont .drip:nth-child(29) {
  height: 23px;
  width: 25px;
  animation-delay: -5.76s;
  background: #8000ff;
  left: 1283px;
}
.cont .drip:nth-child(30) {
  height: 15px;
  width: 37px;
  animation-delay: -1.19s;
  background: #8000ff;
  left: 1339px;
}
.cont .drip:nth-child(31) {
  height: 8px;
  width: 14px;
  animation-delay: -0.48s;
  background: #8000ff;
  left: 750px;
}
.cont .drip:nth-child(32) {
  height: 49px;
  width: 20px;
  animation-delay: -0.4s;
  background: #8000ff;
  left: 1245px;
}
.cont .drip:nth-child(33) {
  height: 11px;
  width: 5px;
  animation-delay: -0.2s;
  background: #8000ff;
  left: 510px;
}
.cont .drip:nth-child(34) {
  height: 50px;
  width: 40px;
  animation-delay: -4.28s;
  background: #8000ff;
  left: 1102px;
}
.cont .drip:nth-child(35) {
  height: 44px;
  width: 14px;
  animation-delay: -1.05s;
  background: #8000ff;
  left: 1022px;
}
.cont .drip:nth-child(36) {
  height: 48px;
  width: 25px;
  animation-delay: -2.57s;
  background: #8000ff;
  left: 1198px;
}
.cont .drip:nth-child(37) {
  height: 14px;
  width: 11px;
  animation-delay: -1.85s;
  background: #8000ff;
  left: 688px;
}
.cont .drip:nth-child(38) {
  height: 17px;
  width: 38px;
  animation-delay: -0.98s;
  background: #8000ff;
  left: 115px;
}
.cont .drip:nth-child(39) {
  height: 19px;
  width: 11px;
  animation-delay: -4.77s;
  background: #8000ff;
  left: 1127px;
}
.cont .drip:nth-child(40) {
  height: 19px;
  width: 36px;
  animation-delay: -4.95s;
  background: #8000ff;
  left: 283px;
}
.cont .drip:nth-child(41) {
  height: 44px;
  width: 30px;
  animation-delay: -2.27s;
  background: #8000ff;
  left: 906px;
}
.cont .drip:nth-child(42) {
  height: 47px;
  width: 35px;
  animation-delay: -2.29s;
  background: #8000ff;
  left: 886px;
}
.cont .drip:nth-child(43) {
  height: 11px;
  width: 19px;
  animation-delay: -4.33s;
  background: #8000ff;
  left: 342px;
}
.cont .drip:nth-child(44) {
  height: 19px;
  width: 5px;
  animation-delay: -5.43s;
  background: #8000ff;
  left: 499px;
}
.cont .drip:nth-child(45) {
  height: 19px;
  width: 42px;
  animation-delay: -0.7s;
  background: #8000ff;
  left: 1062px;
}
.cont .drip:nth-child(46) {
  height: 31px;
  width: 35px;
  animation-delay: -0.08s;
  background: #8000ff;
  left: 29px;
}
.cont .drip:nth-child(47) {
  height: 47px;
  width: 16px;
  animation-delay: -4.18s;
  background: #8000ff;
  left: 1235px;
}
.cont .drip:nth-child(48) {
  height: 47px;
  width: 16px;
  animation-delay: -4.61s;
  background: #8000ff;
  left: 1317px;
}
.cont .drip:nth-child(49) {
  height: 31px;
  width: 43px;
  animation-delay: -5.89s;
  background: #8000ff;
  left: 222px;
}
.cont .drip:nth-child(50) {
  height: 17px;
  width: 14px;
  animation-delay: -3.46s;
  background: #8000ff;
  left: 765px;
}
.cont .drip:nth-child(51) {
  height: 41px;
  width: 10px;
  animation-delay: -3.26s;
  background: #8000ff;
  left: 706px;
}
.cont .drip:nth-child(52) {
  height: 37px;
  width: 11px;
  animation-delay: -1.7s;
  background: #8000ff;
  left: 1351px;
}
.cont .drip:nth-child(53) {
  height: 16px;
  width: 12px;
  animation-delay: -0.42s;
  background: #8000ff;
  left: 1368px;
}
.cont .drip:nth-child(54) {
  height: 39px;
  width: 44px;
  animation-delay: -2.16s;
  background: #8000ff;
  left: 62px;
}
.cont .drip:nth-child(55) {
  height: 11px;
  width: 19px;
  animation-delay: -4.71s;
  background: #8000ff;
  left: 1296px;
}
.cont .drip:nth-child(56) {
  height: 18px;
  width: 6px;
  animation-delay: -4.87s;
  background: #8000ff;
  left: 1313px;
}
.cont .drip:nth-child(57) {
  height: 41px;
  width: 12px;
  animation-delay: -0.5s;
  background: #8000ff;
  left: 590px;
}
.cont .drip:nth-child(58) {
  height: 16px;
  width: 27px;
  animation-delay: -3.29s;
  background: #8000ff;
  left: 213px;
}
.cont .drip:nth-child(59) {
  height: 21px;
  width: 32px;
  animation-delay: -1.34s;
  background: #8000ff;
  left: 1337px;
}
.cont .drip:nth-child(60) {
  height: 10px;
  width: 23px;
  animation-delay: -5.83s;
  background: #8000ff;
  left: 350px;
}
.cont .drip:nth-child(61) {
  height: 47px;
  width: 17px;
  animation-delay: -2.21s;
  background: #8000ff;
  left: 330px;
}
.cont .drip:nth-child(62) {
  height: 24px;
  width: 26px;
  animation-delay: -2.44s;
  background: #8000ff;
  left: 60px;
}
.cont .drip:nth-child(63) {
  height: 24px;
  width: 34px;
  animation-delay: -0.7s;
  background: #8000ff;
  left: 1048px;
}
.cont .drip:nth-child(64) {
  height: 40px;
  width: 43px;
  animation-delay: -3.75s;
  background: #8000ff;
  left: 1203px;
}
.cont .drip:nth-child(65) {
  height: 6px;
  width: 22px;
  animation-delay: -3.28s;
  background: #8000ff;
  left: 837px;
}
.cont .drip:nth-child(66) {
  height: 11px;
  width: 26px;
  animation-delay: -2.54s;
  background: #8000ff;
  left: 52px;
}
.cont .drip:nth-child(67) {
  height: 33px;
  width: 35px;
  animation-delay: -3.41s;
  background: #8000ff;
  left: 1154px;
}
.cont .drip:nth-child(68) {
  height: 48px;
  width: 32px;
  animation-delay: -2.39s;
  background: #8000ff;
  left: 842px;
}
.cont .drip:nth-child(69) {
  height: 17px;
  width: 44px;
  animation-delay: -3.51s;
  background: #8000ff;
  left: 892px;
}
.cont .drip:nth-child(70) {
  height: 18px;
  width: 29px;
  animation-delay: -3.19s;
  background: #8000ff;
  left: 771px;
}
.cont .drip:nth-child(71) {
  height: 27px;
  width: 11px;
  animation-delay: -5.09s;
  background: #8000ff;
  left: 1293px;
}
.cont .drip:nth-child(72) {
  height: 30px;
  width: 14px;
  animation-delay: -0.3s;
  background: #8000ff;
  left: 293px;
}
.cont .drip:nth-child(73) {
  height: 26px;
  width: 37px;
  animation-delay: -1.53s;
  background: #8000ff;
  left: 874px;
}
.cont .drip:nth-child(74) {
  height: 41px;
  width: 27px;
  animation-delay: -3.81s;
  background: #8000ff;
  left: 1130px;
}
.cont .drip:nth-child(75) {
  height: 42px;
  width: 23px;
  animation-delay: -3.76s;
  background: #8000ff;
  left: 63px;
}
.cont .drip:nth-child(76) {
  height: 31px;
  width: 19px;
  animation-delay: -2.53s;
  background: #8000ff;
  left: 1264px;
}
.cont .drip:nth-child(77) {
  height: 27px;
  width: 25px;
  animation-delay: -1.83s;
  background: #8000ff;
  left: 972px;
}
.cont .drip:nth-child(78) {
  height: 31px;
  width: 8px;
  animation-delay: -2.88s;
  background: #8000ff;
  left: 1155px;
}
.cont .drip:nth-child(79) {
  height: 14px;
  width: 38px;
  animation-delay: -4.4s;
  background: #8000ff;
  left: 693px;
}
.cont .drip:nth-child(80) {
  height: 45px;
  width: 32px;
  animation-delay: -2.05s;
  background: #8000ff;
  left: 492px;
}