/* ==========================================================================
   Page-level overrides of master-page boxes for the new pages.
   Link ONLY from the pages that use the new design (default.aspx, NFL/default.aspx, the How-to-Play,
   start-your-pool and admin-please-read pages). NEVER add to the master page: it is unscoped.
   ========================================================================== */
#site_content { width: auto; max-width: 877px; margin: 0 auto; padding: 0; background: none; overflow: visible; } /* 877px = the NASCAR #menubar width, so the content is flush with the menu bar (like NFL) */
/* The new design has its own footer; the master #footer is a fixed 878px box that causes horizontal scroll on phones.
   On LOGGED-IN pages (admin-please-read) keep the master footer instead if you need its "Contact Pool Admin" link:
   delete the next rule for that page and drop the .site-footer block from the fragment. */
#content_footer, #footer { display: none; }

/* Phone width: keep the existing header markup. The 458px logo, nowrap status line,
   empty 468px header slot, and one-row menu are what widen the page. Do not clip the menu. */
@media (max-width: 820px) {
  html, body { width: 100% !important; max-width: 100% !important; }
  #main, #header, #logo, #menubar, #site_content {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box;
  }
  #header, #logo, #menubar { height: auto !important; }
  #logo { text-align: center !important; background-image: none !important; }
  #logo_text { float: none !important; position: relative !important; left: 0 !important; top: auto !important; width: 100% !important; max-width: 100% !important; text-align: center !important; margin: 0 auto !important; }
  #logo img { display: block !important; margin: 0 auto !important; width: auto !important; max-width: 100% !important; height: auto !important; }
  #header div[style*="width:82%"],
  #header div[style*="width:75%"],
  #header div[style*="width:468px"] {
    float: none !important;
    width: auto !important;
    max-width: 100% !important;
    height: auto !important;
  }
  #status {
    float: none !important;
    width: auto !important;
    max-width: 100% !important;
    white-space: normal !important;
  }
  #mbmcpebul_table {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    white-space: normal !important;
  }
  #mbmcpebul_table > li { float: none !important; display: inline-block !important; width: auto !important; vertical-align: top; }
  #mbmcpebul_table li div.buttonbg { width: auto !important; height: auto !important; min-height: 40px; }
  #menubar { position: relative; }
  #mbmcpebul_table > li > ul { left: 0 !important; max-width: calc(100vw - 24px); }
  .ppp-home, .ppp-home .wrap, .ppp-home .hero, .ppp-home .hero-grid, .ppp-home .hero-copy, .ppp-home .hero-shot, .ppp-home picture {
    min-width: 0 !important;
    max-width: 100%;
  }
  .ppp-home .hero-grid { grid-template-columns: 1fr !important; }
  .ppp-home img { max-width: 100% !important; height: auto !important; }
}