<svg width="282px" height="82px" viewBox="0 0 282 82" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
    <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
        <g id="Group">
            <circle id="red" fill="#EE4747" cx="41" cy="41" r="41"></circle>
            <circle id="yellow" fill="#FFC848" cx="141" cy="41" r="41"></circle>
            <circle id="green" fill="#1EC4B4" cx="241" cy="41" r="41"></circle>
        </g>
    </g>
</svg>

html, body {
  height: 100%;
}

body {
  display: flex;
  padding: 0;
  background-color: #222;
  justify-content: center;
  align-items: center;
}

@keyframes flicker {
  0% {
    opacity: 0;
  } 100% {
    opacity: 1;
  }
}

#red {
  animation: flicker 2s ease alternate infinite;
}