Прокрутка фона параллакса в режиме редактора в сравнении с полной страницей

Question

Я пытаюсь добиться прокрутки параллакса с фоновыми изображениями, все еще располагая изображение так, чтобы "начальная точка" была наиболее релевантной. Когда я в редакторе CodePen, фоновое позиционирование работает; однако, при полном просмотре страницы, фоновое позиционирование не работает... Может кто-нибудь помочь мне понять, почему?:(

Это HTML-код, который я использую:

<section class="welcome">
  <div class="container">
    [...]
  </div>
</section>

Это CSS, который я использую:

.welcome {
  padding: 2rem;
  background: linear-gradient(
    to top right,
    rgba(0,0,0,0.35),
    rgba(0,0,0,0.35)
  ), 
    url(https://adpworks.jiveon.com/resources/statics/1253294/homepage1.jpg?a=1525787082807);
  background-position: center bottom;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
  height: 25rem;
}

CODEPEN Ссылка