/*.heart {*/
/*    width: 100px;*/
/*    height: 100px;*/
/*    position: absolute;*/
/*    left: 50%;*/
/*    top: 50%;*/
/*    transform: translate(-50%, -50%);*/
/*    background: url(images/icons/heart.png) no-repeat;*/
/*    background-position: 0 0;*/
/*    cursor: pointer;*/
/*    animation: fave-heart 1s steps(28);*/
/*}*/
/*.scale .heart {*/
/*    background-position: -2800px 0;*/
/*    transition: background 1s steps(28);*/
/*}*/
/*@keyframes fave-heart {*/
/*    0% {*/
/*        background-position: 0 0;*/
/*    }*/
/*    100% {*/
/*        background-position: -2800px 0;*/
/*    }*/
/*}*/

.clicked svg path{
    fill: #7760F9;
    stroke: #7760F9;
}
#clap{
    cursor:pointer;
    text-decoration: none;
}
.canvas{position:relative; flex-wrap: nowrap; }
.canvas,.canvas .total-counter{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.canvas .total-counter{width:100%;position:relative;padding-left:0; line-height:1;color:#6B7280;font-size: 0.875rem;font-weight: 500; white-space: nowrap}.canvas .total-counter.fader{-webkit-animation:fade-in .4s forwards;animation:fade-in .4s forwards}.canvas .clap-container{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;position:absolute; left:0.7rem;width:1.5rem;height:1.5rem;z-index:2;background:#fff;border-radius:50%;}.canvas .clap-container .clap-icon{font-size:30px;color:#7760F9;width:30px;height:30px}.canvas .clap-container.scale{-webkit-animation:scaleAndBack .7s forwards;animation:scaleAndBack .7s forwards}.canvas .click-counter{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:35px;height:35px;position:absolute;top:105%;background-color:#fff;border-radius:50%;z-index:1;opacity:0}.canvas .click-counter .counter{font-family:sans-serif;font-size:14px;color:#fff}.canvas .click-counter.first-active{-webkit-animation:first-bump-in 1s forwards;animation:first-bump-in 1s forwards}.canvas .click-counter.active{-webkit-animation:bump-in 1s forwards;animation:bump-in 1s forwards}.canvas .clap-container-sonar{width:60px;height:60px;background:#7760F9;border-radius:50%;position:absolute;opacity:0;z-index:0}.canvas .particles-container{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:60px;height:60px;position: absolute;left:-8px;}.canvas .particles-container .triangle{border:2px solid transparent;border-top:5px solid #fff;position:absolute}.clicked .canvas .particles-container .triangle{border-top:5px solid #7760F9FF;}.canvas .particles-container .triangle .square{width:5px;height:5px;background:#fff;position:absolute;left:0;top:-2px}.clicked .canvas .particles-container .triangle .square{background:#7760F9FF;}.canvas .particles-container .pop-top{-webkit-animation:pop-top 1s forwards;animation:pop-top 1s forwards}.canvas .particles-container .pop-top-left{-webkit-animation:pop-top-left 1s forwards;animation:pop-top-left 1s forwards}.canvas .particles-container .pop-top-right{-webkit-animation:pop-top-right 1s forwards;animation:pop-top-right 1s forwards}.canvas .particles-container .pop-bottom-right{-webkit-animation:pop-bottom-right 1s forwards;animation:pop-bottom-right 1s forwards}.canvas .particles-container .pop-bottom-left{-webkit-animation:pop-bottom-left 1s forwards;animation:pop-bottom-left 1s forwards}
.LikeBtn-buttonIcon{display:block;width:42px;min-width:24px;height:25px;font-size:0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M15.7 4C18.87 4 21 6.98 21 9.76C21 15.39 12.16 20 12 20C11.84 20 3 15.39 3 9.76C3 6.98 5.13 4 8.3 4C10.12 4 11.31 4.91 12 5.71C12.69 4.91 13.88 4 15.7 4Z' stroke='%236B7280' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3C/path%3E%3C/svg%3E");
    background-repeat:no-repeat;background-size:cover}
.clicked .LikeBtn-buttonIcon{background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M15.7 4C18.87 4 21 6.98 21 9.76C21 15.39 12.16 20 12 20C11.84 20 3 15.39 3 9.76C3 6.98 5.13 4 8.3 4C10.12 4 11.31 4.91 12 5.71C12.69 4.91 13.88 4 15.7 4Z' stroke='%237760F9' fill='%237760F9' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3C/path%3E%3C/svg%3E");}
@-webkit-keyframes sonar-wave{0%{opacity:.7}to{-webkit-transform:scale(1.4);transform:scale(1.4);opacity:0}}@keyframes sonar-wave{0%{opacity:.7}to{-webkit-transform:scale(1.4);transform:scale(1.4);opacity:0}}@-webkit-keyframes fade-in{0%{opacity:0}50%{opacity:0}to{opacity:1}}@keyframes fade-in{0%{opacity:0}50%{opacity:0}to{opacity:1}}@-webkit-keyframes pop-top{0%{-webkit-transform:translate(0) rotate(0);transform:translate(0) rotate(0);opacity:.4}to{-webkit-transform:translateY(-100px) rotate(0);transform:translateY(-100px) rotate(0);opacity:0}}@keyframes pop-top{0%{-webkit-transform:translate(0) rotate(0);transform:translate(0) rotate(0);opacity:.4}to{-webkit-transform:translateY(-100px) rotate(0);transform:translateY(-100px) rotate(0);opacity:0}}@-webkit-keyframes pop-top-left{0%{-webkit-transform:translate(0) rotate(-55deg);transform:translate(0) rotate(-55deg);opacity:.4}to{-webkit-transform:translate(-100px,-50px) rotate(-55deg);transform:translate(-100px,-50px) rotate(-55deg);opacity:0}}@keyframes pop-top-left{0%{-webkit-transform:translate(0) rotate(-55deg);transform:translate(0) rotate(-55deg);opacity:.4}to{-webkit-transform:translate(-100px,-50px) rotate(-55deg);transform:translate(-100px,-50px) rotate(-55deg);opacity:0}}@-webkit-keyframes pop-top-right{0%{-webkit-transform:translate(0) rotate(55deg);transform:translate(0) rotate(55deg);opacity:.4}to{-webkit-transform:translate(100px,-50px) rotate(55deg);transform:translate(100px,-50px) rotate(55deg);opacity:0}}@keyframes pop-top-right{0%{-webkit-transform:translate(0) rotate(55deg);transform:translate(0) rotate(55deg);opacity:.4}to{-webkit-transform:translate(100px,-50px) rotate(55deg);transform:translate(100px,-50px) rotate(55deg);opacity:0}}@-webkit-keyframes pop-bottom-right{0%{-webkit-transform:translate(0) rotate(135deg);transform:translate(0) rotate(135deg);opacity:.4}to{-webkit-transform:translate(70px,80px) rotate(135deg);transform:translate(70px,80px) rotate(135deg);opacity:0}}@keyframes pop-bottom-right{0%{-webkit-transform:translate(0) rotate(135deg);transform:translate(0) rotate(135deg);opacity:.4}to{-webkit-transform:translate(70px,80px) rotate(135deg);transform:translate(70px,80px) rotate(135deg);opacity:0}}@-webkit-keyframes pop-bottom-left{0%{-webkit-transform:translate(0) rotate(-135deg);transform:translate(0) rotate(-135deg);opacity:.4}to{-webkit-transform:translate(-70px,80px) rotate(-135deg);transform:translate(-70px,80px) rotate(-135deg);opacity:0}}@keyframes pop-bottom-left{0%{-webkit-transform:translate(0) rotate(-135deg);transform:translate(0) rotate(-135deg);opacity:.4}to{-webkit-transform:translate(-70px,80px) rotate(-135deg);transform:translate(-70px,80px) rotate(-135deg);opacity:0}}@-webkit-keyframes first-bump-in{0%{opacity:1}50%{opacity:1}to{opacity:0}}@keyframes first-bump-in{0%{opacity:1}50%{opacity:1}to{opacity:0}}@-webkit-keyframes bump-in{0%{-webkit-transform:scale(.9);transform:scale(.9);opacity:1}50%{-webkit-transform:scale(1);transform:scale(1);opacity:1}to{-webkit-transform:scale(1);transform:scale(1);opacity:0}}@keyframes bump-in{0%{-webkit-transform:scale(.9);transform:scale(.9);opacity:1}50%{-webkit-transform:scale(1);transform:scale(1);opacity:1}to{-webkit-transform:scale(1);transform:scale(1);opacity:0}}@-webkit-keyframes scaleAndBack{0%{-webkit-transform:scale(1);transform:scale(1)}50%{-webkit-transform:scale(1.15);transform:scale(1.15)}to{-webkit-transform:scale(1);transform:scale(1)}}@keyframes scaleAndBack{0%{-webkit-transform:scale(1);transform:scale(1)}50%{-webkit-transform:scale(1.15);transform:scale(1.15)}to{-webkit-transform:scale(1);transform:scale(1)}}
