.attention-indicator {
  background: none #00bec3 repeat;
  height: 0.2666rem;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  display: none;
}

.attention-indicator.visible {
  display: block;
}

.attention-indicator > .handle {
  background: none #b2f2ff repeat;
  animation: handle 1s infinite;
  height: 0.2666rem;
  width: 8.6rem;
  margin: 0 auto;
}

.attention-indicator > .handle2 {
  animation-delay: 333ms;
  margin: -0.2666rem auto;
}

.attention-indicator > .handle3 {
  animation-delay: 666ms;
  margin: -0.5333rem auto;
}

@keyframes handle {
  0%   { transform: scaleX(1.0); opacity: 1;}
  100% { transform: scaleX(4.0); opacity: 0;}
}