a.nav-link {
  background: none;
  border: 0;
  box-sizing: border-box;
  color: #f45e61;
  position: relative;
  vertical-align: middle;
  top:0;
}

a.nav-link::before,
a.nav-link::after {
  box-sizing: inherit;
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
}


.center:hover {
  color: #0099CB;
}

.center::before,
.center::after {
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  transform-origin: center;
}

.center::before {
  border-top: 2px solid #0099CB;
  border-bottom: 2px solid #0099CB;
  transform: scale3d(0, 1, 1);
}

.center::after {
  border-left: 2px solid #0099CB;
  border-right: 2px solid #0099CB;
  transform: scale3d(1, 0, 1);
}

.center:hover::before,
.center:hover::after {
  transform: scale3d(1, 1, 1);
  transition: transform 0.5s;
}