.tijdlijnr {position: relative;}
.tijdlijnr > div
{
border-right: 2px solid #aaa;
left: 16px;
position: absolute;
top: 0px;
height: 100%;
}
.tijdlijnr > ul
{
list-style-type: none;
margin: 0px;
padding: 0px;
}
.tijdlijnr li {margin-bottom: 8px;}
.tijdlijnr li:before {display: none;}
.tijdlijnr header {align-items: center; display: flex;}
.tijdlijnr header div
{
background-color: rgb(170, 170, 170);
border-radius: 100%;
height: 32px;
width: 32px;
}
.tijdlijnr footer {margin-left: 48px;}
.tijdlijnr h2 {margin-left: 16px; flex: 1;}
echo "<div class='tijdlijnr'>";
echo "<div></div>";
echo "<ul>";
echo "<li>";;
echo "<header>";
echo "<div></div>";
echo "<h2>Title</h2>";
echo "</header>";
echo "<footer>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quam dolores quod debitis veritatis placeat nemo iste natus maxime.</footer>";
echo "</li>";
echo "<li>";;
echo "<header>";
echo "<div></div>";
echo "<h2>Title</h2>";
echo "</header>";
echo "<footer>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quam dolores quod debitis veritatis placeat nemo iste natus maxime.</footer>";
echo "</li>";
echo "<li>";;
echo "<header>";
echo "<div></div>";
echo "<h2>Title</h2>";
echo "</header>";
echo "<footer>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quam dolores quod debitis veritatis placeat nemo iste natus maxime.</footer>";
echo "</li>";
echo "</ul>";
echo "</div>";