igumenov

https://kenwheeler.github.io/slick/
Искать на странице по ключу "Slider Syncing"

Я бы сделал так:
Основной фон полосы вынес бы выше к timeline__body так как полоса подстроится под кол-во элементов внутри,
а точки уже позиционировал относительно timeline__item {
top: 50%;
transform: translateY(-50%)
} только не картинкой а через обычный border сделать

Чтобы не изменять структуру верстки можно средствами js и jquery
CSS

html {
    position: relative;
    min-height: 100%;
}
footer {
    display:none;
    position: absolute;
    left: 0;
    bottom: 0;
    height: auto;
    width: 100%;
}

JS

function footerAlign() {
  $('footer').css('display', 'block');
  $('footer').css('height', 'auto');
  var footerHeight = $('footer').outerHeight();
  $('body').css('padding-bottom', footerHeight);
  $('footer').css('height', footerHeight);
}


$(document).ready(function(){
  footerAlign();
});

$( window ).resize(function() {
  footerAlign();
});