:root {
  --accent: #e8ba6a;
}

/* from https://codepen.io/bemdesign/pen/wMmZYo */

.timeline{
  position: relative;
}
.timeline-line{
  border-left:3px solid var(--accent);
  position: absolute;
  margin-left:90px;
  z-index: -1;
  height:100%;
  min-height:100%;
}
.timeline-events{
  margin:0 0 0 20px;
  padding:0;
  list-style: none;
  
}
.timeline-event{
  margin:10px 0;
  margin-left:20px;
  padding-left:20px;
  z-index: 0;
  list-style: none;
  padding:0;
  border-radius:50px;
  transition: all 0.5s;
  /*Flex for the win*/
  display:flex;
  align-items:center;
}
.timeline-date, .timeline-description{
  display:inline-block;
}
.timeline-description{
  margin-left:2em;
}
.timeline-date{
  background-color: var(--accent);
  font-size: 0.9em;
  color:#000;
  width:100px;
  height:100px;
  border-radius:50px;
  text-align: center;
  flex: 0 0 auto;
}
.timeline-date time{
  display:inline-block;
  padding-top:40px;
}
.timeline-event:hover, .timeline-event:active, .timeline-event:focus{
  background-color:var(--accent-bg);
}

/* we need to manually override the color in the leaflet search box */
.leaflet-control-geocoder-form input {
  color: #212121;
}

.noborder {
  border: 0px;
}

.helptext {
  font-style: italic;
  font-size: 0.7em;
}