@import url("https://fonts.googleapis.com/css2?family=Russo+One&display=swap");

svg {
    font-family: "Russo One", sans-serif;
    width: 100%;
    height: 100%;
}
svg text {
    animation: stroke 3s infinite alternate;
    stroke-width: 2;
    stroke: #486fe0;
    font-size: 100px;
}
@keyframes stroke {
    0% {
        fill: rgba(39, 234, 255, 0);
        stroke: rgba(72, 111, 224, 1);
        stroke-dashoffset: 25%;
        stroke-dasharray: 0 50%;
        stroke-width: 2;
    }
    70% {
        fill: rgba(39, 234, 255, 0);
        stroke: rgba(72, 111, 224, 1);
    }
    80% {
        fill: rgba(39, 234, 255, 0);
        stroke: rgba(72, 111, 224, 1);
        stroke-width: 3;
    }
    100% {
        fill: rgba(39, 234, 255, 1);
        stroke: rgba(72, 111, 224, 0);
        stroke-dashoffset: -25%;
        stroke-dasharray: 50% 0;
        stroke-width: 0;
    }
}

.wrapper {
    background-color: #ffffff;
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 9999;
    transition: opacity 0.75s, visibility 0.75s;
}

.wrapper--hidden {
    opacity: 0;
    visibility: hidden;
}