.timeline {
  position: relative;
}
.timeline::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  width: 2px;
  background-color: #007bff;
  transform: translateX(-50%);
}
.timeline-item {
  position: relative;
  padding: 20px;
  margin-bottom: 30px;
  background-color: #ffffff;
  border: 1px dashed #ddd;
  border-radius: 4px;
}
.timeline-item:last-of-type {
    border: 1px solid green;
  }

.timeline-item::before {
  content: "";
  position: absolute;
  top: 10px;
  left: -8px;
  width: 15px;
  height: 15px;
  background-color: #007bff;
  border-radius: 50%;
}

.timeline-item:last-of-type:before {
    animation: pulse 2s infinite;
    width: 20px;
    left: -10px;
    height: 20px;
}

@keyframes pulse {
    0% {
        transform: scale(1);
        background: green;
    }
    50% {
        transform: scale(1.2);
        background: yellow;
    }
    100% {
        transform: scale(1);
        background: purple;
    }
}
