#intro {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
width: 100%;
height: 100vh;
height: 100svh;
background-color: #4c4c4c;
overflow: hidden;
z-index: 1000;
text-transform: uppercase;
font-size: 3.5vmin;
color: #fff;
font-weight: 300;
display: flex;
justify-content: center;
align-items: center;
flex-flow: column;
}
#intro p {
margin: 1.25rem auto;
letter-spacing: 0.5rem;
opacity: 0;
}
#intro.start-intro p {
opacity: 1;
transition: opacity 1.25s ease-in-out;
}
#intro.start-intro p:nth-child(2) {
transition-delay: 0.8s;
}
#intro.start-intro p:nth-child(3) {
transition-delay: 1.6s;
}
#intro.start-intro {
opacity: 0;
transform: translateX(-100vw);
transition: opacity 2s 3.6s ease-in, transform 0s 5.6s;
}