1<div class="flex items-center justify-center rounded-[25px] pointer-events-none w-[20.5em] h-[17em] bg-[#87ceeb] hover:bg-[#171717] active:bg-black transition duration-500 ease-in-out overflow-hidden">
2  <div class="group">
3  <button class="relative z-[2] cursor-pointer top-[13em] left-[7em] pointer-events-auto w-[6em] h-[6em] rounded-full bg-gradient-to-br from-yellow-400 via-yellow-400 to-orange-500 hover:from-gray-400 hover:to-slate-200 transition duration-500 ease-in-out shadow-[0px_0px_100px_rgba(255,212,59,0.5),0px_0px_100px_rgba(255,102,0,0.5)] hover:shadow-[0px_0px_100px_rgba(233,233,233,0.5),0px_0px_100px_rgba(192,192,192,0.5);] hover:opacity-100 active:shadow-none">
4  <div class="relative opacity-0 left-[65%] top-[25%] w-[1.1em] h-[1.1em] rounded-full bg-[#a6a6a6] shadow-[inset_-3px_1px_1px_#7b7b7b,inset_0px_-1px_1px_#d1d1d1] transition duration-500 ease-in-out group-hover:opacity-100"></div>
5  <div class="relative opacity-0 left-[80%] top-[25%] w-[.45em] h-[.45em] rounded-full bg-[#a6a6a6] shadow-[inset_-3px_1px_1px_#7b7b7b,inset_0px_-1px_1px_#d1d1d1] transition duration-500 ease-in-out group-hover:opacity-100"></div>
6  <div class="relative opacity-0 left-[65%] top-[20%] w-[.8em] h-[.8em] rounded-full bg-[#a6a6a6] shadow-[inset_-3px_1px_1px_#7b7b7b,inset_0px_-1px_1px_#d1d1d1] transition duration-500 ease-in-out group-hover:opacity-100"></div>
7  <svg class="relative w-[6em] h-[6em] bottom-[39%] opacity-0 shadow-none transition duration-500 ease-in-out group-active:opacity-100" width="141.11111mm" height="141.11111mm" viewBox="0 0 500.00001 500.00001" id="svg4770" version="1.1" xmlns="http://www.w3.org/2000/svg">
8      <defs id="defs4772"></defs>
9      <metadata id="metadata4775">
10      image/svg+xml</metadata>
11      <g id="layer1" transform="translate(92.857148,-1130.9336)">
12        <g transform="translate(264.28569,744.28568)" id="g5318">
13          <ellipse ry="250" rx="249.99994" style="fill:#178181;fill-opacity:1" cx="-107.1429" cy="636.64795" id="circle4657"></ellipse>
14          <path style="fill:#2aa846;fill-opacity:1" d="m 142.85704,636.64796 c 0,-50.15918 -14.76953,-96.86621 -40.20019,-136.01074 0,0 -14.261714,20.83398 -11.582027,34.22558 2.677734,13.39356 18.413077,14.41602 16.796867,24.24024 -1.61621,9.82422 -13.223625,-2.81153 -27.511708,23.0791 -14.287106,25.89258 -7.140623,61.61719 13.392575,64.29102 20.534173,2.67187 49.104483,-9.8252 49.104483,-9.8252 z" id="path4659"></path>
15          <path style="fill:#2aa846;fill-opacity:1" d="m -41.488621,395.3589 c 29.098626,7.89843 56.087877,20.92187 79.938457,38.03808 0,0 -28.9882739,-4.78125 -39.9697165,5.03711 -10.9804665,9.82129 -26.9951105,33.03907 -39.9697165,0 -12.972653,-33.03711 9.76e-4,-43.07519 9.76e-4,-43.07519 z" id="path4661"></path>
16          <path style="fill:#2aa846;fill-opacity:1" d="m -295.11258,471.82276 c 45.81835,-52.21191 113.04294,-85.1748 187.96968,-85.1748 0,0 -16.96093,10.26953 15.181635,27.67969 32.143547,17.41211 17.410152,25.44629 10.713865,30.80371 -6.695311,5.35742 -18.309566,-10.71387 -25.8955,-21.42676 -7.58691,-10.71582 -40.16796,-27.23144 -65.16991,-18.30078 -25.00097,8.93066 -46.42479,15.52734 -42.85643,23.83594 3.56738,8.30664 46.42479,-7.75879 62.49608,-6.87012 16.07128,0.89062 10.71386,10.70996 -4.46192,22.31836 -15.17773,11.6084 -16.96679,25.89258 -0.89453,34.82031 16.07031,8.93164 35.70898,9.8252 40.1787,4.46875 4.4668,-5.35742 -8.03613,-40.17871 22.322264,-25.00195 30.35839,15.17676 55.359361,24.1123 30.35839,46.43066 -25.001946,22.31641 -53.571274,47.3252 -54.465804,61.60547 -0.89453,14.28223 8.93164,25.89844 3.57422,26.78711 -5.35743,0.88867 -10.27442,-5.80176 -13.84375,-10.71582 -3.56738,-4.91113 -20.08886,-6.69434 -28.12402,-3.57227 -8.03613,3.12207 -23.21679,15.17676 -14.73242,26.78516 8.48535,11.61035 20.08301,6.24609 31.69336,11.60449 11.60839,5.35742 22.43358,25.74707 20.21093,30.35547 -2.22266,4.60645 -12.11816,-1.22656 -20.21093,-16.96191 -8.09473,-15.73731 -23.27637,-5.35742 -33.958,-8.03614 -10.68262,-2.67773 -18.71875,-4.46289 -29.43359,-23.21386 -10.71484,-18.74903 -32.89745,-23.9961 -41.9619,-34.82031 -25.96582,-31.00586 -24.1084,-54.46387 -29.46484,-65.17774 -5.35742,-10.7168 -19.22558,-28.22266 -19.22558,-28.22266 z" id="path4663"></path>
17          <path style="fill:#2aa846;fill-opacity:1" d="m -83.036462,640.22023 c 0,0 26.786126,2.67382 40.178701,14.28418 13.392575,11.60839 15.181637,16.07519 35.7158115,20.53808 20.5341745,4.46094 29.4648365,16.06543 16.0712852,38.38965 -13.3925749,22.32129 -37.5038967,58.03711 -49.1083867,68.75195 -11.603512,10.71582 -25.890618,19.64356 -31.248039,37.5 -5.356444,17.85449 -7.145506,28.5625 4.46289,35.71094 0,0 -6.246093,15.18066 -20.533198,-4.46289 -14.288082,-19.64551 -2.679687,-42.85645 0,-56.25 2.677733,-13.3916 9.819333,-53.56641 5.355467,-63.39258 -4.460936,-9.82324 -25.000969,-16.07519 -30.358389,-36.60742 -5.35742,-20.5332 4.01855,-60.49219 29.463858,-54.46191 z" id="path4665"></path>
18          <path style="opacity:0.36700056;fill:#414141;fill-opacity:1;enable-background:new" d="m -283.92019,459.87256 c 97.63181,-97.63379 255.919848,-97.63184 353.552638,0 97.632792,97.62988 97.632792,255.91992 9.7e-4,353.55175 0,0 113.425772,-149.99023 -47.16111,-310.57714 C -138.11554,342.25927 -283.92019,459.87256 -283.92019,459.87256 Z" id="path4667"></path>
19        </g>
20      </g>
21    </svg>
22  </button>
23  <div class="relative blur-[0.5px] opacity-80 top-[2.4em] left-[-1em] bg-[#f5f5f5] w-[50px] h-[50px] rounded-full shadow-[#f5f5f5_65px_-15px_0_-5px,#f5f5f5_25px_-25px,#f5f5f5_30px_10px,#f5f5f5_60px_15px_0_-10px,#f5f5f5_85px_5px_0_-5px] group-hover:opacity-0 group-active:opacity-0 transition duration-500 ease-in-out"></div>
24  <div class="relative blur-[0.5px] opacity-80 opacity-100 top-[6em] left-[13em] bg-[#f5f5f5] w-[50px] h-[50px] rounded-full shadow-[#f5f5f5_65px_-15px_0_-5px,#f5f5f5_25px_-25px,#f5f5f5_30px_10px,#f5f5f5_60px_15px_0_-10px,#f5f5f5_85px_5px_0_-5px] group-hover:opacity-0 group-active:opacity-0 transition duration-500 ease-in-out"></div>
25  <div class="relative bottom-[7em] left-[-0.1em] w-[20em] h-[17em] transition duration-500 ease-in-out opacity-0 group-hover:opacity-100 scale-[1.2] group-active:scale-[1]">
26    <div class="animate-pulse w-[2px] h-[2px] bg-white rounded-full shadow-[220px_118px_#fff,280px_176px_#fff,40px_50px_#fff,60px_180px_#fff,200px_250px_#fff]"></div>
27    <div class="animate-[pulse_1s_infinite_100ms] w-[2px] h-[2px] bg-white rounded-full shadow-[120px_170px_#fff,_180px_176px_#fff,_140px_45px_#fff,_10px_230px_#fff,_70px_120px_#fff,_170px_10px_#fff,_70px_70px_#fff]"></div>
28    <div class="animate-[pulse_1s_infinite_200ms] w-[2px] h-[2px] bg-white rounded-full shadow-[20px_130px_#fff,_300px_130px_#fff,_80px_20px_#fff,_190px_50px_#fff,_270px_20px_#fff,_240px_70px_#fff,_170px_210px_#fff]"></div>
29    <div class="animate-[pulse_1s_infinite_300ms] w-[2px] h-[2px] bg-white rounded-full shadow-[120px_230px_#fff,_110px_80px_#fff,_280px_80px_#fff,_280px_230px_#fff,_220px_190px_#fff,_100px_200px_#fff,_250px_150px_#fff]"></div>
30  </div>
31  </div>
32</div>