Problems with 100% viewport width in mobile?

2 of my pages in mobile aren’t going full 100% width, you can see it here.

I’ve got <meta name="viewport" content="width=device-width" /> in my code, and I’ve tried various variations of it. The problem could be in my pages.phpfile, since the rest of the pages are custom templates?

Here’s my code for page.php:

<?php
/**
 * The template for displaying all pages.
 *
 * This is the template that displays all pages by default.
 * Please note that this is the WordPress construct of pages
 * and that other 'pages' on your WordPress site will use a
 * different template.
 *
 */

get_header(); ?>

<div id="primary" class="content-area">
    <div id="content" class="site-content" role="main">
        <?php while ( have_posts() ) : the_post(); ?>

        <?php get_template_part( 'content' ); ?>

        <?php endwhile; // end of the loop. ?>
    </div><!-- #content .site-content -->
</div>

<?php get_footer(); ?>

CSS:

#content {
  margin: 0 auto;
  max-width: 51em;
  background: none;
  float: none;
  margin: 0 auto;
  padding: 0;
}

#primary {
  width: 100%;
}

I don’t know if I’m missing something that’s wordpress related, or messed up my code (I’m a beginner at coding), or what. Confused because my other pages are working alright and I can’t see anything in the code that’s causing it to be that thin width.

*btw – haven’t figured out the nav in mobile yet, but you can see that it works in the other pages by checking out the link:
Home.