[Theme: Twenty Twelve] Child theme responsive layout problems

I’ve developed a child theme for Twenty Twelve at https://ninemusepress.com

Most of the pages work well on my iPhone — but I run into problems with pages that depend upon templates I made. What looks to be happening is some container is still sized smaller than the browser width (even though I tried to set all containing elements to width: auto)…while other elements stretch across the width of the iPhone browser.

I run into this problem with Safari and the iPhone — though it seems to be working fine in Chrome.

I’ve been trying to track down what’s happening with the code, but I can’t for the life of me figuring out which elements are the issue. I’m about to tear my hair out.

You can see an offending page here: https://ninemusepress.com/edgar-wilde-and-the-lost-grimoire/

And here’s a screenshot of the page on my iphone: https://ninemusepress.com/images/iphone.png

Here’s my child theme CSS’s media queries section:

[No need to post CSS code – it’s all visible on your site]