Answers for "fade in fade out css animation codepen repeat"

css fade in and stay

.fadePopInAndStay {
	display: block;
	opacity: 0;
	visibility: visible;
	animation-name: doAnimStay;
	animation-duration: 2s;
	animation-fill-mode: forwards;/* Makes it stay after animation */
}
@-webkit-keyframes doAnimStay{
  0%   {opacity:0;}
  100% {opacity:1;}
}

css animation fade out after delay

<style>
  #text{
  transition-duration:1s; /* <= creates fade out effect */
  transition-delay:1s;
}
</style>

<p onclick="this.style.opacity=0" id="text">My text</p>