/* ============ TIMELINER.JS ============= */
.timeline-container {
  border-left: 2px solid #ccc;
  margin: 20px auto;
  padding-left: 18px;
}
.timeline-wrapper {
  margin: 0 0 12px;
  position: relative;
}
.timeline-time {
  position: relative;
}
.timeline-time::before {
  content: "";
  height: 2px;
  width: 18px;
  background: #ccc;
  position: absolute;
  top: calc(50% - 1px);
  left: -18px;
}
.timeline-wrapper h2 {
  cursor: pointer;
  font-size: 2rem;
  font-weight: 400;
  margin: 0 0 10px;
  padding: 4px 4px 4px 0;
}
.timeline-wrapper h2 span {
  background: #9b1c23;
  border-radius: 4px;
  color: #fff;
  padding: 8.5px 9px;
  transition: 0.25s
}
.timeline-wrapper h2 span:hover{
  background: #54565a
}
.timeline-series {
  margin: 0 12px 0 0;
  padding: 4px 4px 4px 0;
  position: relative;
}
.timeline-series dt a {
  color: #111 !important;
  cursor: pointer;
  font-weight: 500;
  font-size: 1.1rem;
}
.timeline-series dt a .closed {
  color: #999;
  font-size: 1em;
  margin-left: 0;
}
.timeline-series dt a .open {
  color: #7DBADF;
}
.timeline-series dt a:hover {
  color: #7DBADF;
}
.timeline-series dd {
  width: 100%;
}
.timeline-series dd h3 {
  color: #FFF;
  clear: both;
  float: left;
  font-size: 1.5em;
  margin: 0;
  white-space: nowrap;
}
.timeline-event-content {
  display: none;
  padding-top: 25px;
}
.timeline-event-content h4 {
  clear: left;
  float: left;
  font-size: 1.4em;
  font-weight: 400;
  margin: 10px 0 0;
  padding: 0 0 0 20px;
}
.timeline-event-content blockquote {
  border-left: 2px solid #ccc;
  clear: left;
  float: left;
  font-size: 1.8em;
  margin-left: 0;
  padding: 0 30px;
  width: 400px;
}
.timeline-event-content blockquote .attribution {
  font-size: 0.7em;
  text-align: right;
}