Back to buttons

Live preview

Preview settings

Changes appear as you type. Use Tab to test keyboard focus.

⌘ / Ctrl + S saves locally

Sameer2244's hover button

HTML, CSS or Tailwind, and a little JavaScript. One button or a group of up to six.

By Sameer2244

Remix button

Button submission checks

Checks will appear after the preview updates.

Buttons only: no full pages, forms, cards or navigation. Put scripts in the JavaScript tab. Tailwind uses utilities from HTML and JavaScript; use complete class names. Custom CSS supports plain CSS, without @apply, imports or plugins.

Accessibility quick check

Waiting for the rendered preview…

Try Tab, Enter and Space in the preview. Check the focus ring, hover and disabled states, then enable Reduce motion. These checks are guidance, not an accessibility certification.

Explore freely here. Remix to publish your version with credit to the creator.

About Sameer2244's hover button

Sameer2244's hover button is an animated CSS button by Sameer2244. Preview the interaction, customize its HTML, styles and JavaScript, or download the files with creator credit.

Effects and categories
Hover effects, Icon, 3D, Animated
Using this example
Copy the HTML or download index.html, style.css and app.js. Test keyboard focus, motion and contrast in your own project.

Usage, Tailwind and licensing questions

Read the source files

HTML

<div class="button-container">
  <div class="button">
    
    <div class="button-icon">
        <div class="one"></div>
        <div class="two"></div>
        <div class="dots"></div>
        <div class="dots2"></div>
    </div>
  </div>
    <div class="coin">
    <svg id="svg" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="50" height="50" viewBox="0, 0, 400,400"><g id="svgg"><path id="path0" d="M149.843 25.433 C 149.709 25.781,149.600 31.361,149.600 37.833 L 149.600 49.600 125.374 49.600 C 109.439 49.600,100.883 49.742,100.374 50.014 C 99.622 50.417,99.600 51.116,99.600 75.014 L 99.600 99.600 87.833 99.600 C 81.361 99.600,75.781 99.709,75.433 99.843 C 74.881 100.054,74.350 299.616,74.900 300.085 C 74.955 300.132,80.580 300.267,87.400 300.385 L 99.800 300.600 99.903 325.300 L 100.006 350.000 124.370 350.000 C 137.771 350.000,149.019 350.109,149.367 350.243 C 149.925 350.457,150.000 351.926,150.000 362.643 L 150.000 374.800 199.994 374.800 L 249.988 374.800 250.094 362.500 L 250.200 350.200 275.000 350.000 L 299.800 349.800 300.000 325.000 L 300.200 300.200 312.500 300.094 L 324.800 299.988 324.800 200.000 L 324.800 100.012 312.500 99.906 L 300.200 99.800 300.000 75.000 L 299.800 50.200 275.200 50.000 L 250.600 49.800 250.385 37.400 C 250.267 30.580,250.132 24.955,250.085 24.900 C 249.617 24.352,150.054 24.881,149.843 25.433 M249.503 37.600 C 249.594 48.500,249.677 49.853,250.279 50.300 C 250.783 50.674,253.964 50.800,262.876 50.800 L 274.800 50.800 274.800 74.920 C 274.800 93.147,274.917 99.157,275.280 99.520 C 275.631 99.871,278.880 100.000,287.400 100.000 C 295.920 100.000,299.169 100.129,299.520 100.480 C 300.219 101.179,300.219 298.821,299.520 299.520 C 299.169 299.871,295.920 300.000,287.400 300.000 C 278.880 300.000,275.631 300.129,275.280 300.480 C 274.928 300.832,274.800 304.142,274.800 312.880 L 274.800 324.800 262.880 324.800 C 254.142 324.800,250.832 324.928,250.480 325.280 C 250.129 325.631,250.000 328.887,250.000 337.431 C 250.000 346.811,249.893 349.191,249.453 349.556 C 248.912 350.005,188.755 349.927,125.500 349.395 L 100.800 349.188 100.800 325.070 C 100.800 306.402,100.687 300.801,100.300 300.279 C 99.853 299.677,98.500 299.594,87.600 299.503 L 75.400 299.400 75.400 200.000 L 75.400 100.600 87.800 100.400 L 100.200 100.200 100.303 75.303 L 100.406 50.406 125.303 50.303 L 150.200 50.200 150.301 38.200 C 150.357 31.600,150.486 25.974,150.589 25.698 C 150.738 25.299,160.848 25.218,200.088 25.298 L 249.400 25.400 249.503 37.600 M224.672 99.861 C 224.522 100.011,224.400 144.923,224.400 199.667 L 224.400 299.200 200.029 299.200 C 178.406 299.200,175.586 299.271,175.029 299.829 C 174.385 300.473,174.033 323.378,174.643 324.967 C 175.014 325.934,224.986 325.934,225.357 324.967 C 225.491 324.619,225.600 318.952,225.600 312.373 L 225.600 300.412 237.900 300.306 L 250.200 300.200 250.200 200.000 L 250.200 99.800 237.572 99.694 C 230.627 99.636,224.822 99.711,224.672 99.861 M249.520 100.480 C 250.280 101.240,250.212 298.926,249.452 299.557 C 249.063 299.880,245.489 299.981,237.152 299.906 L 225.400 299.800 225.298 200.400 C 225.241 145.730,225.280 100.775,225.385 100.500 C 225.653 99.794,248.815 99.775,249.520 100.480 M224.600 312.400 L 224.600 324.600 200.000 324.600 L 175.400 324.600 175.294 312.805 C 175.235 306.317,175.275 300.781,175.382 300.502 C 175.538 300.097,180.575 300.015,200.089 300.097 L 224.600 300.200 224.600 312.400" stroke="none" fill="#dc9c34" fill-rule="evenodd"></path><path id="path1" d="M150.352 75.159 L 149.400 75.930 149.400 87.665 L 149.400 99.400 137.665 99.400 L 125.930 99.400 125.164 100.345 C 124.414 101.272,124.401 103.479,124.499 213.345 L 124.600 325.400 149.500 325.503 L 174.400 325.606 174.400 313.003 L 174.400 300.400 162.480 300.400 C 153.742 300.400,150.432 300.272,150.080 299.920 C 149.709 299.549,149.600 276.702,149.600 199.520 L 149.600 99.600 162.006 99.600 L 174.411 99.600 174.306 87.100 L 174.200 74.600 162.752 74.494 C 151.955 74.394,151.249 74.432,150.352 75.159 M225.867 74.667 C 225.720 74.813,225.600 80.483,225.600 87.267 L 225.600 99.600 238.000 99.600 L 250.400 99.600 250.400 200.000 L 250.400 300.400 238.000 300.400 L 225.600 300.400 225.600 313.000 L 225.600 325.600 237.300 325.587 C 252.518 325.569,250.800 327.243,250.800 312.436 L 250.800 300.800 262.436 300.800 C 274.014 300.800,274.076 300.796,274.823 299.900 C 276.000 298.489,276.000 101.511,274.823 100.100 C 274.076 99.204,274.014 99.200,262.436 99.200 L 250.800 99.200 250.800 87.574 C 250.800 80.324,250.644 75.656,250.386 75.174 C 249.966 74.389,226.627 73.906,225.867 74.667 M175.600 175.370 L 175.600 250.351 177.300 250.600 C 179.735 250.958,199.870 250.665,200.267 250.267 C 200.701 249.832,200.909 103.531,200.478 101.868 L 200.149 100.600 187.875 100.494 L 175.600 100.388 175.600 175.370" stroke="none" fill="#fce912" fill-rule="evenodd"></path><path id="path2" d="M150.668 25.465 C 150.521 25.613,150.400 31.193,150.400 37.867 L 150.400 50.000 200.006 50.000 L 249.612 50.000 249.506 37.700 L 249.400 25.400 200.168 25.298 C 173.091 25.243,150.816 25.318,150.668 25.465 M100.400 75.200 L 100.400 100.000 112.320 100.000 C 121.058 100.000,124.368 99.872,124.720 99.520 C 125.072 99.168,125.200 95.858,125.200 87.120 L 125.200 75.200 137.120 75.200 C 145.858 75.200,149.168 75.072,149.520 74.720 C 149.872 74.368,150.000 71.058,150.000 62.320 L 150.000 50.400 125.200 50.400 L 100.400 50.400 100.400 75.200 M175.383 75.301 C 175.275 75.580,175.236 81.207,175.294 87.804 L 175.400 99.800 200.000 99.800 L 224.600 99.800 224.600 87.400 L 224.600 75.000 200.089 74.897 C 180.581 74.815,175.538 74.897,175.383 75.301 M150.486 100.474 C 149.782 101.178,149.776 298.816,150.480 299.520 C 151.183 300.223,174.134 300.204,174.713 299.500 C 174.993 299.159,175.040 267.381,174.862 199.600 L 174.600 100.200 162.786 100.094 C 153.932 100.015,150.850 100.110,150.486 100.474 M75.385 100.900 C 75.280 101.175,75.241 145.950,75.298 200.400 L 75.400 299.400 87.700 299.506 L 100.000 299.612 100.000 200.006 L 100.000 100.400 87.787 100.400 C 78.385 100.400,75.531 100.515,75.385 100.900" stroke="none" fill="#fcfcfc" fill-rule="evenodd"></path><path id="path3" d="M149.200 12.200 L 149.200 24.400 124.200 24.400 L 99.200 24.400 99.200 36.800 L 99.200 49.200 86.800 49.200 L 74.400 49.200 74.400 74.200 L 74.400 99.200 61.800 99.200 L 49.200 99.200 49.200 200.000 L 49.200 300.800 61.800 300.800 L 74.400 300.800 74.400 325.800 L 74.400 350.800 86.800 350.800 L 99.200 350.800 99.200 363.200 L 99.200 375.600 124.200 375.600 L 149.200 375.600 149.200 387.800 L 149.200 400.000 200.000 400.000 L 250.800 400.000 250.800 387.800 L 250.800 375.600 275.800 375.600 L 300.800 375.600 300.800 363.200 L 300.800 350.800 313.200 350.800 L 325.600 350.800 325.600 325.800 L 325.600 300.800 338.200 300.800 L 350.800 300.800 350.800 200.000 L 350.800 99.200 338.200 99.200 L 325.600 99.200 325.600 74.200 L 325.600 49.200 313.200 49.200 L 300.800 49.200 300.800 36.800 L 300.800 24.400 275.800 24.400 L 250.800 24.400 250.800 12.200 L 250.800 0.000 200.000 0.000 L 149.200 0.000 149.200 12.200 M250.085 24.900 C 250.132 24.955,250.267 30.580,250.385 37.400 L 250.600 49.800 275.200 50.000 L 299.800 50.200 300.000 75.000 L 300.200 99.800 312.500 99.906 L 324.800 100.012 324.800 200.000 L 324.800 299.988 312.500 300.094 L 300.200 300.200 300.000 325.000 L 299.800 349.800 275.000 350.000 L 250.200 350.200 250.094 362.500 L 249.988 374.800 199.994 374.800 L 150.000 374.800 150.000 362.643 C 150.000 351.926,149.925 350.457,149.367 350.243 C 149.019 350.109,137.771 350.000,124.370 350.000 L 100.006 350.000 99.903 325.300 L 99.800 300.600 87.400 300.385 C 80.580 300.267,74.955 300.132,74.900 300.085 C 74.350 299.616,74.881 100.054,75.433 99.843 C 75.781 99.709,81.361 99.600,87.833 99.600 L 99.600 99.600 99.600 75.014 C 99.600 51.116,99.622 50.417,100.374 50.014 C 100.883 49.742,109.439 49.600,125.374 49.600 L 149.600 49.600 149.600 37.833 C 149.600 31.361,149.709 25.781,149.843 25.433 C 150.054 24.881,249.617 24.352,250.085 24.900 M225.385 100.500 C 225.280 100.775,225.241 145.730,225.298 200.400 L 225.400 299.800 237.152 299.906 C 245.489 299.981,249.063 299.880,249.452 299.557 C 250.212 298.926,250.280 101.240,249.520 100.480 C 248.815 99.775,225.653 99.794,225.385 100.500 M175.382 300.502 C 175.275 300.781,175.235 306.317,175.294 312.805 L 175.400 324.600 200.000 324.600 L 224.600 324.600 224.600 312.400 L 224.600 300.200 200.089 300.097 C 180.575 300.015,175.538 300.097,175.382 300.502" stroke="none" fill="#040404" fill-rule="evenodd"></path><path id="path4" d="M150.000 62.117 C 150.000 71.013,149.872 74.368,149.520 74.720 C 149.168 75.072,145.858 75.200,137.120 75.200 L 125.200 75.200 125.200 87.120 C 125.200 95.858,125.072 99.168,124.720 99.520 C 124.368 99.872,121.013 100.000,112.118 100.000 L 99.997 100.000 100.194 200.100 C 100.302 255.155,100.486 311.222,100.601 324.694 L 100.812 349.188 125.506 349.395 C 188.744 349.927,248.912 350.005,249.453 349.556 C 249.893 349.191,250.000 346.811,250.000 337.431 C 250.000 328.887,250.129 325.631,250.480 325.280 C 250.832 324.928,254.142 324.800,262.880 324.800 L 274.800 324.800 274.800 312.880 C 274.800 304.142,274.928 300.832,275.280 300.480 C 275.631 300.129,278.880 300.000,287.400 300.000 C 295.920 300.000,299.169 299.871,299.520 299.520 C 300.219 298.821,300.219 101.179,299.520 100.480 C 299.169 100.129,295.920 100.000,287.400 100.000 C 278.880 100.000,275.631 99.871,275.280 99.520 C 274.917 99.157,274.800 93.149,274.800 74.931 L 274.800 50.823 262.500 50.603 C 255.735 50.481,227.655 50.295,200.100 50.188 L 150.000 49.994 150.000 62.117 M174.306 87.100 L 174.411 99.600 162.034 99.600 L 149.658 99.600 149.398 97.500 C 149.256 96.345,149.198 91.019,149.270 85.664 C 149.439 73.045,147.857 74.356,162.752 74.494 L 174.200 74.600 174.306 87.100 M250.386 75.174 C 250.644 75.656,250.800 80.324,250.800 87.574 L 250.800 99.200 262.436 99.200 C 274.014 99.200,274.076 99.204,274.823 100.100 C 276.000 101.511,276.000 298.489,274.823 299.900 C 274.076 300.796,274.014 300.800,262.436 300.800 L 250.800 300.800 250.800 312.436 C 250.800 324.014,250.796 324.076,249.900 324.823 C 248.763 325.771,225.627 326.035,225.568 325.100 C 225.543 324.700,225.496 324.700,225.335 325.100 C 225.039 325.833,174.803 325.833,174.794 325.100 C 174.789 324.702,174.722 324.703,174.468 325.103 C 174.216 325.500,168.929 325.584,149.374 325.503 L 124.600 325.400 124.499 213.345 C 124.401 103.529,124.414 101.271,125.163 100.345 C 125.968 99.351,141.708 98.684,147.500 99.398 L 149.600 99.658 149.600 199.549 C 149.600 276.709,149.709 299.549,150.080 299.920 C 150.867 300.707,174.262 300.595,175.057 299.800 C 175.577 299.280,178.898 299.200,200.029 299.200 L 224.400 299.200 224.400 199.587 C 224.400 111.412,224.469 99.948,225.000 99.745 C 225.515 99.547,225.600 97.780,225.600 87.224 C 225.600 80.464,225.720 74.813,225.867 74.667 C 226.627 73.906,249.966 74.389,250.386 75.174 M224.600 87.400 L 224.600 99.800 200.000 99.800 L 175.400 99.800 175.294 87.804 C 175.236 81.207,175.275 75.580,175.383 75.301 C 175.538 74.897,180.581 74.815,200.089 74.897 L 224.600 75.000 224.600 87.400 M174.862 199.600 C 175.040 267.381,174.993 299.159,174.713 299.500 C 174.134 300.204,151.183 300.223,150.480 299.520 C 149.776 298.816,149.782 101.178,150.486 100.474 C 150.850 100.110,153.932 100.015,162.786 100.094 L 174.600 100.200 174.862 199.600 M200.478 101.868 C 200.909 103.531,200.701 249.832,200.267 250.267 C 199.870 250.665,179.735 250.958,177.300 250.600 L 175.600 250.351 175.600 175.370 L 175.600 100.388 187.875 100.494 L 200.149 100.600 200.478 101.868" stroke="none" fill="#fcdc34" fill-rule="evenodd"></path></g></svg>
  </div>
  
    <div class="mario">
    <svg id="svg" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="100" height="92" viewBox="0, 0, 400,368"><g id="svgg"><path id="path0" d="M289.948 11.326 C 290.108 28.231,288.862 26.999,306.063 27.256 L 318.388 27.440 319.231 28.692 C 320.059 29.921,320.074 30.125,320.074 40.132 C 320.074 49.877,320.106 50.357,320.825 51.128 L 321.576 51.934 345.963 51.975 C 359.376 51.998,372.049 52.060,374.125 52.113 L 377.901 52.210 377.901 26.105 L 377.901 0.000 333.871 0.000 L 289.841 0.000 289.948 11.326 M160.988 52.644 C 160.138 53.182,159.908 56.293,159.880 67.609 C 159.858 76.232,159.751 78.451,159.331 79.027 C 158.837 79.703,158.146 79.752,146.699 79.926 C 135.920 80.090,134.480 80.182,133.593 80.764 L 132.597 81.417 132.597 92.125 C 132.597 106.807,131.325 105.709,148.340 105.709 L 158.314 105.709 159.083 107.299 C 159.809 108.799,159.853 109.489,159.853 119.573 L 159.853 130.258 159.000 131.059 L 158.148 131.860 133.033 131.860 L 107.919 131.860 107.919 107.019 L 107.919 82.177 107.030 81.144 L 106.142 80.110 93.965 79.992 L 81.788 79.873 80.843 80.818 L 79.898 81.763 80.004 106.036 C 80.106 129.308,80.139 130.342,80.812 131.085 C 81.499 131.844,81.778 131.860,94.072 131.866 C 101.331 131.869,106.863 132.019,107.182 132.220 C 108.040 132.762,108.190 152.555,107.357 155.433 C 107.035 156.547,106.596 158.122,106.383 158.932 C 106.039 160.235,105.766 160.506,104.010 161.279 L 102.026 162.154 102.026 172.237 L 102.026 182.320 103.455 182.320 C 104.241 182.320,105.978 182.732,107.315 183.235 L 109.746 184.150 123.473 184.082 C 139.569 184.003,144.940 183.997,200.000 183.997 C 255.389 183.997,260.530 184.003,276.427 184.086 C 289.176 184.153,290.115 184.113,290.976 183.476 L 291.897 182.794 291.994 171.877 L 292.092 160.960 291.161 159.486 L 290.230 158.011 253.679 158.009 C 214.489 158.007,214.999 158.031,213.189 156.094 L 212.155 154.987 212.155 144.217 C 212.155 130.059,210.872 131.164,227.335 131.140 C 237.770 131.124,238.298 131.090,238.661 130.411 C 239.149 129.499,239.176 109.793,238.691 108.516 L 238.340 107.592 227.733 107.479 C 215.815 107.353,214.944 107.163,212.998 104.273 L 212.155 103.022 212.136 80.516 C 212.116 57.346,211.953 53.234,211.028 52.649 C 210.332 52.209,161.683 52.204,160.988 52.644 M241.275 52.997 C 240.512 54.422,240.754 102.525,241.529 103.453 C 242.155 104.203,242.504 104.227,254.013 104.322 C 269.628 104.451,268.198 103.015,268.488 118.858 C 268.643 127.269,268.809 130.098,269.171 130.460 C 269.549 130.838,274.903 130.996,294.585 131.209 C 308.300 131.357,325.466 131.570,332.733 131.683 C 344.404 131.863,346.048 131.819,346.836 131.303 L 347.728 130.718 347.621 119.595 C 347.525 109.628,347.443 108.328,346.830 107.095 L 346.145 105.719 333.953 105.622 L 321.760 105.525 320.917 104.273 C 320.087 103.042,320.074 102.853,320.074 92.551 L 320.074 82.080 318.997 81.003 L 317.920 79.926 305.745 79.926 C 290.751 79.926,289.871 79.713,289.871 76.083 L 289.871 74.770 279.926 74.770 L 269.982 74.770 269.978 66.206 C 269.974 54.695,269.886 54.057,268.186 53.177 C 266.045 52.069,241.858 51.907,241.275 52.997 M268.204 237.317 C 267.416 238.156,267.403 238.354,267.403 250.225 L 267.403 262.280 268.307 263.184 L 269.211 264.088 279.926 264.088 L 290.641 264.088 291.555 263.175 L 292.468 262.261 292.439 250.407 C 292.410 238.801,292.290 237.476,291.197 236.746 C 290.974 236.597,285.890 236.473,279.898 236.470 L 269.005 236.464 268.204 237.317 M188.749 265.063 L 187.845 266.038 187.845 276.357 L 187.845 286.676 188.782 288.273 L 189.718 289.871 199.987 289.871 L 210.257 289.871 211.403 288.906 C 213.577 287.077,213.628 286.783,213.628 276.141 C 213.628 263.140,214.700 264.088,200.007 264.088 L 189.652 264.088 188.749 265.063 M24.933 293.476 C 24.228 294.255,23.802 310.605,24.494 310.375 C 24.717 310.301,24.934 307.006,25.046 301.996 C 25.147 297.454,25.364 293.531,25.528 293.278 C 25.966 292.602,25.619 292.717,24.933 293.476" stroke="none" fill="#ecbf86" fill-rule="evenodd"></path><path id="path1" d="M217.779 55.525 C 217.623 56.082,217.495 66.814,217.495 79.374 L 217.495 102.210 227.901 102.308 L 238.306 102.406 238.302 79.840 C 238.299 67.429,238.195 56.653,238.069 55.893 L 237.841 54.512 227.951 54.512 L 218.062 54.512 217.779 55.525 M54.144 74.801 C 52.408 75.135,50.828 76.491,50.830 77.645 C 50.831 78.044,51.090 77.846,51.547 77.095 C 52.832 74.988,52.922 74.973,66.114 74.751 L 78.269 74.546 67.035 74.514 C 60.856 74.497,55.055 74.626,54.144 74.801 M241.844 109.975 C 241.721 110.295,241.621 115.433,241.621 121.393 C 241.621 135.285,243.204 133.702,229.312 133.702 C 223.352 133.702,218.214 133.802,217.894 133.925 C 217.382 134.122,217.311 135.378,217.311 144.238 L 217.311 154.328 267.772 154.328 L 318.232 154.328 318.232 144.249 L 318.232 134.170 316.523 133.936 C 315.583 133.807,304.125 133.702,291.060 133.702 C 260.265 133.702,263.372 135.198,263.360 120.363 C 263.352 110.652,263.317 110.136,262.639 109.774 C 261.350 109.083,242.115 109.270,241.844 109.975 M135.820 185.899 L 134.807 186.053 134.807 196.108 L 134.807 206.164 136.281 207.139 L 137.755 208.115 147.975 208.017 L 158.195 207.919 158.293 196.777 L 158.390 185.635 147.611 185.691 C 141.683 185.721,136.377 185.815,135.820 185.899 M241.621 196.287 C 241.621 202.145,241.721 207.200,241.844 207.521 C 242.041 208.032,243.305 208.103,252.256 208.103 L 262.444 208.103 263.819 207.169 L 265.193 206.235 265.193 196.168 L 265.193 186.100 263.812 185.872 C 263.052 185.746,257.749 185.642,252.026 185.639 L 241.621 185.635 241.621 196.287 M344.499 207.369 C 343.595 207.733,343.116 208.506,342.789 210.129 C 342.589 211.119,342.632 211.090,343.198 209.845 C 343.546 209.082,344.328 208.130,344.936 207.730 C 346.085 206.974,345.887 206.810,344.499 207.369 M342.259 212.523 C 342.259 213.232,342.334 213.522,342.427 213.168 C 342.520 212.813,342.520 212.233,342.427 211.878 C 342.334 211.524,342.259 211.814,342.259 212.523 M161.572 213.874 C 161.436 214.009,161.326 225.261,161.326 238.879 C 161.326 262.707,161.299 263.671,160.622 264.508 L 159.918 265.378 119.646 265.562 C 97.496 265.663,79.084 265.888,78.729 266.062 C 78.139 266.351,78.085 267.216,78.085 276.322 L 78.085 286.266 78.997 286.984 C 80.999 288.559,81.031 289.058,81.031 318.854 L 81.031 346.229 161.101 346.222 C 224.253 346.216,241.246 346.119,241.527 345.759 C 241.723 345.509,241.895 344.175,241.909 342.795 C 241.931 340.608,242.057 340.163,242.883 339.337 L 243.831 338.389 243.831 328.311 L 243.831 318.232 295.304 318.232 L 346.777 318.232 346.698 278.545 C 346.654 256.717,346.521 238.015,346.403 236.983 L 346.186 235.108 344.336 234.681 C 343.041 234.382,335.801 234.254,320.230 234.254 L 297.974 234.254 297.974 224.316 L 297.974 214.379 296.961 214.107 C 296.404 213.958,289.982 213.831,282.689 213.824 L 269.429 213.812 269.429 224.125 L 269.429 234.438 281.215 234.622 C 287.698 234.724,293.209 234.941,293.462 235.105 C 294.131 235.537,294.116 262.763,293.447 264.088 C 292.578 265.808,291.087 265.990,278.890 265.862 L 267.725 265.746 266.091 263.940 L 264.457 262.134 264.455 251.785 C 264.453 241.680,264.195 238.849,263.219 238.219 C 262.988 238.070,246.344 237.946,226.231 237.943 C 185.406 237.937,187.486 238.066,186.768 235.481 C 186.535 234.641,186.375 229.933,186.374 223.849 L 186.372 213.628 174.095 213.628 C 167.342 213.628,161.707 213.738,161.572 213.874 M213.501 263.164 C 216.832 264.153,216.742 263.825,216.878 275.452 C 217.086 293.148,217.049 293.186,200.027 293.186 C 185.448 293.186,186.605 294.487,186.437 277.901 C 186.310 265.378,186.472 263.771,187.935 263.066 C 189.321 262.398,211.203 262.482,213.501 263.164 M23.771 291.160 C 23.183 292.385,22.921 310.498,23.492 310.498 C 23.752 310.497,24.045 310.287,24.143 310.031 C 24.505 309.089,24.136 290.401,23.771 291.160" stroke="none" fill="#3d44bd" fill-rule="evenodd"></path><path id="path2" d="M102.026 11.045 L 102.026 22.089 90.147 22.186 L 78.269 22.284 78.173 37.293 L 78.076 52.302 118.688 52.315 C 198.090 52.340,211.968 52.284,213.444 51.933 C 215.444 51.458,238.631 51.461,240.000 51.936 C 240.618 52.151,246.506 52.345,253.959 52.397 C 268.106 52.495,269.613 52.718,269.613 54.718 C 269.613 55.162,269.717 56.043,269.843 56.676 L 270.074 57.827 279.972 57.827 L 289.871 57.827 289.871 66.108 L 289.871 74.390 279.834 74.494 L 269.797 74.598 279.834 74.684 L 289.871 74.770 289.871 76.083 C 289.871 79.713,290.751 79.926,305.745 79.926 L 317.920 79.926 318.997 81.003 L 320.074 82.080 320.074 92.551 C 320.074 102.853,320.087 103.042,320.917 104.273 L 321.760 105.525 333.953 105.622 L 346.145 105.719 346.830 107.095 C 347.979 109.408,348.072 130.294,346.937 131.215 C 346.216 131.801,345.002 131.860,333.700 131.860 C 322.694 131.860,321.232 131.927,321.034 132.443 C 320.911 132.763,320.810 137.732,320.810 143.485 C 320.810 159.238,322.068 158.011,305.925 158.011 L 293.960 158.011 293.021 159.243 L 292.081 160.475 292.081 171.555 L 292.081 182.635 291.111 183.399 C 290.181 184.130,289.703 184.162,279.766 184.162 C 272.189 184.162,269.273 184.281,268.950 184.604 C 268.367 185.188,268.320 207.561,268.900 209.085 C 269.502 210.668,269.516 210.670,280.411 210.676 C 291.081 210.682,291.415 210.726,293.186 212.355 C 295.119 214.133,313.351 215.315,320.534 214.128 L 321.915 213.900 321.915 199.952 L 321.915 186.004 335.912 186.004 L 349.908 186.004 349.908 160.041 L 349.908 134.079 363.812 133.982 L 377.716 133.886 377.810 93.094 C 377.885 60.596,377.810 52.294,377.442 52.264 C 375.389 52.097,366.919 52.021,345.963 51.981 L 321.576 51.934 320.825 51.128 C 320.106 50.357,320.074 49.877,320.074 40.132 C 320.074 30.125,320.059 29.921,319.231 28.692 L 318.388 27.440 306.063 27.256 C 297.773 27.132,293.422 26.930,292.771 26.638 C 291.878 26.237,290.239 23.582,290.239 22.536 C 290.239 22.204,284.666 22.099,267.035 22.099 L 243.831 22.099 243.831 11.050 L 243.831 0.000 172.928 0.000 L 102.026 0.000 102.026 11.045 M54.544 75.125 C 53.008 75.373,51.197 76.787,51.197 77.737 C 51.197 78.370,52.117 78.098,52.602 77.321 C 53.717 75.535,55.026 75.336,67.035 75.123 L 78.269 74.924 67.219 74.893 C 61.142 74.876,55.438 74.980,54.544 75.125 M26.151 182.873 C 26.151 183.177,25.894 183.425,25.581 183.425 C 25.267 183.425,24.604 183.864,24.108 184.400 L 23.204 185.375 23.204 210.023 C 23.204 236.196,23.168 235.677,25.057 236.654 C 26.044 237.165,26.151 237.396,26.151 239.026 C 26.151 242.094,25.704 241.989,38.700 241.989 L 50.092 241.989 50.092 253.920 C 50.092 264.460,50.160 265.877,50.675 266.075 C 50.995 266.198,57.227 266.298,64.523 266.298 L 77.789 266.298 78.791 265.225 C 80.529 263.365,80.219 263.379,120.427 263.367 C 153.899 263.356,158.230 263.291,158.733 262.788 C 159.775 261.746,159.776 214.466,158.734 213.141 L 157.958 212.155 146.290 212.149 C 130.366 212.142,131.787 213.635,131.574 196.685 C 131.483 189.445,131.284 184.910,131.046 184.622 C 130.758 184.274,128.127 184.162,120.221 184.162 C 109.979 184.162,109.730 184.144,107.331 183.241 L 104.885 182.320 65.518 182.320 C 30.771 182.320,26.151 182.385,26.151 182.873 M160.925 185.168 C 160.374 186.617,160.648 208.327,161.234 209.669 L 161.676 210.681 173.864 210.681 C 190.071 210.681,188.582 209.329,188.582 224.050 C 188.582 233.786,188.629 234.551,189.268 235.130 C 190.181 235.955,264.389 235.898,265.838 235.070 L 266.667 234.597 266.661 224.204 C 266.658 218.489,266.534 213.634,266.385 213.417 C 265.779 212.532,264.144 212.382,252.893 212.181 L 241.146 211.971 240.370 210.931 C 239.627 209.936,239.587 209.375,239.411 197.488 C 239.309 190.665,239.092 184.876,238.929 184.622 C 238.693 184.259,230.494 184.162,199.969 184.162 L 161.308 184.162 160.925 185.168 M345.120 207.572 C 343.826 208.481,342.607 210.595,342.583 211.971 C 342.574 212.514,342.700 212.417,343.065 211.602 C 343.337 210.994,344.051 210.000,344.652 209.392 C 345.581 208.452,346.844 206.591,346.514 206.648 C 346.456 206.658,345.829 207.074,345.120 207.572 M342.335 223.941 C 342.335 229.715,342.386 232.076,342.449 229.190 C 342.511 226.303,342.511 221.579,342.449 218.692 C 342.386 215.806,342.335 218.168,342.335 223.941 M25.138 289.217 C 24.490 289.910,24.309 290.537,24.309 292.096 L 24.309 294.090 25.252 293.148 C 26.064 292.336,26.178 291.938,26.080 290.269 L 25.967 288.332 25.138 289.217" stroke="none" fill="#fc0404" fill-rule="evenodd"></path><path id="path3" d="M212.948 52.002 C 211.518 52.321,211.377 52.445,211.629 53.159 C 211.784 53.599,212.007 65.094,212.125 78.703 C 212.368 106.771,212.093 104.514,215.502 106.446 C 217.116 107.360,217.197 107.367,227.733 107.479 L 238.340 107.592 238.691 108.516 C 239.176 109.793,239.149 129.499,238.661 130.411 C 238.298 131.090,237.770 131.124,227.335 131.140 C 210.872 131.164,212.155 130.059,212.155 144.217 L 212.155 154.987 213.189 156.094 C 214.999 158.031,214.488 158.007,253.696 158.009 L 290.264 158.011 291.055 159.351 L 291.845 160.690 292.920 159.351 L 293.994 158.011 305.942 158.011 C 322.066 158.011,320.759 159.338,320.901 142.821 L 320.994 131.867 319.927 131.495 C 319.249 131.259,309.944 131.123,294.491 131.123 C 274.027 131.123,270.008 131.040,269.407 130.601 C 268.735 130.109,268.680 129.411,268.488 118.906 C 268.198 103.002,269.647 104.454,253.920 104.313 L 241.987 104.207 241.425 103.350 C 240.934 102.599,240.877 99.379,240.966 77.401 L 241.068 52.310 240.000 51.938 C 238.628 51.459,215.127 51.515,212.948 52.002 M78.085 63.720 L 78.085 75.138 67.654 75.138 C 56.324 75.138,54.097 75.433,52.778 77.110 C 52.410 77.578,51.653 78.075,51.094 78.215 L 50.080 78.470 50.178 119.517 C 50.271 158.351,50.312 160.599,50.934 161.221 C 51.550 161.837,53.175 161.885,76.884 161.983 L 102.176 162.087 104.085 161.246 C 105.761 160.508,106.042 160.225,106.383 158.932 C 106.596 158.122,107.035 156.547,107.357 155.433 C 108.190 152.555,108.040 132.762,107.182 132.220 C 106.863 132.019,101.331 131.869,94.072 131.866 C 81.778 131.860,81.499 131.844,80.812 131.085 C 80.139 130.342,80.106 129.308,80.004 106.036 L 79.898 81.763 80.843 80.818 L 81.788 79.873 93.965 79.992 L 106.142 80.110 107.030 81.144 L 107.919 82.177 107.919 107.019 L 107.919 131.860 133.085 131.860 L 158.251 131.860 159.052 131.008 C 160.272 129.709,160.298 109.808,159.083 107.299 L 158.314 105.709 148.340 105.709 C 131.325 105.709,132.597 106.807,132.597 92.125 L 132.597 81.417 133.593 80.764 C 134.480 80.182,135.918 80.090,146.651 79.926 C 155.846 79.786,158.826 79.629,159.191 79.264 C 159.555 78.900,159.719 75.827,159.879 66.373 C 159.995 59.546,160.211 53.692,160.359 53.365 C 160.827 52.337,159.455 52.302,118.186 52.302 L 78.085 52.302 78.085 63.720 M238.730 55.525 C 239.468 57.748,239.607 101.210,238.882 102.947 L 238.343 104.236 228.095 104.236 L 217.847 104.236 216.491 103.118 L 215.135 102.000 215.135 80.190 L 215.135 58.379 216.131 56.266 L 217.127 54.153 227.699 54.148 L 238.271 54.144 238.730 55.525 M263.892 107.946 C 266.721 109.004,266.667 108.766,266.667 120.152 C 266.667 131.170,266.687 131.280,268.881 132.415 C 269.793 132.887,273.390 132.965,294.094 132.965 L 318.243 132.965 318.146 143.738 L 318.048 154.512 304.788 154.696 C 295.148 154.830,291.309 155.006,290.724 155.341 C 290.096 155.700,282.049 155.801,253.942 155.801 L 217.964 155.801 216.533 154.997 L 215.101 154.192 215.101 144.141 L 215.101 134.089 216.188 133.527 C 217.087 133.062,219.080 132.965,227.741 132.965 C 241.894 132.965,240.823 134.079,240.872 119.307 C 240.900 111.205,241.010 109.112,241.457 108.248 L 242.008 107.182 251.929 107.182 C 261.066 107.182,262.012 107.243,263.892 107.946 M370.411 182.566 C 370.276 182.701,370.166 188.088,370.166 194.537 L 370.166 206.262 358.748 206.262 C 348.333 206.262,347.280 206.318,346.767 206.906 C 346.458 207.261,345.614 208.214,344.893 209.024 C 342.561 211.642,342.541 211.764,342.541 223.561 L 342.541 234.254 344.314 234.254 C 348.910 234.254,348.775 232.886,348.783 279.558 C 348.787 300.322,348.793 317.518,348.796 317.772 C 348.802 318.135,354.172 318.232,374.401 318.232 L 400.000 318.232 400.000 250.276 L 400.000 182.320 385.328 182.320 C 377.259 182.320,370.546 182.431,370.411 182.566 M131.676 184.375 C 131.070 184.629,131.601 207.938,132.254 209.750 C 133.107 212.120,133.243 212.143,146.290 212.149 L 157.958 212.155 158.734 213.141 C 159.771 214.460,159.776 261.746,158.739 262.782 C 158.244 263.277,153.593 263.355,119.696 263.440 C 81.910 263.534,81.193 263.549,79.956 264.276 C 78.049 265.396,78.042 266.042,79.944 265.371 C 81.274 264.902,86.897 264.825,119.907 264.825 L 158.323 264.825 159.456 263.692 L 160.589 262.558 160.589 237.966 C 160.589 214.609,160.623 213.343,161.263 212.764 C 161.861 212.223,163.288 212.155,173.943 212.155 L 185.950 212.155 186.714 213.125 C 187.444 214.054,187.477 214.534,187.477 224.331 L 187.477 234.566 188.431 235.699 L 189.384 236.832 228.320 236.832 C 254.842 236.832,267.378 236.955,267.640 237.216 C 267.906 237.483,268.168 237.426,268.495 237.032 C 268.815 236.647,268.834 236.464,268.553 236.464 C 267.693 236.464,268.004 213.764,268.877 212.891 C 270.146 211.622,289.598 211.777,292.394 213.079 C 293.477 213.584,294.886 213.981,295.525 213.963 L 296.685 213.930 295.396 213.566 C 294.687 213.366,293.692 212.821,293.186 212.355 C 291.413 210.724,291.086 210.681,280.345 210.681 C 268.981 210.681,269.116 210.708,268.690 208.368 C 268.571 207.716,268.523 202.087,268.583 195.860 C 268.699 183.885,268.736 184.162,267.024 184.162 C 266.423 184.162,266.384 184.299,266.714 185.246 C 267.143 186.475,266.958 208.153,266.508 209.445 C 266.106 210.599,265.193 210.681,252.837 210.681 L 241.678 210.681 241.189 209.300 C 240.821 208.261,240.700 204.974,240.700 196.041 C 240.700 184.494,240.623 183.689,239.595 184.444 C 238.771 185.049,239.495 209.758,240.370 210.931 L 241.146 211.971 252.893 212.181 C 264.144 212.382,265.779 212.532,266.385 213.417 C 266.534 213.634,266.658 218.489,266.661 224.204 L 266.667 234.597 265.838 235.070 C 264.389 235.898,190.181 235.955,189.268 235.130 C 188.629 234.551,188.582 233.786,188.582 224.050 C 188.582 209.329,190.071 210.681,173.864 210.681 L 161.676 210.681 161.225 209.669 C 160.900 208.937,160.774 205.328,160.774 196.685 C 160.773 185.127,160.690 184.183,159.669 184.168 C 159.430 184.164,159.300 188.621,159.300 196.813 C 159.300 206.994,159.202 209.583,158.795 210.073 C 158.345 210.614,157.105 210.679,147.561 210.661 C 135.726 210.638,134.624 210.478,133.706 208.656 C 133.025 207.305,132.668 187.017,133.293 185.224 C 133.663 184.162,133.006 183.817,131.676 184.375 M26.796 286.442 C 26.254 286.583,26.151 287.051,26.151 289.370 C 26.151 290.903,25.946 292.487,25.691 292.934 C 25.377 293.482,25.172 296.379,25.046 302.026 L 24.862 310.313 12.431 310.410 L 0.000 310.507 0.000 339.416 L 0.000 368.324 28.913 368.324 L 57.827 368.324 57.827 357.280 L 57.827 346.236 68.526 346.138 L 79.224 346.041 79.197 318.785 C 79.173 296.286,79.074 291.079,78.627 288.950 C 78.329 287.532,78.085 286.331,78.085 286.280 C 78.085 286.111,27.451 286.271,26.796 286.442" stroke="none" fill="#844323" fill-rule="evenodd"></path><path id="path4" d="M216.131 56.266 L 215.135 58.379 215.135 80.190 L 215.135 102.000 216.491 103.118 L 217.847 104.236 228.095 104.236 L 238.343 104.236 238.882 102.947 C 239.607 101.210,239.468 57.748,238.730 55.525 L 238.271 54.144 227.699 54.148 L 217.127 54.153 216.131 56.266 M238.069 55.893 C 238.195 56.653,238.299 67.429,238.302 79.840 L 238.306 102.406 227.901 102.308 L 217.495 102.210 217.495 79.374 C 217.495 66.814,217.623 56.082,217.779 55.525 L 218.062 54.512 227.951 54.512 L 237.841 54.512 238.069 55.893 M241.457 108.248 C 241.010 109.112,240.900 111.205,240.872 119.307 C 240.823 134.079,241.894 132.965,227.741 132.965 C 219.080 132.965,217.087 133.062,216.188 133.527 L 215.101 134.089 215.101 144.141 L 215.101 154.192 216.533 154.997 L 217.964 155.801 253.942 155.801 C 282.049 155.801,290.096 155.700,290.724 155.341 C 291.308 155.007,295.167 154.827,304.788 154.685 C 312.081 154.578,295.382 154.453,267.680 154.409 L 217.311 154.328 217.311 144.238 C 217.311 135.378,217.382 134.122,217.894 133.925 C 218.214 133.802,223.352 133.702,229.312 133.702 C 243.204 133.702,241.621 135.285,241.621 121.393 C 241.621 115.433,241.721 110.295,241.844 109.975 C 242.115 109.270,261.350 109.083,262.639 109.774 C 263.317 110.136,263.352 110.652,263.360 120.363 C 263.372 135.200,259.948 133.637,292.742 133.777 C 312.947 133.863,318.232 133.790,318.232 133.425 C 318.232 133.062,313.158 132.965,294.089 132.965 C 273.389 132.965,269.793 132.886,268.881 132.415 C 266.687 131.280,266.667 131.170,266.667 120.152 C 266.667 114.169,266.518 109.802,266.300 109.395 C 265.343 107.607,262.585 107.182,251.929 107.182 L 242.008 107.182 241.457 108.248 M135.803 184.059 C 132.934 184.248,132.965 184.119,132.965 195.993 C 132.965 206.926,133.215 208.872,134.747 209.877 C 136.208 210.835,158.000 211.030,158.779 210.092 C 159.369 209.381,159.574 184.868,158.994 184.285 C 158.687 183.977,139.818 183.793,135.803 184.059 M241.541 184.024 C 240.558 184.315,240.455 185.787,240.599 197.431 C 240.695 205.214,240.869 208.626,241.213 209.484 L 241.693 210.681 252.845 210.681 C 266.173 210.681,266.185 210.680,266.566 208.887 C 267.077 206.487,266.916 185.000,266.382 184.467 C 265.910 183.995,243.015 183.586,241.541 184.024 M158.293 196.777 L 158.195 207.919 147.975 208.017 L 137.755 208.115 136.281 207.139 L 134.807 206.164 134.807 196.108 L 134.807 186.053 135.820 185.899 C 136.377 185.815,141.683 185.721,147.611 185.691 L 158.390 185.635 158.293 196.777 M263.812 185.872 L 265.193 186.100 265.193 196.168 L 265.193 206.235 263.819 207.169 L 262.444 208.103 252.256 208.103 C 243.305 208.103,242.041 208.032,241.844 207.521 C 241.721 207.200,241.621 202.145,241.621 196.287 L 241.621 185.635 252.026 185.639 C 257.749 185.642,263.052 185.746,263.812 185.872 M161.199 212.828 C 160.645 213.441,160.589 215.723,160.589 238.030 L 160.589 262.558 159.461 263.687 L 158.333 264.815 119.406 264.912 C 83.055 265.003,80.393 265.052,79.190 265.659 C 78.481 266.017,78.232 266.182,78.637 266.028 C 79.042 265.873,97.476 265.663,119.600 265.562 C 157.583 265.388,159.863 265.341,160.484 264.720 C 161.099 264.105,161.154 262.422,161.326 238.937 L 161.510 213.812 173.941 213.715 L 186.372 213.618 186.374 223.844 C 186.375 229.932,186.535 234.641,186.768 235.481 C 187.486 238.066,185.406 237.937,226.231 237.943 C 246.344 237.946,262.988 238.070,263.219 238.219 C 264.195 238.849,264.453 241.680,264.455 251.785 L 264.457 262.134 266.091 263.940 L 267.725 265.746 278.890 265.862 C 291.087 265.990,292.578 265.808,293.447 264.088 C 294.116 262.763,294.131 235.537,293.462 235.105 C 293.209 234.941,287.698 234.724,281.215 234.622 L 269.429 234.438 269.429 224.125 L 269.429 213.812 281.709 213.812 L 293.988 213.812 292.206 212.988 C 289.577 211.773,270.076 211.692,268.877 212.891 C 268.172 213.596,268.140 214.119,268.140 225.046 L 268.140 236.464 279.466 236.470 C 285.695 236.473,290.974 236.597,291.197 236.746 C 292.290 237.476,292.410 238.801,292.439 250.407 L 292.468 262.261 291.555 263.175 L 290.641 264.088 279.926 264.088 L 269.211 264.088 268.294 263.171 L 267.377 262.254 267.418 249.635 L 267.459 237.017 228.420 236.923 L 189.381 236.829 188.429 235.698 L 187.477 234.566 187.477 224.331 C 187.477 214.534,187.444 214.054,186.714 213.125 L 185.950 212.155 173.879 212.155 C 162.653 212.155,161.766 212.202,161.199 212.828 M344.618 234.710 C 346.710 235.215,346.584 232.495,346.589 277.410 C 346.593 319.277,346.559 318.232,347.909 318.232 L 348.777 318.232 348.777 280.018 C 348.777 233.243,348.862 234.172,344.590 234.298 L 343.094 234.343 344.618 234.710 M187.935 263.066 C 186.472 263.771,186.310 265.378,186.437 277.901 C 186.605 294.487,185.448 293.186,200.027 293.186 C 217.049 293.186,217.086 293.148,216.878 275.452 C 216.742 263.825,216.832 264.153,213.501 263.164 C 211.203 262.482,189.321 262.398,187.935 263.066 M211.166 264.503 C 213.708 265.812,213.628 265.432,213.628 276.141 C 213.628 286.783,213.577 287.077,211.403 288.906 L 210.257 289.871 199.987 289.871 L 189.718 289.871 188.782 288.273 L 187.845 286.676 187.845 276.357 L 187.845 266.038 188.749 265.063 L 189.652 264.088 200.007 264.088 C 206.954 264.088,210.626 264.225,211.166 264.503 M78.238 287.201 C 79.044 289.764,79.176 294.116,79.199 318.977 L 79.224 346.225 80.128 346.225 L 81.031 346.225 81.031 318.843 C 81.031 289.920,80.986 289.074,79.342 287.258 C 78.547 286.380,77.970 286.350,78.238 287.201" stroke="none" fill="#585488" fill-rule="evenodd"></path></g></svg>
    </div>
  <p>long click</p>
</div>

CSS


.button {
  width: 6rem;
  height: 6rem;
  background-color: #da6b34;
  border-radius: 0;
  box-shadow: 5px 5px 0px black;
  transform: translate(0,0);
  z-index: 1;
  padding: 0;
  position: relative;
}

.coin {
  position: absolute;
  z-index: -2;
  top: 50%;
  transform: translate(0,-20px);
  right: 45%;
}

.mario {
  position: absolute;
  z-index: 1;
  top: 50%;
  transform: translate(15px,200px);
  right: 45%;
}

.button:active ~ .mario {
  animation: jump2 0.6s ease-in-out;
}

.button:active {
  transform: translate(0,-15px);
}

.button:active ~ .coin {
  animation: jump 1s;
}

.button:hover {
  animation: animate 1s infinite;
}

.button-icon {
  position: relative;
  top: 25%;
  left: 63%;
  z-index: 1;
  transform: scale(1.5);
}

.overlay {
  position: absolute;
  width: 6rem;
  height: 6rem;
  background-color: #FFC07B;
}

.one {
  position: absolute;
  background-color: #DE5917;
  box-shadow: 2px 2px 0px black;
  width: 1rem;
  height: 0.35rem;
  z-index: 10;
}

.one:after {
  content: "";
  position: absolute;
  background-color: #DE5917;
  box-shadow: 2px 2px 0px black;
  width: 0.5rem;
  height: 0.5rem;
  transform: translate(5px,15px);
  z-index: 10;
}

.one:before {
  content: "";
  position: absolute;
  background-color: #DE5917;
  box-shadow: 2px 2px 0px black;
  width: 0.5rem;
  height: 0.5rem;
  transform: translate(5px,25px);
  z-index: 10;
}

.two {
  position: absolute;
  background-color: #DE5917;
  box-shadow: 2px 2px 0px black;
  width: 0.5rem;
  height: 0.5rem;
  transform: translate(-50%,50%);
  z-index: 10;
}

.two::after {
  content: "";
  position: absolute;
  background-color: #DE5917;
  box-shadow: 2px 2px 0px black;
  width: 0.5rem;
  height: 0.8rem;
  transform: translate(190%,-5%);
  z-index: 10;
}

.two::before {
  content: "";
  position: absolute;
  background-color: #DE5917;
  width: 0.7rem;
  height: 0.3rem;
  transform: translate(12px,8px);
  z-index: 10;
}

.dots {
  position: absolute;
  width: 5px;
  height: 5px;
  transform: translate(-20px,-12px);
  background-color: #000;
}

.dots::after {
  content: "";
  position: absolute;
  width: 5px;
  height: 5px;
  transform: translate(50px,0px);
  background-color: #000;
}

.dots2 {
  position: absolute;
  width: 5px;
  height: 5px;
  transform: translate(-20px,40px);
  background-color: #000;
}

.dots2::after {
  content: "";
  position: absolute;
  width: 5px;
  height: 5px;
  transform: translate(50px,0px);
  background-color: #000;
}

@keyframes animate {
  0% {
    background-color: #FFC07B;
  }

  75% {
    background-color: #DE5917;
  }

  100% {
    background-color: #da6b34;
  }
}

@keyframes jump {
  0% {
    transform: translate(0,-15px) rotateY(0deg);
  }

  50% {
    transform: translate(0,-200px) rotateY(180deg);
  }

  75% {
    transform: translate(0,-15px) rotateY(270deg);
  }

  100% {
    transform: translate(0,-15px) rotateY(360deg);
  }
}

.button-container p {
  color: black;
  text-align: center;
  transform: translate(0,1rem);
  font-weight: bold;
  z-index: -2;
}

@keyframes jump2 {
  0% {
    transform: translate(20px,200px);
  }

  50% {
    transform: translate(20px,25px);
  }

  100% {
    transform: translate(20px,200px);
  }
}