html, body {
  margin: 0;
  overflow: hidden;

  height: 100%;
}

.holli-slider{
  height: 100vh;
  position: relative;
}

.page-view .project {
  position: absolute;
  inset: 0;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
    -webkit-mask: none;
          mask: none;
  -webkit-mask-size: 7100% 100%;
          mask-size: 7100% 100%;
}

.page-view .project.hide {
-webkit-mask-position: 0% 0;
          mask-position: 0% 0;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  
  -webkit-animation: mask-play 1.4s steps(70) forwards;
          animation: mask-play 1.4s steps(70) forwards;
}


@-webkit-keyframes mask-play {
  from {
    -webkit-mask-position: 0% 0;
            mask-position: 0% 0;
  }
  to {
    -webkit-mask-position: 100% 0;
            mask-position: 100% 0;
  }
}

@keyframes mask-play {
  from {
    -webkit-mask-position: 0% 0;
            mask-position: 0% 0;
  }
  to {
    -webkit-mask-position: 100% 0;
            mask-position: 100% 0;
  }
}