/* Specifying the name for animation keyframes and keyframes themselves */
@keyframes customticker {
  0% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    visibility: visible;
  }
  100% {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}


/* Formatting the full-width ticker wrapper background and font color */
#tickerwrap {
  width: 100%;
  overflow: hidden;
  // background-color: rgba(0, 0, 0, 0.5);
  background-color: #1ca8dd;
  color: white;
  padding-left: 100%;
  font-family: verdana, helvetica;
  font-size: 20px;
  padding-top: 5px;
  padding-bottom: 5px;
  margin-top: 10px;
  margin-bottom: 10px;
}


/* Formatting the ticker content background, font color, padding and exit state */
#ticker {
  padding-top: 5px;
  display: inline-block;
  white-space: nowrap;
  padding-right: 100%;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-name: customticker;
  animation-name: customticker;
  -webkit-animation-duration: 30s;
  animation-duration: 30s;
}
#ticker a {
  text-decoration: none;
  color: white;
}

#ticker a:hover {
  text-decoration: red underline;
}
