.hvr-underline-from-center { display: inline-block; vertical-align: middle; -webkit-transform: perspective(1px) translateZ(0); transform: perspective(1px) translateZ(0); box-shadow: 0 0 1px rgba(0,0,0,0); position: relative; overflow: hidden }
    .hvr-underline-from-center:before { content: ""; position: absolute; z-index: -1; left: 51%; right: 51%; bottom: 0; background: #fff; height: 2px; -webkit-transition-property: left,right; transition-property: left,right; -webkit-transition-duration: .3s; transition-duration: .3s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out }
    .hvr-underline-from-center:active:before, .hvr-underline-from-center:focus:before, .hvr-underline-from-center:hover:before { left: 0; right: 0 }