body{
  padding:50px;
}
.hover_test{
  overflow:hidden;
  color:#333;
  text-decoration:none;
    position:relative;
    transition-duration: 800ms;
    transition-timing-function: cubic-bezier(0, 0.7, 0.22, 1 );
  display:inline-block;

  &:after{
    content:"";
    background: #555555;
    position:relative;
    display:block;
    height: 1px;
    width:100%;
    margin: 3px 0px 0px 0px;
    transform: scale(0, 1);
    transform-origin: center left;
    transition-duration: 800ms;
    transition-timing-function: cubic-bezier(0, 0.7, 0.22, 1 );
    width: 100%;
    max-width: 100%;
  }
  &:hover{
    &:after{
      transform: scale(1, 1);
    }
  }
}