.btn-f{width:3vw;height:3vw;margin:10px;color:#3498db;overflow:hidden;position:relative;border-radius:30%;background:#bdbde0;text-decoration:none;box-shadow:0 5px 15px -5px #00000070;display:inline-flex;align-items:center;justify-content:center}.btnfb{fill:#f00}.btn-f i{font-size:2vw;transition:.2s linear}.btn-f:before{content:"";width:120%;height:120%;left:-110%;top:90%;position:absolute;background:#3498db;transform:rotate(45deg);background-image:radial-gradient(circle farthest-corner at 10% 20%,#008e7e 0%,#008e7e 100%)}.btn-f:hover i{color:#f1f1f1;transform:scale(1.2)}.btn-f:hover:before{top:-10%;left:-10%;-webkit-animation:animation1 .7s 1;animation:animation1 .7s 1}@-webkit-keyframes animation1{0%{top:90%;left:-110%}50%{top:-30%;left:10%}100%{top:-10%;left:-10%}}@keyframes animation1{0%{top:90%;left:-110%}50%{top:-30%;left:10%}100%{top:-10%;left:-10%}}