纯css下雨效果-html代码-BFW代码库

代码语言：html
所属分类：动画
代码描述：纯css下雨效果
代码标签：效果
下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">

<style>
@import url("https://fonts.googleapis.com/css2?family=Londrina+Sketch&display=swap");
html {
  box-sizing: border-box;
}

*,
*:before,
*:after {
  box-sizing: inherit;
}

h1 {
  font-family: "Londrina Sketch", cursive;
  position: absolute;
  bottom: 5vmin;
  right: 5vmin;
  z-index: 25;
  -webkit-transform: rotate(-19deg);
          transform: rotate(-19deg);
  font-size: 9vmin;
  white-space: nowrap;
  color: #fff;
  text-shadow: 0 0 5vmin #000;
}

.scene {
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: center;
          justify-content: center;
  -webkit-box-align: center;
          align-items: center;
  width: 100vw;
  height: 100vh;
  overflow: hidden;
  background-image: linear-gradient(315deg, #8a8e91 0%, #33333f 74%);
}

.window {
  width: 80vmin;
  height: 80vmin;
  border-radius: 2px;
  border: 5vmin solid #888;
  background-color: #888;
  box-shadow: 0 -5vmin 1vmin rgba(0, 0, 0, 0.9), 0 -1vmin 2vmin black;
}

.window__inside {
  width: 70vmin;
  height: 70vmin;
  border-radius: 2px;
  border: 5vmin solid;
  border-top-color: #8c8d91;
  border-bottom-color: #47474f;
  border-left-color: #7e7d83;
  border-right-color: #9d9ea3;
  background-image: linear-gradient(315deg, #65beff 0%, #3047f5 74%);
  position: relative;
  overflow: hidden;
  -webkit-filter: blur(1px);
          filter: blur(1px);
}

.clouds {
  z-index: 5;
  position: relative;
  height: 100%;
  width: 100%;
}

.cloud {
  position: absolute;
  left: 0;
  -webkit-filter: blur(15px);
          filter: blur(15px);
}

.cloud_type_1 {
  top: -20vmin;
  -webkit-animation: cloud_1_animation 10s linear infinite;
          animation: cloud_1_animation 10s linear infinite;
}
@-webkit-keyframes cloud_1_animation {
  0% {
    -webkit-transform: scale(0.5) translateX(-85vmin);
            transform: scale(0.5) translateX(-85vmin);
  }
  100% {
    -webkit-transform: scale(0.5) translateX(100vmin);
            transform: scale(0.5) translateX(100vmin);
  }
}
@keyframes cloud_1_animation {
  0% {
    -webkit-transform: scale(0.5) translateX(-85vmin);
            transform: scale(0.5) translateX(-85vmin);
  }
  100% {
    -webkit-transform: scale(0.5) translateX(100vmin);
            transform: scale(0.5) translateX(100vmin);
  }
}
.cloud_type_2 {
  top: -30vmin;
  -webkit-animation: cloud_2_animation 15s linear infinite;
          animation: cloud_2_animation 15s linear infinite;
}
@-webkit-keyframes cloud_2_animation {
  0% {
    -webkit-transform: scale(0.7) translateX(-100vmin);
            transform: scale(0.7) translateX(-100vmin);
  }
  100% {
    -webkit-transform: scale(0.7) translateX(100vmin);
            transform: scale(0.7) translateX(100vmin);
  }
}
@keyframes cloud_2_animation {
  0% {
    -webkit-transform: scale(0.7) translateX(-100vmin);
            transform: scale(0.7) translateX(-100vmin);
  }
  100% {
    -webkit-transform: scale(0.7) translateX(100vmin);
            transform: scale(0.7) translateX(100vmin);
  }
}
.cloud_type_3 {
  top: 10vmin;
  -webkit-animation: cloud_3_animation 20s linear infinite;
          animation: cloud_3_animation 20s linear infinite;
}
@-webkit-keyframes cloud_3_animation {
  0% {
    -webkit-transform: scale(1.2) translateX(-100vmin);
            transform: scale(1.2) translateX(-100vmin);
  }
  100% {
    -webkit-transform: scale(1.2) translateX(100vmin);
            transform: scale(1.2) translateX(100vmin);
  }
}
@keyframes cloud_3_animation {
  0% {
    -webkit-transform: scale(1.2) translateX(-100vmin);
            transform: scale(1.2) translateX(-100vmin);
  }
  100% {
    -webkit-transform: scale(1.2) translateX(100vmin);
            transform: scale(1.2) translateX(100vmin);
  }
}
.hill {
  z-index: 15;
  position: absolute;
  bottom: 0;
  left: 0;
  height: 40vmin;
  -webkit-filter: blur(2px);
          filter: blur(2px);
}

.speaker {
  z-index: 10;
  position: absolute;
  bottom: 38vmin;
  left: 10vmin;
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-transform: rotateX(20deg) rotateY(15deg) rotate(-15deg);
          transform: rotateX(20deg) rotateY(15deg) rotate(-15deg);
}

.speaker__part {
  position: absolute;
  width: 10vmin;
  text-align: center;
  outline: 1px solid #111;
}

.speaker__part_side_front,
.speaker__part_side_left {
  height: 20vmin;
}

.speaker__part_side_front {
  background-image: linear-gradient(315deg, #485461 0%, #28313b 74%);
  -webkit-transform: translateZ(5vmin);
          transform: translateZ(5vmin);
}

.speaker__part_side_left {
  background-image: linear-gradient(315deg, #000 0%, #422419 74%);
  -webkit-transform: rotateY(-90deg) translateZ(5vmin);
          transform: rotateY(-90deg) translateZ(5vmin);
}

.speaker__circle {
  position: absolute;
  width: 8vmin;
  height: 8vmin;
  background-image: linear-gradient(315deg, #000000 0%, #414141 74%);
  -webkit-transform: translateZ(5vmin);
          transform: translateZ(5vmin);
  border-radius: 50%;
  box-shadow: inset 0 0 15px #000;
}
.speaker__circle::after {
  content: "";
  position: absolute;
  top: 2vmin;
  left: 2vmin;
  width: 4vmin;
  height: 4vmin;
  border-radius: 50%;
  background-image: linear-gradient(315deg, #000000 0%, #414141 74%);
  box-shadow: 0 0 15px #000;
  -webkit-animation: speaker_animation 0.7s ease infinite;
          animation: speaker_animation 0.7s ease infinite;
}
@-webkit-keyframes speaker_animation {
  0% {
    -webkit-transform: scale(0.9);
            transform: scale(0.9);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
@keyframes speaker_animation {
  0% {
    -webkit-transform: scale(0.9);
            transform: scale(0.9);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
.speaker__circle_pos_top {
  top: 1vmin;
  left: 1vmin;
}

.speaker__circle_pos_bottom {
  top: 11vmin;
  left: 1vmin;
}

/**
 * Rain by @jh3y
 * Link: https://codepen.io/jh3y/pen/WyNdMG
 */
.rain {
  z-index: 20;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}

.rain__drop {
  -webkit-animation-delay: calc(var(--d) * 2s);
          animation-delay: calc(var(--d) * 2s);
  -webkit-animation-duration: calc(var(--a) * 2s);
          animation-duration: calc(var(--a) * 2s);
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-name: drop;
          animation-name: drop;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
  height: 30px;
  left: calc(var(--x) * 1%);
  position: absolute;
  top: calc((var(--y) + 50) * -1px);
}
.rain__drop path {
  fill: #a1c6cc;
  opacity: var(--o);
  -webkit-transform: scaleY(calc(var(--s) * 1.5));
          transform: scaleY(calc(var(--s) * 1.5));
}
@-webkit-keyframes drop {
  90% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    -webkit-transform: translateY(100vh);
            transform: translateY(100vh);
  }
}
@keyframes drop {
  90% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    -webkit-transform: translateY(100vh);
            transform: translateY(100vh);
  }
}
</style>

</head>
<body translate="no">
<div class="scene">
<div class="window">
<div class="window__inside">
<div class="clouds">
<svg class="cloud cloud_type_1" viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
<path fill="rgba(255, 255, 255, 0.87)" d="M25.7,-38.5C37.2,-37.9,53.1,-38.9,62.6,-32.7C72.1,-26.5,75.3,-13.3,77,1C78.7,15.2,79,30.5,69.6,36.9C60.2,43.2,41.1,40.7,27.9,43.6C14.7,46.6,7.3,55,-1.8,58.2C-11,61.4,-22.1,59.4,-32.3,54.7C-42.4,50,-51.8,42.6,-59.7,33.1C-67.7,23.5,-74.4,11.8,-70.4,2.3C-66.3,-7.1,-51.6,-14.2,-42,-20.9C-32.4,-27.6,-27.8,-34,-21.7,-37.6C-15.5,-41.3,-7.8,-42.4,-0.3,-41.8C7.1,-41.3,14.2,-39.1,25.7,-38.5Z" transform="translate(100 100)"></path>
</svg>
<svg class="cloud cloud_type_2" viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
<path fill="rgba(255, 255, 255, 0.87)" d="M35.6,-55.8C48.8,-54.2,63.7,-49.8,73,-40.1C82.2,-30.3,85.7,-15.2,83.9,-1C82.1,13.1,75.1,26.2,67.1,38.2C59.2,50.2,50.4,61.2,39.1,66C27.8,70.8,13.9,69.5,2.2,65.6C-9.4,61.7,-18.8,55.2,-31.4,51.2C-44.1,47.1,-60,45.5,-61.9,37.4C-63.7,29.2,-51.5,14.6,-49,1.4C-46.5,-11.7,-53.7,-23.5,-50.5,-29.2C-47.2,-34.9,-33.5,-34.5,-23.3,-37.8C-13.1,-41.1,-6.6,-48.1,2.3,-52.1C11.3,-56.2,22.5,-57.4,35.6,-55.8Z" transform="translate(100 100)"></path>
</svg>
<svg class="cloud cloud_type_3" viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
<path fill="rgba(255, 255, 255, 0.87)" d="M31.9,-46.6C45,-47.7,61.9,-46.6,70.8,-38.4C79.7,-30.3,80.6,-15.2,78.8,-1.1C76.9,13,72.3,26.1,62.6,32.8C52.9,39.5,38.1,39.9,26.8,42.4C15.5,44.9,7.8,49.5,0.7,48.3C-6.4,47.1,-12.8,40.2,-19.2,34.9C-25.5,29.6,-31.9,25.8,-43.8,20.2C-55.8,14.7,-73.3,7.3,-77.4,-2.3C-81.4,-12,-71.9,-24,-63.2,-35.2C-54.5,-46.4,-46.6,-56.8,-36.2,-57.2C-25.8,-57.6,-12.9,-48.1,-1.8,-45.1C9.4,-42,18.8,-45.4,31.9,-46.6Z" transform="translate(100 100)"></path>
</svg>
</div>
<svg class="hill" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320">
<defs>
<linearGradient id="hill_fill_gradient" ="" x1="0%" y1="0%" x2="75%" y2="45%">
<stop offset="0%" style="stop-color: #a6e630;"></stop>
<stop offset="100%" style="stop-color: #1F7C11;"></stop>
</linearGradient>
</defs>
<path fill="url(#hill_fill_gradient)" fill-opacity="1" d="M0,192L48,176C96,160,192,128,288,106.7C384,85,480,75,576,64C672,53,768,43,864,58.7C960,75,1056,117,1152,149.3C1248,181,1344,203,1392,213.3L1440,224L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z"></path>
</svg>
<div class="speaker">
<div class="speaker__part speaker__part_side_front"></div>
<div class="speaker__part speaker__part_side_left"></div>
<div class="speaker__circle speaker__circle_pos_top"></div>
<div class="speaker__circle speaker__circle_pos_bottom"></div>
</div>
<h1>The Rain</h1>


<div class="rain">
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 42; --y: 37; --o: 0.6650017050222969; --a: 0.8704051571669458; --d: -0.915019752401208; --s: 0.6807101939072115">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 78; --y: 78; --o: 0.9950417278760624; --a: 1.4337817244665887; --d: 0.11832967267482619; --s: 0.24455504058667543">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 27; --y: 9; --o: 0.9234835795064342; --a: 1.0194062587673378; --d: -0.9050988212869537; --s: 0.34877894148600297">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 64; --y: 27; --o: 0.4223373592239452; --a: 0.7039480345714177; --d: -0.5269245164011247; --s: 0.04929447367402884">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 56; --y: 31; --o: 0.4345169884328295; --a: 1.314332954985754; --d: 0.0016487235653714905; --s: 0.9331600361868118">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 95; --y: 77; --o: 0.7223531662805236; --a: 0.9906874908295515; --d: -0.9442484953208603; --s: 0.683505633972199">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 60; --y: 69; --o: 0.03332044232881337; --a: 1.237234714605607; --d: -0.6655472228745616; --s: 0.5261261541241717">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 58; --y: 11; --o: 0.7902688096068775; --a: 0.7038031684506667; --d: -0.836810132021474; --s: 0.9796045841801213">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 7; --y: 51; --o: 0.17490014157318323; --a: 1.000357291851392; --d: -0.2816705786270499; --s: 0.4572243312897444">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 26; --y: 22; --o: 0.8638869108368701; --a: 1.2126706033017276; --d: -0.6064957743209214; --s: 0.20203396286513975">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 88; --y: 14; --o: 0.11809502308432185; --a: 1.0118347151373877; --d: 0.45638857503822683; --s: 0.27327412208296065">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 25; --y: 78; --o: 0.3418506228938152; --a: 0.6329956934843379; --d: 0.9888137682530256; --s: 0.6562564916047289">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 56; --y: 24; --o: 0.2704863446513017; --a: 0.9741333737972218; --d: 0.7491266464245161; --s: 0.38451776137706317">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 40; --y: 71; --o: 0.10353478988194853; --a: 0.5815527104748945; --d: 0.04993832858424474; --s: 0.928217351020393">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 57; --y: 22; --o: 0.39562890460197675; --a: 1.2557329676660176; --d: 0.9681461750159914; --s: 0.8826353379699814">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 14; --y: 90; --o: 0.6626580234768427; --a: 0.6782923250828139; --d: 0.5020747820557654; --s: 0.12145959722854682">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 75; --y: 40; --o: 0.5809368176859746; --a: 1.422016389755804; --d: -0.1837489448523102; --s: 0.9937998624996482">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 85; --y: 79; --o: 0.9422483306326022; --a: 0.9291840000178793; --d: 0.7019653964757926; --s: 0.5795053394379885">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 17; --y: 6; --o: 0.17286206094970447; --a: 1.245984138364821; --d: 0.17478728751038863; --s: 0.168050052428949">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 8; --y: 79; --o: 0.7640386964888599; --a: 0.9413329927050282; --d: 0.17344978946850853; --s: 0.9546547022993923">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 52; --y: 24; --o: 0.5837455005571657; --a: 1.4569710922925765; --d: -0.664887119635345; --s: 0.6905295173020387">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 97; --y: 42; --o: 0.8676956543843035; --a: 0.727554623257556; --d: -0.16568814342279348; --s: 0.5690953439255808">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 26; --y: 70; --o: 0.8090024285662392; --a: 1.3911858312946894; --d: -0.1521779822816942; --s: 0.9142926198819565">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 29; --y: 32; --o: 0.8469053244515856; --a: 1.4695104900091653; --d: -0.024186048567691465; --s: 0.045113511082286006">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 92; --y: 42; --o: 0.042634553005476805; --a: 0.6039046624273856; --d: -0.9670729448349111; --s: 0.4406302489271732">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 58; --y: 18; --o: 0.7711834167118241; --a: 0.8100289975893762; --d: 0.38304382116474445; --s: 0.78073396977523">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 42; --y: 1; --o: 0.4975162855799131; --a: 0.9879993204691102; --d: 0.04514253741773011; --s: 0.4550785485967497">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 81; --y: 33; --o: 0.998633918266737; --a: 1.2302796932099342; --d: -0.3226694875374614; --s: 0.915984633489346">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 94; --y: 45; --o: 0.646449702620632; --a: 0.843065679694099; --d: 0.3134797462807728; --s: 0.7548619801198135">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 84; --y: 71; --o: 0.49018038648598017; --a: 1.4924477588265914; --d: 0.7730844929804888; --s: 0.1600153688699104">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 61; --y: 23; --o: 0.07178613024347791; --a: 1.1109252818828517; --d: -0.28554014352939516; --s: 0.9343422838276114">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 43; --y: 26; --o: 0.9179008903190813; --a: 0.6184908978936268; --d: -0.3403726511161276; --s: 0.6729830991936563">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 8; --y: 72; --o: 0.6103964092070295; --a: 1.3526557679301952; --d: -0.3976433173540852; --s: 0.7402504882136753">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 44; --y: 42; --o: 0.7469327007983539; --a: 1.4500324880542292; --d: 0.12278193580585706; --s: 0.625220043839932">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 49; --y: 5; --o: 0.24877575702165666; --a: 1.01152881395635; --d: 0.41874838692313254; --s: 0.5972475630972958">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 2; --y: 44; --o: 0.530635112583242; --a: 1.019152455857497; --d: -0.5801867930679405; --s: 0.19251316789370176">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 64; --y: 77; --o: 0.34848358977851324; --a: 1.2458348426529657; --d: 0.23576819333864307; --s: 0.9069199305547029">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 45; --y: 68; --o: 0.8369997792646076; --a: 0.9527040771756967; --d: 0.10958246481974632; --s: 0.36883421406892447">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 46; --y: 72; --o: 0.4389329841369123; --a: 1.1308883915853016; --d: -0.22683675291995042; --s: 0.39071639229127686">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 76; --y: 94; --o: 0.7741790948981913; --a: 1.4742299093335982; --d: 0.4857736839710882; --s: 0.7663213626500753">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 4; --y: 39; --o: 0.3342538161084092; --a: 1.3203450302173747; --d: -0.2409544226405056; --s: 0.20496744258457888">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 76; --y: 87; --o: 0.25726465753024086; --a: 0.9459226039383293; --d: -0.07695978333566655; --s: 0.5492282549893044">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 75; --y: 42; --o: 0.027383406707442548; --a: 1.2692926392022132; --d: 0.29255525626272005; --s: 0.09328573494631764">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 53; --y: 72; --o: 0.46945134269204236; --a: 1.3334030014951472; --d: -0.36034679731389785; --s: 0.7511660181733721">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 27; --y: 0; --o: 0.4625877369357567; --a: 0.8715013457280223; --d: -0.512191989433707; --s: 0.44808662863072524">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 28; --y: 92; --o: 0.9508437361610689; --a: 1.0793884455658849; --d: 0.6993932116209773; --s: 0.7749607021479481">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 54; --y: 60; --o: 0.46196298582114736; --a: 0.8369260707432382; --d: 0.7420706739640979; --s: 0.47087990502623">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 76; --y: 58; --o: 0.5249801685079916; --a: 1.0900678059265474; --d: -0.4377884058150898; --s: 0.023698549210737774">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 17; --y: 57; --o: 0.3223506125841995; --a: 0.5726165566667045; --d: 0.056580490597439415; --s: 0.16609594187674515">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 26; --y: 45; --o: 0.9506033374850107; --a: 0.8143051641321091; --d: -0.9440499208649427; --s: 0.7142884589350338">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 90; --y: 91; --o: 0.6233204145336781; --a: 1.4327224024633378; --d: 0.8767834915097636; --s: 0.47297315667742423">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 94; --y: 6; --o: 0.5019929991631626; --a: 1.2248642699590708; --d: 0.1302572877555317; --s: 0.5636188655438938">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 15; --y: 28; --o: 0.13892809199101963; --a: 1.4294305477685838; --d: 0.3990718102260815; --s: 0.5151568488702132">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 27; --y: 26; --o: 0.9953116619246469; --a: 1.1975683048285242; --d: -0.08487743745372978; --s: 0.5508993019879342">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 37; --y: 49; --o: 0.8256082295740754; --a: 1.0086688019816743; --d: 0.5596105072269277; --s: 0.3211299291233418">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 21; --y: 87; --o: 0.1866103380911046; --a: 0.7529754114891054; --d: 0.28393764362921425; --s: 0.3921788339490171">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 29; --y: 77; --o: 0.012113160336616025; --a: 1.042670285721352; --d: 0.04946066404714955; --s: 0.7061673069832575">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 16; --y: 13; --o: 0.9636965979743835; --a: 1.401151441928771; --d: -0.3742539285541522; --s: 0.029113852357033565">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 8; --y: 96; --o: 0.42838508553174126; --a: 0.6183304213430927; --d: -0.6580645217147589; --s: 0.3001998035898872">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 25; --y: 85; --o: 0.4241613095805141; --a: 1.3527071979576397; --d: -0.7713061165000394; --s: 0.11769197563944345">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 0; --y: 45; --o: 0.9185137266560754; --a: 0.9191803872390665; --d: 0.812846996267782; --s: 0.9799074500902971">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 32; --y: 27; --o: 0.29208759838340503; --a: 1.3166904292653883; --d: 0.3119886482442755; --s: 0.26223948126376917">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 29; --y: 86; --o: 0.15656933145609897; --a: 1.4434336446620675; --d: 0.2655845810038988; --s: 0.9176523362131774">
 <path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 65; --y: 75; --o: 0.5896421599253907; --a: 0.9072033461371882; --d: 0.6247821312429167; --s: 0.6873569131826269">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 28; --y: 79; --o: 0.7489185617700731; --a: 1.4347896101276203; --d: -0.08904620592708667; --s: 0.9192678260170795">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 3; --y: 72; --o: 0.9994337921714747; --a: 0.8237625471849037; --d: 0.5818201073042948; --s: 0.44529234310527444">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 62; --y: 27; --o: 0.293347439650256; --a: 1.2639585504590325; --d: -0.9448538874081058; --s: 0.12449894624755209">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 27; --y: 45; --o: 0.8979350141985396; --a: 0.8844920339991587; --d: -0.9249483215024759; --s: 0.06218950642285237">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 30; --y: 83; --o: 0.5107017867320485; --a: 1.4383525430056883; --d: 0.8170432095590057; --s: 0.7489361349022043">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 63; --y: 91; --o: 0.07112888648457094; --a: 0.8402878848935822; --d: -0.046680391595699255; --s: 0.0730428992130625">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 81; --y: 16; --o: 0.12051795753512451; --a: 1.4079403726266146; --d: 0.5421193128598452; --s: 0.24016845991961078">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 84; --y: 55; --o: 0.04906813546846678; --a: 1.2536616637082851; --d: -0.5994536884636861; --s: 0.41253752736991744">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 75; --y: 49; --o: 0.7572007774203047; --a: 0.8837638934486816; --d: -0.4278211790778035; --s: 0.2423058846118935">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 62; --y: 48; --o: 0.33880969310915243; --a: 1.0041246029016244; --d: -0.4581566872911811; --s: 0.17186962797603367">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 9; --y: 61; --o: 0.8898501878817584; --a: 1.1708414428267127; --d: -0.05626540068974828; --s: 0.7479573991336335">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 57; --y: 74; --o: 0.8060597043573272; --a: 0.6301010034212764; --d: 0.8711524015169925; --s: 0.29885465014100254">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 89; --y: 69; --o: 0.09633759397602915; --a: 0.9249522420069112; --d: 0.4637977622832725; --s: 0.09350618738332939">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 5; --y: 87; --o: 0.6339073549749843; --a: 0.5220134593043817; --d: 0.937067106442317; --s: 0.7534828422199478">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 46; --y: 2; --o: 0.7443372962690877; --a: 1.420045651685239; --d: -0.9305657465886665; --s: 0.4507008269619386">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 32; --y: 79; --o: 0.5890446946875028; --a: 0.5910640125903524; --d: 0.7145734680352542; --s: 0.49095758124871747">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 85; --y: 41; --o: 0.4450227921368146; --a: 0.7465454524551238; --d: 0.2781100100024414; --s: 0.5247981673417412">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 97; --y: 18; --o: 0.2783230026024477; --a: 0.6193872053632927; --d: -0.22008151373132545; --s: 0.8820411695800991">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 56; --y: 92; --o: 0.5094810720849259; --a: 1.081219790438557; --d: -0.704717826635529; --s: 0.046881286895188445">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 74; --y: 54; --o: 0.9790954364193172; --a: 1.2652597067503002; --d: -0.4973152940144048; --s: 0.4448699887676193">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 72; --y: 47; --o: 0.3013131084658289; --a: 1.0757771320440057; --d: -0.9288034817713684; --s: 0.05219478493058416">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 6; --y: 29; --o: 0.7090028630556393; --a: 1.427674659815542; --d: -0.4020952987879074; --s: 0.4023874732497419">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 49; --y: 50; --o: 0.4468457162258086; --a: 1.0061091718702304; --d: 0.015677558221408816; --s: 0.4021604533229146">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 80; --y: 80; --o: 0.18773271929095348; --a: 1.4071192842704252; --d: -0.018350208580512728; --s: 0.7939497674202232">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 70; --y: 47; --o: 0.7064401498060595; --a: 1.1025029813558922; --d: 0.8198863920660888; --s: 0.10262982944982935">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 76; --y: 43; --o: 0.4287944878448331; --a: 0.7346112885272362; --d: -0.5279065541412282; --s: 0.6441051534036568">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 69; --y: 37; --o: 0.5310869620846905; --a: 0.70410368731969; --d: -0.7752209459990027; --s: 0.8263546205385046">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 79; --y: 75; --o: 0.34819499545882726; --a: 1.2677755785581428; --d: -0.8642753242143346; --s: 0.14733671415192373">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 92; --y: 61; --o: 0.7110386825174992; --a: 0.9104069781697484; --d: -0.9777126630763302; --s: 0.1660424774960798">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 99; --y: 87; --o: 0.3355335546322733; --a: 1.3747235935897018; --d: -0.08521533094050637; --s: 0.48816106748200805">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 49; --y: 89; --o: 0.5839803262902379; --a: 0.7106027917106288; --d: -0.6293190569576015; --s: 0.7690343699778976">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 49; --y: 83; --o: 0.43734428625346355; --a: 0.8207360397565522; --d: -0.769734113858036; --s: 0.7482795915594933">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 69; --y: 76; --o: 0.969334785374667; --a: 0.7562803598930088; --d: -0.29801872335115; --s: 0.20271196013698978">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 60; --y: 32; --o: 0.9383192350568847; --a: 0.548972566129541; --d: 0.9784629359019084; --s: 0.35163362869184933">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 37; --y: 1; --o: 0.6265754416866394; --a: 1.0428483677634863; --d: -0.4145995672395135; --s: 0.5269958111442179">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 4; --y: 42; --o: 0.03988855192570684; --a: 1.0941793911018731; --d: -0.030338542333683716; --s: 0.7644235080530168">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 80; --y: 36; --o: 0.10994631648009956; --a: 0.5486413602452966; --d: 0.5473992436003243; --s: 0.04967412670882054">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 58; --y: 23; --o: 0.16372031125743303; --a: 1.2673851033590842; --d: -0.5457799809760511; --s: 0.3284854489745077">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 24; --y: 86; --o: 0.571732811903505; --a: 1.0098210335482423; --d: 0.619840830129029; --s: 0.10222737118400227">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 35; --y: 78; --o: 0.5456279627028537; --a: 1.3810529326887915; --d: -0.6052741178837535; --s: 0.7771483762072953">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 99; --y: 15; --o: 0.8473240139325242; --a: 0.9474098146446304; --d: -0.7039302442917523; --s: 0.9007135266327626">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 95; --y: 85; --o: 0.12353053092000676; --a: 1.090234794346134; --d: -0.3745196233142698; --s: 0.4840397522720674">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 14; --y: 8; --o: 0.9108582556189004; --a: 1.3846546815880483; --d: 0.1074704343054389; --s: 0.5150654224604083">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 37; --y: 72; --o: 0.6149952985776939; --a: 0.8679814909146493; --d: 0.7150972120451158; --s: 0.40155731301719233">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 93; --y: 15; --o: 0.16550217701289993; --a: 1.285580369262597; --d: 0.7874677251615738; --s: 0.5267177424513676">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 90; --y: 95; --o: 0.37692301902563363; --a: 1.340368420969056; --d: -0.7906914524842161; --s: 0.6446227323856843">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 35; --y: 85; --o: 0.15650614053653644; --a: 0.9214270823066204; --d: -0.5934618786150536; --s: 0.9866034553741754">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 88; --y: 77; --o: 0.25183873147405045; --a: 0.5157914768302965; --d: 0.11151785608848819; --s: 0.04194361015159531">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 83; --y: 58; --o: 0.35498715737884745; --a: 0.8509178864140672; --d: 0.7295181437708771; --s: 0.40316747292059474">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 69; --y: 61; --o: 0.28013246263700453; --a: 1.2110401900630383; --d: 0.007719383854948969; --s: 0.5756269272644243">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z"></path>
</svg>
<svg class="rain__drop" preserveAspectRatio="xMinYMin" viewBox="0 0 5 50" style="--x: 10; --y: 0; --o: 0.8036634726064911; --a: 0.5344298802558356; --d: 0.6412513474656794; --s: 0.1768320759298596">
<path stroke="none" d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.44.........完整代码请登录后点击上方下载按钮下载查看