/* [ Header Styles ] */
header {
    -webkit-animation: 300ms ease-in-out 0s normal none 1 running fadeInDown;
    animation: 3s ease-in-out 0s normal none 1 running fadeInDown;
}
.navbar {
    background-color: #000000dc;
    padding: 20px 16px;
    font-size: 1.2rem;
}
.nav-item {
    padding: 10px 0px;
}
.nav-item:hover {
    text-decoration: none;
}
.nav-item div {
    color: goldenrod;
    text-decoration: none;
    padding: 5px 10px;
    transition: all .4s;
    width: fit-content;
}
.nav-item div:hover {
    color: #ffffff;
    text-decoration: none;
}
.brand {
    width: 50px;
    height: 50px;
}

/* ===fadeInDown=== */
@-webkit-keyframes fadeInDown {
    from {
      opacity: 0;
      -webkit-transform: translate3d(0, -100%, 0);
      transform: translate3d(0, -100%, 0);
  }
  to {
      opacity: 1;
      -webkit-transform: none;
      transform: none;
  }
}

.u-bline::after {
    content: '';
    display: block;
    width: 0;
    height: 2px;
    background: #ffffff;
    transition: width .4s;
}
.u-bline:hover::after {
    max-width: 96px;
    width: 100%;
    margin-top: .3px;
}