پیش‌نمایش زنده
کد HTML
<div class="shadow">
  <div id="svg-container">
    <svg
      viewBox="-100 100 800 800"
      preserveAspectRatio="xMidYMid meet"
      class="svg-hw"
    >
      <path
        id="path7050"
        class="path"
        d="m 187.44537,731.24092 15.72591,-20.08687 -17.17956,-0.13215 z"
      ></path>
      <path
        id="path7062"
        class="path"
        d="m 186.55602,711.0219 -0.92505,-28.54449 18.15934,28.28019 z"
      ></path>
      <path
        id="path7064"
        class="path"
        d="m 197.05666,701.24277 7.66472,-38.72007 -19.20716,18.2821 z"
      ></path>
      <path
        id="path7065"
        class="path"
        d="m 185.81422,680.80973 12.99609,-49.2053 6.34322,29.99815 z"
      ></path>
      <path
        id="path7066"
        class="path"
        d="m 205.15353,661.60258 14.933,-35.28417 -21.27622,5.41817 z"
      ></path>
      <path
        id="path7067"
        class="path"
        d="m 220.08653,626.04918 32.64115,-24.31568 -54.04952,29.73385 z"
      ></path>
      <path
        id="path7068"
        class="path"
        d="m 198.67816,631.46735 17.70816,-27.35514 35.81276,-2.11441 z"
      ></path>
      <path
        id="path7069"
        class="path"
        d="m 216.75417,603.98006 42.81673,-42.94889 -6.73967,40.96663 z"
      ></path>
      <path
        id="path7070"
        class="path"
        d="m 253.33123,601.9978 71.62553,-33.8305 -64.35726,-7.92903 z"
      ></path>
      <path
        id="path7071"
        class="path"
        d="m 258.93875,598.82619 26.82654,49.82071 3.96451,-63.82865 z"
      ></path>
      <path
        id="path7072"
        class="path"
        d="M 286.02959,650.57196 299.90538,646.5325 288.6726,600.9406 z"
      ></path>
      <path
        id="path7076"
        class="path"
        d="m 286.16174,649.57196 12.81859,49.95286 1.0572,-52.86017 z"
      ></path>
      <path
        id="path7080"
        class="path"
        d="m 300.03753,646.5325 11.23279,55.37102 -12.58636,-3.52271 z"
      ></path>
      <path
        id="path7081"
        class="path"
        d="m 298.68396,698.38081 6.24314,39.59978 6.47537,-35.94491 z"
      ></path>
      <path
        id="path7086"
        class="path"
        d="m 305.1914,737.58414 -18.63321,0.13215 14.80085,-22.99417 z"
      ></path>
      <path
        id="path7088"
        class="path"
        d="m 244.27005,575.69987 -50.74576,-73.47564 65.81091,57.74974 z"
      ></path>
      <path
        id="path7090"
        class="path"
        d="m 193.65644,502.22423 26.56224,-7.26827 2.24656,32.37685 z"
      ></path>
      <path
        id="path7091"
        class="path"
        d="m 222.46524,527.33281 134.89545,-2.07099 -97.9298,34.94823 z"
      ></path>
      <path
        id="path7092"
        class="path"
        d="m 357.1738,525.07493 -15.88556,-44.29267 -92.51002,45.78778 z"
      ></path>
      <path
        id="path7094"
        class="path"
        d="m 341.28824,480.59537 -7.84933,-21.67912 -40.36801,45.6009 z"
      ></path>
      <path
        id="path7096"
        class="path"
        d="m 292.51023,504.70404 -41.86312,-49.15179 81.60491,3.17711 z"
      ></path>
      <path
        id="path7098"
        class="path"
        d="m 220.18422,495.98581 29.15467,31.77112 -26.87365,-0.57588 z"
      ></path>
      <path
        id="path7100"
        class="path"
        d="m 218.74489,495.79893 72.76534,9.34444 -40.34156,-49.43357 z"
      ></path>
      <path
        id="path7101"
        class="path"
        d="m 292.51023,505.14337  -43.14156,21.03357 -28,-31.1 z"
      ></path>
      <path
        id="path7102"
        class="path"
        d="M 220.74489,494.79893 212.148,468.07381 251.08645,456.55225 z"
      ></path>
      <path
        id="path7104"
        class="path"
        d="m 211.96111,468.07381 -18.502,34.01378 -9.90512,-38.49911 z"
      ></path>
      <path
        id="path7105"
        class="path"
        d="m 211.96111,468.07381 8.502,26.01378 -24.90512,6.89911 z"
      ></path>
      <path
        id="path7106"
        class="path"
        d="M 211.77422,468.2607 239.06,397.61669 251.89956,455.36536 z"
      ></path>
      <path
        id="path7107"
        class="path"
        d="m 238.87311,397.05602 -48.59112,18.31511 36.06957,13.39045 z"
      ></path>
      <path
        id="path7108"
        class="path"
        d="m 226.35156,429.761 -41.79757,31.45312 10.27889,-26.22023 31.1449,-6.046 z"
      ></path>
      <path
        id="path7109"
        class="path"
        d="m 225.97778,429.94789 -14,36.5 -27.5,-3.8 z"
      ></path>
      <path
        id="path7110"
        class="path"
        d="m 189.90822,415.74491 3.73777,18.68889 -18.87578,-19.24955 z"
      ></path>
      <path
        id="path7111"
        class="path"
        d="m 189.90822,415.74491 4.73777,19.58889 27.87578,-7.24955 z"
      ></path>
      <path
        id="path7112"
        class="path"
        d="m 173.83577,414.81047 -6.16734,14.39044 25.97756,5.41978 z"
      ></path>
      <path
        id="path7114"
        class="path"
        d="m 168.66843,429.20091 8.5969,9.90512 17.38066,-4.11156 z"
      ></path>
      <path
        id="path7116"
        class="path"
        d="m 173.64888,414.62358 41.11556,-44.66645 -25.04311,45.78778 z"
      ></path>
      <path
        id="path7124"
        class="path"
        d="m 214.20378,370.3309 -24.48245,2.99023 -2.42956,25.97756 z"
      ></path>
      <path
        id="path7126"
        class="path"
        d="m 189.53444,373.13424 -10.83956,12.89533 8.22311,12.20356 z"
      ></path>
      <path
        id="path7128"
        class="path"
        d="m 180.75066,389.39357 -1.30822,19.4889 7,-11 z"
      ></path>
      <path
        id="path7129"
        class="path"
        d="m 178.88177,386.02957 -36.81712,-30.46289 46.72223,17.75445 z"
      ></path>
      <path
        id="path7130"
        class="path"
        d="m 188.78688,373.32113 -13.82978,-14.57734 -32.70556,-3.17711 z"
      ></path>
      <path
        id="path7132"
        class="path"
        d="m 142.25154,355.56668  13.456,22.23978 21.63023,8.36277 z"
      ></path>
      <path
        id="path7134"
        class="path"
        d="m 214.95133,370.5178 24.10867,26.35133 0.74756,-22.23978 z"
      ></path>
      <path
        id="path7135"
        class="path"
        d="m 214.95133,370.5178 24.10867,26.35133 -48.74756,18.23978 z"
      ></path>
      <path
        id="path7136"
        class="path"
        d="m 239.62067,388.08535 41.67623,-7.84933 -41.11557,-5.98045 z"
      ></path>
      <path
        id="path7137"
        class="path"
        d="m 240.18133,374.25557  53.26335,-19.99711 -12.33467,25.79067 z"
      ></path>
      <path
        id="path7138"
        class="path"
        d="m 293.81845,353.88468 -35.322,4.29844 -18.50201,16.25934 z"
      ></path>
      <path
        id="path7140"
        class="path"
        d="m 202.99044,371.45224 -32.14489,-32.1449 22.61356,33.64001 z"
      ></path>
      <path
        id="path7142"
        class="path"
        d="m 188.97377,357.62246 5.41978,-32.51868 2.24267,40.18112 z"
      ></path>
      <path
        id="path7144"
        class="path"
        d="m 170.65866,339.30734 -11.96089,-1.49511 28.22022,25.60378 z"
      ></path>
      <path
        id="path7146"
        class="path"
        d="m 170.65866,339.30734 0.37377,-52.88956 -8.22311,51.58134 z"
      ></path>
      <path
        id="path7148"
        class="path"
        d="m 166.92088,311.08711 -5.79356,-43.54511 9.71823,19.24955 z"
      ></path>
      <path
        id="path7149"
        class="path"
        d="m 170.84555,286.79155  14.01667,-37.75156 -18.12823,28.7809 z"
      ></path>
      <path
        id="path7150"
        class="path"
        d="m 171.03244,309.592 18.12822,-12.52155 -18.12822,22.98733 z"
      ></path>
      <path
        id="path7152"
        class="path"
        d="M 157.95021,337.43845 136.64487,308.47067 163.1831,333.3269 z"
      ></path>
      <path
        id="path7154"
        class="path"
        d="m 145.98932,316.69378 11.774,-31.958 -5.60667,37.93845 z"
      ></path>
      <path
        id="path7156"
        class="path"
        d="m 137.01865,308.65756 4.11156,-38.49912 0.93444,42.79756 z"
      ></path>
      <path
        id="path7158"
        class="path"
        d="m 214.95133,370.14401 17.75445,-14.39044 -5.79356,16.44622 z"
      ></path>
      <path
        id="path7160"
        class="path"
        d="m 233.26645,354.44535 -2.05578,-24.66934 -3.55089,29.71534 z"
      ></path>
      <path
        id="path7162"
        class="path"
        d="m 233.26645,355.1929 19.43644,-1.30822 -25.60378,17.94133 z"
      ></path>
      <path
        id="path7164"
        class="path"
        d="m 239.99444,362.66846 17.94134,-6.16734 -4.48533,-2.80333 z"
      ></path>
      <path
        id="path7165"
        class="path"
        d="m 253.45045,353.69779  29.34156,-13.456 -24.85623,16.07244 z"
      ></path>
      <path
        id="path7168"
        class="path"
        d="m 258.30956,356.68801 28.594,-11.40022 -4.29844,-4.85911 z"
      ></path>
      <path
        id="path7170"
        class="path"
        d="m 287.27735,345.47468 16.82,-25.23001 -21.49223,19.99712 z"
      ></path>
      <path
        id="path7172"
        class="path"
        d="m 304.09735,320.43156 4.11155,-34.01378 -9.71822,38.686 z"
      ></path>
      <path
        id="path7174"
        class="path"
        d="m 292.69712,330.14978 -8.97066,-12.70844 -1.12134,22.80045 z"
      ></path>
      <path
        id="path7176"
        class="path"
        d="m 288.95934,324.35623 7.66245,-14.57734 -13.08223,6.728 z"
      ></path>
      <path
        id="path7178"
        class="path"
        d="m 283.53956,316.69378 -29.90222,-15.69867 29.34156,22.42667 z"
      ></path>
      <path
        id="path7180"
        class="path"
        d="m 296.99556,309.21823 3.36401,-19.43645 -10.09201,22.80045 z"
      ></path>
      <path
        id="path7182"
        class="path"
        d="m 300.35957,289.96867 -5.41978,-31.39734 0.56066,40.55489 z"
      ></path>
      <path
        id="path7184"
        class="path"
        d="m 295.31357,294.82778 -10.09201,-5.79356 10.46578,10.65267 z"
      ></path>
      <path
        id="path7188"
        class="path"
        d="m 356.98691,524.88804 -32.51867,42.98445 72.32601,-2.80333 z"
      ></path>
      <path
        id="path7189"
        class="path"
        d="m 356.98691,524.88804 -32.51867,42.98445 -65.32601,-7.80333 z"
      ></path>
      <path
        id="path7190"
        class="path"
        d="m 357.1738,525.07493 43.35823,-30.276 -3.17711,69.89645 z"
      ></path>
      <path
        id="path7192"
        class="path"
        d="m 333.6258,458.72937 66.90623,35.88267 7.66244,-42.61067 z"
      ></path>
      <path
        id="path7193"
        class="path"
        d="m 333.6258,458.72937 66.90623,35.88267 -42.66244,30.61067 z"
      ></path>
      <path
        id="path7194"
        class="path"
        d="m 454.72982,481.52981 18.12822,17.94134 -10.83956,-5.60667 z"
      ></path>
      <path
        id="path7195"
        class="path"
        d="m 462.01848,493.86448  -17.00689,-27.28578 -37.004,-14.76423 z"
      ></path>
      <path
        id="path7196"
        class="path"
        d="m 408.00759,451.81447  53.63712,42.05001 -61.48646,0.37378 z"
      ></path>
      <path
        id="path7197"
        class="path"
        d="m 461.64471,493.86448 -61.48646,0.37378 50.46001,50.08623 11.40022,-50.46001 z"
      ></path>
      <path
        id="path7198"
        class="path"
        d="m 396.79425,564.88227 53.63712,-20.74467 -51,-50 z"
      ></path>
      <path
        id="path7200"
        class="path"
        d="m 461.8316,494.23826 6.728,17.94134 4.29844,-12.89534 z"
      ></path>
      <path
        id="path7202"
        class="path"
        d="m 450.61826,543.95071 17.94134,-31.77111 -8,-15 z"
      ></path>
      <path
        id="path7206"
        class="path"
        d="m 472.85804,499.47115 -0.56067,43.17134 -3.55088,-30.27601 z"
      ></path>
      <path
        id="path7214"
        class="path"
        d="m 467.99893,512.55337 -13.64289,47.65668 -4,-16 z"
      ></path>
      <path
        id="path7216"
        class="path"
        d="m 458.65448,546.38027 13.82978,-4.11156 0,0 -5.09201,-29.99712 z"
      ></path>
      <path
        id="path7215"
        class="path"
        d="m 458.65448,546.38027 13.82978,-4.11156 10.09201,19.99712 z"
      ></path>
      <path
        id="path7218"
        class="path"
        d="m 396.98114,565.25605 37.93845,70.64401 15.88556,-91.57557 z"
      ></path>
      <path
        id="path7219"
        class="path"
        d="m 450.61826,544.51138 11.58711,51.39445 -20.184,0.37378 z"
      ></path>
      <path
        id="path7222"
        class="path"
        d="m 442.02173,596.27961   7.84933,23.17423 12.52156,-23.92179 z"
      ></path>
      <path
        id="path7224"
        class="path"
        d="m 462.01848,595.71894 27.47268,35.32201 -39.99423,-11.21334 z"
      ></path>
      <path
        id="path7225"
        class="path"
        d="m 470.42849,625.62117 -19.99423,-5.21334 30.08911,37.75157 z"
      ></path>
      <path
        id="path7226"
        class="path"
        d="m 470.42849,626.62117 16.44622,57.56179 2.364,-51.95512 z"
      ></path>
      <path
        id="path7228"
        class="path"
        d="m 488.86493,641.69362 20.55778,67.09312 -23.548,-26.35134 z"
      ></path>
      <path
        id="path7230"
        class="path"
        d="m 510.42271,710.28674 -17.56755,5.79356 -6.54112,-32.89245 z"
      ></path>
      <path
        id="path7231"
        class="path"
        d="m 510.42271,710.59985 -15.138,28.22023 -2.24266,-22.05289 z"
      ></path>
      <path
        id="path7232"
        class="path"
        d="m 493.04205,717.76719  -16.44623,22.98733 18.31511,-0.18689 z"
      ></path>
      <path
        id="path7233"
        class="path"
        d="m 439.59181,609.05361 20.18401,40.5549 -24.66934,-12.70845 z"
      ></path>
      <path
        id="path7234"
        class="path"
        d="m 435.10648,637.00006  -3.73778,49.52557 28.59401,-36.25646 z"
      ></path>
      <path
        id="path7235"
        class="path"
        d="m 459.96271,649.16917  -22.98734,64.10291 -5.79356,-27.84645 z"
      ></path>
      <path
        id="path7236"
        class="path"
        d="m 431.18181,685.42563 -15.32489,43.35823 20.74467,-14.57734 z"
      ></path>
      <path
        id="path7237"
        class="path"
        d="m 436.60159,713.45896 -12.33467,32.70556 -8.78378,-16.63311 z"
      ></path>
      <path
        id="path7238"
        class="path"
        d="m 415.48314,729.53141  -15.51178,16.82 24.10867,0.18689 z"
      ></path>
    </svg>
  </div>
  <div class="loading loading02">
    <span>L</span>
    <span>O</span>
    <span>A</span>
    <span>D</span>
    <span>I</span>
    <span>N</span>
    <span>G</span>
  </div>
</div>
کد CSS
.svg-hw {
  height: 250px;
  width: 250px;
}
.path {
  stroke: #ffffff;
  stroke-width: 3px;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-opacity: 1;
}
@keyframes move7050 {
  0% {
    fill: #b40431;
  }
  10% {
    fill: orange;
    transform: translate(50px, 100px);
  }
  15% {
    fill: yellow;
    transform: translate(150px, 50px);
  }
  30% {
    fill: #110a29;
    transform: translate(0, 0);
  }
  100% {
    fill: #110a29;
  }
}

@keyframes move7062 {
  0% {
    fill: blue;
  }
  10% {
    fill: darkblue;
    transform: translate(-50px, -100px);
  }
  20% {
    fill: cyan;
    transform: translate(150px, -50px);
  }
  40% {
    fill: #291f6c;
    transform: translate(0, 0);
  }
  100% {
    fill: #291f6c;
  }
}

@keyframes move7064 {
  0% {
    fill: blue;
  }
  15% {
    fill: darkgreen;
    transform: translate(-150px, -200px);
  }
  25% {
    fill: green;
    transform: translate(-150px, -50px);
  }
  35% {
    fill: #520d4f;
    transform: translate(0, 0);
  }
  100% {
    fill: #520d4f;
  }
}

@keyframes move7065 {
  0% {
    fill: white;
  }
  13% {
    fill: yellow;
    transform: translate(-50px, -100px);
  }
  20% {
    fill: orange;
    transform: translate(50px, -50px);
  }
  30% {
    fill: #691751;
    transform: translate(0, 0);
  }
  100% {
    fill: #691751;
  }
}

@keyframes move7066 {
  0% {
    fill: #688a08;
  }
  10% {
    fill: darkblue;
    transform: translate(-50px, 150px);
  }
  30% {
    fill: cyan;
    transform: translate(150px, -50px);
  }
  50% {
    fill: #8f335d;
    transform: translate(0, 0);
  }
  100% {
    fill: #8f335d;
  }
}

@keyframes move7067 {
  0% {
    fill: red;
  }
  5% {
    fill: #2e64fe;
    transform: translate(-100px, 150px);
  }
  15% {
    fill: cyan;
    transform: translate(150px, 250px);
  }
  25% {
    fill: #b90149;
    transform: translate(0, 0);
  }
  100% {
    fill: #b90149;
  }
}

@keyframes move7068 {
  0% {
    fill: #cc2efa;
  }
  10% {
    fill: #00ff80;
    transform: translate(-100px, 150px);
  }
  20% {
    fill: #fe9a2e;
    transform: translate(150px, 250px);
  }
  35% {
    fill: #a70c29;
    transform: translate(0, 0);
  }
  100% {
    fill: #a70c29;
  }
}

@keyframes move7069 {
  0% {
    fill: #00ff40;
  }
  10% {
    fill: #ac58fa;
    transform: translate(100px, 150px);
  }
  20% {
    fill: #f5a9bc;
    transform: translate(15px, 25px);
  }
  35% {
    fill: #8d004c;
    transform: translate(0, 0);
  }
  100% {
    fill: #8d004c;
  }
}

@keyframes move7070 {
  0% {
    fill: #4b8a08;
  }
  13% {
    fill: #81f7be;
    transform: translate(60px, 90px);
  }
  30% {
    fill: #df0174;
    transform: translate(15px, 25px);
  }
  35% {
    fill: #ad0f09;
    transform: translate(0, 0);
  }
  100% {
    fill: #ad0f09;
  }
}

@keyframes move7071 {
  0% {
    fill: #f78181;
  }
  20% {
    fill: #00ffbf;
    transform: translate(-80px, 80px);
  }
  35% {
    fill: #3a2f0b;
    transform: translate(15px, 50px);
  }
  45% {
    fill: #6e064e;
    transform: translate(0, 0);
  }
  100% {
    fill: #6e064e;
  }
}

@keyframes move7072 {
  0% {
    fill: #dba901;
  }
  12% {
    fill: #6e6e6e;
    transform: translate(150px, 0px);
  }
  20% {
    fill: #a9f5d0;
    transform: translate(55px, 55px);
  }
  25% {
    fill: #5c1561;
    transform: translate(0, 0);
  }
  100% {
    fill: #5c1561;
  }
}

@keyframes move7076 {
  0% {
    fill: #2efe2e;
  }
  5% {
    fill: #f5a9e1;
    transform: translate(-200px, 180px);
  }
  15% {
    fill: #7401df;
    transform: translate(35px, 25px);
  }
  20% {
    fill: #881754;
    transform: translate(0, 0);
  }
  100% {
    fill: #881754;
  }
}

@keyframes move7080 {
  0% {
    fill: #0b3b39;
  }
  18% {
    fill: #4b088a;
    transform: translate(-200px, 180px);
  }
  27% {
    fill: #a9d0f5;
    transform: translate(35px, 25px);
  }
  37% {
    fill: #a71d67;
    transform: translate(0, 0);
  }
  100% {
    fill: #a71d67;
  }
}

@keyframes move7081 {
  0% {
    fill: #f5a9bc;
  }
  18% {
    fill: #f2f5a9;
    transform: translate(130px, 130px);
  }
  27% {
    fill: #bca9f5;
    transform: translate(-35px, 25px);
  }
  37% {
    fill: #891754;
    transform: translate(0, 0);
  }
  100% {
    fill: #891754;
  }
}

@keyframes move7086 {
  0% {
    fill: #08298a;
  }
  8% {
    fill: #8181f7;
    transform: translate(330px, 130px);
  }
  18% {
    fill: #8181f7;
    transform: translate(-75px, -25px);
  }
  27% {
    fill: #a70b29;
    transform: translate(0, 0);
  }
  100% {
    fill: #a70b29;
  }
}

@keyframes move7088 {
  0% {
    fill: #fe2e64;
  }
  10% {
    fill: #610b21;
    transform: translate(170px, 30px);
  }
  28% {
    fill: #e6e6e6;
    transform: translate(100px, -250px);
  }
  40% {
    fill: #ed6708;
    transform: translate(0, 0);
  }
  100% {
    fill: #ed6708;
  }
}

@keyframes move7090 {
  0% {
    fill: #80ff00;
  }
  20% {
    fill: #d0fa58;
    transform: translate(190px, -70px);
  }
  30% {
    fill: #fa58f4;
    transform: translate(70px, -205px);
  }
  42% {
    fill: #f59c00;
    transform: translate(0, 0);
  }
  100% {
    fill: #f59c00;
  }
}

@keyframes move7091 {
  0% {
    fill: #fe9a2e;
  }
  11% {
    fill: #fe642e;
    transform: translate(50px, -70px);
  }
  22% {
    fill: #df0101;
    transform: translate(70px, -25px);
  }
  33% {
    fill: #e84133;
    transform: translate(0, 0);
  }
  100% {
    fill: #e84133;
  }
}

@keyframes move7092 {
  0% {
    fill: #088a68;
  }
  30% {
    fill: #58d3f7;
    transform: translate(50px, 80px);
  }
  40% {
    fill: #0431b4;
    transform: translate(-50px, 50px);
  }
  50% {
    fill: #eb5e57;
    transform: translate(0, 0);
  }
  100% {
    fill: #eb5e57;
  }
}

@keyframes move7094 {
  0% {
    fill: #cef6d8;
  }
  10% {
    fill: #82fa58;
    transform: translate(50px, 280px);
  }
  40% {
    fill: #e0e0f8;
    transform: translate(20px, 5px);
  }
  45% {
    fill: #e84133;
    transform: translate(0, 0);
  }
  100% {
    fill: #e84133;
  }
}

@keyframes move7096 {
  0% {
    fill: #fe2e2e;
  }
  15% {
    fill: #df7401;
    transform: translate(50px, -100px);
  }
  20% {
    fill: #d358f7;
    transform: translate(-20px, -50px);
  }
  25% {
    fill: #f9b233;
    transform: translate(0, 0);
  }
  100% {
    fill: #f9b233;
  }
}

@keyframes move7098 {
  0% {
    fill: #08298a;
  }
  5% {
    fill: #ff00bf;
    transform: translate(400px, -100px);
  }
  20% {
    fill: #f5a9f2;
    transform: translate(-20px, 80px);
  }
  30% {
    fill: #f18700;
    transform: translate(0, 0);
  }
  100% {
    fill: #f18700;
  }
}

@keyframes move7100 {
  0% {
    fill: #013adf;
  }
  15% {
    fill: #a9e2f3;
    transform: translate(40px, -100px);
  }
  25% {
    fill: #be81f7;
    transform: translate(90px, 80px);
  }
  32% {
    fill: #ffd500;
    transform: translate(0, 0);
  }
  100% {
    fill: #ffd500;
  }
}

@keyframes move7101 {
  0% {
    fill: #0b0b3b;
  }
  5% {
    fill: #0000ff;
    transform: translate(-240px, -100px);
  }
  15% {
    fill: #9ff781;
    transform: translate(80px, 80px);
  }
  22% {
    fill: #fab334;
    transform: translate(0, 0);
  }
  100% {
    fill: #fab334;
  }
}

@keyframes move7102 {
  0% {
    fill: #ff0040;
  }
  15% {
    fill: #f7819f;
    transform: translate(-300px, -100px);
  }
  20% {
    fill: #2efef7;
    transform: translate(80px, 80px);
  }
  40% {
    fill: #dedc00;
    transform: translate(0, 0);
  }
  100% {
    fill: #dedc00;
  }
}

@keyframes move7104 {
  0% {
    fill: #ff0000;
  }
  5% {
    fill: #fa5858;
    transform: translate(-150px, -200px);
  }
  20% {
    fill: #f5da81;
    transform: translate(80px, 180px);
  }
  35% {
    fill: #f9b233;
    transform: translate(0, 0);
  }
  100% {
    fill: #f9b233;
  }
}

@keyframes move7105 {
  0% {
    fill: #088a08;
  }
  12% {
    fill: #fa5858;
    transform: translate(140px, 150px);
  }
  20% {
    fill: #58fa82;
    transform: translate(100px, 380px);
  }
  30% {
    fill: #ffd800;
    transform: translate(0, 0);
  }
  100% {
    fill: #ffd800;
  }
}
@keyframes move7106 {
  0% {
    fill: #58fa58;
  }
  18% {
    fill: #ffff00;
    transform: translate(170px, -100px);
  }
  25% {
    fill: #fa5858;
    transform: translate(100px, 80px);
  }
  35% {
    fill: #00975f;
    transform: translate(0, 0);
  }
  100% {
    fill: #00975f;
  }
}

@keyframes move7107 {
  0% {
    fill: #ceecf5;
  }
  13% {
    fill: #240b3b;
    transform: translate(0px, 180px);
  }
  23% {
    fill: #8a0829;
    transform: translate(100px, 80px);
  }
  28% {
    fill: #65b32e;
    transform: translate(0, 0);
  }
  100% {
    fill: #65b32e;
  }
}

@keyframes move7108 {
  0% {
    fill: #b43104;
  }
  20% {
    fill: #ffff00;
    transform: translate(0px, 80px);
  }
  25% {
    fill: #0a2a1b;
    transform: translate(10px, -35px);
  }
  28% {
    fill: #d3d800;
    transform: translate(0, 0);
  }
  100% {
    fill: #d3d800;
  }
}

@keyframes move7109 {
  0% {
    fill: #3b0b17;
  }
  11% {
    fill: #0a2a22;
    transform: translate(470px, 480px);
  }
  38% {
    fill: #58acfa;
    transform: translate(5px, -50px);
  }
  48% {
    fill: #ffed00;
    transform: translate(0, 0);
  }
  100% {
    fill: #ffed00;
  }
}

@keyframes move7110 {
  0% {
    fill: #ff0000;
  }
  20% {
    fill: #fa58d0;
    transform: translate(500px, 370px);
  }
  26% {
    fill: #00ff00;
    transform: translate(50px, 50px);
  }
  42% {
    fill: #00975f;
    transform: translate(0, 0);
  }
  100% {
    fill: #00975f;
  }
}

@keyframes move7111 {
  0% {
    fill: #fe9a2e;
  }
  5% {
    fill: #0b3b0b;
    transform: translate(-100px, -170px);
  }
  12% {
    fill: #0101df;
    transform: translate(120px, 150px);
  }
  17% {
    fill: #bccf00;
    transform: translate(0, 0);
  }
  100% {
    fill: #bccf00;
  }
}

@keyframes move7112 {
  0% {
    fill: #0a2229;
  }
  10% {
    fill: #181907;
    transform: translate(-260px, 70px);
  }
  22% {
    fill: #ff8000;
    transform: translate(20px, 150px);
  }
  32% {
    fill: #65b32f;
    transform: translate(0, 0);
  }
  100% {
    fill: #65b32f;
  }
}

@keyframes move7114 {
  0% {
    fill: #df3a01;
  }
  17% {
    fill: #00ff80;
    transform: translate(300px, 70px);
  }
  37% {
    fill: #81f781;
    transform: translate(200px, 150px);
  }
  43% {
    fill: #87bd25;
    transform: translate(0, 0);
  }
  100% {
    fill: #87bd25;
  }
}

@keyframes move7116 {
  0% {
    fill: #ff00ff;
  }
  22% {
    fill: #0000ff;
    transform: translate(500px, 7px);
  }
  30% {
    fill: #0b2161;
    transform: translate(20px, 15px);
  }
  33% {
    fill: #00758c;
    transform: translate(0, 0);
  }
  100% {
    fill: #00758c;
  }
}

@keyframes move7124 {
  0% {
    fill: #01df3a;
  }
  4% {
    fill: #8a0829;
    transform: translate(5px, -7px);
  }
  10% {
    fill: #8904b1;
    transform: translate(400px, 150px);
  }
  26% {
    fill: #3363ac;
    transform: translate(0, 0);
  }
  100% {
    fill: #3363ac;
  }
}

@keyframes move7126 {
  0% {
    fill: #01df3a;
  }
  8% {
    fill: #0174df;
    transform: translate(450px, 250px);
  }
  28% {
    fill: #0b3b17;
    transform: translate(-50px, 15px);
  }
  36% {
    fill: #009bac;
    transform: translate(0, 0);
  }
  100% {
    fill: #009bac;
  }
}

@keyframes move7128 {
  0% {
    fill: #9f81f7;
  }
  15% {
    fill: #81f7be;
    transform: translate(150px, -250px);
  }
  22% {
    fill: #ff0040;
    transform: translate(250px, 50px);
  }
  30% {
    fill: #27bdf0;
    transform: translate(0, 0);
  }
  100% {
    fill: #27bdf0;
  }
}

@keyframes move7129 {
  0% {
    fill: #00ffbf;
  }
  12% {
    fill: #ff4000;
    transform: translate(150px, -25px);
  }
  42% {
    fill: #0b3b17;
    transform: translate(50px, -150px);
  }
  50% {
    fill: #00676c;
    transform: translate(0, 0);
  }
  100% {
    fill: #00676c;
  }
}

@keyframes move7130 {
  0% {
    fill: #00ff80;
    transform: translate(-90x, 450px);
  }
  19% {
    fill: #f5a9d0;
    transform: translate(0px, -25px);
  }
  25% {
    fill: #be81f7;
    transform: translate(-50px, -35px);
  }
  30% {
    fill: #005e26;
    transform: translate(0, 0);
  }
  100% {
    fill: #005e26;
  }
}

@keyframes move7132 {
  0% {
    fill: #a9e2f3;
  }
  10% {
    fill: #5fb404;
    transform: translate(-200px, -100px);
  }
  15% {
    fill: #610b38;
    transform: translate(50px, 35px);
  }
  25% {
    fill: #008eab;
    transform: translate(0, 0);
  }
  100% {
    fill: #008eab;
  }
}

@keyframes move7134 {
  0% {
    fill: #ff0000;
  }
  15% {
    fill: #f78181;
    transform: translate(120px, -170px);
  }
  20% {
    fill: #81f7be;
    transform: translate(150px, 35px);
  }
  25% {
    fill: #007c84;
    transform: translate(0, 0);
  }
  100% {
    fill: #007c84;
  }
}

@keyframes move7135 {
  0% {
    fill: #ffff00;
  }
  10% {
    fill: #084b8a;
    transform: translate(100px, 70px);
  }
  25% {
    fill: #31b404;
    transform: translate(0px, -200px);
  }
  40% {
    fill: #00975f;
    transform: translate(0, 0);
  }
  100% {
    fill: #00975f;
  }
}

@keyframes move7136 {
  0% {
    fill: #0404b4;
  }
  5% {
    fill: #2efef7;
    transform: translate(10px, -70px);
  }
  10% {
    fill: #8904b1;
    transform: translate(-40px, 200px);
  }
  20% {
    fill: #008eaa;
    transform: translate(0, 0);
  }
  100% {
    fill: #008eaa;
  }
}

@keyframes move7137 {
  0% {
    fill: #f5a9bc;
  }
  15% {
    fill: #2efe2e;
    transform: translate(300px, 0px);
  }
  23% {
    fill: #b40404;
    transform: translate(-40px, 200px);
  }
  40% {
    fill: #007d83;
    transform: translate(0, 0);
  }
  100% {
    fill: #007d83;
  }
}

@keyframes move7138 {
  0% {
    fill: #08088a;
  }
  17% {
    fill: #088a29;
    transform: translate(-250px, 20px);
  }
  27% {
    fill: #ffff00;
    transform: translate(-40px, -200px);
  }
  37% {
    fill: #005f50;
    transform: translate(0, 0);
  }
  100% {
    fill: #005f50;
  }
}

@keyframes move7140 {
  0% {
    fill: #0b610b;
  }
  12% {
    fill: #04b4ae;
    transform: translate(-20px, 300px);
  }
  27% {
    fill: #04b4ae;
    transform: translate(50px, -20px);
  }
  37% {
    fill: #831f82;
    transform: translate(0, 0);
  }
  100% {
    fill: #831f82;
  }
}

@keyframes move7142 {
  0% {
    fill: #f2f5a9;
  }
  19% {
    fill: #610b21;
    transform: translate(-20px, -60px);
  }
  35% {
    fill: #0080ff;
    transform: translate(350px, 220px);
  }
  40% {
    fill: #201351;
    transform: translate(0, 0);
  }
  100% {
    fill: #201351;
  }
}

@keyframes move7144 {
  0% {
    fill: #0000ff;
  }
  9% {
    fill: #ff00bf;
    transform: translate(210px, 460px);
  }
  12% {
    fill: #ff0040;
    transform: translate(350px, 220px);
  }
  27% {
    fill: #291e6b;
    transform: translate(0, 0);
  }
  100% {
    fill: #291e6b;
  }
}

@keyframes move7146 {
  0% {
    fill: #df013a;
  }
  19% {
    fill: #2efe2e;
    transform: translate(20px, -200px);
  }
  28% {
    fill: #df0101;
    transform: translate(350px, 520px);
  }
  50% {
    fill: #551661;
    transform: translate(0, 0);
  }
  100% {
    fill: #551661;
  }
}

@keyframes move7148 {
  0% {
    fill: #01dfa5;
  }
  5% {
    fill: #220a29;
    transform: translate(200px, -20px);
  }
  10% {
    fill: #0b3b17;
    transform: translate(35px, 52px);
  }
  15% {
    fill: #e60064;
    transform: translate(0, 0);
  }
  100% {
    fill: #e60064;
  }
}

@keyframes move7149 {
  0% {
    fill: #a5df00;
  }
  8% {
    fill: #0b2161;
    transform: translate(-40px, 400px);
  }
  18% {
    fill: #80ff00;
    transform: translate(-35px, 150px);
  }
  25% {
    fill: #8f055f;
    transform: translate(0, 0);
  }
  100% {
    fill: #8f055f;
  }
}

@keyframes move7150 {
  0% {
    fill: #81f79f;
  }
  15% {
    fill: #610b21;
    transform: translate(-40px, 40px);
  }
  21% {
    fill: #088a85;
    transform: translate(-105px, 250px);
  }
  30% {
    fill: #a61d67;
    transform: translate(0, 0);
  }
  100% {
    fill: #a61d67;
  }
}

@keyframes move7152 {
  0% {
    fill: #f781be;
  }
  19% {
    fill: #5f4c0b;
    transform: translate(-40px, 40px);
  }
  31% {
    fill: #2efe2e;
    transform: translate(-40px, -60px);
  }
  46% {
    fill: #e50068;
    transform: translate(0, 0);
  }
  100% {
    fill: #e50068;
  }
}

@keyframes move7154 {
  0% {
    fill: #0a1b2a;
  }
  13% {
    fill: #a9d0f5;
    transform: translate(-20px, 40px);
  }
  27% {
    fill: #01dfa5;
    transform: translate(340px, 260px);
  }
  31% {
    fill: #832082;
    transform: translate(0, 0);
  }
  100% {
    fill: #832082;
  }
}

@keyframes move7156 {
  0% {
    fill: #80ff00;
  }
  10% {
    fill: #ffbf00;
    transform: translate(400px, 0px);
  }
  17% {
    fill: #ff4000;
    transform: translate(340px, 200px);
  }
  22% {
    fill: #832082;
    transform: translate(0, 0);
  }
  100% {
    fill: #832082;
  }
}

@keyframes move7158 {
  0% {
    fill: #40ff00;
  }
  15% {
    fill: #a9f5e1;
    transform: translate(-100px, -20px);
  }
  30% {
    fill: #2a0a12;
    transform: translate(40px, 20px);
  }
  40% {
    fill: #ba024a;
    transform: translate(0, 0);
  }
  100% {
    fill: #ba024a;
  }
}

@keyframes move7160 {
  0% {
    fill: #81f79f;
  }
  18% {
    fill: #2e2efe;
    transform: translate(60px, -20px);
  }
  28% {
    fill: #f7fe2e;
    transform: translate(40px, -90px);
  }
  32% {
    fill: #8e0435;
    transform: translate(0, 0);
  }
  100% {
    fill: #8e0435;
  }
}

@keyframes move7162 {
  0% {
    fill: #f5a9bc;
  }
  10% {
    fill: #38610b;
    transform: translate(-60px, -20px);
  }
  20% {
    fill: #0b243b;
    transform: translate(150px, 190px);
  }
  25% {
    fill: #e6006d;
    transform: translate(0, 0);
  }
  100% {
    fill: #e6006d;
  }
}

@keyframes move7164 {
  0% {
    fill: #0101df;
  }
  5% {
    fill: #00ffff;
    transform: translate(20px, -20px);
  }
  10% {
    fill: #ac58fa;
    transform: translate(-50px, 0px);
  }
  20% {
    fill: #190314;
    transform: translate(0, 0);
  }
  100% {
    fill: #190314;
  }
}

@keyframes move7165 {
  0% {
    fill: #00ff00;
  }
  15% {
    fill: #58acfa;
    transform: translate(200px, -20px);
  }
  30% {
    fill: #faac58;
    transform: translate(-150px, 200px);
  }
  40% {
    fill: #7a1469;
    transform: translate(0, 0);
  }
  100% {
    fill: #7a1469;
  }
}

@keyframes move7168 {
  0% {
    fill: #00ff00;
  }
  5% {
    fill: #e1f5a9;
    transform: translate(-100px, -50px);
  }
  20% {
    fill: #819ff7;
    transform: translate(50px, 50px);
  }
  25% {
    fill: #a71d67;
    transform: translate(0, 0);
  }
  100% {
    fill: #a71d67;
  }
}

@keyframes move7170 {
  0% {
    fill: #0b610b;
  }
  18% {
    fill: #81f79f;
    transform: translate(-100px, 20px);
  }
  25% {
    fill: #2e2efe;
    transform: translate(-150px, -100px);
  }
  35% {
    fill: #e50071;
    transform: translate(0, 0);
  }
  100% {
    fill: #e50071;
  }
}

@keyframes move7172 {
  0% {
    fill: #848484;
  }
  8% {
    fill: #fe2e64;
    transform: translate(-100px, 20px);
  }
  14% {
    fill: #acfa58;
    transform: translate(-10px, 200px);
  }
  18% {
    fill: #831f82;
    transform: translate(0, 0);
  }
  100% {
    fill: #831f82;
  }
}

@keyframes move7174 {
  0% {
    fill: #0b614b;
  }
  18% {
    fill: #e2a9f3;
    transform: translate(-100px, 50px);
  }
  24% {
    fill: #40ff00;
    transform: translate(410px, -100px);
  }
  30% {
    fill: #96105b;
    transform: translate(0, 0);
  }
  100% {
    fill: #96105b;
  }
}

@keyframes move7176 {
  0% {
    fill: #01df74;
  }
  12% {
    fill: #ff0000;
    transform: translate(120px, 10px);
  }
  20% {
    fill: #d8f781;
    transform: translate(-50px, -50px);
  }
  34% {
    fill: #7a1369;
    transform: translate(0, 0);
  }
  100% {
    fill: #7a1369;
  }
}

@keyframes move7178 {
  0% {
    fill: #00ffbf;
  }
  15% {
    fill: #f4fa58;
    transform: translate(20px, 80px);
  }
  20% {
    fill: #0040ff;
    transform: translate(350px, -50px);
  }
  28% {
    fill: #691751;
    transform: translate(0, 0);
  }
  100% {
    fill: #691751;
  }
}

/*@keyframes move7178 {
  0%   {fill: #380B61;}
  18%  {fill: #00FF40;transform: translate(-220px,80px);}
  20%  {fill: #F4FA58;transform: translate(-150px,-50px)}
  35% {fill: #7a1469;transform: translate(0,0);}
 100% {fill: #7a1469;}
}*/

@keyframes move7180 {
  0% {
    fill: #fa5882;
  }
  11% {
    fill: #01a9db;
    transform: translate(-20px, 80px);
  }
  25% {
    fill: #3104b4;
    transform: translate(150px, 500px);
  }
  32% {
    fill: #bf087f;
    transform: translate(0, 0);
  }
  100% {
    fill: #bf087f;
  }
}

@keyframes move7182 {
  0% {
    fill: #ac58fa;
  }
  8% {
    fill: #084b8a;
    transform: translate(150px, 80px);
  }
  25% {
    fill: #bef781;
    transform: translate(400px, 300px);
  }
  42% {
    fill: #e60072;
    transform: translate(0, 0);
  }
  100% {
    fill: #e60072;
  }
}

@keyframes move7184 {
  0% {
    fill: #40ff00;
  }
  5% {
    fill: #a9d0f5;
    transform: translate(50px, 280px);
  }
  15% {
    fill: #3b0b2e;
    transform: translate(-50px, -20px);
  }
  25% {
    fill: #7d2183;
    transform: translate(0, 0);
  }
  100% {
    fill: #7d2183;
  }
}

@keyframes move7188 {
  0% {
    fill: #81f7d8;
  }
  6% {
    fill: #610b5e;
    transform: translate(50px, 30px);
  }
  22% {
    fill: #2efe9a;
    transform: translate(-200px, -50px);
  }
  30% {
    fill: #a61008;
    transform: translate(0, 0);
  }
  100% {
    fill: #a61008;
  }
}

@keyframes move7189 {
  0% {
    fill: #d8d8d8;
  }
  6% {
    fill: #013adf;
    transform: translate(0px, -230px);
  }
  20% {
    fill: #0b3b2e;
    transform: translate(100px, -150px);
  }
  45% {
    fill: #d10a10;
    transform: translate(0, 0);
  }
  100% {
    fill: #d10a10;
  }
}

@keyframes move7190 {
  0% {
    fill: #f5a9f2;
  }
  9% {
    fill: #40ff00;
    transform: translate(-50px, 210px);
  }
  15% {
    fill: #ffff00;
    transform: translate(400px, 230px);
  }
  22% {
    fill: #e50046;
    transform: translate(0, 0);
  }
  100% {
    fill: #e50046;
  }
}

@keyframes move7192 {
  0% {
    fill: #088a08;
  }
  5% {
    fill: #00ffbf;
    transform: translate(250px, 0px);
  }
  17% {
    fill: #ff4000;
    transform: translate(40px, 30px);
  }
  32% {
    fill: #a60b29;
    transform: translate(0, 0);
  }
  100% {
    fill: #a60b29;
  }
}

@keyframes move7193 {
  0% {
    fill: #fe9a2e;
  }
  25% {
    fill: #01df01;
    transform: translate(150px, -90px);
  }
  30% {
    fill: #3b0b2e;
    transform: translate(40px, 90px);
  }
  38% {
    fill: #b70e0b;
    transform: translate(0, 0);
  }
  100% {
    fill: #b70e0b;
  }
}

@keyframes move7194 {
  0% {
    fill: #01dfd7;
  }
  20% {
    fill: #0b610b;
    transform: translate(150px, -190px);
  }
  32% {
    fill: #da81f5;
    transform: translate(40px, -90px);
  }
  37% {
    fill: #0d2e39;
    transform: translate(0, 0);
  }
  100% {
    fill: #0d2e39;
  }
}

@keyframes move7195 {
  0% {
    fill: #01dfd7;
  }
  10% {
    fill: #8258fa;
    transform: translate(-100px, 190px);
  }
  15% {
    fill: #ff0000;
    transform: translate(-150px, -90px);
  }
  20% {
    fill: #a70a2d;
    transform: translate(0, 0);
  }
  100% {
    fill: #a70a2d;
  }
}

@keyframes move7196 {
  0% {
    fill: #5f4c0b;
  }
  7% {
    fill: #6a0888;
    transform: translate(-200px, 0px);
  }
  25% {
    fill: #f2f5a9;
    transform: translate(150px, 190px);
  }
  42% {
    fill: #b90149;
    transform: translate(0, 0);
  }
  100% {
    fill: #b90149;
  }
}

@keyframes move7197 {
  0% {
    fill: #a9bcf5;
  }
  15% {
    fill: #01df01;
    transform: translate(-180px, 40px);
  }
  25% {
    fill: #b404ae;
    transform: translate(40px, -40px);
  }
  35% {
    fill: #7b1c4e;
    transform: translate(0, 0);
  }
  100% {
    fill: #7b1c4e;
  }
}

@keyframes move7198 {
  0% {
    fill: #610b21;
  }
  10% {
    fill: #fa5858;
    transform: translate(-130px, 240px);
  }
  20% {
    fill: #00ff00;
    transform: translate(140px, -140px);
  }
  50% {
    fill: #8d236e;
    transform: translate(0, 0);
  }
  100% {
    fill: #8d236e;
  }
}

@keyframes move7200 {
  0% {
    fill: #f5a9d0;
  }
  9% {
    fill: #00ffff;
    transform: translate(-30px, 40px);
  }
  20% {
    fill: #bdbdbd;
    transform: translate(90px, 110px);
  }
  25% {
    fill: #0d2e3a;
    transform: translate(0, 0);
  }
  100% {
    fill: #0d2e3a;
  }
}

@keyframes move7202 {
  0% {
    fill: #0040ff;
  }
  15% {
    fill: #ff0040;
    transform: translate(100px, 100px);
  }
  25% {
    fill: #bcf5a9;
    transform: translate(130px, -40px);
  }
  35% {
    fill: #351251;
    transform: translate(0, 0);
  }
  100% {
    fill: #351251;
  }
}

@keyframes move7206 {
  0% {
    fill: #00ffff;
  }
  13% {
    fill: #8000ff;
    transform: translate(90px, -300px);
  }
  23% {
    fill: #a9d0f5;
    transform: translate(30px, 40px);
  }
  28% {
    fill: #662e3d;
    transform: translate(0, 0);
  }
  100% {
    fill: #662e3d;
  }
}

@keyframes move7214 {
  0% {
    fill: #585858;
  }
  10% {
    fill: #ffff00;
    transform: translate(-200px, -30px);
  }
  20% {
    fill: #2efec8;
    transform: translate(30px, -140px);
  }
  25% {
    fill: #003952;
    transform: translate(0, 0);
  }
  100% {
    fill: #003952;
  }
}

@keyframes move7215 {
  0% {
    fill: #ffff00;
  }
  16% {
    fill: #fa5882;
    transform: translate(-80px, -90px);
  }
  25% {
    fill: #ced8f6;
    transform: translate(100px, 0px);
  }
  50% {
    fill: #8d1530;
    transform: translate(0, 0);
  }
  100% {
    fill: #8d1530;
  }
}

@keyframes move7216 {
  0% {
    fill: #40ff00;
  }
  8% {
    fill: #2e2efe;
    transform: translate(60px, 30px);
  }
  12% {
    fill: #df3a01;
    transform: translate(100px, -100px);
  }
  20% {
    fill: #5a1c44;
    transform: translate(0, 0);
  }
  100% {
    fill: #5a1c44;
  }
}

@keyframes move7218 {
  0% {
    fill: #00ffff;
  }
  10% {
    fill: #ff0000;
    transform: translate(0px, -150px);
  }
  26% {
    fill: #a9f5a9;
    transform: translate(150px, -100px);
  }
  30% {
    fill: #881069;
    transform: translate(0, 0);
  }
  100% {
    fill: #881069;
  }
}

@keyframes move7219 {
  0% {
    fill: #ff0040;
  }
  20% {
    fill: #2e2efe;
    transform: translate(-250px, -150px);
  }
  25% {
    fill: #848484;
    transform: translate(-150px, -100px);
  }
  35% {
    fill: #003869;
    transform: translate(0, 0);
  }
  100% {
    fill: #003869;
  }
}

@keyframes move7222 {
  0% {
    fill: #2efef7;
  }
  17% {
    fill: #04b404;
    transform: translate(-250px, 170px);
  }
  22% {
    fill: #f5a9bc;
    transform: translate(-50px, -30px);
  }
  30% {
    fill: #004c79;
    transform: translate(0, 0);
  }
  100% {
    fill: #004c79;
  }
}

@keyframes move7224 {
  0% {
    fill: #a9f5f2;
  }
  5% {
    fill: #b40404;
    transform: translate(-150px, -200px);
  }
  25% {
    fill: #ff8000;
    transform: translate(50px, 50px);
  }
  35% {
    fill: #213a8f;
    transform: translate(0, 0);
  }
  100% {
    fill: #213a8f;
  }
}

@keyframes move7225 {
  0% {
    fill: #8258fa;
  }
  13% {
    fill: #819ff7;
    transform: translate(-150px, 90px);
  }
  28% {
    fill: #01df01;
    transform: translate(200px, 50px);
  }
  38% {
    fill: #00628a;
    transform: translate(0, 0);
  }
  100% {
    fill: #00628a;
  }
}

@keyframes move7226 {
  0% {
    fill: #58faf4;
  }
  10% {
    fill: #d7df01;
    transform: translate(90px, 30px);
  }
  35% {
    fill: #04b404;
    transform: translate(100px, -150px);
  }
  45% {
    fill: #005681;
    transform: translate(0, 0);
  }
  100% {
    fill: #005681;
  }
}

@keyframes move7228 {
  0% {
    fill: #fe2ef7;
  }
  8% {
    fill: #5fb404;
    transform: translate(-90px, 40px);
  }
  17% {
    fill: #0a2a29;
    transform: translate(-150px, -90px);
  }
  22% {
    fill: #00628a;
    transform: translate(0, 0);
  }
  100% {
    fill: #00628a;
  }
}

@keyframes move7230 {
  0% {
    fill: #fe2e2e;
  }
  12% {
    fill: #f7fe2e;
    transform: translate(-290px, -240px);
  }
  22% {
    fill: #f6cee3;
    transform: translate(-150px, 10px);
  }
  32% {
    fill: #0082b9;
    transform: translate(0, 0);
  }
  100% {
    fill: #0082b9;
  }
}
@keyframes move7231 {
  0% {
    fill: #ff0040;
  }
  15% {
    fill: #2efe9a;
    transform: translate(-290px, -40px);
  }
  30% {
    fill: #ffff00;
    transform: translate(-70px, 40px);
  }
  40% {
    fill: #00b1eb;
    transform: translate(0, 0);
  }
  100% {
    fill: #00b1eb;
  }
}

@keyframes move7232 {
  0% {
    fill: #ff0000;
  }
  5% {
    fill: #9ff781;
    transform: translate(90px, -90px);
  }
  15% {
    fill: #fa58f4;
    transform: translate(70px, 40px);
  }
  20% {
    fill: #008eaa;
    transform: translate(0, 0);
  }
  100% {
    fill: #008eaa;
  }
}

@keyframes move7233 {
  0% {
    fill: #d0a9f5;
  }
  13% {
    fill: #01df3a;
    transform: translate(-130px, 20px);
  }
  22% {
    fill: #ff4000;
    transform: translate(70px, -40px);
  }
  33% {
    fill: #351251;
    transform: translate(0, 0);
  }
  100% {
    fill: #351251;
  }
}

@keyframes move7234 {
  0% {
    fill: #2a0a22;
  }
  10% {
    fill: #0b610b;
    transform: translate(-300px, -150px);
  }
  25% {
    fill: #d0fa58;
    transform: translate(100px, -150px);
  }
  40% {
    fill: #291f6c;
    transform: translate(0, 0);
  }
  100% {
    fill: #291f6c;
  }
}

@keyframes move7235 {
  0% {
    fill: #4b8a08;
  }
  8% {
    fill: #cef6f5;
    transform: translate(150px, -250px);
  }
  20% {
    fill: #b40404;
    transform: translate(180px, 100px);
  }
  25% {
    fill: #312784;
    transform: translate(0, 0);
  }
  100% {
    fill: #312784;
  }
}

@keyframes move7236 {
  0% {
    fill: #240b3b;
  }
  20% {
    fill: #f3f781;
    transform: translate(-300px, 50px);
  }
  33% {
    fill: #f6cece;
    transform: translate(-180px, -100px);
  }
  38% {
    fill: #00609c;
    transform: translate(0, 0);
  }
  100% {
    fill: #00609c;
  }
}

@keyframes move7237 {
  0% {
    fill: #00ff00;
  }
  9% {
    fill: #ff00ff;
    transform: translate(-20px, -250px);
  }
  25% {
    fill: #ff0040;
    transform: translate(-40px, -60px);
  }
  32% {
    fill: #0082b9;
    transform: translate(0, 0);
  }
  100% {
    fill: #0082b9;
  }
}

@keyframes move7238 {
  0% {
    fill: #ac58fa;
  }
  8% {
    fill: #04b4ae;
    transform: translate(-170px, -150px);
  }
  22% {
    fill: #f3f781;
    transform: translate(30px, -60px);
  }
  45% {
    fill: #00ace9;
    transform: translate(0, 0);
  }
  100% {
    fill: #00ace9;
  }
}

#path7050 {
  animation-name: move7050;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7062 {
  animation-name: move7062;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7064 {
  animation-name: move7064;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7065 {
  animation-name: move7065;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7066 {
  animation-name: move7066;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7067 {
  animation-name: move7067;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7068 {
  animation-name: move7068;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7069 {
  animation-name: move7069;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7070 {
  animation-name: move7070;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7071 {
  animation-name: move7071;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7072 {
  animation-name: move7072;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7076 {
  animation-name: move7076;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7080 {
  animation-name: move7080;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7081 {
  animation-name: move7081;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7086 {
  animation-name: move7086;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7088 {
  animation-name: move7088;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7090 {
  animation-name: move7090;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7091 {
  animation-name: move7091;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7092 {
  animation-name: move7092;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7094 {
  animation-name: move7094;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7096 {
  animation-name: move7096;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7098 {
  animation-name: move7098;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7100 {
  animation-name: move7100;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7101 {
  animation-name: move7101;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7102 {
  animation-name: move7102;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7104 {
  animation-name: move7104;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7105 {
  animation-name: move7105;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7106 {
  animation-name: move7106;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7107 {
  animation-name: move7107;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7108 {
  animation-name: move7108;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7109 {
  animation-name: move7109;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7110 {
  animation-name: move7110;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7111 {
  animation-name: move7111;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7112 {
  animation-name: move7112;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7114 {
  animation-name: move7114;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7116 {
  animation-name: move7116;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7124 {
  animation-name: move7124;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7126 {
  animation-name: move7126;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7128 {
  animation-name: move7128;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7129 {
  animation-name: move7129;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7130 {
  animation-name: move7130;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7132 {
  animation-name: move7132;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7134 {
  animation-name: move7134;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7135 {
  animation-name: move7135;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7136 {
  animation-name: move7136;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7137 {
  animation-name: move7137;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7138 {
  animation-name: move7138;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7140 {
  animation-name: move7140;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7142 {
  animation-name: move7142;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7144 {
  animation-name: move7144;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7146 {
  animation-name: move7146;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7148 {
  animation-name: move7148;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7149 {
  animation-name: move7149;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7150 {
  animation-name: move7150;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7152 {
  animation-name: move7152;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7154 {
  animation-name: move7154;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7156 {
  animation-name: move7156;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7158 {
  animation-name: move7158;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7160 {
  animation-name: move7160;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7162 {
  animation-name: move7162;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7164 {
  animation-name: move7164;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7165 {
  animation-name: move7165;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7168 {
  animation-name: move7168;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7170 {
  animation-name: move7170;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7172 {
  animation-name: move7172;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7174 {
  animation-name: move7174;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7176 {
  animation-name: move7176;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7178 {
  animation-name: move7178;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7180 {
  animation-name: move7180;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7182 {
  animation-name: move7182;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7184 {
  animation-name: move7184;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7188 {
  animation-name: move7188;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7189 {
  animation-name: move7189;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7190 {
  animation-name: move7190;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7192 {
  animation-name: move7192;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7193 {
  animation-name: move7193;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7194 {
  animation-name: move7194;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7195 {
  animation-name: move7195;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7196 {
  animation-name: move7196;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7197 {
  animation-name: move7197;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7198 {
  animation-name: move7198;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7200 {
  animation-name: move7200;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7202 {
  animation-name: move7202;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7206 {
  animation-name: move7206;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7214 {
  animation-name: move7214;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7215 {
  animation-name: move7215;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7216 {
  animation-name: move7216;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7218 {
  animation-name: move7218;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7219 {
  animation-name: move7219;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7222 {
  animation-name: move7222;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7224 {
  animation-name: move7224;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7225 {
  animation-name: move7225;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7226 {
  animation-name: move7226;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7228 {
  animation-name: move7228;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7230 {
  animation-name: move7230;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7231 {
  animation-name: move7231;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7232 {
  animation-name: move7232;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7233 {
  animation-name: move7233;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7234 {
  animation-name: move7234;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7235 {
  animation-name: move7235;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7236 {
  animation-name: move7236;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7237 {
  animation-name: move7237;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

#path7238 {
  animation-name: move7238;
  animation-duration: 6s;
  animation-iteration-count: infinite;
}

.loading {
  font-size: 30px;
  font-family: "nunito", sans-serif;
  font-weight: 800;
  text-align: center;
  color: #ffffff;
}
.loading span {
  display: inline-block;
  margin: 0 -0.05em;
}

.loading02 span {
  animation: loading02 1.2s infinite alternate;
}

.loading02 span:nth-child(2) {
  animation-delay: 0.2s;
}

.loading02 span:nth-child(3) {
  animation-delay: 0.4s;
}

.loading02 span:nth-child(4) {
  animation-delay: 0.6s;
}

.loading02 span:nth-child(5) {
  animation-delay: 0.8s;
}

.loading02 span:nth-child(6) {
  animation-delay: 1s;
}

.loading02 span:nth-child(7) {
  animation-delay: 1.2s;
}

@keyframes loading02 {
  0% {
    filter: blur(0);
    opacity: 1;
  }
  100% {
    filter: blur(5px);
    opacity: 0.2;
  }
}
نوع: loader
تاریخ ایجاد: 2026/06/06
آخرین بروزرسانی: 2026/06/06