Sitaram

Site URL: https://sacredcommunityproject.org/sacred-community-podcast I would like some help with this image grid. These are just small icon logo images, and so I don't want any to just be on a single line by themselves and large. My hope would be: That when it needs to shrink, it could just go to two rows of five images each. As it is now, when it gets a little smaller there are 8 on a row and then 2 on a row or 7 and 3. And then in mobile view it is 3, 3 and then 1. I am willing to make this a single row of 8 if there is a way to make it two rows of 4 on mobile. Any help is aprpeciated. If what I am wanting to do is not possible, please just tell me what is possible and I will adjust accordingly. Thanks!

Site URL: https://sacredcommunityproject.org/from-and-for-god Hi, I am hoping for some help! I want these four store logos present on this page to always stay in a row, even on mobile (I don't want people to have to scroll through each of these on their phone.) I had it working previously, and then something must have changed, and I can't figure out what. This is what I currently have: @media screen and (max-width:767px) { div#page-section-605e346569407f6b11798c2f>.row>.col>.row>.col { width: 33% !important; float: left !important; } div#page-section-61b4ef6db456ab7d39255dc4>.row>.col>.row>.col { width: 33% !important; float: left !important; } } And then in the header for the actual page I have this code: <style> @media screen and (max-width:768px) { .gallery-fullscreen-slideshow[data-width="full"] { height: 33vh !important; } .gallery-fullscreen-slideshow-control { visibility: hidden; } } @media screen and (max-width:1160px) and (min-width:768px) { .gallery-fullscreen-slideshow[data-width="full"] { height: 45vh !important; } } </style> Like I said, this previously worked fine. And then somewhere along the way it stopped working. I have no idea why. Any help is greatly appreciated.