body {
    margin: 0;
    padding: 0;
    background-color: black;
    overflow: hidden;
}
p {
    margin: 0;
    padding: 0;
}
.star-box {
    width: 800px;
    position: absolute;
    color: white;
}
.shooting-star {
    animation: moving 8s infinite linear;
    /*
    transform: translate(-300px, 0);
    transition-duration: 10s;*/
}
.star {
    display: inline-block;
    font-size: 16px;
    line-height: 1;
    animation: rotation 3s infinite linear;
}
.star-after3 {
    margin-left: 2.8em;
    animation: twinkle 1.3s infinite linear;
}
.star-after2 {
    margin-left: 1.2em;
    animation: twinkle 2.3s infinite linear;
}
.star-after1 {
    margin-left: 0.8em;
    word-break: none;
    animation: twinkle 3s infinite linear;
}
@keyframes rotation {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}
@keyframes moving {
    from {
        margin-top: 0;
        margin-left: 100%;
    }
    to {
        margin-top: 100vh;
        margin-left: 0;
    }
}
@keyframes twinkle {
    0% {
        opacity: 0;
    }
    50% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}