#cards{display:flex;flex-wrap:wrap;max-width:100vw;justify-content:center;align-items:center;height:100%;gap:16px;width:calc(100% - 20px)}.card{background-color:#3f4d64f1;height:30vh;border-radius:10px;position:relative;width:30vw}#cards:hover>.card>.card-border{opacity:1}.card:hover:before{opacity:1}.card:before{background:radial-gradient(800px circle at var(--mouse-x) var(--mouse-y),rgba(171,155,150,.06),transparent 40%);z-index:3}.card:before,.card>.card-border{border-radius:inherit;content:"";height:100%;left:0;position:absolute;top:0;width:100%;transition:opacity .5s;pointer-events:none}.card>.card-border{background:radial-gradient(400px circle at var(--mouse-x) var(--mouse-y),rgba(244,184,33,.629),transparent 40%);z-index:1}.card>.card-content{background-color:#3f4d64;border-radius:inherit;margin:1px;height:calc(100% - 2px);width:calc(100% - 2px);position:relative;z-index:2;padding:20px;color:#fff}@keyframes fade-in{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in{animation:fade-in .3s ease-out}.col-sm-2{padding:10px;border-radius:4px;height:125px;margin-bottom:10px}.sp{width:32px;height:32px;clear:both;margin:20px auto}.sp-wave{border-radius:50%;position:relative;opacity:1}.sp-wave:before,.sp-wave:after{content:"";border:1px solid var(--sp-color, #3b82f6);border-radius:50%;width:100%;height:100%;position:absolute;left:0}.sp-wave:before{transform:scale(1);opacity:1;animation:spWaveBe .6s infinite linear}.sp-wave:after{transform:scale(0);opacity:0;animation:spWaveAf .6s infinite linear}@keyframes spWaveAf{0%{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}@keyframes spWaveBe{0%{-webkit-transform:scale(1,1);opacity:1}to{-webkit-transform:scale(1.5,1.5);opacity:0}}
