cssAudio - Activefile-genericCSS - ActiveGeneric - ActiveHTML - ActiveImage - ActiveJS - ActiveSVG - ActiveText - Activefile-genericVideo - Activehtmlicon-personicon-teamoctocatpop-outspinnerstartv

Pen Settings

CSS Base

Vendor Prefixing

Add External CSS

These stylesheets will be added in this order and before the code you write in the CSS editor. You can also add another Pen here, and it will pull the CSS from it. Try typing "font" or "ribbon" below.

Quick-add: + add another resource

Add External JavaScript

These scripts will run in this order and before the code in the JavaScript editor. You can also link to another Pen here, and it will run the JavaScript from it. Also try typing the name of any popular library.

Quick-add: + add another resource

Code Indentation

     

Save Automatically?

If active, Pens will autosave every 30 seconds after being saved once.

Auto-Updating Preview

If enabled, the preview panel updates automatically as you code. If disabled, use the "Run" button to update.

            
              <div class="block">
  <svg class="main" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="50 0 1170 950">
    <g id="mountains">
      <path class="st0" d="M-24 0.8H1263.1V405.8H-24z" />
      <path class="st1" d="M342 249.8L417 234.8 531.1 291.8 576.1 228.8 675.1 279.8 693.1 255.8 768.1 267.8 957.1 372.8 1083.1 426.8 15 417.8z" />
      <path class="st2" d="M139.2 273.8L315 237.8 399 258.8 462 243.8 540.1 261.8 606.1 249.8 657.1 288.8 693.1 303.8 750.1 372.8 780.1 411.8 102 423.8z" />
      <path class="st1" d="M177 279.8L327 252.8 369 282.8 417 234.8 507.1 285.8 567.1 258.8 657.1 288.8 732.1 408.8 180 417.8z" />
      <path class="st3" d="M1245.1 264.8L1131.1 207.8 1098.1 174.8 1062.1 183.8 1004.2 201 986.7 180.5 935.7 188.3 888.9 230 828.9 283.7 764.2 277.7 645 300.8 696.1 411.8 1251.1 414.8z" />
      <path class="st4" d="M1242.1 327.8L1119.1 285.8 1020.1 333.8 927.1 282.8 822.1 261.8 780.1 327.8 717.3 349.9 669.1 366.8 606.1 339.8 600.1 408.8 1251.1 414.8z" />
      <path class="st5" d="M621.1 315.8L513.1 369.8 432 357.8 417 381.8 375 345.8 318 330.8 303 366.8 267 378.8 258 426.8 678.1 408.8z" />
      <path class="st6" d="M-8.9 237.9L81.1 300.9 123 273.8 180 342.8 225 324.8 270 366.8 315 358.4 369 422 42.2 422 -15 424.3z" />
      <path class="st7" d="M77.2 307L120.5 267 145.2 307z" />
      <path class="st8" d="M922.2 251L912.2 299 970.2 271z" />
      <path class="st9" d="M224.2 357L190.2 419 294.2 421z" />
      <path class="st8" d="M900.2 335L850.2 411 944.2 413zM584.2 411L674.2 385 722.2 411z" />
      <path class="st10" d="M184.2 239L178.2 305 222.2 279zM982.2 317L972.2 357 1020.1 333.8zM630.2 341L616.2 399 664.2 387zM306.2 335L272.2 423 338.2 421zM688.2 339L684.2 395 722.2 411zM60.2 341L26.2 421 102 423.8z" />
      <path class="st1" d="M864.2 247L838.2 281 884.2 281zM222.2 269L188.2 311 260.2 307zM658.2 345L648.2 391 664.2 387zM372.2 379L369 421 446.2 419zM1098.2 275L1068.2 305 1102.2 289zM212.2 221L228.2 253 280.2 243z" />
      <path class="st11" d="M564.2 267L702.2 329 698.2 291z" />
      <path class="st12" d="M252.2 309L294 345.8 308.2 327z" />
      <path class="st11" d="M538.2 401L598.2 379 584.2 411z" />
      <path class="st13" d="M996.1 201.8L1086.2 207 1098.1 174.8z" />
      <path class="st7" d="M1020.1 333.8L1119.1 285.8 1062.2 361zM792.2 399L876.2 369 860.2 401z" />
      <path class="st1" d="M780.3 312.1L826 363.7 852.4 280 780.3 312.1 780.3 312.1 780.3 312.1 780.3 312.1" />
      <path class="st8" d="M1097.3 284.3L1106.8 397.4 1150.6 324.1 1097.3 284.3 1097.3 284.3" />
      <path class="st1" d="M832.2 281.9L982.3 182.4 952.3 233.5 852.4 280 832.2 281.9" />
    </g>
    <g id="sea">
      <linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="619.245" y1="405" x2="619.245" y2="799">
        <stop offset="0" stop-color="#B9E3CA" />
        <stop offset="1" stop-color="#B16D67" />
      </linearGradient>
      <path class="st14" d="M-11.8 415L-15.8 797 1254.2 799 1250.2 405z" />
      <linearGradient id="SVGID_2_" gradientUnits="userSpaceOnUse" x1="200.414" y1="601.697" x2="86.461" y2="799.07">
        <stop offset="0" stop-color="#C69C6D" />
        <stop offset=".405" stop-color="#A83759" stop-opacity=".9" />
        <stop offset="1" stop-color="#A83759" stop-opacity="0" />
      </linearGradient>
      <path class="st16" d="M-11.8 415L-13.8 573 96.2 515 80.2 537 184.2 523 126.2 511 244.2 519 198.2 539 284.2 541 268.2 561 452.2 557 408.2 575 504.2 563 452.2 533 532.2 535 520.2 549 574.2 557 546.2 567 604.2 567 588.2 539 734.2 539 692.2 521 768.2 505 732.2 493 908.2 509 830.2 515 904.2 537 868.2 551 940.2 575 906.2 599 974.2 613 942.2 627 1076.2 629 1139.2 603 1076.2 581 1182.2 563 1104.2 537 1252.2 517 1246.2 415z"
      />
      <path class="st17" d="M144.2 421L1218.2 415 1046.2 463z" />
      <path class="st18" d="M78.2 441L34.2 455 224.2 461 214.2 495 344.2 489 300.2 513 470.2 515 478.2 531 708.2 517 684.2 491 916.2 477 1092.2 437z" />
      <path class="st19" d="M-11.8 415L878.2 449 694.2 467 58.3 428.3 -15 423.8z" />
    </g>
    <g id="sides">
      <linearGradient id="SVGID_3_" gradientUnits="userSpaceOnUse" x1="144.36" y1="497" x2="144.36" y2="797.571">
        <stop offset="0" stop-color="#C69C6D" />
        <stop offset="1" stop-color="#A83759" />
      </linearGradient>
      <path class="st15" d="M0.2,539c0,0,204,23.8,152,56.4c-52,32.5-15.9,45.5,12.1,54.2c28,8.7,6,67.2,30,73.7 c24,6.5-21.3,30.3,58,32.5c76,2.2,116.7,38,48.1,41.2c-68.6,3.2-300.1-47.7-300.1-47.7S-33.8,539,0.2,539z" />
      <path class="st20" d="M-5.8,497c0,0,218,298,310.6,299.1l-321,1.5L-5.8,497z" />
      <linearGradient id="SVGID_4_" gradientUnits="userSpaceOnUse" x1="1126.225" y1="531" x2="1126.225" y2="809" gradientTransform="matrix(-1 0 0 1 2149.826 0)">
        <stop offset="0" stop-color="#C69C6D" />
        <stop offset="1" stop-color="#A83759" />
      </linearGradient>
      <path class="st21" d="M1258.2,531c0,0-256,234-476,278l482.7-0.4L1258.2,531z" />
      <path id="outlinemountain" class="st22" d="M564.9,334.4l171.4-12.9l88.2,43.3l80.5,39.6c0,0,0,0,0.1,0c0,0,0,0,0.1,0c0,0,0,0,0,0 c0,0,0.3,0,0.3,0c0.1,0,0.5,0,0.5,0v0c0,0-0.6,0-0.6,0l198.6-3.3c0,0,0,0,0,0c0.1,0,0.1,0,0.2,0c0,0,0,0,0.1,0c0,0,0,0,0,0 c0,0,0,0,0.1,0c0,0,0.1,0,0.1,0c0,0,0,0,0,0l44.1-29.4l118.5-19.8V350l-81.4-29.2l-61.5-45.3c0,0,0,0-0.1,0c0,0-0.1,0-0.1-0.1 c0,0,0,0-0.1,0c0,0-0.1,0-0.1,0c0,0,0,0-0.1,0l-61.3-7.7l-75.8-87c0,0,0,0,0,0l0,0c0,0,0,0,0,0c0,0-0.1-0.1-0.1-0.1c0,0,0,0,0,0 c0,0,0,0-0.1,0c0,0-0.1,0-0.1-0.1c0,0-0.1,0-0.1,0c0,0,0,0,0,0c0,0,0,0,0,0c0,0-0.1,0-0.1,0c0,0,0,0-0.1,0l-50.7,6.5 c-0.2,0-0.3,0.1-0.5,0.2l-102.5,92.7l-3,1.9c-0.2,0.1-0.3,0.2-0.3,0.4l-62.5-5c-0.1,0-0.2,0-0.3,0l-70.3,17.5l-51,4.7c0,0,0,0,0,0 c0,0,0-0.1-0.1-0.1c0,0-0.1-0.1-0.1-0.1c0,0,0,0,0,0l-79.3,26c-0.4,0.1-0.6,0.5-0.6,0.9v6.8v1.8 C564.8,334.4,564.8,334.4,564.9,334.4C564.8,334.4,564.9,334.4,564.9,334.4z M657.1,301.8l117.7,9.7l-38.3,8.3L657.1,301.8z M739,321l26.3-5.7l15-3.2l41.3,49.4L739,321z M817.9,354.4l-35.8-42.9l69.1-29.1l-26.6,79.9L817.9,354.4z M826,363.7l26.8-80.3 l51,118.5L826,363.7z M911.4,326.8l42-91.7l53.8,7.4L911.4,326.8z M1009.3,243.1l47.2,38.6l3.8,3.1l-49.2,14.4l-98.6,29 L1009.3,243.1z M908.6,328.7l-54-47.2l-0.5-0.4l97-45.1L908.6,328.7z M904.7,399.8l-30.3-70.4l-19.5-45.4l53.1,46.5l-1.5,31.1 L904.7,399.8z M909.8,330.9l182.4-43.6l-58.4,36.1l-127.4,78.7L909.8,330.9z M908.5,402.8l187.9-116l0.2,3.3l6.4,109.5L908.5,402.8 z M1098.3,287l50.7,38.2l-36.9,60.4l-7.3,11.9L1098.3,287z M1148.2,370c-0.1,0-0.2,0.1-0.3,0.1l-41,27.3l43.7-71.5l112.1,24.8 L1148.2,370z M1254,347.1l-98.4-21.8l22.3-2.2l7.3-0.7L1254,347.1z M1182.9,320.9l-32.4,3.2l-4.2-7.8l-20.1-37.1L1182.9,320.9z M1147.4,321.9l-48.3-36.4l6.6-2.3l17.6-6L1147.4,321.9z M1119.9,276.5l-16.2,5.6l-6.3,2.2l-21.9-10.5l-8.2-3.9L1119.9,276.5z M1063,269.7l30.4,14.6H1063V269.7z M1089.9,285.9l-148.3,35.4l120.6-35.4H1089.9z M1061.4,283.4l-45.4-37.1l45.4,22.7V283.4z M1058.5,265.6l-48.6-24.2l-15.1-39.6l-6.3-16.4L1058.5,265.6z M1007.9,240.9l-46.3-6.4l-7.3-1l31.4-50.5L1007.9,240.9z M935.7,188.3l46.6-5.9l-140.9,91.2L935.7,188.3z M833.3,280.9l149.9-97l-30.9,49.6L852.4,280l-20.1,1.8L833.3,280.9z M766.4,278.6 l54.2,4.4l-113.5,10.4L766.4,278.6z M696,296.5C696,296.5,696,296.5,696,296.5l134.7-12.2c0,0,0,0,0,0l16.3-1.8l-66.6,27.9 l-125.7-10.3L696,296.5z M645,300.8l6.4,1.5l79.2,18l-160.4,12.1L645,300.8z M566.4,326.5l58.5-19.2l-58.5,24.6V326.5z"
      />
    </g>
    <g id="low-things">
      <g id="balloon_1_">
        <circle id="balloon" class="st23" cx="1040.7" cy="233.5" r="45" />
        <path id="b-balloon" class="st23" d="M1037.2,276.5l-7.5,18c0,0,7.5,7.5,15,4.5C1052.2,296,1037.2,276.5,1037.2,276.5z" />
        <path id="balloonstring" class="st24" d="M1037.7 294.5L1036.2 750.5" />
      </g>
      <g id="leftgrass">
        <path class="st25" d="M21.9,615.1c-1.1,2.8-2.1,5.7-3,8.6c-0.9,2.9-1.8,5.8-2.6,8.7c-1.6,5.8-2.9,11.7-4,17.6 c-2.2,11.8-3.6,23.7-4,35.6h4.3c-0.3-11.8,0.4-23.6,1.9-35.4c0.8-5.9,1.7-11.8,2.9-17.6c0.6-2.9,1.3-5.8,2-8.7 C20.1,620.8,20.9,617.9,21.9,615.1z" />
        <path class="st25" d="M17.7 581.3c1.7 7.2 3.1 14.4 4.4 21.7 1.2 7.3 2.2 14.6 3 22 .8 7.4 1.3 14.8 1.6 22.2.2 7.4.2 14.9-.4 22.3H22c.9-7.2 1.3-15 1.4-22.3.1-7.3-.1-14.7-.5-22-.4-7.3-1.1-14.7-1.9-22C20.1 595.8 19.1 588.5 17.7 581.3zM25.7 628.5c1.3 2.8 2.3 5.7 3.3 8.7 1 2.9 1.9 5.9 2.7 8.9 1.6 6 2.9 12.1 4 18.2 2.1 12.3 3 24.7 3 37.2h-4.3c.7-12.2.5-24.7-.8-36.9-.7-6.1-1.6-12.2-2.9-18.2-.6-3-1.3-6-2.2-9C27.7 634.3 26.8 631.4 25.7 628.5z"
        />
        <path class="st25" d="M38,610.9c-0.1,6.2-0.2,12.4-0.1,18.6c0,6.2,0.2,12.4,0.4,18.6c0.2,6.2,0.5,12.4,1,18.5 c0.5,6.2,1.1,12.8,2,18.9H37c-0.6-6.3-0.8-12.5-0.9-18.7c-0.1-6.2-0.1-12.5,0.1-18.7c0.1-6.2,0.4-12.4,0.7-18.6 C37.1,623.2,37.5,617,38,610.9z" />
        <path class="st25" d="M37.5 609.3c1.9 6.2 3.6 12.5 5 18.8 1.5 6.3 2.8 12.6 3.8 19 1.1 6.4 1.9 12.8 2.5 19.2.5 6.4.8 12.9.5 19.2h4.3c-.1-6.6-.7-13.1-1.6-19.6-.9-6.5-2.1-12.9-3.6-19.2-1.4-6.3-3.1-12.6-4.9-18.9C41.8 621.6 39.8 615.4 37.5 609.3zM60.9 596.5c1.3 2.8 2.3 5.7 3.3 8.7 1 2.9 1.9 5.9 2.7 8.9 1.6 6 2.9 12.1 4 18.2 2.1 12.3 3 24.7 3 37.2h-4.3c.7-12.2.5-24.7-.8-36.9-.7-6.1-1.6-12.2-2.9-18.2-.6-3-1.3-6-2.2-9C62.9 602.3 62 599.4 60.9 596.5zM96.9 601c1.4 6.9 2.5 13.9 3.4 20.9.9 7 1.7 14 2.3 21.1 1.2 14.1 1.7 28.3 1.4 42.5h-4.3c1-14 1.2-28.3.7-42.4-.2-7-.6-14.1-1.2-21.1C98.7 615 98 607.9 96.9 601z"
        />
      </g>
      <g id="budbk" class="st26">
        <path class="st25" d="M37.4,668.5c0,0-59-57.6-29.5-47.8s15.5-18.3,25.3-9.8S74,615,62.7,630.5C51.5,646,88,636.1,79.6,648.8 S37.4,668.5,37.4,668.5z" />
        <path class="st27" d="M36.6,668.5c0,0-51.6-50.4-25.8-41.8s13.5-16,22.1-8.6s35.6,3.7,25.8,17.2c-9.8,13.5,22.1,4.9,14.7,16 S36.6,668.5,36.6,668.5z" />
        <path class="st19" d="M37,667.7c0,0-42.3-41.3-21.2-34.3c21.2,7.1,11.1-13.1,18.1-7.1c7.1,6,29.2,3,21.2,14.1 c-8.1,11.1,18.1,4,12.1,13.1S37,667.7,37,667.7z" />
        <path class="st17" d="M37.6,666.3c0,0-30.8-30-15.4-24.9c15.4,5.1,8.1-9.5,13.2-5.1s21.3,2.2,15.4,10.3c-5.9,8.1,13.2,2.9,8.8,9.5 C55.1,662.6,37.6,666.3,37.6,666.3z" />
      </g>
      <linearGradient id="SVGID_5_" gradientUnits="userSpaceOnUse" x1="37.245" y1="619.202" x2="37.245" y2="742.379">
        <stop offset="0" stop-color="#C69C6D" />
        <stop offset=".405" stop-color="#A83759" stop-opacity=".9" />
        <stop offset="1" stop-color="#A83759" stop-opacity="0" />
      </linearGradient>
      <path class="st28" d="M-23,685.7c0,0,26.9-82.2,38.3-63.8s8.5,46.8,21.3,38.3c12.8-8.5,21.3,24.1,21.3,24.1s15.6-8.5,26.9,4.3 s25.5,24.1,25.5,24.1l-19.4,29.8l-117.7-20.1l-9-6.9L-23,685.7z" />
      <linearGradient id="SVGID_6_" gradientUnits="userSpaceOnUse" x1="130.245" y1="630.202" x2="130.245" y2="804">
        <stop offset="0" stop-color="#C69C6D" />
        <stop offset=".405" stop-color="#A83759" stop-opacity=".9" />
        <stop offset="1" stop-color="#A83759" stop-opacity="0" />
      </linearGradient>
      <path class="st29" d="M45.2,724c0,0,38-116,54-90s12,66,30,54s30,34,30,34s22-12,38,6s36,34,36,34l-27.3,42l-166-28.3L27.2,766 L45.2,724z" />
      <g id="jar">
        <path class="st30 st31" d="M1200.8,691.6c0-7.5-1.5-8.9-7-15.9c0,0-0.1-2.3-0.1-4.9c0.7-0.5,0.8-0.8,0.8-0.8l-0.8,0.2 c0-0.5,0-0.9,0-1.4c0.7-0.5,0.8-0.9,0.8-0.9l-0.8,0.1c0-0.4,0-0.9,0-1.3c0.6-0.4,0.8-0.6,0.8-0.6l-0.8,0.3c0-0.6,0-1.1,0-1.6 c0.3-1.1,0.2-1.9,0.2-1.9c-4.6-5.2-38.4-5.3-42.4,0.1c0,0,0,0.7,0.3,1.7l0,0.8l-0.9-0.2c0,0,0.3,0.3,0.9,0.7l-0.1,1.3 l-0.9-0.4c0,0,0.2,0.4,0.9,1l0,1.2l-0.9-0.2c0,0,0.2,0.4,0.9,0.9l-0.2,5.8c-10.1,12.8-6.7,8.3-7.3,35.4 c-1.1,11.4-0.2,22.6-0.2,27.1c0,10.1,8.2,18.3,18.3,18.3c11.5-0.1,14.9,0,20.4,0c10.1,0,18.3-8.2,18.3-18.3 C1199.9,724.5,1200.8,727.6,1200.8,691.6z"
        />
        <g class="st32">
          <path class="st33" d="M1193.2,676.1c-0.1-0.1-0.1-0.2-0.1-0.4l0,0c-0.1-5.2-0.3-11.8-0.2-12.5c0.1-0.9,1.5-0.6,1.2,0.3 c-0.6,2.5-8,3.2-10.6,3.4c-6,0.6-28.9,1.6-32.4-3.3l1.2-0.3c-0.5,12.9-0.4,12.5-0.6,12.8c-9.3,11.1-7.4,8.4-7.5,30.3 c0,8.3-0.4,5.6-0.5,15c-0.1,6.2,0.4,11.5,0.6,17.3c0.2,4.4,2.1,8.7,5.1,11.7c3.2,3.3,7.7,5.1,12.2,5.2 c0,0,6.2-0.1,20.5,0c10,0.1,17-7,18.1-15.3c0.2-1.1,0.2-2.1,0.2-2.1c-0.9-19,0.6-9.9,0-48.2 C1200.1,683.8,1197.6,681.8,1193.2,676.1z M1201.1,704.5c-0.1,17.5-0.9,19.8,0.2,33.7c0.6,7.3-5.5,18.8-18.7,19.2 c0,0-11.4,0-19.8,0c-11.7,0-19.5-9-19.4-19.2c0.1-4.7-0.7-15.6,0.4-27l0,0c0.4-26.4-3.1-22.9,6.9-35.8l-0.1,0.4 c0.3-8.6,0.2-4.5,0.5-12.4c0-0.6,0.8-0.8,1.2-0.3c3.2,5,34.3,5.1,40.2,0.9c0.3-0.2,0.6-0.5,0.5-0.7l0,0l1.2,0.3 c0,3.3,0.2,11.3,0.2,12.2l-0.1-0.4C1202.5,685.7,1201.3,684.4,1201.1,704.5z"
          />
          <path class="st33" d="M1193.8 669.8C1193.8 669.8 1193.8 669.9 1193.8 669.8c.2-.8 1.5-.4 1.2.4-1.1 2.2-8.4 2.9-10.8 3.2-.3 0-.4-.5-.1-.5C1186 672.7 1191.8 672.3 1193.8 669.8zM1151.2 668.7c0 0 2.2 5.1 24.9 4.7.3 0 .3.5 0 .5-24.8.4-27.2-4.8-25.8-5.5C1150.6 668.3 1151 668.4 1151.2 668.7z"
          />
          <path class="st33" d="M1171 671.5c17.7.1 23.1-2.7 22.9-3.7 0 0 0 0 0 0 0 0 0 0 0 .1.2-.9 1.6-.5 1.2.5-2.1 3.9-19.4 3.6-24 3.5C1170.7 671.8 1170.7 671.5 1171 671.5zM1151.2 666.7c.5 1.2 3.7 2.9 7.3 3.5.4.1.3.7-.1.6-1.4-.4-4.2-.9-6.5-2.1C1148.3 666.9 1150.8 665.5 1151.2 666.7 1151.2 666.7 1151.2 666.7 1151.2 666.7z"
          />
          <path class="st33" d="M1155.2 667.2c3.7 1.4 6.1 1.7 10.3 1.9.3 0 .3.5 0 .5-4.6.1-12.1-.5-15.3-3.8-.7-.7.4-1.8 1.1-1.1C1152.2 665.8 1154 666.8 1155.2 667.2zM1191.6 668.3c-2.7.9-4.4 1.1-7.4 1.2-.3 0-.3-.4 0-.4 2.9-.4 7.7-1.3 9.8-3.4.6-.6 1.5.3.9.9C1194.2 667.3 1192.6 668 1191.6 668.3zM1192.7 673c.2-.9.2-1.6.9-1.6.4 0 .6.3.7.6C1194.1 672.7 1194.2 672.6 1192.7 673zM1193.6 672.1l-.5.2c.2.5 1 .4 1.1-.1L1193.6 672.1zM1193.4 671.5c-.1 0-.2.1-.3.3l.5.2L1193.4 671.5z"
          />
          <g>
            <path class="st33" d="M1151.1,663c0,0,2.9-4.3,21.4-4.3c5.7,0,14.7,0.4,19.8,3c0.5,0.2,1.3,0.7,1.7,1.1 c0.3,0.4-0.2,0.8-0.5,0.5c0,0-3.4-3.6-21-3.7c-4.9,0-17.3,0.3-20.9,3.7c-0.1,0.1-0.3,0.3-0.4,0.1 C1151,663.3,1151,663.1,1151.1,663z" />
          </g>
          <g>
            <path class="st33" d="M1158.4,742.8c-1.3,0.1-6.6,3.3-6.4,5.1c0.3,2,1.4,3,4.1,3.8c5.5,1.5,32.8,3,35.7-2.7 c0.4-0.7,0.4-1.4,0.3-2.2c-0.2-1.6-6.9-4.5-8.5-4.4c1.5-0.1,8.7,2.3,9,4.4c0.1,0.9,0.1,1.7-0.3,2.5 c-2.9,6-27.5,4.8-33.7,3.7c-3.3-0.6-6.5-1.5-7-4.6c-0.1-0.5-0.1-0.7,0.1-1.2C1152.7,745.3,1157.1,742.9,1158.4,742.8z"
            />
          </g>
          <g>
            <path class="st33" d="M1156,663.5c2.1-1.4,5.8-2,8.2-1.3c-1.8,0.3-2,0-7.9,1.2C1156.1,663.4,1156,663.5,1156,663.5z" />
          </g>
          <g>
            <path class="st33" d="M1177.6,661.4c3.4-0.7,7.9,0.4,10.7,2.4c-2.4-0.7-4.5-1.7-10.2-2.3 C1177.8,661.4,1177.6,661.4,1177.6,661.4z" />
          </g>
        </g>
      </g>
      <g id="leftgrass_1_">
        <path class="st34" d="M90.5,719.9c1.1,2.3,2.1,4.7,3,7.1c0.9,2.4,1.8,4.8,2.6,7.2c1.6,4.8,2.9,9.7,4,14.5c2.2,9.8,3.6,19.6,4,29.5 h-4.3c0.3-9.8-0.4-19.6-1.9-29.3c-0.8-4.9-1.7-9.7-2.9-14.6c-0.6-2.4-1.3-4.8-2-7.2C92.3,724.6,91.5,722.2,90.5,719.9z" />
        <path class="st34" d="M94.7 691.9c-1.7 5.9-3.1 12-4.4 18-1.2 6-2.2 12.1-3 18.2-.8 6.1-1.3 12.2-1.6 18.4-.2 6.2-.2 12.3.4 18.5h4.3c-.9-6-1.3-12.4-1.4-18.5-.1-6.1.1-12.2.5-18.3.4-6.1 1.1-12.2 1.9-18.2C92.3 703.9 93.4 697.9 94.7 691.9zM86.7 731c-1.3 2.3-2.3 4.8-3.3 7.2-1 2.4-1.9 4.9-2.7 7.4-1.6 5-2.9 10-4 15.1-2.1 10.2-3 20.5-3 30.8h4.3c-.7-10.1-.5-20.5.8-30.6.7-5.1 1.6-10.1 2.9-15.1.6-2.5 1.3-5 2.2-7.5C84.7 735.9 85.6 733.4 86.7 731z"
        />
        <path class="st34" d="M74.4,716.4c0.1,5.1,0.2,10.3,0.1,15.4c0,5.1-0.2,10.3-0.4,15.4c-0.2,5.1-0.5,10.3-1,15.4 c-0.5,5.1-1.1,10.6-2,15.6h4.3c0.6-5.2,0.8-10.4,0.9-15.5c0.1-5.2,0.1-10.3-0.1-15.5c-0.1-5.2-0.4-10.3-0.7-15.4 C75.3,726.7,74.9,721.5,74.4,716.4z"
        />
        <path class="st34" d="M74.9 715.1c-1.9 5.1-3.6 10.3-5 15.5-1.5 5.2-2.8 10.5-3.8 15.7-1.1 5.3-1.9 10.6-2.5 15.9-.5 5.3-.8 10.7-.5 15.9h-4.3c.1-5.5.7-10.9 1.6-16.2.9-5.4 2.1-10.7 3.6-15.9 1.4-5.3 3.1-10.5 4.9-15.6C70.6 725.3 72.6 720.1 74.9 715.1zM51.5 704.5c-1.3 2.3-2.3 4.8-3.3 7.2-1 2.4-1.9 4.9-2.7 7.4-1.6 5-2.9 10-4 15.1-2.1 10.2-3 20.5-3 30.8h4.3c-.7-10.1-.5-20.5.8-30.6.7-5.1 1.6-10.1 2.9-15.1.6-2.5 1.3-5 2.2-7.5C49.5 709.3 50.4 706.9 51.5 704.5zM15.5 708.2c-1.4 5.7-2.5 11.5-3.4 17.3-.9 5.8-1.7 11.6-2.3 17.5-1.2 11.7-1.7 23.4-1.4 35.2h4.3c-1-11.6-1.2-23.4-.7-35.1.2-5.8.6-11.7 1.2-17.5C13.7 719.8 14.4 714 15.5 708.2z"
        />
      </g>
      <linearGradient id="grass-shadow_1_" gradientUnits="userSpaceOnUse" x1="1092.848" y1="748.024" x2="1092.848" y2="777">
        <stop offset="0" stop-color="#C69C6D" />
        <stop offset=".518" stop-color="#A83759" stop-opacity=".9" />
        <stop offset="1" stop-color="#A83759" stop-opacity="0" />
      </linearGradient>
      <ellipse id="grass-shadow" class="st35" cx="1092.8" cy="762.5" rx="141.3" ry="14.5" />
      <g id="grass">
        <path class="st36" d="M1040,714.3c1,0.5,1.8,1.1,2.6,1.6c0.8,0.5,1.5,1.1,2.1,1.6c1.3,1.1,2.4,2.2,3.3,3.4c1.8,2.3,3,4.6,3.6,7 c1.2,4.7,0.1,9.7-2.3,14.4h-5.7c3.3-4.6,5.2-9.7,5-14.4c-0.1-2.3-0.7-4.7-2.1-7c-0.7-1.1-1.5-2.3-2.5-3.4 c-0.5-0.6-1.1-1.1-1.8-1.7C1041.6,715.4,1040.9,714.8,1040,714.3z"
        />
        <path class="st36" d="M1041.2 711.5c-1.6 2.5-2.8 5.1-3.9 7.7-1 2.6-1.8 5.1-2.4 7.7-1.2 5.1-1.7 8.6-.9 13.7l-5.8 1.7c.2-5.2 1.5-10.4 3.7-15.5 1.1-2.6 2.4-5.1 3.9-7.7C1037.4 716.5 1039.1 714 1041.2 711.5zM1064.3 715.2c-2.1 2.2-3.8 4.4-5.2 6.7-1.4 2.2-2.5 4.5-3.2 6.8-.7 2.3-1.1 4.5-1 6.8.1 2.3.7 4.7 2 6.9h-6c-.8-2.3-.9-4.6-.6-6.9.4-2.3 1.3-4.6 2.5-6.8 1.2-2.3 2.8-4.5 4.7-6.7C1059.5 719.6 1061.7 717.4 1064.3 715.2zM1052.6 716.1c-1.8 2.2-3.2 4.3-4.4 6.5-1.2 2.2-2.2 4.4-3 6.6-1.6 4.4-2.2 8.8-1.6 13.2h-6c.3-4.5 2-8.9 4.6-13.2 1.3-2.2 2.8-4.4 4.5-6.5C1048.4 720.4 1050.3 718.2 1052.6 716.1z"
        />
        <path class="st36" d="M1038.1 716.7c.9 1.2 1.5 2.4 2.1 3.6.6 1.2 1.1 2.4 1.5 3.6.9 2.4 1.4 4.8 1.7 7.2.5 4.8-.1 9.8-2.2 14.6h6c1.1-4.9.7-9.8-.8-14.6-.8-2.4-1.8-4.8-3.2-7.2-.7-1.2-1.4-2.4-2.3-3.6C1040.1 719 1039.2 717.8 1038.1 716.7zM1070.5 718.5c-1.2 1.1-2.2 2.2-3.2 3.3-1 1.1-1.8 2.2-2.6 3.3-1.6 2.2-2.8 4.4-3.7 6.6-1.8 4.4-3.2 6.7-1.9 11.1l-5.1 2.2c-.3-4.5 1.2-9 4-13.5 1.4-2.2 3.1-4.4 5.2-6.6 1-1.1 2.1-2.2 3.3-3.3C1067.8 720.6 1069 719.5 1070.5 718.5z"
        />
        <path class="st36" d="M1061.1,712.6c1.9,2.4,3.5,4.9,4.8,7.3c1.3,2.5,2.4,4.9,3.2,7.4c1.7,5,2.4,9.9,2,14.9h-6 c1.4-4.9,1.7-9.9,1-14.9c-0.3-2.5-0.9-4.9-1.7-7.4C1063.5,717.5,1062.5,715.1,1061.1,712.6z" />
        <path class="st36" d="M1061.6 720.7c1.8 1 3.2 2 4.6 3 1.4 1 2.6 2.1 3.7 3.1 2.3 2.1 4.1 4.2 5.5 6.4 2.9 4.3 4.2 8.7 4.1 13.1l-4.7-2.2c1-4.3-.6-6.4-2.4-10.7-.9-2.1-2.2-4.3-4-6.4-.9-1.1-1.9-2.1-3-3.2C1064.4 722.8 1063.1 721.7 1061.6 720.7zM1071.6 711.6c1.9 1.2 3.4 2.5 4.9 3.7 1.4 1.2 2.7 2.5 3.9 3.8 2.3 2.5 4.2 5.1 5.5 7.7 2.6 5.2 3.2 10.4 1.2 15.6l-4.9-1.9c2.9-5.1 2.3-8.5.7-13.6-.8-2.6-2.1-5.1-4-7.7-.9-1.3-2-2.5-3.2-3.8C1074.5 714.1 1073.2 712.8 1071.6 711.6z"
        />
        <path class="st27" d="M1036.6,652.6c1.2,1.9,2.2,4,3.1,6c0.9,2.1,1.8,4.1,2.5,6.3c1.5,4.2,2.8,8.5,3.9,12.9 c2.2,8.7,3.5,17.6,4.3,26.5c1.4,17.9,0.1,36.8-2.7,54.7h-6.8c3.9-17.5,6.2-36.8,5.9-54.5c-0.1-8.8-0.9-17.7-2.4-26.4 c-0.8-4.4-1.8-8.7-3-13c-0.6-2.1-1.3-4.3-2.1-6.3C1038.4,656.6,1037.6,654.6,1036.6,652.6z"
        />
        <path class="st27" d="M1038 641.9c-1.9 9.7-3.4 19.4-4.6 29.1-1.2 9.7-2.2 19.5-2.9 29.3-1.4 19.5-2 35.1-1 54.6l-6.9 4.1c.2-19.7 1.8-39.4 4.4-58.9 1.3-9.8 2.8-19.5 4.7-29.2C1033.5 661.1 1035.5 651.5 1038 641.9zM1065.3 648.8c-2.5 8.4-4.5 16.9-6.2 25.4-1.7 8.5-2.9 17.1-3.8 25.6-.9 8.6-1.3 17.1-1.2 25.7.1 8.6.9 17.8 2.4 26.2l-5.8-1.9c-1-8.8-2.3-15.6-1.9-24.3.5-8.7 1.5-17.4 3-26 1.5-8.6 3.4-17.1 5.6-25.6C1059.7 665.5 1062.2 657.1 1065.3 648.8zM1051 654.6c-2.1 8.2-3.7 16.5-5.2 24.7-1.4 8.3-2.6 16.6-3.6 24.9-1.8 16.6-2.5 30.1-1.7 46.7l-7.2 3.2c.4-16.9 2.4-33.7 5.5-50.3 1.5-8.3 3.3-16.6 5.3-24.8C1046.1 670.9 1048.4 662.7 1051 654.6z"
        />
        <path class="st27" d="M1034.3 648.8c1 4.5 1.8 9.1 2.5 13.6.7 4.6 1.3 9.1 1.8 13.7 1 9.1 1.7 18.3 2 27.5.6 18.3 2.1 36.8-.4 54.9l4.9.5c1.3-18.5.9-37.1-.9-55.5-.9-9.2-2.2-18.4-3.8-27.5-.8-4.6-1.7-9.1-2.7-13.6C1036.6 657.8 1035.6 653.3 1034.3 648.8zM1072.7 658.3c-1.4 4.1-2.7 8.2-3.8 12.3-1.1 4.1-2.2 8.3-3.1 12.5-1.9 8.3-3.3 16.7-4.4 25.1-2.1 16.8-2.7 34-1.2 50.7l-6.2-3.1c-.3-17.2.6-31.2 3.9-48 1.7-8.4 3.7-16.8 6.2-25 1.2-4.1 2.5-8.3 4-12.3C1069.5 666.4 1071 662.3 1072.7 658.3z"
        />
        <path class="st27" d="M1061.5,646.3c2.3,9.2,4.1,18.5,5.7,27.9c1.6,9.3,2.8,18.7,3.8,28.1c2,18.8,2.8,37.7,2.3,56.6h-7.1 c1.7-18.7,2-37.7,1.2-56.5c-0.4-9.4-1.1-18.8-2-28.1C1064.5,665,1063.3,655.6,1061.5,646.3z" />
        <path class="st27" d="M1062.1,656.8c2.1,3.8,3.8,7.6,5.5,11.6c1.6,3.9,3.1,7.9,4.4,11.9c2.7,8,4.8,16.1,6.5,24.3 c3.4,16.3,5,33,4.9,49.6h-7.1c1.2-16.3,0.9-32.9-1.3-49.2c-1.1-8.1-2.6-16.3-4.7-24.3c-1-4-2.2-8-3.5-12 C1065.4,664.6,1064,660.7,1062.1,656.8z"
        />
        <path class="st27" d="M1074,642.3c2.2,4.6,4,9.3,5.8,14.1c1.7,4.7,3.3,9.5,4.6,14.3c2.8,9.6,4.9,19.3,6.5,29.1 c3.1,19.6,3.8,39.4,1.4,59.1l-7.1-3.7c3.5-19.3,4-35.7,2.1-55.2c-1-9.7-2.5-19.5-4.7-29.1c-1.1-4.8-2.3-9.6-3.8-14.4 C1077.5,651.7,1075.9,647,1074,642.3z"
        />
        <g>
          <path class="st19" d="M1085.4,727.3c-1.5,0.6-2.7,1.3-3.9,1.9c-1.1,0.7-2.2,1.3-3.2,2c-1.9,1.3-3.5,2.7-4.9,4.1 c-2.7,2.7-4.4,5.6-5.3,8.4c-1.8,5.7-0.1,11.6,3.4,17.3h8.5c-4.9-5.5-7.7-11.6-7.4-17.2c0.2-2.8,1.1-5.6,3.1-8.4 c1-1.4,2.2-2.7,3.8-4.1c0.8-0.7,1.6-1.3,2.6-2C1083,728.6,1084.1,727.9,1085.4,727.3z"
          />
          <path class="st19" d="M1083.5 723.9c2.4 3.1 4.2 6.1 5.8 9.2 1.5 3.1 2.7 6.2 3.6 9.3 1.7 6.2 2.5 10.3 1.3 16.5l8.6 2.1c-.3-6.2-2.2-12.5-5.5-18.6-1.6-3.1-3.6-6.2-5.8-9.2C1089.2 730 1086.7 727 1083.5 723.9zM1049.3 728.4c3.2 2.7 5.6 5.3 7.7 8 2.1 2.7 3.7 5.4 4.8 8.1 1.1 2.7 1.6 5.4 1.5 8.1-.2 2.7-1.1 5.6-3 8.3h8.9c1.3-2.8 1.4-5.5.8-8.3-.6-2.8-1.9-5.5-3.7-8.2-1.8-2.7-4.2-5.4-7-8.1C1056.4 733.7 1053.2 731 1049.3 728.4zM1066.7 729.4c2.6 2.6 4.7 5.2 6.5 7.8 1.8 2.6 3.3 5.2 4.5 7.9 2.3 5.3 3.3 10.6 2.4 15.8h8.9c-.5-5.3-3-10.7-6.8-15.9-1.9-2.6-4.1-5.2-6.7-7.8C1072.8 734.6 1070 732 1066.7 729.4z"
          />
          <path class="st19" d="M1088.2 730.2c-1.3 1.4-2.3 2.9-3.2 4.3-.9 1.4-1.7 2.9-2.3 4.3-1.3 2.9-2.1 5.8-2.5 8.7-.8 5.8.2 11.8 3.2 17.5h-8.9c-1.6-5.9-1.1-11.7 1.2-17.6 1.1-2.9 2.7-5.8 4.8-8.7 1-1.4 2.2-2.9 3.4-4.3C1085.2 733 1086.6 731.6 1088.2 730.2zM1040.1 732.3c1.8 1.3 3.3 2.6 4.8 3.9 1.4 1.3 2.7 2.6 3.9 3.9 2.3 2.6 4.2 5.3 5.5 7.9 2.7 5.3 4.7 8.1 2.8 13.4l7.6 2.7c.4-5.4-1.8-10.8-6-16.2-2.1-2.7-4.7-5.3-7.7-7.9-1.5-1.3-3.2-2.6-5-3.9C1044.1 734.9 1042.2 733.6 1040.1 732.3z"
          />
          <path class="st19" d="M1054.1,725.3c-2.9,2.9-5.1,5.9-7.1,8.8c-1.9,3-3.5,5.9-4.8,8.9c-2.5,5.9-3.6,11.9-2.9,17.9h8.9 c-2.1-5.9-2.5-11.9-1.5-17.9c0.5-3,1.3-5.9,2.6-8.9C1050.4,731.2,1051.9,728.3,1054.1,725.3z" />
          <path class="st19" d="M1053.3 735c-2.6 1.2-4.8 2.4-6.9 3.7-2 1.2-3.9 2.5-5.5 3.8-3.3 2.5-6 5.1-8.2 7.7-4.3 5.2-6.2 10.4-6.1 15.7l6.9-2.7c-1.5-5.2.9-7.7 3.6-12.9 1.4-2.6 3.3-5.1 5.9-7.7 1.3-1.3 2.8-2.5 4.4-3.8C1049.2 737.5 1051 736.3 1053.3 735zM1038.4 724.1c-2.8 1.5-5.1 3-7.2 4.5-2.1 1.5-4.1 3-5.8 4.5-3.5 3-6.2 6.1-8.1 9.2-3.9 6.2-4.7 12.5-1.8 18.7l7.3-2.3c-4.3-6.1-3.5-10.2-1.1-16.4 1.2-3.1 3.2-6.2 5.9-9.2 1.4-1.5 2.9-3 4.7-4.6C1034.1 727 1036 725.5 1038.4 724.1zM1189 722.7c-2.8 1.5-5.1 3-7.2 4.5-2.1 1.5-4.1 3-5.8 4.5-3.5 3-6.2 6.1-8.1 9.2-3.9 6.2-4.7 12.5-1.8 18.7l7.3-2.3c-4.3-6.1-3.5-10.2-1.1-16.4 1.2-3.1 3.2-6.2 5.9-9.2 1.4-1.5 2.9-3 4.7-4.6C1184.7 725.7 1186.6 724.2 1189 722.7z"
          />
        </g>
        <g>
          <path class="st36" d="M1105,724.2c1,0.4,1.8,0.8,2.6,1.3c0.8,0.4,1.5,0.9,2.1,1.3c1.3,0.9,2.4,1.8,3.3,2.7c1.8,1.8,3,3.7,3.6,5.6 c1.2,3.8,0.1,7.8-2.3,11.7h-5.7c3.3-3.7,5.2-7.8,5-11.6c-0.1-1.9-0.7-3.8-2.1-5.6c-0.7-0.9-1.5-1.8-2.5-2.8 c-0.5-0.5-1.1-0.9-1.8-1.4C1106.6,725,1105.9,724.6,1105,724.2z"
          />
          <path class="st36" d="M1106.2 721.9c-1.6 2.1-2.8 4.1-3.9 6.2-1 2.1-1.8 4.1-2.4 6.2-1.2 4.2-1.7 7-.9 11.1l-5.8 1.4c.2-4.2 1.5-8.4 3.7-12.5 1.1-2.1 2.4-4.2 3.9-6.2C1102.4 726 1104.1 723.9 1106.2 721.9zM1129.3 724.9c-2.1 1.8-3.8 3.6-5.2 5.4-1.4 1.8-2.5 3.6-3.2 5.5-.7 1.8-1.1 3.7-1 5.5.1 1.8.7 3.8 2 5.6h-6c-.8-1.9-.9-3.7-.6-5.6.4-1.9 1.3-3.7 2.5-5.5 1.2-1.8 2.8-3.6 4.7-5.4C1124.5 728.5 1126.7 726.7 1129.3 724.9zM1117.6 725.6c-1.8 1.7-3.2 3.5-4.4 5.3-1.2 1.8-2.2 3.5-3 5.3-1.6 3.5-2.2 7.1-1.6 10.6h-6c.3-3.6 2-7.2 4.6-10.7 1.3-1.8 2.8-3.5 4.5-5.3C1113.4 729.1 1115.3 727.3 1117.6 725.6z"
          />
          <path class="st36" d="M1103.1 726.1c.9 1 1.5 1.9 2.1 2.9.6 1 1.1 1.9 1.5 2.9.9 1.9 1.4 3.9 1.7 5.8.5 3.9-.1 7.9-2.2 11.8h6c1.1-3.9.7-7.9-.8-11.8-.8-2-1.8-3.9-3.2-5.8-.7-1-1.4-1.9-2.3-2.9C1105.1 728 1104.2 727 1103.1 726.1zM1135.5 727.6c-1.2.9-2.2 1.7-3.2 2.6-1 .9-1.8 1.8-2.6 2.7-1.6 1.8-2.8 3.6-3.7 5.3-1.8 3.6-3.2 5.4-1.9 9l-5.1 1.8c-.3-3.7 1.2-7.3 4-10.9 1.4-1.8 3.1-3.6 5.2-5.3 1-.9 2.1-1.8 3.3-2.6C1132.8 729.3 1134 728.4 1135.5 727.6z"
          />
          <path class="st36" d="M1126.1,722.8c1.9,2,3.5,3.9,4.8,5.9c1.3,2,2.4,4,3.2,6c1.7,4,2.4,8,2,12.1h-6c1.4-4,1.7-8,1-12 c-0.3-2-0.9-4-1.7-6C1128.5,726.8,1127.5,724.8,1126.1,722.8z" />
          <path class="st36" d="M1126.6 729.4c1.8.8 3.2 1.6 4.6 2.5 1.4.8 2.6 1.7 3.7 2.5 2.3 1.7 4.1 3.4 5.5 5.2 2.9 3.5 4.2 7 4.1 10.6l-4.7-1.8c1-3.5-.6-5.2-2.4-8.7-.9-1.7-2.2-3.5-4-5.2-.9-.9-1.9-1.7-3-2.6C1129.4 731 1128.1 730.2 1126.6 729.4zM1136.6 722c1.9 1 3.4 2 4.9 3 1.4 1 2.7 2 3.9 3 2.3 2 4.2 4.1 5.5 6.2 2.6 4.2 3.2 8.4 1.2 12.6l-4.9-1.5c2.9-4.1 2.3-6.9.7-11-.8-2.1-2.1-4.1-4-6.2-.9-1-2-2.1-3.2-3.1C1139.5 724 1138.2 723 1136.6 722z"
          />
        </g>
        <g>
          <path class="st27" d="M1101.6,625.7c1.2,2.4,2.2,4.9,3.1,7.5c0.9,2.5,1.8,5.1,2.5,7.7c1.5,5.2,2.8,10.5,3.9,15.9 c2.2,10.7,3.5,21.7,4.3,32.8c1.4,22.1,0.1,45.5-2.7,67.7h-6.8c3.9-21.6,6.2-45.5,5.9-67.4c-0.1-10.9-0.9-21.9-2.4-32.7 c-0.8-5.4-1.8-10.7-3-16c-0.6-2.6-1.3-5.3-2.1-7.9C1103.4,630.8,1102.6,628.2,1101.6,625.7z"
          />
          <path class="st27" d="M1103 612.5c-1.9 12-3.4 24-4.6 36-1.2 12-2.2 24.1-2.9 36.2-1.4 24.2-2 43.4-1 67.5l-6.9 5.1c.2-24.4 1.8-48.7 4.4-72.9 1.3-12.1 2.8-24.1 4.7-36.1C1098.5 636.3 1100.5 624.4 1103 612.5zM1130.3 621c-2.5 10.4-4.5 20.9-6.2 31.4-1.7 10.5-2.9 21.1-3.8 31.7-.9 10.6-1.3 21.2-1.2 31.8.1 10.6.9 22 2.4 32.4l-5.8-2.3c-1-10.8-2.3-19.4-1.9-30.1.5-10.8 1.5-21.5 3-32.1 1.5-10.6 3.4-21.2 5.6-31.7C1124.7 641.7 1127.2 631.3 1130.3 621zM1116 628.3c-2.1 10.1-3.7 20.4-5.2 30.6-1.4 10.2-2.6 20.5-3.6 30.8-1.8 20.6-2.5 37.3-1.7 57.8l-7.2 4c.4-20.9 2.4-41.7 5.5-62.2 1.5-10.3 3.3-20.5 5.3-30.7C1111.1 648.4 1113.4 638.3 1116 628.3z"
          />
          <path class="st27" d="M1099.3 621c1 5.6 1.8 11.2 2.5 16.9.7 5.6 1.3 11.3 1.8 16.9 1 11.3 1.7 22.6 2 34 .6 22.7 2.1 45.5-.4 67.9l4.9.6c1.3-22.9.9-45.9-.9-68.7-.9-11.4-2.2-22.7-3.8-34-.8-5.6-1.7-11.3-2.7-16.9C1101.6 632.2 1100.6 626.6 1099.3 621zM1137.7 632.8c-1.4 5.1-2.7 10.2-3.8 15.3-1.1 5.1-2.2 10.3-3.1 15.4-1.9 10.3-3.3 20.7-4.4 31.1-2.1 20.8-2.7 42.1-1.2 62.8l-6.2-3.8c-.3-21.3.6-38.6 3.9-59.4 1.7-10.4 3.7-20.8 6.2-31 1.2-5.1 2.5-10.2 4-15.3C1134.5 642.8 1136 637.7 1137.7 632.8z"
          />
          <path class="st27" d="M1126.5,617.9c2.3,11.4,4.1,22.9,5.7,34.5c1.6,11.6,2.8,23.2,3.8,34.8c2,23.3,2.8,46.7,2.3,70.1h-7.1 c1.7-23.1,2-46.7,1.2-69.9c-0.4-11.6-1.1-23.2-2-34.8C1129.5,641,1128.3,629.5,1126.5,617.9z" />
          <path class="st27" d="M1127.1,630.9c2.1,4.7,3.8,9.5,5.5,14.3c1.6,4.8,3.1,9.7,4.4,14.7c2.7,9.9,4.8,19.9,6.5,30 c3.4,20.2,5,40.8,4.9,61.4h-7.1c1.2-20.2,0.9-40.7-1.3-60.9c-1.1-10.1-2.6-20.1-4.7-30.1c-1-5-2.2-9.9-3.5-14.8 C1130.4,640.6,1129,635.7,1127.1,630.9z"
          />
          <path class="st27" d="M1139,613c2.2,5.7,4,11.6,5.8,17.4c1.7,5.9,3.3,11.8,4.6,17.7c2.8,11.9,4.9,23.9,6.5,36 c3.1,24.2,3.8,48.7,1.4,73.2l-7.1-4.6c3.5-23.8,4-44.2,2.1-68.3c-1-12.1-2.5-24.1-4.7-36c-1.1-6-2.3-11.9-3.8-17.8 C1142.5,624.7,1140.9,618.8,1139,613z"
          />
        </g>
        <g>
          <path class="st19" d="M1150.4,718.2c-1.5,0.8-2.7,1.6-3.9,2.4c-1.1,0.8-2.2,1.6-3.2,2.4c-1.9,1.6-3.5,3.3-4.9,5 c-2.7,3.4-4.4,6.9-5.3,10.4c-1.8,7-0.1,14.4,3.4,21.4h8.5c-4.9-6.8-7.7-14.4-7.4-21.3c0.2-3.5,1.1-6.9,3.1-10.3 c1-1.7,2.2-3.4,3.8-5.1c0.8-0.8,1.6-1.7,2.6-2.5C1148,719.8,1149.1,719,1150.4,718.2z"
          />
          <path class="st19" d="M1148.5 714c2.4 3.8 4.2 7.6 5.8 11.4 1.5 3.8 2.7 7.6 3.6 11.4 1.7 7.6 2.5 12.8 1.3 20.4l8.6 2.6c-.3-7.7-2.2-15.4-5.5-23.1-1.6-3.8-3.6-7.6-5.8-11.4C1154.2 721.5 1151.7 717.7 1148.5 714zM1114.3 719.5c3.2 3.3 5.6 6.6 7.7 9.9 2.1 3.3 3.7 6.7 4.8 10 1.1 3.4 1.6 6.7 1.5 10.1-.2 3.3-1.1 7-3 10.2h8.9c1.3-3.4 1.4-6.9.8-10.3-.6-3.4-1.9-6.8-3.7-10.2-1.8-3.4-4.2-6.7-7-10C1121.4 726.1 1118.2 722.8 1114.3 719.5zM1131.7 720.8c2.6 3.2 4.7 6.4 6.5 9.7 1.8 3.2 3.3 6.5 4.5 9.7 2.3 6.5 3.3 13.1 2.4 19.6h8.9c-.5-6.6-3-13.2-6.8-19.7-1.9-3.3-4.1-6.5-6.7-9.7C1137.8 727.2 1135 724 1131.7 720.8z"
          />
          <path class="st19" d="M1153.2 721.7c-1.3 1.8-2.3 3.6-3.2 5.3-.9 1.8-1.7 3.6-2.3 5.4-1.3 3.6-2.1 7.2-2.5 10.7-.8 7.2.2 14.6 3.2 21.7h-8.9c-1.6-7.2-1.1-14.5 1.2-21.7 1.1-3.6 2.7-7.2 4.8-10.8 1-1.8 2.2-3.6 3.4-5.3C1150.2 725.2 1151.6 723.5 1153.2 721.7zM1105.1 724.4c1.8 1.6 3.3 3.2 4.8 4.8 1.4 1.6 2.7 3.2 3.9 4.9 2.3 3.3 4.2 6.5 5.5 9.8 2.7 6.6 4.7 10 2.8 16.5l7.6 3.3c.4-6.7-1.8-13.4-6-20-2.1-3.3-4.7-6.6-7.7-9.8-1.5-1.6-3.2-3.2-5-4.8C1109.1 727.6 1107.2 726 1105.1 724.4z"
          />
          <path class="st19" d="M1119.1,715.7c-2.9,3.6-5.1,7.3-7.1,10.9c-1.9,3.7-3.5,7.3-4.8,11c-2.5,7.4-3.6,14.8-2.9,22.2h8.9 c-2.1-7.3-2.5-14.8-1.5-22.1c0.5-3.7,1.3-7.3,2.6-11C1115.4,723,1116.9,719.4,1119.1,715.7z" />
          <path class="st19" d="M1118.3 727.7c-2.6 1.5-4.8 3-6.9 4.5-2 1.5-3.9 3.1-5.5 4.6-3.3 3.1-6 6.3-8.2 9.5-4.3 6.4-6.2 12.9-6.1 19.4l6.9-3.3c-1.5-6.4.9-9.6 3.6-16 1.4-3.2 3.3-6.4 5.9-9.5 1.3-1.6 2.8-3.1 4.4-4.7C1114.2 730.8 1116 729.2 1118.3 727.7zM1103.4 714.2c-2.8 1.8-5.1 3.7-7.2 5.5-2.1 1.9-4.1 3.7-5.8 5.6-3.5 3.8-6.2 7.6-8.1 11.4-3.9 7.7-4.7 15.4-1.8 23.1l7.3-2.8c-4.3-7.5-3.5-12.6-1.1-20.2 1.2-3.8 3.2-7.6 5.9-11.4 1.4-1.9 2.9-3.8 4.7-5.6C1099.1 717.9 1101 716 1103.4 714.2z"
          />
        </g>
        <path class="st25" d="M1129.1,640c-1.5-2.3-6.1-5.5-11.5-3c1-1.7,3.2-3.3,5-5c2.5-2.3,4.5-7.3,2.8-14.2c-1.7-6.9-3.6-6.9-3.6-6.9 s1.4,2.2,1,5.9c-0.3,3.6-0.5,5.4-0.5,5.4s-0.9-2.8-0.7-4.3c0.2-1.6,0.5-3.5,0.3-4.3c-1.4,1-2.6,4.3-2.6,4.3s-0.4-1.1-0.9-1.1 c-0.9,0.8-1.9,2.5-3.5,3.8c-1.1,0.9-5.1,2.5-6.5,5.4c-0.5-2.1-1.6-3.8-2.2-4.9c-0.6-1.2-0.5-7.5,0.6-9.1c0,0-3.2,2.2-4.8,5.9 c-1.1,2.5-2.4,5.9-0.6,9c1,1.8,1.6,2.6,1.6,2.6s-2.7-1.6-5.1-1.6c-2.5-0.1-5.3,1.7-5.4,4.1c-0.1,2.1,0.8,3,1.4,3.3 c0.4,0.2,1.6,0.4,2.6-0.3c1.1-0.8,1.4-3.7,3.3-4c-2.7-0.5-4,3.2-5,2.5c0,0-0.8-1.2,1.8-2.7c2.6-1.5,6.4-0.6,8.2,1.4 c1.8,1.9,2,3.8,2.1,5.7c0,0.7-0.6,2.9,0.6,4.2c-1.9,3.2-13.7,27.6-15,58.5c-0.8,17.6,1.5,43,2.4,52.3c0.6,0,1.4,0,2.1,0 c-1.1-9.8-3.9-38.2-2.7-52.8c1.5-18.7,4.5-39.4,14.7-57c0,0,2.2,0.6,4.1-1.6c1.9-2.2,4.5-3.8,7.8-3.6c3.3,0.2,6.7,4.3,6.2,9.7 c-0.5,5.4-2.4,3.1-1.7,7.3c0.6-3,1.6-2.7,3.3-5.5C1131.1,645,1130.1,641.4,1129.1,640z"
        />
        <path class="st37" d="M1000.3,685.6c1.8,2.6,0.7,8,2.9,10.2c0,0.3,0,0.5,0.1,0.6c0,0.4-0.4,0.3-0.4,0.7c0.3,0.7,0.9,1.1,1.6,1.4 c-0.9,0.8-0.1,2-0.4,3.4c0.8-2,1.9-2,2.6-2.5c0.6,0.1,0.3,1.2,1,1.1c0-0.5-0.5-0.5-0.4-1c0.4-0.3,0.3,0.6,0.4,0.6 c0.4,0,0.4-0.4,0.5-0.7c2.5,12.6,13.1,46.1,18.6,61.5l2.3-0.1c-8.1-20.8-18.7-52.6-19-62.3c0.4-0.1,0.7-0.4,1-0.5 c0.4,0.1,1.7,2,1.4,3.2c1,0-0.6-3.6-0.1-4c0.2,0.1,0.3,0.3,0.3,0.5c0.5-0.1-0.2-0.7,0.1-0.9c1.1-0.4,2-1,2.9-1.6 c-0.2,0.1-0.7-0.1-0.7,0.1c-0.2-0.7-0.9-0.2-1.4-0.5c-0.4,0.2-0.5,0.5-1,0.6c-0.3,0-0.5-0.2-0.7-0.3c0.3-0.5,0.5-1,0.7-1.5 c1.8,1.1,4.9,0.7,6.6,1.5c-1.4-1.4-5.2-1.3-7.3-2.4c-0.3-4.1-4.2-5.5-4.8-9.6c-0.6-0.3-0.9-0.8-1.2-1.3c-0.3,0.2,0.1,0.5,0.1,0.7 c-1.8-1.2-3.3-6.7-5.5-7.4c0.9,0.8,1.7,2.7,1.7,2.9c-0.8,0.1-1.5-0.1-2,0.7c-0.5,1.6,0.8,3.4,0.6,5.9c-0.2-0.2-0.6-2.4-0.8-2.6 c-0.3,0.1,0.5,2.2,0.4,2.5c-0.2,0-0.2-0.2-0.2-0.4C999.9,684.7,1000.7,685,1000.3,685.6z M1011.2,696.7c0.3,0.1,0.6-0.3,0.7,0 C1011.7,696.7,1011.3,696.9,1011.2,696.7z M1004.7,700.1c0.1-0.9,0.8-1.8,1.6-1.6C1006,699.3,1005.2,699.5,1004.7,700.1z"
        />
        <g>
          <path class="st27" d="M1156.7,724.9c1.5,0.6,2.7,1.3,3.9,1.9c1.1,0.7,2.2,1.3,3.2,2c1.9,1.3,3.5,2.7,4.9,4.1 c2.7,2.7,4.4,5.6,5.3,8.4c1.8,5.7,0.1,11.6-3.4,17.3h-8.5c4.9-5.5,7.7-11.6,7.4-17.2c-0.2-2.8-1.1-5.6-3.1-8.4 c-1-1.4-2.2-2.7-3.8-4.1c-0.8-0.7-1.6-1.3-2.6-2C1159,726.2,1158,725.5,1156.7,724.9z"
          />
          <path class="st27" d="M1158.5 721.5c-2.4 3.1-4.2 6.1-5.8 9.2-1.5 3.1-2.7 6.2-3.6 9.3-1.7 6.2-2.5 10.3-1.3 16.5l-8.6 2.1c.3-6.2 2.2-12.5 5.5-18.6 1.6-3.1 3.6-6.2 5.8-9.2C1152.8 727.6 1155.4 724.5 1158.5 721.5zM1192.8 726c-3.2 2.7-5.6 5.3-7.7 8-2.1 2.7-3.7 5.4-4.8 8.1-1.1 2.7-1.6 5.4-1.5 8.1.2 2.7 1.1 5.6 3 8.3h-8.9c-1.3-2.8-1.4-5.5-.8-8.3.6-2.8 1.9-5.5 3.7-8.2 1.8-2.7 4.2-5.4 7-8.1C1185.7 731.3 1188.9 728.6 1192.8 726zM1175.3 727c-2.6 2.6-4.7 5.2-6.5 7.8-1.8 2.6-3.3 5.2-4.5 7.9-2.3 5.3-3.3 10.6-2.4 15.8h-8.9c.5-5.3 3-10.7 6.8-15.9 1.9-2.6 4.1-5.2 6.7-7.8C1169.2 732.2 1172 729.6 1175.3 727z"
          />
          <path class="st27" d="M1153.8 727.7c1.3 1.4 2.3 2.9 3.2 4.3.9 1.4 1.7 2.9 2.3 4.3 1.3 2.9 2.1 5.8 2.5 8.7.8 5.8-.2 11.8-3.2 17.5h8.9c1.6-5.9 1.1-11.7-1.2-17.6-1.1-2.9-2.7-5.8-4.8-8.7-1-1.4-2.2-2.9-3.4-4.3C1156.8 730.6 1155.4 729.1 1153.8 727.7zM1201.9 729.9c-1.8 1.3-3.3 2.6-4.8 3.9-1.4 1.3-2.7 2.6-3.9 3.9-2.3 2.6-4.2 5.3-5.5 7.9-2.7 5.3-4.7 8.1-2.8 13.4l-7.6 2.7c-.4-5.4 1.8-10.8 6-16.2 2.1-2.7 4.7-5.3 7.7-7.9 1.5-1.3 3.2-2.6 5-3.9C1197.9 732.5 1199.8 731.2 1201.9 729.9z"
          />
          <path class="st27" d="M1188,722.9c2.9,2.9,5.1,5.9,7.1,8.8c1.9,3,3.5,5.9,4.8,8.9c2.5,5.9,3.6,11.9,2.9,17.9h-8.9 c2.1-5.9,2.5-11.9,1.5-17.9c-0.5-3-1.3-5.9-2.6-8.9C1191.6,728.8,1190.1,725.8,1188,722.9z" />
          <path class="st27" d="M1188.7 732.6c2.6 1.2 4.8 2.4 6.9 3.7 2 1.2 3.9 2.5 5.5 3.8 3.3 2.5 6 5.1 8.2 7.7 4.3 5.2 6.2 10.4 6.1 15.7l-6.9-2.7c1.5-5.2-.9-7.7-3.6-12.9-1.4-2.6-3.3-5.1-5.9-7.7-1.3-1.3-2.8-2.5-4.4-3.8C1192.8 735.1 1191 733.8 1188.7 732.6zM1203.6 721.6c2.8 1.5 5.1 3 7.2 4.5 2.1 1.5 4.1 3 5.8 4.5 3.5 3 6.2 6.1 8.1 9.2 3.9 6.2 4.7 12.5 1.8 18.7l-7.3-2.3c4.3-6.1 3.5-10.2 1.1-16.4-1.2-3.1-3.2-6.2-5.9-9.2-1.4-1.5-2.9-3-4.7-4.6C1208 724.6 1206 723.1 1203.6 721.6zM1053 720.3c2.8 1.5 5.1 3 7.2 4.5 2.1 1.5 4.1 3 5.8 4.5 3.5 3 6.2 6.1 8.1 9.2 3.9 6.2 4.7 12.5 1.8 18.7l-7.3-2.3c4.3-6.1 3.5-10.2 1.1-16.4-1.2-3.1-3.2-6.2-5.9-9.2-1.4-1.5-2.9-3-4.7-4.6C1057.4 723.3 1055.4 721.8 1053 720.3z"
          />
        </g>
        <g>
          <path class="st27" d="M1031.4,730.2c-1.5,0.6-2.7,1.3-3.9,1.9c-1.1,0.7-2.2,1.3-3.2,2c-1.9,1.3-3.5,2.7-4.9,4.1 c-2.7,2.7-4.4,5.6-5.3,8.4c-1.8,5.7-0.1,11.6,3.4,17.3h8.5c-4.9-5.5-7.7-11.6-7.4-17.2c0.2-2.8,1.1-5.6,3.1-8.4 c1-1.4,2.2-2.7,3.8-4.1c0.8-0.7,1.6-1.3,2.6-2C1029.1,731.5,1030.1,730.8,1031.4,730.2z"
          />
          <path class="st27" d="M1029.6 726.8c2.4 3.1 4.2 6.1 5.8 9.2 1.5 3.1 2.7 6.2 3.6 9.3 1.7 6.2 2.5 10.3 1.3 16.5l8.6 2.1c-.3-6.2-2.2-12.5-5.5-18.6-1.6-3.1-3.6-6.2-5.8-9.2C1035.3 732.9 1032.7 729.8 1029.6 726.8zM995.3 731.3c3.2 2.7 5.6 5.3 7.7 8 2.1 2.7 3.7 5.4 4.8 8.1 1.1 2.7 1.6 5.4 1.5 8.1-.2 2.7-1.1 5.6-3 8.3h8.9c1.3-2.8 1.4-5.5.8-8.3-.6-2.8-1.9-5.5-3.7-8.2-1.8-2.7-4.2-5.4-7-8.1C1002.4 736.5 999.2 733.9 995.3 731.3zM1012.8 732.3c2.6 2.6 4.7 5.2 6.5 7.8 1.8 2.6 3.3 5.2 4.5 7.9 2.3 5.3 3.3 10.6 2.4 15.8h8.9c-.5-5.3-3-10.7-6.8-15.9-1.9-2.6-4.1-5.2-6.7-7.8C1018.9 737.5 1016.1 734.9 1012.8 732.3z"
          />
          <path class="st27" d="M1034.3 733c-1.3 1.4-2.3 2.9-3.2 4.3-.9 1.4-1.7 2.9-2.3 4.3-1.3 2.9-2.1 5.8-2.5 8.7-.8 5.8.2 11.8 3.2 17.5h-8.9c-1.6-5.9-1.1-11.7 1.2-17.6 1.1-2.9 2.7-5.8 4.8-8.7 1-1.4 2.2-2.9 3.4-4.3C1031.3 735.9 1032.7 734.4 1034.3 733zM986.1 735.2c1.8 1.3 3.3 2.6 4.8 3.9 1.4 1.3 2.7 2.6 3.9 3.9 2.3 2.6 4.2 5.3 5.5 7.9 2.7 5.3 4.7 8.1 2.8 13.4l7.6 2.7c.4-5.4-1.8-10.8-6-16.2-2.1-2.7-4.7-5.3-7.7-7.9-1.5-1.3-3.2-2.6-5-3.9C990.2 737.8 988.3 736.5 986.1 735.2z"
          />
          <path class="st27" d="M1000.1,728.2c-2.9,2.9-5.1,5.9-7.1,8.8c-1.9,3-3.5,5.9-4.8,8.9c-2.5,5.9-3.6,11.9-2.9,17.9h8.9 c-2.1-5.9-2.5-11.9-1.5-17.9c0.5-3,1.3-5.9,2.6-8.9C996.4,734.1,997.9,731.1,1000.1,728.2z" />
          <path class="st27" d="M999.3 737.9c-2.6 1.2-4.8 2.4-6.9 3.7-2 1.2-3.9 2.5-5.5 3.8-3.3 2.5-6 5.1-8.2 7.7-4.3 5.2-6.2 10.4-6.1 15.7l6.9-2.7c-1.5-5.2.9-7.7 3.6-12.9 1.4-2.6 3.3-5.1 5.9-7.7 1.3-1.3 2.8-2.5 4.4-3.8C995.2 740.4 997.1 739.1 999.3 737.9zM984.5 726.9c-2.8 1.5-5.1 3-7.2 4.5-2.1 1.5-4.1 3-5.8 4.5-3.5 3-6.2 6.1-8.1 9.2-3.9 6.2-4.7 12.5-1.8 18.7l7.3-2.3c-4.3-6.1-3.5-10.2-1.1-16.4 1.2-3.1 3.2-6.2 5.9-9.2 1.4-1.5 2.9-3 4.7-4.6C980.1 729.9 982.1 728.4 984.5 726.9zM1135.1 725.6c-2.8 1.5-5.1 3-7.2 4.5-2.1 1.5-4.1 3-5.8 4.5-3.5 3-6.2 6.1-8.1 9.2-3.9 6.2-4.7 12.5-1.8 18.7l7.3-2.3c-4.3-6.1-3.5-10.2-1.1-16.4 1.2-3.1 3.2-6.2 5.9-9.2 1.4-1.5 2.9-3 4.7-4.6C1130.7 728.6 1132.7 727.1 1135.1 725.6z"
          />
        </g>
      </g>
      <g id="lightning" class="st38">
        <path class="st39" d="M278.2 -6.9L39.4 290.1 218.5 456.6 53.5 762.6" />
        <path class="st40" d="M289.8 -5.9L50.9 291.1 230 457.6 65 763.6" />
        <path class="st41" d="M293.8 -5.9L63.8 291.1 236.3 457.6 77.4 763.6" />
        <path class="st42" d="M304.9 -5.9L74.9 291.1 247.4 457.6 88.5 763.6" />
      </g>
      <g id="bug">
        <linearGradient id="r-wing_4_" gradientUnits="userSpaceOnUse" x1="87.326" y1="661.827" x2="87.326" y2="672.18">
          <stop offset="0" stop-color="#A83759" stop-opacity=".5" />
          <stop offset=".646" stop-color="#543934" stop-opacity=".9" />
          <stop offset="1" stop-color="#8D7B98" stop-opacity=".6" />
        </linearGradient>
        <path id="r-wing" class="st43" d="M84.2,672c0,0,7.3-16.7,6-7.3C88.9,674,84.2,672,84.2,672z" />
        <linearGradient id="l-wing_4_" gradientUnits="userSpaceOnUse" x1="81.615" y1="665.197" x2="81.615" y2="672.423">
          <stop offset="0" stop-color="#A83759" stop-opacity=".5" />
          <stop offset=".646" stop-color="#543934" stop-opacity=".9" />
          <stop offset="1" stop-color="#8D7B98" stop-opacity=".6" />
        </linearGradient>
        <path id="l-wing" class="st44" d="M86.2,671.7c0,0-13.3-11.3-8-4C83.6,675,86.2,671.7,86.2,671.7z" />
      </g>
      <g id="bug_1_">
        <linearGradient id="r-wing_5_" gradientUnits="userSpaceOnUse" x1="100.864" y1="641.983" x2="100.864" y2="652.335" gradientTransform="rotate(33.217 91.702 646.148)">
          <stop offset="0" stop-color="#A83759" stop-opacity=".5" />
          <stop offset=".646" stop-color="#543934" stop-opacity=".9" />
          <stop offset="1" stop-color="#8D7B98" stop-opacity=".6" />
        </linearGradient>
        <path id="r-wing_1_" class="st45" d="M93.5,654.5c0,0,15.3-9.9,9-2.8C96.3,658.7,93.5,654.5,93.5,654.5z" />
        <linearGradient id="l-wing_5_" gradientUnits="userSpaceOnUse" x1="95.153" y1="645.352" x2="95.153" y2="652.578" gradientTransform="rotate(33.217 91.702 646.148)">
          <stop offset="0" stop-color="#A83759" stop-opacity=".5" />
          <stop offset=".646" stop-color="#543934" stop-opacity=".9" />
          <stop offset="1" stop-color="#8D7B98" stop-opacity=".6" />
        </linearGradient>
        <path id="l-wing_1_" class="st46" d="M95.3,655.3c0,0-4.9-16.8-4.5-7.7C91.3,656.6,95.3,655.3,95.3,655.3z" />
      </g>
      <g id="bug_2_">
        <linearGradient id="r-wing_6_" gradientUnits="userSpaceOnUse" x1="102.837" y1="670.105" x2="102.837" y2="680.458" gradientTransform="rotate(31.946 93.698 674.177)">
          <stop offset="0" stop-color="#A83759" stop-opacity=".5" />
          <stop offset=".646" stop-color="#543934" stop-opacity=".9" />
          <stop offset="1" stop-color="#8D7B98" stop-opacity=".6" />
        </linearGradient>
        <path id="r-wing_2_" class="st47" d="M95.6,682.6c0,0,15-10.3,9-3C98.5,686.7,95.6,682.6,95.6,682.6z" />
        <linearGradient id="l-wing_6_" gradientUnits="userSpaceOnUse" x1="97.126" y1="673.475" x2="97.126" y2="680.7" gradientTransform="rotate(31.946 93.698 674.177)">
          <stop offset="0" stop-color="#A83759" stop-opacity=".5" />
          <stop offset=".646" stop-color="#543934" stop-opacity=".9" />
          <stop offset="1" stop-color="#8D7B98" stop-opacity=".6" />
        </linearGradient>
        <path id="l-wing_2_" class="st48" d="M97.5,683.3c0,0-5.3-16.7-4.7-7.6C93.4,684.7,97.5,683.3,97.5,683.3z" />
      </g>
      <g id="bug_3_">
        <linearGradient id="r-wing_7_" gradientUnits="userSpaceOnUse" x1="86.326" y1="690.827" x2="86.326" y2="701.18">
          <stop offset="0" stop-color="#A83759" stop-opacity=".5" />
          <stop offset=".646" stop-color="#543934" stop-opacity=".9" />
          <stop offset="1" stop-color="#8D7B98" stop-opacity=".6" />
        </linearGradient>
        <path id="r-wing_3_" class="st49" d="M83.2,701c0,0,7.3-16.7,6-7.3C87.9,703,83.2,701,83.2,701z" />
        <linearGradient id="l-wing_7_" gradientUnits="userSpaceOnUse" x1="80.615" y1="694.197" x2="80.615" y2="701.423">
          <stop offset="0" stop-color="#A83759" stop-opacity=".5" />
          <stop offset=".646" stop-color="#543934" stop-opacity=".9" />
          <stop offset="1" stop-color="#8D7B98" stop-opacity=".6" />
        </linearGradient>
        <path id="l-wing_3_" class="st50" d="M85.2,700.7c0,0-13.3-11.3-8-4C82.6,704,85.2,700.7,85.2,700.7z" />
      </g>
      <g id="innerflower" class="st51">
        <path id="backflower" class="st52" d="M537.9,683.7c0,0,20.7-42,51.3-30c30.7,12,61.3,3.3,61.3,3.3l1.3,5.3c0,0-50.7,7.3-68.7-4 C565.2,647,537.9,683.7,537.9,683.7z" />
        <path id="flower" class="st17" d="M579.2,684c0,0,12.7,0.9,18.4-17.9c5.7-18.9,5.2-27.8,18.4-31.2c13.2-3.3,9.9,5.2,9.9,5.2 s5.2-1.4,4.2-5.7s10.4-2.4,15.6,1.9c5.2,4.2,15.6,13.7,19.8,27.4c4.2,13.7,28.3-1.9,28.3-1.9s19.4-19.4,0-24.1 c-19.4-4.7,6.1-5.7,6.1-5.7s-7.1-9.9,1.4-7.6s10.4-6.6,11.3,0.9s18.4,1.4,10.9,6.1s9.4,2.4,5.2,7.6c-4.2,5.2-12.7-10.4-18.9,3.3 c-6.1,13.7-11.8,24.1-11.8,24.1s-11.8,14.6-26,7.1s-14.6-4.2-23.1-26.9c0,0-13.7-17.7-15.1-9c-1.4,8.6-12.5,6.2-15.8,1.9 c-6-7.8-12.3,11-12.3,11S603.6,680.7,579.2,684z"
        />
        <g id="budback">
          <ellipse class="st53" cx="726.9" cy="635.1" rx="7.2" ry="3.1" />
          <ellipse class="st53" cx="717.2" cy="627" rx="6.8" ry="3.9" />
          <circle class="st53" cx="702.4" cy="621.6" r="4.1" />
          <ellipse class="st53" cx="690.5" cy="632.6" rx="7.2" ry="3.8" />
        </g>
        <g id="budmid">
          <ellipse class="st54" cx="726" cy="635" rx="5.8" ry="2.5" />
          <ellipse class="st54" cx="718.2" cy="628.5" rx="5.4" ry="3.1" />
          <circle class="st54" cx="706.5" cy="624.2" r="3.2" />
          <ellipse class="st54" cx="697" cy="633" rx="5.8" ry="3" />
        </g>
        <g id="budfirst">
          <circle class="st55" cx="707.2" cy="627.5" r="2.2" />
          <circle class="st55" cx="714.9" cy="630.4" r="3.9" />
          <circle class="st55" cx="721.2" cy="636.2" r="3.2" />
          <circle class="st55" cx="702" cy="632.2" r="3.5" />
        </g>
      </g>
    </g>
    <g id="lady">
      <ellipse class="st56" cx="879.2" cy="680.5" rx="27" ry="4.5" />
      <g id="hairripples">
        <ellipse class="st57" cx="862.2" cy="712.5" rx="60" ry="8.5" />
        <ellipse class="st57" cx="862.2" cy="712.5" rx="60" ry="8.5" />
        <ellipse class="st57" cx="862.2" cy="712.5" rx="60" ry="8.5" />
        <ellipse class="st57" cx="862.2" cy="712.5" rx="60" ry="8.5" />
        <ellipse class="st57" cx="862.2" cy="712.5" rx="60" ry="8.5" />
      </g>
      <g id="footripples">
        <ellipse class="st57" cx="303.2" cy="689" rx="57" ry="4" />
        <ellipse class="st57" cx="303.2" cy="689" rx="57" ry="4" />
        <ellipse class="st57" cx="303.2" cy="689" rx="57" ry="4" />
        <ellipse class="st57" cx="303.2" cy="689" rx="57" ry="4" />
        <ellipse class="st57" cx="303.2" cy="689" rx="57" ry="4" />
      </g>
      <g id="legripples_1_">
        <ellipse class="st57" cx="512.7" cy="697" rx="108.5" ry="8.5" />
        <ellipse class="st57" cx="512.7" cy="697" rx="108.5" ry="8.5" />
        <ellipse class="st57" cx="512.7" cy="697" rx="108.5" ry="8.5" />
        <ellipse class="st57" cx="512.7" cy="697" rx="108.5" ry="8.5" />
        <ellipse class="st57" cx="512.7" cy="697" rx="108.5" ry="8.5" />
      </g>
      <g id="handripples">
        <ellipse class="st57" cx="738.2" cy="707.5" rx="53" ry="5.5" />
        <ellipse class="st57" cx="738.2" cy="707.5" rx="53" ry="5.5" />
        <ellipse class="st57" cx="738.2" cy="707.5" rx="53" ry="5.5" />
        <ellipse class="st57" cx="738.2" cy="707.5" rx="53" ry="5.5" />
        <ellipse class="st57" cx="738.2" cy="707.5" rx="53" ry="5.5" />
      </g>
      <g id="body">
        <path class="head st58" d="M808.2,662c0,0-17.3,6.3-26.3,5.7c0,0-11.7-1.3-17-5.7l-13.3-7c0,0-4.3-7-1-14c0,0,10.7-25,27-28.3 c16.3-3.3,17.3-9,29-8c0,0,18.7-0.3,24.3,21.7C830.9,626.3,837.6,654.3,808.2,662z" />
        <path id="arm" class="st58" d="M764.7,619c0,0-14-37-19.5-39.5c0,0-8-24-39-7.5c0,0-39.5,31.5-56.5,57c0,0-8.5,9.5-5,16 c0,0,8,15.5,19.5,23.5l48.5,38c0,0,5.5,4,17.5,0s-0.5-2-0.5-2l6.5,5c0,0,10,3,7.5-2l-9.5-11c0,0,12,15.5,16.5,13.5s1.5-5.5-9.5-16 s13,18.5,15.5,16c0.9-0.9,1.3-1.8,1.5-2.8c0.4-1.7,0-3.2,0-3.2l-14.5-16.5l12.5,10.5l1.4,11.1c0,0,4.1,5.9,5.1-2.1s0.5-14,0.5-14 l-19-8.5l-17.5,4c0,0-9-0.5-12-5L676.2,638c0,0,5.5,3.5,11-2s35-33.5,35-33.5s11.5,0,13.5-11"
        />
        <path id="leg" class="st58" d="M675.2,597c0,0-9-0.5-14.5,2.5s-15,6-18.5,1.5s-30-29-39-30.5s-36-8.5-50-0.5s-59.5,47.5-59.5,47.5 s-21,18-39,22s-27.5,1-27.5,1s-22.5,0-48,12.5s-26,7.5-32,8s-10.5,3.5-10.5,3.5s-19-6.5-33-4s-10,6.5-10,6.5s-6,2-7,7 c0,0-6,2.5-6,5.5s13.5,1.5,13.5,1.5s-18-2.5-18.5-0.5s-2.5,9.5,5,9.5s75-5.5,75-5.5s7.5-8,25-4s49.5-1,49.5-1l36.5-7.5 c0,0,7-12,29.5-7.5l35.5-14c0,0,29-9.5,35.5-22s10-17,10-17"
        />
        <path class="st58" d="M435.7,680c0,0,45,22,62,22.5s60-7,60-7l47-15.5c0,0,17-9,39-1s38,12.5,46.5,10.5" />
        <path class="st60" d="M767.1,642.8c0,0-3.5,5,4.8,8.5C771.9,651.3,766.1,647.2,767.1,642.8z" />
        <path id="mouth" class="st61" d="M758.2,643c0,0,0.6,5.6,2.1,7.7c1.6,2.2,3.7,4.4,3.7,4.4" />
        <path class="st58" d="M763.2,693l82,17c0,0,26,8,30-4s-16.5-28.5-16.5-28.5l-36-23" />
        <path id="hair" class="st62" d="M842.7,679l-39.5-14.5c-14,8-5,29.5-5,29.5s42,29,47.5,25s26-11,26-11s6.5-1.5,6.5,3.5s13-8,13-8 s-5.5-11-5.5-25s-13.5-3-29.5-12.5s-15.5-7.5-10-13s6.5-19,5.5-34.5s-24.5-27.5-34-30s-8,2.5-24,2.5s-15.5,18-15.5,18 s5,8.7,14.3,16c9.3,7.3,18.7,11,16,18.3c-2.7,7.3-11,24-4.3,27.3C810.9,674,842.7,679,842.7,679z"
        />
        <path id="brow-l" class="st59" d="M787.2,636c0,0,2.4-10.9,0.5-16.5"/>
        <path id="brow-r" class="st59" d="M790.7,647.5c5.8,9.1,5.5,8.9,11.5,13.5"/>
        <path id="eye-l" class="st59" d="M777.6,624.4c0,0-0.3,8.2,2.6,10.8C780.1,635.1,774.9,632.2,777.6,624.4z"/>
        <path id="eye-r" class="st59" d="M787.9,658c0,0-7-5.3-4.2-9.4C783.7,648.6,783.6,652.9,787.9,658z"/>
      </g>
      <path class="st61" d="M755.4,647.1l1.9,5.1C757.4,652.2,755.4,649.8,755.4,647.1z" />
     <g id="yawn">
          <path id="head-y" class="st58" d="M809.4,661.3c0,0-17.3,6.3-26.3,5.7c-15.4-1.7-16.3-1-25-5.7l-9.3-5c0,0-4.3-8-1-15
            c0,0,14.7-26,31-29.3s17.3-9,29-8c0,0,18.7-0.3,24.3,21.7C832.1,625.6,838.8,653.6,809.4,661.3z"/>
          <path id="mouth-y" class="st61" d="M756.5,641.4c0,0,6.5,4.9,3.2,13.2C758.2,651.3,745.1,652.8,756.5,641.4z"/>
          <path id="eye-l-y" class="st59" d="M779.7,627.9l1.4,8.5c0,0-5-7.6-5.1-9.9s2.4,4.4,3.2,4.5S779.7,627.9,779.7,627.9z"/>
          <path id="eye-r-y" class="st59" d="M789.3,655.4l-4.8-7.2c0,0,1.5,9,2.9,10.7s-1.2-4.8-0.7-5.5 C787.3,652.8,789.3,655.4,789.3,655.4z"/>
          <path id="brow-l-y" class="st59" d="M785.7,634.8c0,0,3.4-8.2,2-12.8"/>
          <path id="brow-r-y" class="st59" d="M790,646.8c4.3,6.8,4.1,6.7,8.5,10.1"/>
        </g>
    </g>
    <g id="lizard_1_">
      <path id="tongue" class="st23" d="M218,726c0,0,2.8-2.2,7.2-0.8s7-0.8,7-0.8s-2.2,3.5-7,2s-6.5,0.8-6.5,0.8L218,726z" />
      <path id="lizardbody" class="st63" d="M193,735c2.9-1.4,3.7-5.3,6.2-7.4c0.9-0.8,2-1.3,3.1-1.9c0.7-0.3,1.4-0.7,2.1-1 c1.9-0.9,3.9-1.9,6-2.3c2.3-0.4,4.8-0.2,6.9,0.8c1.4,0.6,2.7,1.5,3.1,2.9c0.4,1.6-0.5,3.2-1.5,4.4c-3.2,4-7.9,6.6-11.2,10.5 c-0.8,1-1.5,2.1-2.4,3c-0.7,0.7-1.5,1.3-2,2.1c-0.4,0.6-0.7,1.3-1.2,1.8c-0.5,0.4-1.1,0.7-1.7,1c-0.6,0.3-1.1,0.8-1.3,1.4 c-1,0.3-1.7,0.8-2.2,1.7c-0.2,0.4-0.3,0.9-0.6,1.3c-0.3,0.6-0.9,1.1-1.3,1.6c-1.6,2-2.2,4.8-1.3,7.2c0.1,0.3,0.3,0.7,0.2,1 c-0.1,0.3-0.4,0.6-0.7,0.5c0.3,0.7,1.3,0.7,2,0.3c0.7-0.3,1.3-0.9,2-0.9c0.7,0,1.3,0.4,2,0.4c0.4,0,0.8-0.2,1.2-0.2 c0.9-0.1,1.7,0.4,2.3,1c0.6,0.6,1,1.4,1.4,2.2c-2.6,0.3-5.2,0.7-7.8,1.3l0.1,1.2c-1.2-0.4-2.4-0.6-3.6-0.6c-0.9,0-1.8,0-2.8-0.1 c-3.6-0.5-6.6-3.9-6.5-7.6c-6.7,3.5-14.7,4.4-22,2.4c-0.9-0.2-1.9-0.5-2.8-0.2c-0.8,0.4-1.3,1.3-2.1,1.8c-0.7,0.4-1.6,0.5-2.4,0.5 c-0.7,0-1.3-0.2-2-0.4c-0.7-0.2-1.4-0.2-2,0.2c-0.1,0.2,0.1,0.4,0.3,0.6c0.7,0.6,0.5,1.7,0.2,2.6c-0.2-0.1-0.4-0.4-0.4-0.7 c-0.2,0.3-0.1,0.7,0,1.1c0.1,0.3,0.3,0.7,0.2,1.1c-0.1,0.4-0.7,0.6-0.9,0.2c-0.1-0.2,0-0.5-0.1-0.8c-0.1-0.2-0.3-0.3-0.5-0.4 c-0.7-0.3-1.5-0.4-2.2-0.4c0.1,0.9-0.1,1.8-0.6,2.5c-0.2,0.2-0.4,0.4-0.6,0.5c-0.2,0-0.3-0.1-0.4-0.2c-0.2-0.3,0.4-0.7,0.1-1 c0,0-0.1-0.1-0.1-0.1c-0.6-0.4-1.4-0.5-1.9-1.1c-0.4-0.5-0.5-1.2-1.1-1.4c-0.2-0.1-0.5-0.1-0.7-0.1c-1.2,0-2.5,0-3.7,0 c-0.5,0-1,0-1.5,0.2c-0.2,0.1-0.5,0.2-0.7,0c0.4,0,0.6-0.4,0.6-0.7c-0.1-0.3-0.3-0.4-0.3-0.7c-0.1-0.4,0.1-0.9,0.4-1.2 c0.3-0.3,0.7-0.6,0.9-1c-2.3,0-4.5,0.8-6.8,1.3c-1.9,0.4-3.8,0.5-5.6,0.7c-5.3,0.4-10.5,2.5-15.7,3.5c-1.2,0.2-2.4,0.4-3.5,0.4 c-0.9,0-1.8-0.1-2.6-0.4c-0.8-0.2-0.8-1.4,0.1-1.5c2.1-0.3,4.3-0.7,6.4-1.3c3-0.8,6-1.8,9-2.8c9.7-3.3,19.4-6.7,29.1-10 c5.6-1.9,11.1-4.3,16.1-7.4C172.7,740.9,183.6,739.5,193,735z"
      />
      <path id="tongue-flick" class="st23" d="M218.7,727.2c0,0,9.2-0.2,8.2-4.2s-2.7-1.3-2.7-1.3S229.6,722.8,218.7,727.2z" />
    </g>
    <g id="balburst">
          <polygon id="one" class="st67" points="1039.5,96 1033.5,80.6 1041.5,83.3 			"/>
          <polygon id="two" class="st67" points="1064.9,131.3 1074.2,118.6 1066.2,116 			"/>
          <polygon id="three" class="st67" points="1097.5,137.3 1106.9,124.6 1110.9,134 			"/>
          <polygon id="four" class="st67" points="1086.2,167 1097.5,170.3 1093.5,161.6 			"/>
          <polygon id="five" class="st67" points="1054.9,164.6 1054.9,175.3 1061.5,172.6 			"/>
          <polygon id="six" class="st67" points="1020.2,162 1010.2,174.6 1020.2,172 			"/>
          <polygon id="seven" class="st67" points="1007.2,135.3 989.2,135.3 989.9,142.6 1003.2,138.6 			"/>
        </g>
    <g id="paper">
      <polygon id="paperback" class="st68" points="1368,322.3 1370.4,309.5 1272.9,336 1347.4,357.3 1358.7,339.6 1369.8,340.1 		"/>
      <g id="paperpaths">
        <polygon class="st66" points="1347.4,357.3 1272.9,336 1364.6,330.4 			"/>
        <polygon class="st66" points="1272.9,336 1370.4,309.5 1367.9,322.4 			"/>
        <polyline class="st66" points="1369.8,340.1 1368,322.2 1272.9,336 1369.8,340.1 1364.8,330.3 			"/>
      </g>
    </g>
    
   <g class="keyboard">
    <rect id="k1" class="kst1" width="155" height="153" x="50" y="797"/>
    <rect id="k2" x="205" class="kst2" width="155" height="153" y="797"/>
    <rect id="k3" x="350" class="kst3" width="155" y="797" height="153"/>
    <rect id="k4" x="495" y="797" class="kst4" width="155" height="153"/>
    <rect id="k5" x="640" y="797" class="kst5" width="155" height="153"/>
    <rect id="k6" x="785" y="797" class="kst6" width="155" height="153"/>
    <rect id="k7" x="920" y="797" class="kst7" width="155" height="153"/>
    <rect id="k8" x="1070" y="797" class="kst8" width="155" height="153"/>
    </g>

  </svg>
</div>
<h1>Press the asdf jkl; keys</h1>
<h2>Play the colored keyboard below and turn the sound on</h2>

            
          
!
            
              body {
  background: #333;
  font-family: 'Oswald', sans-serif;
}

h1 {
  position: absolute;
  width: 100%;
  text-align: center;
  margin-top: 40px;
  font-size: 35px;
  color: darken(#6D8265, 7%);
  opacity: 0.7;
}

h2 {
  position: absolute;
  width: 80%;
  left: 10%;
  text-align: center;
  margin-top: 5px;
  font-size: 18px;
  letter-spacing: -0.01em;
  color: darken(#6D8265, 14%);
  opacity: 0.7;
  display: none;
}

.main {
  width: 85%;
  position: absolute;
  left: 7.5%;
}

.keyboard {
  display: none;
}

#innerflower, #balburst polygon {
  opacity: 0;
}

.st0{fill:#B3C3AD; opacity:0.8; transform:translateY(10px);} .st1{opacity:0.34;fill:#B9E3CA;} .st2{opacity:0.34;fill:#C18AA0;stroke:#B9E3CA;stroke-miterlimit:10;} .st3{opacity:0.34;fill:#934654;} .st4{opacity:0.34;fill:#9F5C7B;} .st5{opacity:0.34;fill:#AE8FA8;stroke:#A2DDD7;stroke-miterlimit:10;} .st6{opacity:0.34;fill:#934654;stroke:#4FDBCA;stroke-width:2;stroke-miterlimit:10;} .st7{opacity:0.26;fill:#3BA89B;} .st8{opacity:0.34;fill:#A83759;} .st9{opacity:0.34;fill:#A83759;stroke:#4FDBCA;stroke-miterlimit:10;} .st10{opacity:0.34;fill:#8D7B98;} .st11{opacity:0.43;fill:#69D0C4;} .st12{opacity:0.67;fill:#69D0C4;} .st13{opacity:0.29;fill:#69D0C4;} .st14{fill:url(#SVGID_1_);} .st15{opacity:0.26;fill:url(#SVGID_2_);} .st16{opacity:0.13;fill:#8D7B98;} .st17{fill:#B9E3CA;} .st18{opacity:0.2;fill:#3BA89B;} .st19{fill:#69D0C4;} .st20{opacity:0.35;fill:url(#SVGID_3_);} .st21{opacity:0.35;fill:url(#SVGID_4_);transform:translateY(-10px);} .st22{opacity:0.7;fill:#69D0C4;} .st23{fill:#A83759;} .st24{fill:none;stroke:#543934;stroke-miterlimit:10;} .st25{fill:#21887E;} .st26{opacity:0.52;} .st27{fill:#3BA89B;} .st28{opacity:0.96;fill:url(#SVGID_5_);} .st29{opacity:0.96;fill:url(#SVGID_6_);} .st30{opacity:0.16;} .st31{fill:#E8E6E4;} .st32{opacity:0.7;} .st33{fill:#FFFFFF;} .st34{fill:#259386;} .st35{fill:url(#grass-shadow_1_);} .st36{fill:#1B6B61;} .st37{fill:#1E776C;}  .st39{display:inline;fill:none;stroke:#21887E;stroke-width:10;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;} .st40{display:inline;fill:none;stroke:#B9E3CA;stroke-width:10;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;} .st41{display:inline;fill:none;stroke:#C18AA0;stroke-width:10;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;} .st42{display:inline;fill:none;stroke:#A83759;stroke-width:10;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;} .st43{fill:url(#r-wing_4_);} .st44{fill:url(#l-wing_4_);} .st45{fill:url(#r-wing_5_);} .st46{fill:url(#l-wing_5_);} .st47{fill:url(#r-wing_6_);} .st48{fill:url(#l-wing_6_);} .st49{fill:url(#r-wing_7_);} .st50{fill:url(#l-wing_7_);} .st51{opacity:0.79;} .st52{opacity:0.7;stroke:#60C6B7;fill:none} .st53{fill:#60C6B7;} .st54{fill:#9DD1B6;} .st55{fill:#D0EFDC;} .st56{opacity:0.41;fill:none;stroke:#69D0C4;stroke-miterlimit:10;} .st57{fill:none;stroke:#69D0C4;stroke-miterlimit:10;} .st58{fill:#BCBFB4;} .st59{fill:#A3645B;} .st60{opacity:0.75;fill:#BA8A7B;} .st61{fill:#CE795B;} .st62{fill:#B16D67;} .st63{fill:#1F7A6F;}
.st64{fill:#CE795B;}
.st65{fill:#A3645B;}
.st68{opacity:0.27;fill:#F9F9F9;enable-background:new    ;}	.st66{opacity:0.73;fill:none;stroke:#F9F9F9;stroke-width:0.75;stroke-miterlimit:10;enable-background:new;}
.st67{fill:#DD4563;}

.kst0{fill:#FFFFFF;}
.kst1{fill:#8E2F6C;}
.kst2{fill:#A83759;}
.kst3{fill:#CE6F80;}
.kst4{fill:#BDB9B4;}
.kst5{fill:#9CA396;}
.kst6{fill:#69D0C4;}
.kst7{fill:#3BA89B;}
.kst8{fill:#21887E;}

#yawn {
  transform: translateX(-115px);
  opacity: 0;
}

#lightning path, #tongue-flick {
  visibility: hidden;
}

#lightning path, #lightning, #backflower {
  fill: none;
}

@media screen and (max-device-width:900px) {
  h1 {
    display: none;
  }
  .keyboard, h2 {
    display: block;
  }
}

            
          
!
            
              var allP = $("svg path").not(".st14, #sides path, .st29, .st28, #b-balloon, #balburst polygon");
TweenMax.set("#lightning path", {
  visibility: "visible"
});
TweenMax.set("#balburst polygon", {
  transformStyle: "preserve-3d",
  perspective: 600
});

TweenMax.to("h1", 2, {
  opacity: 0,
  delay: 4,
  ease: Circ.easeOut
});

//ripples that continually repeat
function revolve() {
  var tl = new TimelineMax({repeat: -1});

  tl.add("begin");
  tl.staggerFromTo("#hairripples ellipse", 3, {
      transformOrigin: "50% 50%",
      opacity: 1,
      scale:0
    }, {
      scale: 2,
      opacity: 0,
      repeat: -1,
      transformOrigin: "50% 50%",
      ease: Circ.easeOut
    }, 0.7, "begin");
  tl.staggerFromTo("#legripples_1_ ellipse", 2.5, {
      transformOrigin: "50% 50%",
      opacity: 1,
      scale:0
    }, {
      scale: 1.2,
      opacity: 0.4,
      transformOrigin: "50% 50%",
      repeat: -1,
      ease: Circ.easeOut
    }, 0.5, "begin+=0.5");
  tl.staggerFromTo("#footripples ellipse", 2, {
      transformOrigin: "50% 50%",
      opacity: 1,
      scale:0
    }, {
      scale: 1.5,
      opacity: 0.5,
      repeat: -1,
      transformOrigin: "50% 50%",
      ease: Circ.easeOut
    }, 0.5, "begin+=1");
  tl.staggerFromTo("#handripples ellipse", 3, {
      transformOrigin: "50% 50%",
      opacity: 1,
      scale:0
    }, {
      scale: 1,
      opacity: 0.3,
      repeat: -1,
      transformOrigin: "50% 50%",
      ease: Circ.easeOut
    }, 1, "begin+=0.2");

  return tl;
};

revolve();

//her breathing and the lizard tongue
function breathe() {
  var tl = new TimelineMax({repeat: -1});

  tl.add("begin");
  tl.fromTo("#arm", 1.5, {
      scaleY:1
    }, {
      scaleY: 0.98,
      transformOrigin: "50% 100%",
      ease: Circ.easeOut
    }, "begin");
  tl.to("#arm", 1.8, {
      scaleY:1,
      transformOrigin: "50% 100%",
      ease: Circ.easeOut
    }, "begin+=1.8");
  tl.fromTo("#leg", 1.5, {
      scaleY:1
    }, {
      scaleY: 0.98,
      transformOrigin: "50% 100%",
      ease: Circ.easeOut
    }, "begin");
  tl.to("#leg", 1.8, {
      scaleY:1,
      transformOrigin: "50% 100%",
      ease: Circ.easeOut
    }, "begin+=1.8");
  
   tl.fromTo("#tongue", 0.1, {
      transformOrigin: "0% 50%",
      scale: 0
    }, {
      scale: 1,
      transformOrigin: "0% 50%",
      ease: Linear.easeNone
    }, "begin");
  tl.to("#tongue", 0.1, {
      morphSVG: {shape:"#tongue-flick"},
      ease: Elastic.easeInOut
    }, "begin+=0.1");
  tl.to("#tongue", 0.1, {
      morphSVG: {shape:"#tongue"},
      scale: 0,
      transformOrigin: "0% 50%",
      ease: Linear.easeNone
    }, "begin+=0.2");

  return tl;
};
breathe();

//lightning
function strike() {
  var tl = new TimelineMax(),
      ch1 = "hsl(+=5%, -=5%, +=20%)",
      ch2 = "hsl(-=5%, +=5%, -=20%)";

  tl.add("begin");
  tl.staggerFromTo("#lightning path", 0.5, {
      drawSVG: "0% 0%",
      strokeWidth: 2
    }, {
      drawSVG: true,
      strokeWidth: 10,
      ease: Bounce.easeOut
    }, 0.05, "begin");
   tl.to("#mountains path", 0.2, {
      fill: ch1,
      ease: Elastic.easeOut
    }, "begin+=0");
  tl.to("#mountains path", 0.2, {
      fill: ch2,
      ease: Elastic.easeIn
    }, "begin+=0.55");
  tl.to(".st16", 0.2, {
      fill: ch1,
      ease: Elastic.easeOut
    }, "begin+=0");
  tl.to(".st16", 0.2, {
      fill: ch2,
      ease: Elastic.easeIn
    }, "begin+=0.55");
  tl.staggerTo("#lightning path", 0.2, {
      drawSVG: "100% 100%",
      strokeWidth: 2,
      ease: Bounce.easeOut
    }, 0.05, "begin+=0.55");

  return tl;
}

var lightning = new TimelineMax({paused:true});
lightning.add(strike());

//yawn
function maw() {
  var tl = new TimelineMax(),
      int = 0.3,
      int2 = 0.6,
      b = "begin",
      bSec = "begin+=1.5";

  tl.add("begin");
  tl.to("#mouth", 0.4, {
      morphSVG: {shape:"#mouth-y", shapeIndex: 1},
      opacity: 0.5,
      x: -2,
      y: 2,
      ease: SlowMo.easeOut
    }, b);
  tl.to(".head", int, {
      morphSVG: {shape:"#head-y"},
      x: -2,
      y: 1,
      ease: SlowMo.easeOut
    }, b);
  tl.to("#eye-r", 0.2, {
      morphSVG: {shape:"#eye-r-y"},
      opacity: 0.5,
      x: -1,
      ease: SlowMo.easeOut
    }, b);
  tl.to("#eye-l", 0.2, {
      morphSVG: {shape:"#eye-l-y"},
      opacity: 0.5,
      x: -1,
      ease: SlowMo.easeOut
    }, b);
  tl.to("#brow-l", int, {
      morphSVG: {shape:"#brow-l-y"},
      ease: SlowMo.easeOut
    }, b);
  tl.to("#brow-r", int, {
      morphSVG: {shape:"#brow-r-y"},
      ease: SlowMo.easeOut
    }, b);
  
    tl.to("#mouth", int2, {
      morphSVG: {shape:"#mouth"},
      opacity: 1,
      y: 0,
      x: 0,
      ease: SlowMo.easeIn
    }, bSec);
  tl.to(".head", int2, {
      morphSVG: {shape:".head"},
      x: 0,
      y: 0,
      ease: SlowMo.easeIn
    }, bSec);
  tl.to("#eye-r", int, {
      morphSVG: {shape:"#eye-r"},
      opacity: 1,
      x: 0,
      ease: SlowMo.easeIn
    }, bSec);
  tl.to("#eye-l", int, {
      morphSVG: {shape:"#eye-l"},
      x: 0,
      opacity: 1,
      ease: SlowMo.easeIn
    }, bSec);
  tl.to("#brow-l", int, {
      morphSVG: {shape:"#brow-l"},
      ease: SlowMo.easeIn
    }, bSec);
  tl.to("#brow-r", int, {
      morphSVG: {shape:"#brow-r"},
      ease: SlowMo.easeIn
    }, bSec);

  return tl;
}

var yawn = new TimelineMax({paused:true});
yawn.add(maw());


//flower
function budding() {
  var tl = new TimelineMax();

  tl.add("begin");
  tl.to("#innerflower", 0.5, {
      opacity: 0.9,
      ease: Circ.easeOut
    }, "begin");
  tl.fromTo("#backflower", 1.5, {
      strokeWidth: 5,
      drawSVG: "0 0"
    }, {
      drawSVG: true,
      strokeWidth: 1,
      ease: Circ.easeOut
    }, "begin+=0.5");
  tl.staggerFromTo("#budback", 1.5, {
      scale: 0,
      opacity:0
    }, {
      scale: 1,
      opacity: 1,
      ease: Circ.easeOut
    }, 0.4, "begin");
  tl.staggerFromTo("#budmid", 1.5, {
      scale: 0,
      opacity:0
    }, {
      scale: 1,
      opacity: 1,
      ease: Circ.easeOut
    }, 0.4, "begin+=0.5");
  tl.staggerFromTo("#budfirst", 1.5, {
      scale: 0,
      opacity:0
    }, {
      scale: 1,
      opacity: 1,
      ease: Circ.easeOut
    }, 0.4, "begin+=1");
  tl.fromTo("#flower", 1.5, {
      opacity: 0
    }, {
      opacity: 1,
      ease: Circ.easeOut
    }, "begin+=0.5");
  tl.to("#innerflower", 0.5, {
      opacity: 0,
      ease: Circ.easeIn
    }, "begin+=4");
  
  tl.timeScale(1.4);

  return tl;
}

var flower = new TimelineMax({paused:true});
flower.add(budding());


//bugs
function bugs() {
  var tl = new TimelineMax();

  tl.add("begin");
   tl.from("#bug, #bug_1_, #bug_2_, #bug_3_", 0.2, {
      opacity: 0
    }, "begin");
  tl.to($("#bug"), 2, {
    bezier:{
      type:"soft", 
      values:[{x:50, y:-22}, {x:-70, y:-105}, {x:25, y:-275}, {x:-80, y:-466}, {x:3, y:-760}]
    },
  ease:Circ.easeIn}, "begin+=0.3");
  tl.to($("#bug_1_"), 2.5, {
    bezier:{
      type:"soft", 
      values:[{x:-50, y:-50}, {x:20, y:-125}, {x:75, y:-200}, {x:0, y:-450}, {x:30, y:-700}]
    },
  ease:Circ.easeIn}, "begin");
  tl.to($("#bug_2_"), 2.75, {
    bezier:{
      type:"soft", 
      values:[{x:20, y:-35}, {x:-50, y:-75}, {x:80, y:-250}, {x:0, y:-400}, {x:25, y:-700}]
    },
  ease:Circ.easeIn}, "begin+=0.7");
  tl.to($("#bug_3_"), 1.5, {
    bezier:{
      type:"soft", 
      values:[{x:50, y:-22}, {x:-70, y:-105}, {x:25, y:-300}, {x:-80, y:-500}, {x:3, y:-800}]
    },
  ease:Circ.easeIn}, "begin+=1");

  return tl;
}

var insect = new TimelineMax({paused:true});
insect.add(bugs());

//balloon
function balloonGrow(){
  var balloon = $("#balloon")[0];
  var radius = balloon.getAttribute("r");
  var cySet = balloon.getAttribute("cy");
  balloon.setAttribute('r', parseInt(radius) + 10);
  balloon.setAttribute('cy', parseInt(cySet) - 10);
  if (parseInt(radius) > 125) {
    ion.sound.play("balloon-pop3");
    var balloonTl = new TimelineMax();
    balloonTl.add("pop");
    balloonTl.to("#balloon", 0.05, {
      scale: 5,
      opacity: 0,
      transformOrigin: "50% 50%",
      ease: Circ.easeOut
    }, "pop");
    balloonTl.fromTo("#balloon", 0.05, {
      opacity: 0,
      scale: 1
    }, {
      opacity: 1,
      scale: 1,
      transformOrigin: "50% 50%",
      ease: Circ.easeIn
    }, "pop+=0.2");
    balloonTl.fromTo("#balburst polygon", 0.6, {
        opacity: 1,
        y: 0,
        rotation: 0
        }, {
        rotation: 500,
        y: 100,
        opacity: 0,
        ease:Expo.easeOut
    }, "pop");
    setTimeout(function(){
      balloon.setAttribute("r", "45");
      balloon.setAttribute("cy", "233.5");
    }, 200);
  }
}

//colors one
function colorsOne() {
  var sceneChange = new TimelineMax();
    sceneChange.add("sch");
    sceneChange.to(allP, 1, {
      fill: "hsl(+=20%, +=5%, -=20%)",
      ease: Circ.easeOut
    }, "sch");
    sceneChange.to(allP, 1, {
      fill: "hsl(-=20%, -=5%, +=20%)",
      ease: Circ.easeIn
    }, "sch+=1.3");
  sceneChange.to(".st14", 1, {
      opacity: 0.1,
      ease: Circ.easeOut
    }, "sch");
    sceneChange.to(".st14", 1, {
      opacity: 1,
      ease: Circ.easeIn
    }, "sch+=1.3");
}

//colors two
function colorsTwo() {
  var colorChange = new TimelineMax();
  colorChange.add("col");
  colorChange.to(allP, 1.5, {
    fill: "hsl(+=50%, -=5%, -=20%)",
    ease: Circ.easeOut
  }, "col");
  colorChange.to(allP, 2, {
    fill: "hsl(-=50%, +=5%, +=20%)",
    ease: Circ.easeIn
  }, "col+=1.6");
}

// init bunch of sounds
ion.sound({
    sounds: [
        {name: "butterflies5"},
        {name: "hit2"},
        {name: "hit3"},
        {name: "hit4"},
        {name: "hit5"},
        {name: "hit6"},
        {name: "hit7"},
        {name: "hit8"},
        {name: "hit9"},
        {name: "hit10"},
        {name: "paperplane3"},
        {name: "yawn1"},
        {name: "balloon-pop3"}
    ],

    // main config
    path: "https://s3-us-west-2.amazonaws.com/s.cdpn.io/28963/",
    preload: true,
    multiplay: true,
    volume: 0.9
});

//desktop keyboard
$(document).keydown(function(e) {
    switch(e.which) {
        
        case 65: // a
          ion.sound.play("hit2");
          lightning.restart();
        break;
        
        case 70: // f
        //balloon
          balloonGrow();
          ion.sound.play("hit4");
        break;
        
        case 83: // s
          colorsOne();
          ion.sound.play("hit3");
        break;
        
        case 186: // semicolon
          colorsTwo();
          ion.sound.play("hit5");
        break;
        
        case 75: // k
          setTimeout(function(){
            ion.sound.play("butterflies5");
          }, 100);
          insect.restart();
        break;
        
        case 74: // j
          ion.sound.play("hit6");
          flower.restart();
        break;
        
        case 76: // l
          ion.sound.play("paperplane3");
          TweenMax.fromTo($("#paper"), 2, {
            x: 0,
            y: 0 
            }, {
            bezier:{
              type:"soft", 
              values:[{x:-300, y:-35}, {x:-600, y:-15}, {x:-900, y:20}, {x:-1200, y:0}, {x:-1400, y:20}]
            },
          ease:Power3.easeOut});
        break;
        
        case 68: // d
          ion.sound.play("yawn1");
          yawn.restart();
        break;
          
        default: return; // exit this handler for other keys
    }
    e.preventDefault(); // prevent scrolling with arrows
});

//make the keyboard visible to mobile devices through insanely long and arguably horrible regex
window.mobileAndTabletcheck = function() {
  var check = false;
  (function(a){if(/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino|android|ipad|playbook|silk/i.test(a)||/1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test(a.substr(0,4)))check = true})(navigator.userAgent||navigator.vendor||window.opera);
  return check;
}

if ( window.mobileAndTabletcheck() === true ) {
  $("h1").css("display", "none");
  TweenMax.to("h2", 1, {
    opacity: 0,
    delay: 4,
    ease: Circ.easeOut
  });
  
   $("#k1").on("click", function() {
      ion.sound.play("hit2");
      lightning.restart();
    });
        
   $("#k2").on("click", function() {
      balloonGrow();
      ion.sound.play("hit4");
    });
        
   $("#k3").on("click", function() {
      colorsOne();
      ion.sound.play("hit3");
    });
        
   $("#k4").on("click", function() {
      colorsTwo();
      ion.sound.play("hit5");
    });
        
   $("#k5").on("click", function() {
      ion.sound.play("butterflies5");
      insect.restart();
    });
        
   $("#k6").on("click", function() {
      ion.sound.play("hit6");
      flower.restart();
    });
        
   $("#k7").on("click", function() {
      ion.sound.play("paperplane3");
      TweenMax.fromTo($("#paper"), 2, {
        x: 0,
        y: 0 
        }, {
        bezier:{
          type:"soft", 
          values:[{x:-300, y:-35}, {x:-600, y:-15}, {x:-900, y:20}, {x:-1200, y:0}, {x:-1400, y:20}]
        },
      ease:Power3.easeOut});
    });
        
   $("#k8").on("click", function() {
        ion.sound.play("yawn1");
        yawn.restart();
    });
}


            
          
!
999px
Close

Asset uploading is a PRO feature.

As a PRO member, you can drag-and-drop upload files here to use as resources. Images, Libraries, JSON data... anything you want. You can even edit them anytime, like any other code on CodePen.

Go PRO

Loading ..................

Console