.timeline-nav {
  display: flex;
  background-color: #ebebeb;
  width: 100%;
  height: 50px;
  margin-bottom: 2rem;
}
.timeline-nav__arrow {
  background-color: #ebebeb;
  height: 50px;
  border: none;
  color: rgb(19, 40, 67);
}
.timeline-nav__arrow:hover {
  color: #996914;
  box-shadow: none;
}
.timeline-nav__arrow--inactive {
  color: #919191;
  cursor: default;
}
.timeline-nav__arrow--inactive:hover {
  color: #919191;
}
.timeline-nav__wrapper {
  display: block;
  white-space: nowrap;
  position: relative;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  width: 100%;
}
.timeline-nav__list {
  overflow: hidden;
  overflow-x: visible;
  list-style-type: none;
  margin: 0;
  padding: 0;
}
.timeline-nav__item {
  display: inline-block;
  width: 33%;
  height: 50px;
  padding-top: 14px;
  text-align: center;
}
@media (min-width: 1024px) {
  .timeline-nav__item {
    width: 25%;
  }
}
.timeline-nav__item--active {
  color: rgb(19, 40, 67);
  border-bottom: 2px solid #996914;
}
.timeline-nav__link:hover, .timeline-nav__link:active {
  text-decoration: none;
}