*{
	margin:0;
	padding:0;
}

body {
 overflow: hidden;
 display: flex;
 height: 100vh;
 background-color: black;
}

header{
	display:none;

 --animation-delay: 15;
 --duration: 1100ms;
 --iterations: infinite;
}

 
.reveal,
.reveal::after {
         animation-delay: 10;
         animation-duration: 1000ms;
         animation-iteration-count: infinite;


}
 
.reveal {
        position: relative;
 	font-size: 6vw;
 	animation-name: text;
 	color: black;
 	text-transform: uppercase;

 
}
 
.reveal::after {
 	content: "";
 	position: absolute;
 	z-index: 999;
   color:black;
 	top: 0;
 	left: 0;
 	right: 0;
 	bottom: 0;
 	background-color: white;
 	transform: scaleX(0);
 	transform-origin: 0 50%;
 	animation-name: revealer;
 	animation-iteration-count: infinite;
 }
 
 
 
@keyframes text {
 from {
         clip-path: inset(0 100% 0 0);
 }
 to {
         clip-path: inset(0 0 0 0);
 }
}
 
 
 
 
@keyframes revealer {
 
 0%, 50% {
         transform-origin: 0 50%;
 }
 
 60%, 100% {
         transform-origin: 100% 50%; 
 }
 
 
 60% {
         transform: scaleX(1);
 }
 
 100% {
         transform: scaleX(0);
 }

}