Adjusting Image Block Size on Mobile for Service Page

I'm using a blog page and blog post for a service page (Corporate IT Training), showing icons using 4 image blocks.

While they look great on desktop, on mobile, they turn into large blocks, disrupting the layout.

Is there a way to make these image blocks smaller or more visually appealing on mobile without losing the desktop view effect?

This is my website: https://www.workplaceconsultant.com
This question concerns this specific page: https://www.workplaceconsultant.com/capabilities/learning-development/corporate-training 

Thanks!

Hi @IhabKhiri, have you tried editing the layout in mobile view? 

Squarespace's article on Device view

5 hours ago, melody495 said:

Hi @IhabKhiri, have you tried editing the layout in mobile view? 

Squarespace's article on Device view

Hi @melody495 “In the classic editor, editing your mobile preview also affects the computer view of your site.” 😭

19 hours ago, tuanphan said:

You can use this code to Website > Website Tools (under Not Linked) > Custom CSS

@media screen and (max-width:767px) {
div#block-8dcab36ee7cc05a85bba+.row .span-3 {
    max-width: 150px;
    margin: 0 auto;
}
}

 

I see what you did there! Thanks, it works!