How to fix blog post text width on desktop and mobile?

I recently changed the text width on my blog posts to be narrower, as that makes posts much easier to read. I used the following my Global CSS to make this change (see below for the result):

}
body.blog .entry-wrap,
body.single .entry-wrap {
padding-left: 200px;
padding-right: 200px;
}

However, on mobile the text is also shrunk drastically (see below):

Do you know how I can shrink the width of my text posts in desktop mode, while still retaining the regular responsive width on mobile? If there’s an elegant way to do this, that would be really nice.

Thanks in advance for any insight you all might have; I really appreciate it!

Best,
Jonathan

Hi Jonathan,

Please update the code to:

@media (min-width: 768px) {
    body.blog .entry-wrap,
    body.single .entry-wrap {
        padding-left: 200px;
        padding-right: 200px;
    }
}

This would add the large padding only on wider screens.

Hope this helps.