#cells {
    position: absolute;
    z-index: -1;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: hidden;
}
#cells span {
    display: block;
    position: absolute;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
    transform: translate(-50%, -50%);
}
#cells span:before {
    display: block;
    padding-top: 100%;
    content: '';
}      
#cells span.speed-1 {
    -ms-transition: all cubic-bezier(.2, 0, .8, 1) 40s;
    -webkit-transition: all cubic-bezier(.2,0,.8,1) 40s;
    transition: all cubic-bezier(.2,0,.8,1) 40s;
}
#cells span.speed-2 {
    -ms-transition: all cubic-bezier(.2, 0, .8, 1) 60s;
    -webkit-transition: all cubic-bezier(.2,0,.8,1) 60s;
    transition: all cubic-bezier(.2,0,.8,1) 60s;
}
#cells span.speed-3 {
    -ms-transition: all cubic-bezier(.2, 0, .8, 1) 75s;
    -webkit-transition: all cubic-bezier(.2,0,.8,1) 75s;
    transition: all cubic-bezier(.2,0,.8,1) 75s;
}
#cells .cell-1 {
    max-width: 775px;
    width: 59.6153846154vw;
    background-image: url("../images/cell-1.png");
}
#cells .cell-2 {
    max-width: 590px;
    width: 45.3846153846vw;
    background-image: url("../images/cell-2.png");
}
#cells .cell-3 {
    max-width: 260px;
    width: 20vw;
    background-image: url("../images/cell-3.png");
}
/* https://blumberginstitute.org/wp-content/uploads/2024/05/virus-background-02_3.mp4 */

/* Add mobile styles */
@media (max-width: 600px) {
    #cells {
        display: none;
    }

    #cells {
        position: fixed;
        z-index: -1;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        overflow: hidden
    }
    
    #cells span {
        display: block;
        position: absolute;
        background-position: center center;
        background-repeat: no-repeat;
        background-size: contain;
        -ms-transform: translate(-50%,-50%);
        -webkit-transform: translate(-50%,-50%);
        transform: translate(-50%,-50%)
    }
    
    #cells span:before {
        display: block;
        padding-top: 100%;
        content: ''
    }

    #cells .cell-1 {
        max-width: 475px;
        width: 59.6153846154vw;
        left: 0vw;
    }
    
    #cells .cell-2 {
        max-width: 390px;
        width: 45.3846153846vw;
        left: 100vw;
    }
    
    #cells .cell-3 {
        max-width: 240px;
        width: 20vw;
        left: 80vw;
    }
}