a.ani{overflow:hidden;padding:10px 20px;font-size:14px;text-decoration:none;color:#333;text-transform:uppercase;position:relative;letter-spacing:1px;box-shadow:0 0 10px 5px rgba(0,0,0,.1);background:#fff;display:inline-block}a.ani span:first-child{height:3px;right:0;position:absolute;top:0;background:linear-gradient(90deg,#171618,#3b4dff);width:100%}@keyframes animate1{0%{transform:translateX(-100%)}to{transform:translateX(100%)}}a.ani span:nth-child(2){height:100%;right:0;position:absolute;top:0;background:linear-gradient(180deg,#171618,#3b4dff);width:3px}@keyframes animate2{0%{transform:translateY(-100%)}to{transform:translateY(100%)}}a.ani span:nth-child(3){height:3px;right:0;position:absolute;bottom:0;background:linear-gradient(270deg,#171618,#3b4dff);width:100%}@keyframes animate3{0%{transform:translateX(100%)}to{transform:translateX(-100%)}}a.ani span:nth-child(4){height:100%;position:absolute;top:0;background:linear-gradient(0deg,#171618,#3b4dff);left:0;width:3px}@keyframes animate4{0%{transform:translateY(100%)}to{transform:translateY(-100%)}}a.ani:hover span:first-child{animation:animate1 2s linear infinite}a.ani:hover span:nth-child(2){animation:animate2 2s linear infinite;animation-delay:1s}a.ani:hover span:nth-child(3){animation:animate3 2s linear infinite}a.ani:hover span:nth-child(4){animation:animate4 2s linear infinite;animation-delay:1s}