body {
    font-family: Roboto Mono;
    margin: 0;
    background: url("old_skater_gif.webp");
    background-position: center;
    /* Center the image */
    background-repeat: no-repeat;
    /* Do not repeat the image */
    background-size: cover;
    /*cover the whole page*/
}

main {
    height: 100vh;
    /* make the page 100% of the viewport */
}

/*BACK-BUTTON*/
.back-button a {
    font-family: Roboto Mono;
    font-size: 2em;
    display: block;
    padding: 20px;
    text-decoration: none;
    color: blue;
}

.back-button {
    position: fixed;
    left: 0px;
    top: 0px;
    margin: 20px;
    border-radius: 100%;
    border: circle 5px black;
    background-color: gainsboro;
    transition: border .2s ease-in;
    z-index: 10;
}

.back-button a {
    transition: color .2s ease-in;
}

.back-button:hover {
    border: 5px;
}

.back-button a:hover {
    color: gold;
}

/*NEXT-BUTTON*/
.next-button a {
    font-family: Roboto Mono;
    font-size: 2em;
    display: block;
    padding: 20px;
    text-decoration: none;
    color: blue;
}

.next-button {
    position: fixed;
    right: 0px;
    top: 0px;
    margin: 20px;
    border-radius: 100%;
    border: circle 5px black;
    background-color: gainsboro;
    transition: border .2s ease-in;
}

.next-button a {
    transition: color .2s ease-in;
}

.next-button:hover {
    background-color:
        border: dotted 5px;
}

.next-button a:hover {
    color: gold;
}


/*FOOTER*/
.footer {
    font-family: Roboto Mono;
    position: fixed;
    padding-left: 18px;
    bottom: 18px;
    width: 100%;
    font-size: 12px;
    color: gold;
}


.main-content {}

.oldog {
    text-align: center;
    font-family: 'Staatliches', cursive;
    font-size: 5em;
    color: white;
    letter-spacing: 2px;
    animation-name: admin;
    animation-duration: 4s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}


@keyframes admin {
    0% {
        opacity: 0;
        /*vw means viewport width*/
        transform: translateY(0vh);
    }

    25% {
        opacity: 1;
        color: gold;
    }

    50% {
        color: blue
    }

    75% {

        opacity: 0;
    }

    100% {
        opacity: 0;
        transform: translateY(100vh);
    }
}