p.count{display:block}div.opening{background-color:#fff;width:50px;height:50px;border-radius:50%;margin:0 auto;border:5px solid #000;position:relative}div.opening div.circle{background-color:#000;width:50px;height:50px;margin-left:-25px;margin-top:-25px;border-radius:50%;position:absolute;top:50%;left:50%;transition-property:transform, background-color;transition-duration:1s;transition-timing-function:ease-out;transform:scale(0.3);transform-style:preserve-3d;backface-visibility:visible}figure{display:block;position:relative;margin:0 auto;left:auto;top:auto;margin-top:20px}figure.kudo{position:absolute;right:50%;margin-right:-30px;top:30px;text-align:center}.kudo.complete a.kudobject div.opening div.circle{background:#000 url("/images/heart_60x60.png") no-repeat center;background-size:80%}a.count{text-decoration:none}a.count span{width:auto;text-transform:uppercase;font-family:"freight-sans-pro", sans-serif;margin-top:5px;color:#000;font-weight:800;display:block;line-height:13px}a.count span.num{font-size:18px}a.count span.txt{font-size:11px}a.count p span.dont-move{font-size:18px;text-transform:none;line-height:22px;width:200px;margin-left:-50px;margin-top:8px;letter-spacing:0}a.kudobject{display:block;cursor:pointer}.kudo.active a.kudobject div.opening div.circle{transform:scale(1.1);background:rgba(0,0,0,0.7)}.kudo.complete a.kudobject div.opening div.circle{transition-property:none;animation:bounce 1s;animation-iteration-count:1;transform:scale(0.85)}@keyframes bounce{0%{transform:scale(1.1);background-color:#000;opacity:1}50%{transform:scale(1.6);opacity:.7;background-color:#000}60%{transform:scale(0.6);opacity:1}80%{transform:scale(0.95)}100%{transform:scale(0.85)}}
