CSS

html, body {
    width: 100%;
    height: 100%;

    background-color: white;
}

#pack {
    position: absolute;
    top: 50%;
    left: 50%;
    height: 300px;
    width: 200px;
    margin-top: -100px;
    margin-left: -100px;
}

#sparkle1 {
    position: absolute;
    top: -8%;
    left: 50%;
    height: 140px;
    width: 150px;
}

#sparkle2 {
    position: absolute;
    top: 90%;
    left: 57%;
    height: 180px;
    width: 155px;
}

#sparkle3 {
    position: absolute;
    top: 94%;
    left: 29%;
    height: 140px;
    width: 115px;
}

#sparkle4 {
    position: absolute;
    top: 25%;
    left: 86%;
    height: 150px;
    width: 123px;
}

#sparkle5 {
    position: absolute;
    top: 20%;
    right: 83%;
    height: 145px;
    width: 118px;
}

#sparkle6 {
    position: absolute;
    top: 79%;
    right: 82%;
    height: 150px;
    width: 120px;
}

#sparkle7 {
    position: absolute;
    top: 52%;
    right: 85%;
    height: 150px;
    width: 130px;
}

#sparkle8 {
    position: absolute;
    top: 50%;
    left: 85%;
    height: 180px;
    width: 160px;
}

#sparkles {
    position: absolute;
    top: 50%;
    left: 50%;

    width: 500px;
    height: 500px;
    margin-top: -250px;
    margin-left: -250px;
}