.story-page{
background:#101010;
}
 
/* TIMELINE */
 
.timeline{
position:relative;
max-width:1000px;
margin:auto;
padding:40px 20px;
}
 
.timeline::after{
content:'';
position:absolute;
width:4px;
background:#f5b400;
top:0;
bottom:0;
left:50%;
margin-left:-2px;
}
 
/* ITEM */
 
.timeline-item{
padding:20px 40px;
position:relative;
width:50%;
}
 
/* DOT */
 
.timeline-item::after{
content:'';
position:absolute;
width:16px;
height:16px;
background:#f5b400;
border-radius:50%;
top:30px;
right:-8px;
z-index:1;
}
 
/* LEFT */
 
.left{
left:0;
}
 
/* RIGHT */
 
.right{
left:50%;
}
 
.right::after{
left:-8px;
}
 
/* CARD */
 
.timeline-content{
background:#1a1a1a;
padding:20px;
border-radius:8px;
border:2px solid #f5b400;
}
 
.timeline-content h2{
color:#f5b400;
margin-bottom:5px;
}
 
.timeline-content h3{
margin-bottom:10px;
}
 
/* MOBILE */
 
@media(max-width:900px){
 
.timeline::after{
left:20px;
}
 
.timeline-item{
width:100%;
padding-left:60px;
padding-right:20px;
}
 
.timeline-item::after{
left:12px;
}
 
.right{
left:0;
}
 
}