.timeline{
  position:relative;
  max-width:1300px;
  margin:auto;
  padding:120px 0;
}

.timeline::after{
  content:'';
  position:absolute;
  width:4px;

  background:linear-gradient(
    to bottom,
    #e10600,
    #ffffff
  );

  top:0;
  bottom:0;
  left:50%;
}

.timeline-item{
  position:relative;
  width:50%;
  padding:30px 50px;
}

.timeline-item:nth-child(odd){
  left:0;
}

.timeline-item:nth-child(even){
  left:50%;
}

.timeline-content{
  background:#161b22;
  border-radius:22px;
  overflow:hidden;

  border:1px solid rgba(255,255,255,.08);

  transition:.4s;
}

.timeline-content:hover{
  transform:translateY(-10px);

  box-shadow:
  0 0 40px rgba(225,6,0,.35);
}

.timeline-content img{
  width:100%;
  height:280px;
  object-fit:cover;
}

.timeline-content h2{
  padding:25px 25px 10px;
  color:#e10600;
  font-size:2rem;
}

.timeline-content p{
  padding:0 25px 30px;
  color:#c9d1d9;
  line-height:1.8;
}

.timeline-item::after{
  content:'';

  position:absolute;

  width:24px;
  height:24px;

  background:#fff;

  border:4px solid #e10600;

  top:50px;

  border-radius:50%;

  z-index:5;
}

.timeline-item:nth-child(odd)::after{
  right:-14px;
}

.timeline-item:nth-child(even)::after{
  left:-12px;
}