@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap');

*{
    margin: 0;
    padding: 0;
    outline: none;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box; 
}

body{
    background-color: black;
    color:rgb(142, 255, 37);
    font-family: 'IBM Plex Mono', monospace;  
    background-image: url(../images/background.gif); 
    background-repeat: repeat;
}

#introbody{
    background-image: none;
}

a{
    color: white;
    text-decoration: none;
}

a:hover{
    color:chartreuse;
}

.skip{
    margin-top: 2vh;
    text-align: center;
    font-family:'Press Start 2P', 'Courier New', Courier, monospace;
    letter-spacing: .2em;
    font-size: x-small;
}

a:visited {
    color:inherit;
}

#introbooty{
    display: block;
    padding-top: 10vh;
    margin: auto;
    height: 50vh;
    width: auto;
}

.container {
    width: 40vw;
    min-height: 120px;
    margin: 50px auto 0;
}

.container .typer {
    color: chartreuse;
    line-height: 1.75;
    font-size: 1em;
    text-align: left;
    padding-top: 15px;
}

#enterlink{
    padding-top:5vh;
    text-align: center;
    opacity: 0.0;
    animation: fadein .5s 43s ease-in-out infinite;
    font-family:'Press Start 2P', 'Courier New', Courier, monospace;
    text-decoration: none;
    color:white;
    letter-spacing: .15em;
    line-height: 2em;
}

@keyframes fadein {
    0% {opacity:.5;}
    100% {opacity:1;}
}

h1{
    text-align: center;
    font-family:'Press Start 2P', 'Courier New', Courier, monospace;
    margin-top:45vh;
    font-size: 6em;
    color:red;
    opacity: 0.0;
    animation: fadein .001s ease-in infinite
}

@keyframes fadein {
    0% {opacity:.75;}
    100% {opacity:1;}
}


@media only screen and (max-width: 768px) {

    #introbooty{
        display: block;
        padding-top: 5vh;
        margin: auto;
        height: 25vh;
        width: auto;
    }

    .container {
        width: 75vw;
        min-height: 120px;
        margin: 3vh auto 0;
    }  

    #enterlink{
        font-size: x-small;
        padding-bottom: 5vh;
    }

    h1{
        text-align: center;
        margin-top: 40vh;
        font-size: 3em;
        line-height: 1.5em;
        color:red;
        animation: fadein .001s ease-in infinite
    }

    @keyframes fadein {
        0% {opacity:.75;}
        100% {opacity:1;}
    }

}