<h1>Spotlight</h1>
<div class="light"></div>
<div class="light"></div>

html {
  background-image:linear-gradient(#333, #669);
  height:100%;
  overflow:hidden;
}

h1 {
  color:#fc0;
  font-family:Impact,Charcoal, sans-serif;
  font-size:20vw;
  text-align:center;
  text-shadow:1px -1px #da0, 2px -2px #da0, 3px -3px #da0, 4px -4px #da0, 5px -5px #da0;
}

.light {
  animation:top-right 5s ease-in-out alternate infinite;
  border-bottom:none;
  border-left:solid 20vh transparent;
  border-right:solid 20vh transparent;
  border-top:solid 200vh rgba(255, 255, 255, .5);
  bottom:0;
  height:0;
  left:0;
  position:absolute;
  transform-origin:bottom;
  width:0;
}

.light + .light {
  animation:top-left 4s ease-in-out alternate infinite;
  left:auto;
  right:0;
}

@keyframes top-right {
  0% {
    transform:rotate(-10deg);
  }
  100% {
    transform:rotate(70deg);
  }
}

@keyframes top-left {
  0% {
    transform:rotate(10deg);
  }
  100% {
    transform:rotate(-70deg);
  }
}