Beginner help with Media queries

Hey all,

I'm a complete beginner with very little coding experience and I'm struggling to set up media queries. I had used a template initially and have added some custom styles. I'm happy with the page I have designed in the largest format, smaller size looks OK, but the rest are just a mess. When I try to set up a media query, it seems to edit the settings for all sizes, rather than the screen size I have selected. I know I'm doing something fundamentally wrong, just can't figure out what. I assume that the CSS files are set up incorrectly, if at all. Initially I want smaller padding on smaller sizes, just around a column of text. Any pointers would be greatly appreciated!

Thanks in advance :-) Andy

This is one way to add media queries in Bootstrap Studio

Media Query

Thanks Windy, it really helped seeing it simplified like that. I should have broken it down into manageable chunks instead of jumping in at the deep end! I think I've got it now!