@import "../fonts/Consolas/stylesheet.css";

::selection
{
    background: var(--highlighted-text);
}

html
{
    background-color: var(--dark-background-color);
    z-index: -1;
}

body
{
    background: radial-gradient(var(--light-background-color), var(--dark-background-color));
    color: var(--plain-text);
    font-family: "Consolas";
    z-index: -1;
}

main
{
    position: absolute;
    overflow: hidden;

    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    margin: 0px;
    padding: 0px;

    display: flex;

    justify-content: center;
    align-items: center;
}

.typing::after {
    content: "|";
    position: absolute;
    animation: cursor 1.0s steps(2, jump-none) infinite;
}

#blob
{
    position: fixed;
    top: 50vh;
    left: 50vw;
    width: 30vmin;
    height: 30vmin;
    background-color: var(--special-text);
    opacity: 0.25;
    border-radius: 50%;
    transform: translate(-50%, -50%);

    z-index: -1;
}

#blur
{
    position: fixed;
    top: 0;
    left: 0;

    width: 100vw;
    height: 100vh;

    backdrop-filter: blur(20vmin);
    -webkit-backdrop-filter: blur(20vmin);

    z-index: 0;
}

#name
{
    position: absolute;
    bottom: 50%;
    font-size: 10rem;
    margin: 0px;
    z-index: 1;
}

#subtitle
{
    position: absolute;
    top: 50%;
    font-size: 4rem;
    margin: 0px;
    z-index: 1;
}

@keyframes cursor 
{
    0% { opacity: 0.0; }
    50% { opacity: 1.0; }
    100% { opacity: 0.0; }
}