@font-face {
  font-family: able;
  src: url("Abel-Regular.ddf19b24.ttf") format("truetype");
}

@font-face {
  font-family: allanb;
  src: url("Allan-Bold.e3e698a6.ttf") format("truetype");
}

@font-face {
  font-family: allanr;
  src: url("Allan-Regular.1ef2237f.ttf") format("truetype");
}

@font-face {
  font-family: kaku;
  src: url("Hiragino Kaku Gothic Std W8.17ddb2f5.otf") format("truetype");
}

@font-face {
  font-family: ming;
  src: url("m.1445cb61.otf") format("truetype");
}

.text {
  border-bottom: none;
  display: inline-block;
  position: relative;
}

.text:after {
  content: "";
  background: linear-gradient(to right, #fff, #3846ab);
  width: 0;
  height: 3px;
  transition: all .5s;
  position: absolute;
  bottom: -2px;
  left: 0;
}

.text:hover:after {
  width: 100%;
}