style.css

*{
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}
body{
    background-color: black;
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
}

.star{
    background-color: white;
    border-radius: 100%;
    position: absolute;
}

@keyframes move1 {
    from{
        transform: translateY(0px);
    }50%{
        transform: translateY(5px);
    }to{
        transform: translateY(0px);
    }
}

@keyframes move2 {
    from{
        transform: translateX(0px);
    }50%{
        transform: translateX(6px);
    }to{
        transform: translateX(0px);
    }
}

@keyframes move3 {
    from{
        transform: translateY(0px);
    }50%{
        transform: translateY(-3px);
    }to{
        transform: translateY(0px);
    }
}

@keyframes move4 {
    from{
        transform: translateX(0px);
    }50%{
        transform: translateX(-5px);
    }to{
        transform: translateX(0px);
    }
}

@keyframes move5 {
    from{
        transform: translate(0px, 0px);
    }50%{
        transform: translate(-4px, 3px);
    }to{
        transform: translate(0px, 0px);
    }
}

@keyframes move6 {
    from{
        transform: translate(0px, 0px);
    }50%{
        transform: translate(-5px, -6px);
    }to{
        transform: translate(0px, 0px);
    }
}

@keyframes move7 {
    from{
        transform: translate(0px, 0px);
    }50%{
        transform: translate(5px, -4px);
    }to{
        transform: translate(0px, 0px);
    }
}

@keyframes move8 {
    from{
        transform: translate(0px, 0px);
    }50%{
        transform: translate(6px, 5px);
    }to{
        transform: translate(0px, 0px);
    }
}