Issues with landing page hero image border on mobile being too large

Design help Layout & Design
1

I have a hero image that has a solid color border around it. It looks great on desktop.

On mobile it looks kinda awful.

image
image485×1280 89.5 KB

Is there a way to either make the cityscape image larger so there is a thinner border or could the image be centered just on mobile?

Is there a way anywhere in Webflow to separate mobile design from desktop design? It seems really counterintuitive that you have to do this delicate dance with one design that flexes to each vs designing differently for mobile and desktop especially when it seems that they fight with each other so often.

Here is my site Read-Only: LINK
(how to share your site Read-Only link)

2

yes, check width and height as has set fixed values, also check position and it spacing

And again, all your questions are related to lack of understanding basics of CSS. I will recommend to take some free courses found on YT to get familiar what CSS is and how it works and also finish at least Webflow-101 on Webflow University.