[data-component-id*=":paragraph_timeline_event"] {
  position: relative;
  margin: 10px 20px;
  padding: 1rem;
  background: #eaeff6;
}
[data-component-id*=":paragraph_timeline_event"] .field--name-field-timeline-event-date {
  color: #233755;
  font-size: 1.25rem;
  font-weight: bold;
  margin-bottom: 1rem;
}

@media (min-width: 768px) {
  [data-component-id*=":paragraph_timeline"] .timeline-align-right [data-component-id*=":paragraph_timeline_event"]::before,
  [data-component-id*=":paragraph_timeline"] .field--item:nth-child(even):not([class*=timeline-align-]) [data-component-id*=":paragraph_timeline_event"]::before {
    content: "";
    height: 0;
    position: absolute;
    top: 30px;
    width: 0;
    left: -10px;
    right: unset;
    border-style: solid;
    border-width: 10px 10px 10px 0;
    border-color: transparent #eaeff6 transparent transparent;
  }
  [data-component-id*=":paragraph_timeline"] .timeline-align-right [data-component-id*=":paragraph_timeline_event"]::after,
  [data-component-id*=":paragraph_timeline"] .field--item:nth-child(even):not([class*=timeline-align-]) [data-component-id*=":paragraph_timeline_event"]::after {
    content: "";
    position: absolute;
    width: 20px;
    height: 20px;
    left: -30px;
    right: unset;
    background-color: #ffffff;
    border: 4px solid #233755;
    top: 30px;
    border-radius: 50%;
    z-index: 2;
  }
  [data-component-id*=":paragraph_timeline"] .timeline-align-right [data-component-id*=":paragraph_timeline_event"].timeline-event-orientation-left::before,
  [data-component-id*=":paragraph_timeline"] .field--item:nth-child(even):not([class*=timeline-align-]) [data-component-id*=":paragraph_timeline_event"].timeline-event-orientation-left::before {
    content: "";
    height: 0;
    position: absolute;
    top: 30px;
    width: 0;
    border-style: solid;
    right: -10px;
    left: unset;
    border-width: 10px 0 10px 10px;
    border-color: transparent transparent transparent #eaeff6;
  }
  [data-component-id*=":paragraph_timeline"] .timeline-align-right [data-component-id*=":paragraph_timeline_event"].timeline-event-orientation-left::after,
  [data-component-id*=":paragraph_timeline"] .field--item:nth-child(even):not([class*=timeline-align-]) [data-component-id*=":paragraph_timeline_event"].timeline-event-orientation-left::after {
    content: "";
    position: absolute;
    width: 20px;
    height: 20px;
    right: -30px;
    left: unset;
    background-color: #ffffff;
    border: 4px solid #233755;
    top: 30px;
    border-radius: 50%;
    z-index: 2;
  }
  [data-component-id*=":paragraph_timeline"] .timeline-align-right [data-component-id*=":paragraph_timeline_event"].timeline-event-orientation-center::before, [data-component-id*=":paragraph_timeline"] .timeline-align-right [data-component-id*=":paragraph_timeline_event"].timeline-event-orientation-center::after,
  [data-component-id*=":paragraph_timeline"] .field--item:nth-child(even):not([class*=timeline-align-]) [data-component-id*=":paragraph_timeline_event"].timeline-event-orientation-center::before,
  [data-component-id*=":paragraph_timeline"] .field--item:nth-child(even):not([class*=timeline-align-]) [data-component-id*=":paragraph_timeline_event"].timeline-event-orientation-center::after {
    border: none;
  }
  [data-component-id*=":paragraph_timeline"] .timeline-align-left [data-component-id*=":paragraph_timeline_event"]::before,
  [data-component-id*=":paragraph_timeline"] .field--item:nth-child(odd):not([class*=timeline-align-]) [data-component-id*=":paragraph_timeline_event"]::before {
    content: "";
    height: 0;
    position: absolute;
    top: 30px;
    width: 0;
    border-style: solid;
    right: -10px;
    left: unset;
    border-width: 10px 0 10px 10px;
    border-color: transparent transparent transparent #eaeff6;
  }
  [data-component-id*=":paragraph_timeline"] .timeline-align-left [data-component-id*=":paragraph_timeline_event"]::after,
  [data-component-id*=":paragraph_timeline"] .field--item:nth-child(odd):not([class*=timeline-align-]) [data-component-id*=":paragraph_timeline_event"]::after {
    content: "";
    position: absolute;
    width: 20px;
    height: 20px;
    right: -30px;
    left: unset;
    background-color: #ffffff;
    border: 4px solid #233755;
    top: 30px;
    border-radius: 50%;
    z-index: 2;
  }
  [data-component-id*=":paragraph_timeline"] .timeline-align-left [data-component-id*=":paragraph_timeline_event"].timeline-event-orientation-right::before,
  [data-component-id*=":paragraph_timeline"] .field--item:nth-child(odd):not([class*=timeline-align-]) [data-component-id*=":paragraph_timeline_event"].timeline-event-orientation-right::before {
    content: "";
    height: 0;
    position: absolute;
    top: 30px;
    width: 0;
    left: -10px;
    right: unset;
    border-style: solid;
    border-width: 10px 10px 10px 0;
    border-color: transparent #eaeff6 transparent transparent;
  }
  [data-component-id*=":paragraph_timeline"] .timeline-align-left [data-component-id*=":paragraph_timeline_event"].timeline-event-orientation-right::after,
  [data-component-id*=":paragraph_timeline"] .field--item:nth-child(odd):not([class*=timeline-align-]) [data-component-id*=":paragraph_timeline_event"].timeline-event-orientation-right::after {
    content: "";
    position: absolute;
    width: 20px;
    height: 20px;
    left: -30px;
    right: unset;
    background-color: #ffffff;
    border: 4px solid #233755;
    top: 30px;
    border-radius: 50%;
    z-index: 2;
  }
  [data-component-id*=":paragraph_timeline"] .timeline-align-left [data-component-id*=":paragraph_timeline_event"].timeline-event-orientation-center::before, [data-component-id*=":paragraph_timeline"] .timeline-align-left [data-component-id*=":paragraph_timeline_event"].timeline-event-orientation-center::after,
  [data-component-id*=":paragraph_timeline"] .field--item:nth-child(odd):not([class*=timeline-align-]) [data-component-id*=":paragraph_timeline_event"].timeline-event-orientation-center::before,
  [data-component-id*=":paragraph_timeline"] .field--item:nth-child(odd):not([class*=timeline-align-]) [data-component-id*=":paragraph_timeline_event"].timeline-event-orientation-center::after {
    border: none;
  }
}
@media (max-width: 768px) {
  [data-component-id*=":paragraph_timeline"] .timeline-orientation-left-right [data-component-id*=":paragraph_timeline_event"]::before,
  [data-component-id*=":paragraph_timeline"] .timeline-orientation-left [data-component-id*=":paragraph_timeline_event"]::before {
    content: "";
    height: 0;
    position: absolute;
    top: 30px;
    width: 0;
    border-style: solid;
    right: -10px;
    left: unset;
    border-width: 10px 0 10px 10px;
    border-color: transparent transparent transparent #eaeff6;
  }
  [data-component-id*=":paragraph_timeline"] .timeline-orientation-left-right [data-component-id*=":paragraph_timeline_event"]::after,
  [data-component-id*=":paragraph_timeline"] .timeline-orientation-left [data-component-id*=":paragraph_timeline_event"]::after {
    content: "";
    position: absolute;
    width: 20px;
    height: 20px;
    right: -30px;
    left: unset;
    background-color: #ffffff;
    border: 4px solid #233755;
    top: 30px;
    border-radius: 50%;
    z-index: 2;
  }
  [data-component-id*=":paragraph_timeline"] .timeline-orientation-right-left [data-component-id*=":paragraph_timeline_event"]::before,
  [data-component-id*=":paragraph_timeline"] .timeline-orientation-right [data-component-id*=":paragraph_timeline_event"]::before {
    content: "";
    height: 0;
    position: absolute;
    top: 30px;
    width: 0;
    left: -10px;
    right: unset;
    border-style: solid;
    border-width: 10px 10px 10px 0;
    border-color: transparent #eaeff6 transparent transparent;
  }
  [data-component-id*=":paragraph_timeline"] .timeline-orientation-right-left [data-component-id*=":paragraph_timeline_event"]::after,
  [data-component-id*=":paragraph_timeline"] .timeline-orientation-right [data-component-id*=":paragraph_timeline_event"]::after {
    content: "";
    position: absolute;
    width: 20px;
    height: 20px;
    left: -30px;
    right: unset;
    background-color: #ffffff;
    border: 4px solid #233755;
    top: 30px;
    border-radius: 50%;
    z-index: 2;
  }
}