MMM-Stock.css

.marquee {
  width: 100%;
  margin: 0 auto;
  overflow: hidden;
  white-space: nowrap;
  box-sizing: border-box;
  animation: marquee 50s linear infinite;
  -webkit-animation: marquee 50s linear infinite;
}
.down {
  color: red;
}

.down::before {
  content: '▾';
}

.up {
  color: green;
}

.up::before {
  content: '▴';
}

.down::before,
.up::before {
  margin-left: 15px;
}

span.quote
{
	margin: 0;
	font-weight: bold;
	color: #fff;
	padding: 0 5px 0 10px;
}
.greentext
{
	color: red;
}
.redtext
{
	color: green;
}
.up_green
{
	background: url(http://www.codescratcher.com/wp-content/uploads/2014/11/down.gif) no-repeat left center;
	padding-left: 10px;
	margin-right: 5px;
}
.down_red
{
	background: url(http://www.codescratcher.com/wp-content/uploads/2014/11/up.gif) no-repeat left center;
	padding-left: 10px;
	margin-right: 5px;
}


@keyframes ticker {
	0%   {margin-top: 0}
    20%  {margin-top: -30px}
    40%  {margin-top: -60px}
    60%  {margin-top: -90px}
    80%  {margin-top: -120px}
    100% {margin-top: 0}
}
.quotes {
  height: 25px;
  overflow: hidden;
  padding: 0px;
  -webkit-user-select: none
} 

.quotes ul {
  float: right;
  padding-left: 0px;
  animation: ticker 10s cubic-bezier(1, 0, .5, 0) infinite;
  -webkit-user-select: none
}

.quotes ul li {line-height: 25px; list-style: none }

.quotes ul li span {
  font: 18px Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -webkit-user-select: none
}

.quotes ul:hover { animation-play-state: paused }
.quotes span:hover+ul { animation-play-state: paused }