index.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Happy Birthday Shivanshu</title>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="stylesheet" href="src/css/index.css" />
  </head>
  <body>
    <div class="first--slide">
      <div class="slide--content">
        <h1>hello</h1>
        <h2>Shivanshu Mathur</h2>
        <span class="top"></span>
        <span class="right"></span>
        <span class="bottom"></span>
        <span class="left"></span>
      </div>

      <div class="slide--content--one">
        <h1 class="first">today</h1>
        <h2 class="first">is</h2>
        <h2 class="second">your</h2>
        <h1 class="second">special day</h1>
        <div class="circle--stuff">
          <svg
            viewBox="0 0 288 48"
            width="288"
            height="48"
            style="overflow: visible;"
          >
            <g transform="translate(144 0)">
              <g transform="translate(-276.566 421.129)">
                <rect
                  width="12.608460234942264"
                  height="12.608460234942264"
                  fill="#F87B7C"
                  transform="rotate(72.60145421789896)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="-147.31692562790084 0"
                  to="-294.6338512558017 480"
                  dur="1.2580507927982927s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.2580507927982927s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(269.756 389.735)">
                <rect
                  width="6.6024317861213895"
                  height="6.6024317861213895"
                  fill="#FFC107"
                  transform="rotate(38.02803143466206)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="148.876375621307 0"
                  to="297.752751242614 480"
                  dur="1.500721309571935s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.500721309571935s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(174.705 169.205)">
                <rect
                  width="5.852897883045647"
                  height="5.852897883045647"
                  fill="#F65A5B"
                  transform="rotate(28.456635184965855)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="129.17077622623987 0"
                  to="258.34155245247973 480"
                  dur="1.0529970168710006s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.0529970168710006s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(-130.903 64.4332)">
                <rect
                  width="10.500608397273465"
                  height="10.500608397273465"
                  fill="#F65A5B"
                  transform="rotate(33.518702042612105)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="-115.41033595665428 0"
                  to="-230.82067191330856 480"
                  dur="1.9569807707276798s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.9569807707276798s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(255.222 435.243)">
                <rect
                  width="5.741483052387249"
                  height="5.741483052387249"
                  fill="#39D1B4"
                  transform="rotate(46.49147792751984)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="133.85114085517338 0"
                  to="267.70228171034677 480"
                  dur="1.3036790452656355s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.3036790452656355s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(31.0162 15.9351)">
                <rect
                  width="6.80101713474188"
                  height="6.80101713474188"
                  fill="#FFC107"
                  transform="rotate(11.204022894474395)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="30.019648010959024 0"
                  to="60.03929602191805 480"
                  dur="1.0387121585702985s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.0387121585702985s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(-3.09286 202.201)">
                <rect
                  width="10.607425290967909"
                  height="10.607425290967909"
                  fill="#F65A5B"
                  transform="rotate(73.47039150769439)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="-2.17615538500645 0"
                  to="-4.3523107700129 480"
                  dur="1.4662807556935682s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.4662807556935682s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(206.722 332.232)">
                <rect
                  width="7.636912663465038"
                  height="7.636912663465038"
                  fill="#F65A5B"
                  transform="rotate(18.036591826355995)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="122.16550975510404 0"
                  to="244.33101951020808 480"
                  dur="1.4353281745859594s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.4353281745859594s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(137.252 313.902)">
                <rect
                  width="9.58640372808878"
                  height="9.58640372808878"
                  fill="#FA9C9D"
                  transform="rotate(84.9299171174362)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="82.98382665184931 0"
                  to="165.96765330369863 480"
                  dur="1.5673910658448071s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.5673910658448071s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(112.875 188.052)">
                <rect
                  width="12.224275888715743"
                  height="12.224275888715743"
                  fill="#F65A5B"
                  transform="rotate(56.958868320425424)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="81.10118787423545 0"
                  to="162.2023757484709 480"
                  dur="1.1256263736515593s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.1256263736515593s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(-44.0883 105.22)">
                <rect
                  width="7.3193707683479285"
                  height="7.3193707683479285"
                  fill="#39D1B4"
                  transform="rotate(29.61901015919562)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="-36.161416073732816 0"
                  to="-72.32283214746563 480"
                  dur="1.0534095913396215s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.0534095913396215s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(201.372 372.671)">
                <rect
                  width="5.544510601155997"
                  height="5.544510601155997"
                  fill="#F65A5B"
                  transform="rotate(2.2963703425883897)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="113.35963017076664 0"
                  to="226.71926034153327 480"
                  dur="1.030518978123618s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.030518978123618s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(131.495 87.179)">
                <rect
                  width="10.759076659212255"
                  height="10.759076659212255"
                  fill="#FFC107"
                  transform="rotate(87.32528953957524)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="111.2837754504788 0"
                  to="222.5675509009576 480"
                  dur="1.6733003196858514s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.6733003196858514s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(168.916 8.31682)">
                <rect
                  width="13.053827089343216"
                  height="13.053827089343216"
                  fill="#FFC107"
                  transform="rotate(41.59319430819056)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="166.0388449718487 0"
                  to="332.0776899436974 480"
                  dur="1.167328833970436s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.167328833970436s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(-246.023 361.539)">
                <rect
                  width="9.438843277640762"
                  height="9.438843277640762"
                  fill="#FA9C9D"
                  transform="rotate(77.07547908665653)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="-140.32757933557534 0"
                  to="-280.6551586711507 480"
                  dur="1.8215214067142032s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.8215214067142032s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(-19.4778 411.261)">
                <rect
                  width="5.155137368313447"
                  height="5.155137368313447"
                  fill="#F65A5B"
                  transform="rotate(63.68358494554056)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="-10.489996883997884 0"
                  to="-20.97999376799577 480"
                  dur="1.938744964010533s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.938744964010533s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(-193.329 253.053)">
                <rect
                  width="12.572461872186224"
                  height="12.572461872186224"
                  fill="#FA9C9D"
                  transform="rotate(18.14043778713332)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="-126.5912529949043 0"
                  to="-253.1825059898086 480"
                  dur="1.7608957790386608s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.7608957790386608s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(132.362 64.3945)">
                <rect
                  width="11.962171698190868"
                  height="11.962171698190868"
                  fill="#F87B7C"
                  transform="rotate(66.5452938923993)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="116.70535383045883 0"
                  to="233.41070766091767 480"
                  dur="1.2748012693059791s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.2748012693059791s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(23.7278 28.7318)">
                <rect
                  width="5.809294053959366"
                  height="5.809294053959366"
                  fill="#39D1B4"
                  transform="rotate(12.777973190620841)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="22.387744172095072 0"
                  to="44.775488344190144 480"
                  dur="1.990394651793788s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.990394651793788s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(-166.194 338.268)">
                <rect
                  width="5.155192084927991"
                  height="5.155192084927991"
                  fill="#F87B7C"
                  transform="rotate(65.13887033072942)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="-97.49050856733884 0"
                  to="-194.98101713467767 480"
                  dur="1.5205048549215163s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.5205048549215163s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(-31.4654 122.618)">
                <rect
                  width="10.368127452931883"
                  height="10.368127452931883"
                  fill="#39D1B4"
                  transform="rotate(44.25401495643392)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="-25.062944124981968 0"
                  to="-50.125888249963936 480"
                  dur="1.7807724976183688s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.7807724976183688s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(-42.2511 41.8627)">
                <rect
                  width="14.103528131335075"
                  height="14.103528131335075"
                  fill="#FFC107"
                  transform="rotate(72.09281246475781)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="-38.861764593079066 0"
                  to="-77.72352918615813 480"
                  dur="1.837076713482284s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.837076713482284s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(-160.068 86.1509)">
                <rect
                  width="10.983279923644469"
                  height="10.983279923644469"
                  fill="#F87B7C"
                  transform="rotate(42.54113201739413)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="-135.71076835776705 0"
                  to="-271.4215367155341 480"
                  dur="1.4617462130029035s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.4617462130029035s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(-29.8295 464.828)">
                <rect
                  width="9.161711928973633"
                  height="9.161711928973633"
                  fill="#FA9C9D"
                  transform="rotate(15.34556142284818)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="-15.154273359641607 0"
                  to="-30.308546719283214 480"
                  dur="1.4337419826765745s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.4337419826765745s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(-178.317 128.014)">
                <rect
                  width="13.686769327961251"
                  height="13.686769327961251"
                  fill="#FFC107"
                  transform="rotate(45.07414220309329)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="-140.77315685616557 0"
                  to="-281.54631371233114 480"
                  dur="1.3309859125988193s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.3309859125988193s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(219.727 410.159)">
                <rect
                  width="12.764074026565211"
                  height="12.764074026565211"
                  fill="#FFC107"
                  transform="rotate(83.87363030859562)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="118.48317389639978 0"
                  to="236.96634779279955 480"
                  dur="1.3039269158524756s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.3039269158524756s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(111.389 357.596)">
                <rect
                  width="8.285457717371177"
                  height="8.285457717371177"
                  fill="#FFC107"
                  transform="rotate(55.18291720980784)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="63.83361358999828 0"
                  to="127.66722717999656 480"
                  dur="1.8032664697360352s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.8032664697360352s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(75.6214 475.193)">
                <rect
                  width="13.200638456623885"
                  height="13.200638456623885"
                  fill="#FFC107"
                  transform="rotate(73.51717550864369)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="38.00101769286111 0"
                  to="76.00203538572222 480"
                  dur="1.9478787303213856s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.9478787303213856s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(274.856 432.139)">
                <rect
                  width="8.968495048926354"
                  height="8.968495048926354"
                  fill="#FFC107"
                  transform="rotate(66.02890800046019)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="144.6387866106216 0"
                  to="289.2775732212432 480"
                  dur="1.1950311173221444s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.1950311173221444s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(-73.9908 129.708)">
                <rect
                  width="11.469532088642811"
                  height="11.469532088642811"
                  fill="#FA9C9D"
                  transform="rotate(23.880882117170138)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="-58.25017828281587 0"
                  to="-116.50035656563173 480"
                  dur="1.7631218650889633s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.7631218650889633s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(195.443 148.666)">
                <rect
                  width="10.462121786336729"
                  height="10.462121786336729"
                  fill="#FFC107"
                  transform="rotate(26.548226340406018)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="149.22492086385515 0"
                  to="298.4498417277103 480"
                  dur="1.0624958491755168s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.0624958491755168s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(-58.6732 432.261)">
                <rect
                  width="14.377316164643027"
                  height="14.377316164643027"
                  fill="#39D1B4"
                  transform="rotate(56.99518347171379)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="-30.871770620846135 0"
                  to="-61.74354124169227 480"
                  dur="1.637228355700252s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.637228355700252s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(-139.405 326.431)">
                <rect
                  width="10.089588480012424"
                  height="10.089588480012424"
                  fill="#FFC107"
                  transform="rotate(53.39693328651522)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="-82.97623670735247 0"
                  to="-165.95247341470494 480"
                  dur="1.6240260735518415s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.6240260735518415s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(-42.9264 14.5082)">
                <rect
                  width="5.605522069860404"
                  height="5.605522069860404"
                  fill="#39D1B4"
                  transform="rotate(86.567326362837)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="-41.66699732647694 0"
                  to="-83.33399465295388 480"
                  dur="1.3729834448841063s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.3729834448841063s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(-83.4398 23.0919)">
                <rect
                  width="13.569223440454884"
                  height="13.569223440454884"
                  fill="#39D1B4"
                  transform="rotate(86.28047320362091)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="-79.60989820810235 0"
                  to="-159.2197964162047 480"
                  dur="1.6981444705695712s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.6981444705695712s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(-127.497 372.59)">
                <rect
                  width="12.966533291639399"
                  height="12.966533291639399"
                  fill="#F65A5B"
                  transform="rotate(83.52931885276857)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="-71.77965589119036 0"
                  to="-143.55931178238072 480"
                  dur="1.8029830839013916s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.8029830839013916s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(-109.582 323.12)">
                <rect
                  width="6.691190217900216"
                  height="6.691190217900216"
                  fill="#FA9C9D"
                  transform="rotate(47.43597820627009)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="-65.49394850207734 0"
                  to="-130.9878970041547 480"
                  dur="1.5469645527476263s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.5469645527476263s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(-158.75 116.733)">
                <rect
                  width="9.96375744984303"
                  height="9.96375744984303"
                  fill="#FFC107"
                  transform="rotate(9.149378353079351)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="-127.69522448692736 0"
                  to="-255.39044897385472 480"
                  dur="1.2743070249499613s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.2743070249499613s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(39.8691 45.2325)">
                <rect
                  width="11.598710036991175"
                  height="11.598710036991175"
                  fill="#FA9C9D"
                  transform="rotate(76.22294910874258)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="36.43558234995789 0"
                  to="72.87116469991578 480"
                  dur="1.8183696696850091s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.8183696696850091s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(-63.98 101.214)">
                <rect
                  width="8.703156709522599"
                  height="8.703156709522599"
                  fill="#F65A5B"
                  transform="rotate(55.22678231532443)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="-52.83832435013566 0"
                  to="-105.67664870027131 480"
                  dur="1.0351788944422509s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.0351788944422509s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(-207.586 325.836)">
                <rect
                  width="12.7674090818734"
                  height="12.7674090818734"
                  fill="#F87B7C"
                  transform="rotate(53.2099971109075)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="-123.6496687354237 0"
                  to="-247.2993374708474 480"
                  dur="1.3801286184806891s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.3801286184806891s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(-14.1761 359.014)">
                <rect
                  width="8.999663539806251"
                  height="8.999663539806251"
                  fill="#F65A5B"
                  transform="rotate(63.059129707808076)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="-8.110149853597672 0"
                  to="-16.220299707195345 480"
                  dur="1.5332334897832933s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.5332334897832933s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(186.115 110.245)">
                <rect
                  width="8.846869993590271"
                  height="8.846869993590271"
                  fill="#39D1B4"
                  transform="rotate(48.39105816056324)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="151.35248674639698 0"
                  to="302.70497349279395 480"
                  dur="1.8171209491047406s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.8171209491047406s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(-44.9409 372.92)">
                <rect
                  width="5.787671588835311"
                  height="5.787671588835311"
                  fill="#39D1B4"
                  transform="rotate(25.736018869681374)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="-25.291483926677277 0"
                  to="-50.58296785335455 480"
                  dur="1.294870187978929s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.294870187978929s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(-123.417 253.899)">
                <rect
                  width="14.005292966639402"
                  height="14.005292966639402"
                  fill="#FA9C9D"
                  transform="rotate(78.53166980312068)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="-80.71953249258353 0"
                  to="-161.43906498516705 480"
                  dur="1.502501770041541s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.502501770041541s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(-230.289 330.106)">
                <rect
                  width="9.768355026891115"
                  height="9.768355026891115"
                  fill="#39D1B4"
                  transform="rotate(6.20830045074041)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="-136.4494736963528 0"
                  to="-272.8989473927056 480"
                  dur="1.9617639114021732s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.9617639114021732s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(265.433 381.927)">
                <rect
                  width="8.740484652817603"
                  height="8.740484652817603"
                  fill="#FA9C9D"
                  transform="rotate(33.112914915491366)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="147.81721881818615 0"
                  to="295.6344376363723 480"
                  dur="1.4463132494751758s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.4463132494751758s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(39.8835 208.371)">
                <rect
                  width="8.478693141673741"
                  height="8.478693141673741"
                  fill="#F65A5B"
                  transform="rotate(70.4322873768517)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="27.810725423849558 0"
                  to="55.621450847699116 480"
                  dur="1.0435485904484305s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.0435485904484305s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(-196.946 256.686)">
                <rect
                  width="14.772557082522477"
                  height="14.772557082522477"
                  fill="#FFC107"
                  transform="rotate(12.70748308933365)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="-128.3237418055129 0"
                  to="-256.6474836110258 480"
                  dur="1.7522213600748298s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.7522213600748298s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(150.191 478.423)">
                <rect
                  width="10.628106842047844"
                  height="10.628106842047844"
                  fill="#FA9C9D"
                  transform="rotate(17.776604987264612)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="75.21931197943222 0"
                  to="150.43862395886444 480"
                  dur="1.59286850157008s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.59286850157008s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(-176.485 147.986)">
                <rect
                  width="12.61672667417864"
                  height="12.61672667417864"
                  fill="#F87B7C"
                  transform="rotate(64.26109092904363)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="-134.89599168313967 0"
                  to="-269.79198336627934 480"
                  dur="1.2136136152047012s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.2136136152047012s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(2.63655 133.571)">
                <rect
                  width="12.0983843373292"
                  height="12.0983843373292"
                  fill="#FA9C9D"
                  transform="rotate(77.1811483234397)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="2.0625914867788224 0"
                  to="4.125182973557645 480"
                  dur="1.5838470702401857s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.5838470702401857s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(-153.787 280.623)">
                <rect
                  width="12.877019817907263"
                  height="12.877019817907263"
                  fill="#39D1B4"
                  transform="rotate(23.860842745005897)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="-97.04875569413277 0"
                  to="-194.09751138826553 480"
                  dur="1.6101299293674471s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.6101299293674471s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(81.0715 431.883)">
                <rect
                  width="9.117118916187268"
                  height="9.117118916187268"
                  fill="#FA9C9D"
                  transform="rotate(35.95068552997413)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="42.674704554766656 0"
                  to="85.34940910953331 480"
                  dur="1.4115420356298163s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.4115420356298163s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(-139.629 392.8)">
                <rect
                  width="7.313004295500736"
                  height="7.313004295500736"
                  fill="#FA9C9D"
                  transform="rotate(58.02215575282054)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="-76.78938850387553 0"
                  to="-153.57877700775106 480"
                  dur="1.0129214483440876s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.0129214483440876s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(-273.198 299.716)">
                <rect
                  width="12.585063692234112"
                  height="12.585063692234112"
                  fill="#FFC107"
                  transform="rotate(23.141937462371192)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="-168.1829769087535 0"
                  to="-336.365953817507 480"
                  dur="1.0221483989192268s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.0221483989192268s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(35.4281 298.09)">
                <rect
                  width="6.923794981974305"
                  height="6.923794981974305"
                  fill="#F65A5B"
                  transform="rotate(3.7746840564447925)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="21.85541553457417 0"
                  to="43.71083106914834 480"
                  dur="1.841477233909523s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.841477233909523s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(-33.0682 476.788)">
                <rect
                  width="7.5732528577320535"
                  height="7.5732528577320535"
                  fill="#39D1B4"
                  transform="rotate(77.7718996598293)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="-16.58958353532071 0"
                  to="-33.17916707064142 480"
                  dur="1.3473653905171072s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.3473653905171072s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(-283.314 326.701)">
                <rect
                  width="12.2603815691265"
                  height="12.2603815691265"
                  fill="#F87B7C"
                  transform="rotate(40.61186413835374)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="-168.57637773029137 0"
                  to="-337.15275546058274 480"
                  dur="1.0104588510243326s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.0104588510243326s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(-184.995 236.299)">
                <rect
                  width="14.208468465595544"
                  height="14.208468465595544"
                  fill="#F65A5B"
                  transform="rotate(3.823136008517254)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="-123.9672518900931 0"
                  to="-247.9345037801862 480"
                  dur="1.008151763575754s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.008151763575754s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(-16.0432 153.69)">
                <rect
                  width="14.13951789919437"
                  height="14.13951789919437"
                  fill="#FA9C9D"
                  transform="rotate(42.619301927043715)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="-12.152238276917666 0"
                  to="-24.304476553835332 480"
                  dur="1.976559708932348s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.976559708932348s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(-177.155 156.185)">
                <rect
                  width="5.133505938536141"
                  height="5.133505938536141"
                  fill="#FA9C9D"
                  transform="rotate(21.39834732398235)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="-133.6627946033307 0"
                  to="-267.3255892066614 480"
                  dur="1.7626435353614347s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.7626435353614347s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(-298.208 442.713)">
                <rect
                  width="10.836267006261"
                  height="10.836267006261"
                  fill="#F87B7C"
                  transform="rotate(72.30364731432881)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="-155.129444591013 0"
                  to="-310.258889182026 480"
                  dur="1.897024023744813s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.897024023744813s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(84.2279 92.2677)">
                <rect
                  width="7.121515445378002"
                  height="7.121515445378002"
                  fill="#F65A5B"
                  transform="rotate(6.357404543570042)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="70.64765751330808 0"
                  to="141.29531502661615 480"
                  dur="1.8647485817543341s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.8647485817543341s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(190.66 379.05)">
                <rect
                  width="6.809910365652707"
                  height="6.809910365652707"
                  fill="#FA9C9D"
                  transform="rotate(81.16530403759086)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="106.5323927443129 0"
                  to="213.0647854886258 480"
                  dur="1.8784567579243676s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.8784567579243676s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(-242.452 323.151)">
                <rect
                  width="14.074355906122618"
                  height="14.074355906122618"
                  fill="#F65A5B"
                  transform="rotate(48.409224917371716)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="-144.9007558049375 0"
                  to="-289.801511609875 480"
                  dur="1.237222291333915s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.237222291333915s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(-133.488 171.588)">
                <rect
                  width="9.246056340066431"
                  height="9.246056340066431"
                  fill="#FFC107"
                  transform="rotate(43.8327821758391)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="-98.33540134965875 0"
                  to="-196.6708026993175 480"
                  dur="1.7118575625304209s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.7118575625304209s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(-212.338 477.609)">
                <rect
                  width="10.206275708067604"
                  height="10.206275708067604"
                  fill="#F87B7C"
                  transform="rotate(3.5180713953336706)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="-106.43416329622404 0"
                  to="-212.86832659244808 480"
                  dur="1.0388271083528573s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.0388271083528573s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(242.416 313.93)">
                <rect
                  width="6.474600901177441"
                  height="6.474600901177441"
                  fill="#FA9C9D"
                  transform="rotate(17.332006714008447)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="146.5614830699091 0"
                  to="293.1229661398182 480"
                  dur="1.1725354605029232s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.1725354605029232s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(192.019 277.818)">
                <rect
                  width="9.48876350160013"
                  height="9.48876350160013"
                  fill="#F87B7C"
                  transform="rotate(80.4424860466377)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="121.62468336575408 0"
                  to="243.24936673150816 480"
                  dur="1.7604495247076903s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.7604495247076903s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(279.76 449.142)">
                <rect
                  width="12.739962236214819"
                  height="12.739962236214819"
                  fill="#39D1B4"
                  transform="rotate(41.421608567353125)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="144.5253960453657 0"
                  to="289.0507920907314 480"
                  dur="1.9807597601629032s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.9807597601629032s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(-108.772 462.209)">
                <rect
                  width="5.912076935930544"
                  height="5.912076935930544"
                  fill="#F65A5B"
                  transform="rotate(49.583326900563826)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="-55.41304570703835 0"
                  to="-110.8260914140767 480"
                  dur="1.487324922186101s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.487324922186101s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(-191.159 422.45)">
                <rect
                  width="14.584811421858316"
                  height="14.584811421858316"
                  fill="#F65A5B"
                  transform="rotate(27.837753606260925)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="-101.67483313139012 0"
                  to="-203.34966626278023 480"
                  dur="1.285104860483476s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.285104860483476s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(-187.329 333.699)">
                <rect
                  width="11.468429979820034"
                  height="11.468429979820034"
                  fill="#FFC107"
                  transform="rotate(36.27812415313309)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="-110.50521774347041 0"
                  to="-221.01043548694082 480"
                  dur="1.6387655937208296s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.6387655937208296s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <g transform="translate(-19.3892 203.962)">
                <rect
                  width="9.690275881619304"
                  height="9.690275881619304"
                  fill="#F65A5B"
                  transform="rotate(36.271222002843615)"
                ></rect>
                <animateTransform
                  attributeName="transform"
                  type="translate"
                  from="-13.607219250650084 0"
                  to="-27.21443850130017 480"
                  dur="1.3155557725809395s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animateTransform>
                <animate
                  attributeType="CSS"
                  attributeName="opacity"
                  values="1;0"
                  dur="1.3155557725809395s"
                  begin="-10s"
                  repeatCount="indefinite"
                ></animate>
              </g>
              <animate
                attributeType="CSS"
                attributeName="opacity"
                values="0;1"
                dur="1s"
                repeatCount="1"
                begin="DOMNodeInserted"
              ></animate>
            </g>
            <g opacity="0" style="transition: opacity 0.5s ease-out;">
              <path
                fill="#FFC107"
                d="M126.099 11.24l5 8.661 8.66-5-5-8.66z"
              ></path>
              <path
                fill="#F65A5B"
                d="M264.76 21.24l-8.661 5 5 8.661 8.66-5zM204.929 47.071v-10h-10v10z"
              ></path>
              <path
                fill="#FFC107"
                d="M58.807 21.193l-6.928 4 4 6.928 6.928-4z"
              ></path>
              <path fill="#F65A5B" d="M282.171 18.828v4h4v-4z"></path>
              <path
                fill="#F87B7C"
                d="M261.586 7l-1.414 1.414 1.414 1.414L263 8.414zM212.586 24l-1.414 1.414 1.414 1.414L214 25.414z"
              ></path>
              <path
                fill="#F65A5B"
                d="M154.586 9l-1.414 1.414 1.414 1.414L156 10.414z"
              ></path>
              <path
                fill="#F65A5B"
                d="M187.586 1l-1.414 1.414 1.414 1.414L189 2.414zM113.586 4l-1.414 1.414 1.414 1.414L115 5.414z"
              ></path>
              <path
                fill="#FFC107"
                d="M69.586 9l-1.414 1.414 1.414 1.414L71 10.414z"
              ></path>
              <path
                fill="#FFC107"
                d="M1.586 24L.172 25.414l1.414 1.414L3 25.414z"
              ></path>
              <path
                fill="#FFC107"
                d="M131.586 31l-1.414 1.414 1.414 1.414L133 32.414zM18.76.24l-8.661 5 5 8.661 8.66-5zM171.343 14l-5.657 5.657 5.657 5.657L177 19.657z"
              ></path>
              <path
                fill="#39D1B4"
                d="M206.807 5.193l-6.928 4 4 6.928 6.928-4zM98.343 36.414l-4.242 4.243 4.242 4.243 4.243-4.243z"
              ></path>
              <path
                fill="#FFC107"
                d="M93.44 11.096l-2 3.464 3.463 2 2-3.464zM49.172 4l-2.829 2.828 2.829 2.828L52 6.828zM27.172 39l-2.829 2.828 2.829 2.828L30 41.828z"
              ></path>
              <path
                fill="#F65A5B"
                d="M227.343 3.829l-2.828 2.828 2.828 2.828 2.829-2.828z"
              ></path>
            </g>
          </svg>
        </div>
      </div>
    </div>

    <div class="second--canvas">
      <div class="content">
        <h2>let's</h2>
        <h2>celebrate</h2>
      </div>
      <div class="canvas--remove"></div>
    </div>

    <div class="third--canvas">
      <div class="star--bg">
        <img src="src/images/amusement-park.png" alt="" id="b1" />
        <img src="src/images/amusement-park.png" alt="" id="b2" />
      </div>
      <div class="center--line">
        <img src="src/images/balloons.png" id="bl--right" alt="" />
        <img src="src/images/balloons.png" id="bl--left" alt="" />
        <h1>
          <span>h</span><span>a</span><span>p</span><span>p</span
          ><span>y</span> <span>b</span><span>i</span><span>r</span
          ><span>t</span><span>h</span><span>d</span><span>a</span
          ><span>y</span>
        </h1>
      </div>
      <img src="src/images/gift.png" alt="" id="gf1" />
      <img src="src/images/gift.png" alt="" id="gf2" />
      <img src="src/images/gift.png" alt="" id="gf3" />
    </div>

    <script src="src/js/index.js"></script>
  </body>
</html>