body{

  margin: 0;
  padding: 0;
  box-sizing: border-box;
  background-color: #262626;
}
.box{
  display: flex;
  justify-content: center;
  align-items: center; 
   height: 100vh;
  width: 100vw;
/*   top: 50%;
  left: 50%;
  transform: translate(-50%,-50%); */
  
  position: absolute;
}
.box h2{
  
/*   margin: 0;
  padding: 0; */
  font-weight: 800;
  font-size: 10rem;
  text-transform: uppercase;
  color: rgba(255,255,255,.1);
  background-image: url(water.png);
  background-repeat: repeat-x;
  background-position: bottom -80px left 0px;
  -webkit-background-clip: text;
  animation: animate 5s linear infinite;
}
@keyframes animate{
  0%{
   background-position: bottom -80px left 0px;
  }
    40%{
    background-position:  bottom -30px left 860px;
  }
   80%{
    background-position:  bottom 20px left 1600px;
  }
   100%{
    background-position:  bottom -80px left 2400px;
  } 
}