Денис Инешин

<div class='anim'>
    <div class='animated anim-bg-1'></div>
    <div class='animated anim-bg-2'></div>
    <div class='animated anim-bg-1 dop'></div>
</div>

<div class='page'>
    <p>Контент страницы</p>
</div>

.anim {
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    overflow: hidden;
}

@keyframes GO {
  0%   { transform: translate(0, 0); }
  100% { transform: translate(0, -200%); }
}

.animated {
  animation: GO 7s infinite;
}

.anim-bg-1 {
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background: red;
}

.dop {
    top: 200%;
}

.anim-bg-2 {
    position: absolute;
    top: 100%; left: 0;
    width: 100%; height: 100%;
    background: green;
}

.page {
    position: absolute;
    top: 0; left: 0;
    width: 100%;
    color: #fff;
}