<div></div>
div {
  width: 300px;
  height: 300px;
  background: orangered;
  animation: color 10s infinite both;
}

@keyframes color {
  59.999% {
    background: orangered;
  }
  60% {
    background: teal;
  }
  69.999% {
    background: teal;
  }
  70% {
    background: orangered;
  }
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.