#container {
    height: 100vh;
    background-color: #000000;
    overflow: hidden;
}

#container h1 {
    font-size: 4rem;
    color: #555555;
    font-family: 'Rubik Mono One', sans-serif;
}

/* coment CSS */
/* #container {
    background-image: url(https://www.arbortechtools.com/wp-content/uploads/2016/09/flip_geometric_bg.jpg);
    background-position: center;
    background-size: cover;
} */
#content {
    margin-left: 45%;
    width: 70%;
    animation-name: scrolltext;
    animation-duration: 30s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    text-align: center;
    transform-origin: top left;
}

@keyframes scrolltext {
    0% {
        opacity: 0;
        transform: rotate(30deg) translateY(50%);
    }

    10% {
        opacity: 0.8;
    }

    11% {
        opacity: 1;
    }

    12% {
        opacity: 0.2;
    }

    13% {
        opacity: 0.8;
    }

    90% {
        opacity: 0.8;
    }

    100% {
        opacity: 0;
        transform: rotate(30deg) translateY(-100%);
    }
}