Allow List Content to scale on Mobile

Site URL: https://brass-triceratops-e56d.squarespace.com

Hey guys, I've been scouring the forum for help and I've gotten this far.

I'm trying to scale a block of 3 images when on mobile; instead of the typical flow over like it does automatically.

With the code below I've gotten them to scale on mobile but now I need them to align horizontally,

any help?

@media screen and (max-width:766px) {
div#yui_3_17_2_1_1607657594977_302 {
    margin-bottom: 0 !important;
}
div#yui_3_17_2_1_1607657594977_302 
  {
    width: 33.33% !important;
}
div#yui_3_17_2_1_1607657594977_302 img {
    width: 100% !important;
    height: auto !important;
    vertical-align: middle;
    display: block;
}
}

edited CSS... same issue presents - not aligning horizontally

@media screen and (max-width:766px) {
.sqs-block-content {
    margin-bottom: 0 !important;
}
.sqs-block-content  {
    width: 33.33% !important;
}
.sqs-block-content img {
    width: 100% !important;
    height: auto !important;
    vertical-align: middle;
    display: block;
}
}

Additionally now realizing that .sqs-block-content is not right either