*{
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body,html{
  min-height: 100vh;
  width: 100%;
  background-color:#212121;
  display:flex;
  justify-content:center;
  align-items:center;
}
h1 {
  font-size:10vh;
  color:#fff;
}
.container {
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100vh;
  display:flex;
  overflow:hidden;
  flex-wrap:wrap;
  
  }
.container  .box {
   border:1px solid black;
   position:relative;
   background-color:#424242;
   width:38px;
   display:block;
   height:40px;
 }
 .container .box.active{
   background-color:#0f0;
   pointer-events:none;
   box-shadow:0 0 20px #00D200, 0 0 30px #0f05, 0 0 50px #0f0;
   z-index:999;
   animation:fall 2s linear forwards;
 }

@keyframes fall {
   0%{
     transform:translate(0,0) rotate(0deg);
   }
   100%{
     transform:translate(0,100vh) rotate(360deg);
   }
}