twitter-like-button/build/static/css/main.4e20ff3d.css

This is the functional twitter like button which you can integrate to your project. To give extra ordinary look

svg{cursor:pointer;overflow:visible;width:60px}svg #heart{-webkit-animation:animateHeartOut .3s linear forwards;animation:animateHeartOut .3s linear forwards;-webkit-transform-origin:center;transform-origin:center}svg #main-circ{-webkit-transform-origin:29.5px 29.5px;transform-origin:29.5px 29.5px}#checkbox{display:none}#checkbox:checked+label svg #heart{fill:#e2264d;-webkit-animation:animateHeart .3s linear .25s forwards;animation:animateHeart .3s linear .25s forwards;-webkit-transform:scale(.2);transform:scale(.2)}#checkbox:checked+label svg #main-circ{-webkit-animation:animateCircle .3s linear forwards;animation:animateCircle .3s linear forwards;opacity:1;transition:all 2s}#checkbox:checked+label svg #grp1{opacity:1;transition:all .1s .3s}#checkbox:checked+label svg #grp1 #oval1{-webkit-transform:scale(0) translateY(-30px);transform:scale(0) translateY(-30px);-webkit-transform-origin:0 0 0;transform-origin:0 0 0;transition:-webkit-transform .5s .3s;transition:transform .5s .3s;transition:transform .5s .3s,-webkit-transform .5s .3s}#checkbox:checked+label svg #grp1 #oval2{-webkit-transform:scale(0) translate(10px,-50px);transform:scale(0) translate(10px,-50px);-webkit-transform-origin:0 0 0;transform-origin:0 0 0;transition:-webkit-transform 1.5s .3s;transition:transform 1.5s .3s;transition:transform 1.5s .3s,-webkit-transform 1.5s .3s}#checkbox:checked+label svg #grp2{transition:all .1s .3s}#checkbox:checked+label svg #grp2 #oval1{-webkit-transform:scale(0) translate(30px,-15px);transform:scale(0) translate(30px,-15px);-webkit-transform-origin:0 0 0;transform-origin:0 0 0;transition:-webkit-transform .5s .3s;transition:transform .5s .3s;transition:transform .5s .3s,-webkit-transform .5s .3s}#checkbox:checked+label svg #grp2 #oval2{-webkit-transform:scale(0) translate(60px,-15px);transform:scale(0) translate(60px,-15px);-webkit-transform-origin:0 0 0;transform-origin:0 0 0;transition:-webkit-transform 1.5s .3s;transition:transform 1.5s .3s;transition:transform 1.5s .3s,-webkit-transform 1.5s .3s}#checkbox:checked+label svg #grp3{transition:all .1s .3s}#checkbox:checked+label svg #grp3 #oval1{-webkit-transform:scale(0) translate(30px);transform:scale(0) translate(30px);-webkit-transform-origin:0 0 0;transform-origin:0 0 0;transition:-webkit-transform .5s .3s;transition:transform .5s .3s;transition:transform .5s .3s,-webkit-transform .5s .3s}#checkbox:checked+label svg #grp3 #oval2{-webkit-transform:scale(0) translate(60px,10px);transform:scale(0) translate(60px,10px);-webkit-transform-origin:0 0 0;transform-origin:0 0 0;transition:-webkit-transform 1.5s .3s;transition:transform 1.5s .3s;transition:transform 1.5s .3s,-webkit-transform 1.5s .3s}#checkbox:checked+label svg #grp4{transition:all .1s .3s}#checkbox:checked+label svg #grp4 #oval1{-webkit-transform:scale(0) translate(30px,15px);transform:scale(0) translate(30px,15px);-webkit-transform-origin:0 0 0;transform-origin:0 0 0;transition:-webkit-transform .5s .3s;transition:transform .5s .3s;transition:transform .5s .3s,-webkit-transform .5s .3s}#checkbox:checked+label svg #grp4 #oval2{-webkit-transform:scale(0) translate(40px,50px);transform:scale(0) translate(40px,50px);-webkit-transform-origin:0 0 0;transform-origin:0 0 0;transition:-webkit-transform 1.5s .3s;transition:transform 1.5s .3s;transition:transform 1.5s .3s,-webkit-transform 1.5s .3s}#checkbox:checked+label svg #grp5{transition:all .1s .3s}#checkbox:checked+label svg #grp5 #oval1{-webkit-transform:scale(0) translate(-10px,20px);transform:scale(0) translate(-10px,20px);-webkit-transform-origin:0 0 0;transform-origin:0 0 0;transition:-webkit-transform .5s .3s;transition:transform .5s .3s;transition:transform .5s .3s,-webkit-transform .5s .3s}#checkbox:checked+label svg #grp5 #oval2{-webkit-transform:scale(0) translate(-60px,30px);transform:scale(0) translate(-60px,30px);-webkit-transform-origin:0 0 0;transform-origin:0 0 0;transition:-webkit-transform 1.5s .3s;transition:transform 1.5s .3s;transition:transform 1.5s .3s,-webkit-transform 1.5s .3s}#checkbox:checked+label svg #grp6{transition:all .1s .3s}#checkbox:checked+label svg #grp6 #oval1{-webkit-transform:scale(0) translate(-30px);transform:scale(0) translate(-30px);-webkit-transform-origin:0 0 0;transform-origin:0 0 0;transition:-webkit-transform .5s .3s;transition:transform .5s .3s;transition:transform .5s .3s,-webkit-transform .5s .3s}#checkbox:checked+label svg #grp6 #oval2{-webkit-transform:scale(0) translate(-60px,-5px);transform:scale(0) translate(-60px,-5px);-webkit-transform-origin:0 0 0;transform-origin:0 0 0;transition:-webkit-transform 1.5s .3s;transition:transform 1.5s .3s;transition:transform 1.5s .3s,-webkit-transform 1.5s .3s}#checkbox:checked+label svg #grp7{transition:all .1s .3s}#checkbox:checked+label svg #grp7 #oval1{-webkit-transform:scale(0) translate(-30px,-15px);transform:scale(0) translate(-30px,-15px);-webkit-transform-origin:0 0 0;transform-origin:0 0 0;transition:-webkit-transform .5s .3s;transition:transform .5s .3s;transition:transform .5s .3s,-webkit-transform .5s .3s}#checkbox:checked+label svg #grp7 #oval2{-webkit-transform:scale(0) translate(-55px,-30px);transform:scale(0) translate(-55px,-30px);-webkit-transform-origin:0 0 0;transform-origin:0 0 0;transition:-webkit-transform 1.5s .3s;transition:transform 1.5s .3s;transition:transform 1.5s .3s,-webkit-transform 1.5s .3s}#checkbox:checked+label svg #grp2,#checkbox:checked+label svg #grp3,#checkbox:checked+label svg #grp4,#checkbox:checked+label svg #grp5,#checkbox:checked+label svg #grp6,#checkbox:checked+label svg #grp7{opacity:1;transition:opacity .1s .3s}@-webkit-keyframes animateCircle{40%{fill:#dd4688;opacity:1;-webkit-transform:scale(10);transform:scale(10)}55%{fill:#d46abf;opacity:1;-webkit-transform:scale(11);transform:scale(11)}65%{fill:#cc8ef5;opacity:1;-webkit-transform:scale(12);transform:scale(12)}75%{fill:transparent;stroke:#cc8ef5;stroke-width:.5;opacity:1;-webkit-transform:scale(13);transform:scale(13)}85%{fill:transparent;stroke:#cc8ef5;stroke-width:.2;opacity:1;-webkit-transform:scale(17);transform:scale(17)}95%{fill:transparent;stroke:#cc8ef5;stroke-width:.1;opacity:1;-webkit-transform:scale(18);transform:scale(18)}to{fill:transparent;stroke:#cc8ef5;stroke-width:0;opacity:1;-webkit-transform:scale(19);transform:scale(19)}}@keyframes animateCircle{40%{fill:#dd4688;opacity:1;-webkit-transform:scale(10);transform:scale(10)}55%{fill:#d46abf;opacity:1;-webkit-transform:scale(11);transform:scale(11)}65%{fill:#cc8ef5;opacity:1;-webkit-transform:scale(12);transform:scale(12)}75%{fill:transparent;stroke:#cc8ef5;stroke-width:.5;opacity:1;-webkit-transform:scale(13);transform:scale(13)}85%{fill:transparent;stroke:#cc8ef5;stroke-width:.2;opacity:1;-webkit-transform:scale(17);transform:scale(17)}95%{fill:transparent;stroke:#cc8ef5;stroke-width:.1;opacity:1;-webkit-transform:scale(18);transform:scale(18)}to{fill:transparent;stroke:#cc8ef5;stroke-width:0;opacity:1;-webkit-transform:scale(19);transform:scale(19)}}@-webkit-keyframes animateHeart{0%{-webkit-transform:scale(.2);transform:scale(.2)}40%{-webkit-transform:scale(1.2);transform:scale(1.2)}to{-webkit-transform:scale(1);transform:scale(1)}}@keyframes animateHeart{0%{-webkit-transform:scale(.2);transform:scale(.2)}40%{-webkit-transform:scale(1.2);transform:scale(1.2)}to{-webkit-transform:scale(1);transform:scale(1)}}@-webkit-keyframes animateHeartOut{0%{-webkit-transform:scale(1.4);transform:scale(1.4)}to{-webkit-transform:scale(1);transform:scale(1)}}@keyframes animateHeartOut{0%{-webkit-transform:scale(1.4);transform:scale(1.4)}to{-webkit-transform:scale(1);transform:scale(1)}}
/*# sourceMappingURL=main.4e20ff3d.css.map*/