CodePen

HTML

            
              <section class="lights">
  <i></i>
</section>
            
          
!

↑ Insert the most common viewport meta tag

CSS

            
              .lights {
  width:100%;
  padding:10% 0;
  background-color:black;
}
i {
  display:block; margin:0px auto;
  width:30px; height:30px;
  background-color:hsla(200, 80%, 50%, 0.8);
  border:10px solid hsla(200, 80%, 50%, 1);
  border-radius:2px;
  /*call animation*/
  animation:flashing 2s infinite;
}

@keyframes flashing {
  0%   { opacity: 0; }
  50%   { opacity: 1; }
  100% { opacity: 0; }
}
            
          
!
? ?
? ?
Must be a valid URL.
+ add another resource
via CSS Lint

JS

            
              
            
          
!
Must be a valid URL.
+ add another resource
via JS Hint
Loading ..................