<p class="fade">
    ‘Health is our heritage, our right.<br/>
    It is the complete and full union between soul, mind and body;<br/>
    and this is not a difficult far-away ideal to attain,<br/>
    but one so easy and natural&#8230;<br/>
    that many of us have overlooked it.’<br/>
    Dr Edward Bach
  </p>
.fade{
	background:#fff;
	color:#000;
	line-height:24px;
	margin:0 0 1em;
	position:relative;
	overflow:hidden;
}
.fade:after{
	content:"";
	position:absolute;
	z-index:2;
	left:0;
	right:0;
	top:0px;
	bottom:0;
	background:#fff;
	animation:fade 8s linear infinite;
}
@keyframes fade{
	0% {transform:translateY(0) }
	80%{transform:translateY(100%)}
  97%{transform:translateY(100%)}
}

/* ie11 and above only. 

Older browers will get an invisible text so you may want to do this instead:

@supports (transform:translateY(0)) {

.fade:after{
	content:"";
	position:absolute;
	z-index:2;
	left:0;
	right:0;
	top:0px;
	bottom:0;
	background:#fff;
	animation:fade 8s linear infinite;
}
@keyframes fade{
	0% {transform:translateY(0) }
	80%{transform:translateY(100%)}
  97%{transform:translateY(100%)}
}

}
*/

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.