@keyframes lr-fadein {
from {
visibility: hidden;
opacity: 0;
}
to {
visibility: visible;
opacity: 1;
}
}
@keyframes lr-fadeout {
from {
visibility: visible;
opacity: 1;
}
to {
visibility: hidden;
opacity: 0;
}
}
#lr-overlay-wrapper {
position: fixed;
background: #121212;
width: 100vw;
height: 100vh;
z-index: 2147483647;
left: 0;
top: 0;
display: flex;
align-items: center;
justify-content: center;
flex-flow: column nowrap;
}
#lr-overlay-content {
text-align: center;
font-size: 2em;
color: white;
margin: 0.75em auto;
}
#lr-overlay-content img {
width: 50%;
}
#lr-overlay-content a {
color: lightblue;
}
#lr-overlay-content div {
margin: 0.75em;
}
#lr-overlay-buttons {
margin: 0.75em auto;
display: flex;
}
#lr-overlay-skip {
user-select: none;
position: absolute;
right: 5%;
top: 5%;
}
.lr-overlay-button {
border-radius: 5px;
padding: 0.5em;
background: dimgray;
text-align: center;
margin: 0 5px;
}
.lr-overlay-button span {
color: white;
}
#lr-overlay-content div:nth-child(2),
#lr-overlay-content div:nth-child(3),
#lr-overlay-buttons {
visibility: hidden;
opacity: 0;
}
#lr-overlay-skip {
visibility: visible;
opacity: 1;
}
#lr-overlay-content div:nth-child(2) {
animation: lr-fadein 1s forwards;
animation-delay: 1s;
}
#lr-overlay-content div:nth-child(3) {
animation: lr-fadein 1s forwards;
animation-delay: 3s;
}
#lr-overlay-buttons {
animation: lr-fadein 1s forwards;
animation-delay: 5s;
}
#lr-overlay-skip {
animation: lr-fadeout 1s forwards;
animation-delay: 5s;
}