svg-demo/animate/style.css

@keyframes colorRotate {
  from { opacity: 100%; }
  80%  { opacity: 100%; }
  to   { opacity: 0; }
}

#path53926,
#path53868,
#path53870,
#path53872,
#path53874, 
#path53876 {
  animation-name: colorRotate;
  animation-duration: 1s;
  animation-direction: alternate;
  animation-iteration-count: infinite;
}

#path53868,
#path53870 {
  animation-delay: 0.4s;
}

#path53872 {
  animation-delay: 0.8s;
}

#path53874, 
#path53876 {
  animation-delay: 1.2s;
}

@keyframes toggleLight1 {
  from { fill: #37c1ef; }
  50%  { fill: #37c1ef; }
  51%  { fill: #80e8f8; }
  to   { fill: #80e8f8; }
}

@keyframes toggleLight2 {
  from { fill: #36aed7; }
  50%  { fill: #36aed7; }
  51%  { fill: #70e0f0; }
  to   { fill: #70e0f0; }
}

#path27272,
#path34452 {
  animation-duration: 2s;
  animation-direction: alternate;
  animation-iteration-count: infinite;
}

#path27272 {
  animation-name: toggleLight1;
}

#path34452 {
  animation-name: toggleLight2;
}

@keyframes lightSwitch {
  from { transform: scaleY(1) translateY(0); }
  40%  { transform: scaleY(1) translateY(0); }
  41%  { transform: scaleY(1.4) translateY(-42px); }
  50%  { transform: scaleY(1.4) translateY(-42px); }
  51%  { transform: scaleY(1) translateY(0); }
  to   { transform: scaleY(1) translateY(0); }
}

#rect36645,
#path36960 {
  animation-name: lightSwitch;
  animation-duration: 2s;
  animation-direction: alternate;
  animation-iteration-count: infinite;
}