.magnetic-button{cursor:pointer;outline:none;transition:color .1s linear,background .15s linear}.magnetic-button>span{display:inline-block;position:relative;z-index:2;will-change:transform}.magnetic-btn-wrapper{perspective:2000px}.buble-wrapper{position:absolute;top:0;left:0;width:500px;height:500px;filter:url(#filter);filter:blur(50px)}@media (max-width:575px){.buble-wrapper{left:-60px!important;width:400px;height:400px}}.ball,.svg-layer{position:absolute}.ball{width:200px;height:200px;top:calc(50% - 100px);left:calc(50% - 100px)}.ball:before{background:var(--bubble-bg);border-radius:100%;position:absolute;top:0;left:0;width:100%;height:100%;content:""}.ball:first-child{transform:translate(-220px);animation:x-axis-lateral 15s ease-in-out infinite alternate}.ball:first-child:before{animation:y-axis-lateral 10s ease-in-out .1s infinite alternate}.ball:nth-child(2){animation:x-axis 15s ease-in-out infinite alternate}.ball:nth-child(2):before{animation:y-axis 10s ease-in-out .5s infinite alternate}.ball:nth-child(3){transform:translate(220px,260px);animation:x-axis-lateral 15s ease infinite alternate}.ball:nth-child(3):before{animation:y-axis-lateral 10s ease-in-out .4s infinite alternate}@keyframes x-axis{0%{transform:translate(-320px);background:var(--bubble-bg)}to{transform:translate(320px);background:var(--bubble-bg)}}@keyframes y-axis{0%{transform:translateY(140px);background:var(--bubble-bg)}to{transform:translateY(-220px) scale(.8);background:var(--bubble-bg)}}@keyframes x-axis-lateral{0%{transform:translate(-120px);background:var(--bubble-bg)}to{transform:translate(120px);background:var(--bubble-bg)}}@keyframes y-axis-lateral{0%{transform:translateY(40px);background:var(--bubble-bg)}to{transform:translateY(-200px);background:var(--bubble-bg)}}