@keyframes cube {
    from {
        transform: scale(0) rotate(0deg) translate(-50%, -50%);
        opacity: 1;
    }
    to {
        transform: scale(20) rotate(960deg) translate(-50%, -50%);
        opacity: 0;
    }
}

.background {
   z-index: -5;
    position: fixed;
    width: 100vw;
    height: 100vh;
    top: 0;
    left: 0;
    margin: 0;
    padding: 0;
    background: #4a3d2b;
    overflow: hidden;
}
.background li {
   z-index: -4;
    position: absolute;
    top: 80vh;
    left: 45vw;
    width: 10px;
    height: 10px;
    border: solid 1px #423626;
    color: transparent;
    transform-origin: top left;
    transform: scale(0) rotate(0deg) translate(-50%, -50%);
    animation: cube 7s ease-in forwards infinite;
}
undefined
.background li:nth-child(0) {
   z-index: -4;
    animation-delay: 0s;
    left: 12vw;
    top: 52vh;
    border-color: #51432f;
}

.background li:nth-child(1) {
   z-index: -4;
    animation-delay: 2s;
    left: 88vw;
    top: 20vh;
    border-color: #51432f;
}

.background li:nth-child(2) {
   z-index: -4;
    animation-delay: 4s;
    left: 47vw;
    top: 40vh;
}

.background li:nth-child(3) {
   z-index: -4;
    animation-delay: 6s;
    left: 31vw;
    top: 6vh;
    border-color: #51432f;
}

.background li:nth-child(4) {
   z-index: -4;
    animation-delay: 8s;
    left: 59vw;
    top: 75vh;
}

.background li:nth-child(5) {
   z-index: -4;
    animation-delay: 10s;
    left: 69vw;
    top: 93vh;
    border-color: #51432f;
}
