Page History

<div class="hwrap">
  <div class="hmove">
    <div class="hitem">February 14th is National Donor Day!</div>
    <div class="hitem">February 14th is National Donor Day!</div>
    <div class="hitem">February 14th is National Donor Day!</div>
    <div class="hitem">February 14th is National Donor Day!</div>
  </div>
</div>

 /* (A) FORCE ALL ITEMS INTO SINGLE ROW */
 .hmove {
   display: flex;
 }

 .hitem {
   width: 100%;
   flex-shrink: 0;
   font-size: 21px;
   font-family: Verdana, sans-serif;
 }

 .hwrap {
   	overflow: hidden;
	   padding-bottom: 15px;
 }

 /* (B) MOVE ITEMS FROM RIGHT TO LEFT */
 /* first item = 0, fourth item = -300% */
 @keyframes tickerh {
   0% {
     transform: translatex(100%);
   }

   100% {
     transform: translatex(-300%30%);
   }
 }

 .hmove {
   animation: tickerh linear 60s20s infinite;
 }

 .hmove:hover {
   animation-play-state: paused;
 }

 @media only screen and (min-width: 200px) and (max-width: 600px)  {
   .hmove {
     animation: tickerh linear 60s20s infinite;
   }
 
}

 @media only screen and (min-width: 601px) and (max-width: 1000px)  {
   .hmove {
     animation: tickerh linear 30s10s infinite;
   }
 
}