@font-face 
{
    font-family: neo;
    src: url(/neon_pixel-7.ttf);
}

@font-face 
{
    font-family: myFont;
    src: url(/Wonkyneocity-Regular.otf);
}

p 
{
    font-family: myFont;
    color: #f6f2f2;
    font-size: 3vw;
    margin: 2%;
    padding: 0;
}

body 
{
    background-color: #0a000e;
}

h1
{
    font-family: neo;
    text-align: center;
    top: 0;
    left: 0;
    width: 100%;
    height: fit-content;

    padding: 0;
    margin: 0;

    font-size: 9vw;
    font-weight: normal;

    border: 2px outset #0d24dc;
    box-shadow: 0 0 30px #0d77f3;
    border-radius: 20px;
    color: #f7bff4;
    animation: neon 2s ease-in infinite alternate;
    text-shadow: 
        0 0 10px #f6f2f26c,
        0 0 15px #f6f2f24e,
        0 0 30px #fd18f279,
        0 0 50px #fd18f282,
        0 0 70px #fd18f286,
        0 0 90px #fd18f288;
}

h2
{
    font-size: 5vw;
    margin-top: 2%;
    margin-bottom: 1%;
    border-bottom: 2px solid #0d24dc;
    font-family: neo;
    text-align: center;
    font-weight: normal;
    color: #f7bff4;
    animation: neon 2s ease-in infinite alternate;
    text-shadow: 
        0 0 10px #f6f2f26c,
        0 0 15px #f6f2f24e,
        0 0 30px #fd18f279,
        0 0 50px #fd18f282,
        0 0 70px #fd18f286,
        0 0 90px #fd18f288;
}

@keyframes neon
{
    from
    {
        text-shadow: 
        0 0 10px #f6f2f2c9,
        0 0 15px #f6f2f2c4,
        0 0 30px #fd18f0,
        0 0 50px #fd18f0,
        0 0 70px #fd18f0,
        0 0 90px #fd18f0;
    }
    to 
    {
        text-shadow: 
        0 0 12px #f6f2f2b7
        0 0 15px #f6f2f2b0
        0 0 15px #fd18f0
        0 0 25px #fd18f0
        0 0 35px #fd18f0
        0 0 45px #fd18f0;
    }

}

.left 
{
    text-align: center;
    box-sizing: border-box;
    position: relative;
    border: 2px solid #0d24dc;
    box-shadow: 0 0 20px #0d77f3;
    top: 20px;
    left: 0;
    height: 50%;
    width: calc(100%-200px);

    margin-left: 100px;
    margin-right: 100px;

    border-radius: 20px;
}

.right
{
    text-align: center;
    box-sizing: border-box;
    position: relative;
    border: 2px solid #0d24dc;
    box-shadow: 0 0 20px #0d77f3;
    top: 40px;
    left: 0;
    height: 50%;
    width: calc(100%-200px);

    margin-left: 100px;
    margin-right: 100px;

    border-radius: 20px;
}

.backToMain
{
    
    background-color: #0d25dc;
    position: relative;
    top: 60px;
    text-align: center;
    border: 2px outset #0d24dc;
    box-shadow: 0 0 30px #0d77f3;
    border-radius: 20px;
    width: fit-content;
    height: fit-content;
    text-decoration: none;
}

.smol
{
    font-size: 3vw;
    border-radius: 20px;
    border: 1px outset  #0d24dc;
    box-shadow: 0 0 5px #0d77f3;
}