@media screen and (max-width: 768px) {
  body {
    font-size: 17px !important;
    line-height: 1.45 !important;
    overflow-x: hidden !important;
    margin: 0 !important;
    padding: 10px !important;
  }

  table, tbody, tr, td, th {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  td, th {
    padding: 4px !important;
  }

  img {
    max-width: 100% !important;
    height: auto !important;
  }

  img[src*="logo"],
  img[src*="spacer"],
  img[src*="tl"],
  img[src*="tr"],
  img[src*="bl"],
  img[src*="br"],
  img[src*="tm"],
  img[src*="btm"] {
    display: none !important;
  }

  .mobile-hide-decor {
    display: none !important;
    height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  .mobile-toplinks {
    white-space: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    text-align: center !important;
    font-size: 16px !important;
    line-height: 1.2 !important;
    padding: 6px 0 8px 0 !important;
    border-bottom: 1px solid #00aa00 !important;
    margin-bottom: 8px !important;
  }

  .mobile-toplinks a {
    display: inline !important;
    padding: 0 !important;
    margin: 0 !important;
    min-height: 0 !important;
    line-height: inherit !important;
  }

  .mobile-nav-wrap {
    display: block !important;
    max-height: 42vh !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    border: 1px solid #006600 !important;
    padding: 10px !important;
    margin: 8px 0 14px 0 !important;
  }

  a.nav, a.navhi, a.navhilite, .mobile-nav-wrap a {
    display: block !important;
    min-height: 42px !important;
    line-height: 42px !important;
    padding: 0 10px !important;
    margin: 3px 0 !important;
    box-sizing: border-box !important;
  }

  .mobile-toggle {
    width: 100% !important;
    padding: 10px !important;
    margin: 8px 0 !important;
    font-size: 17px !important;
  }

  body.mobile-collapsed .mobile-stats-wrap {
    display: none !important;
  }

  body.mobile-collapsed .mobile-stats-wrap.mobile-section-open {
    display: block !important;
  }

  p, div, span {
    line-height: 1.45 !important;
  }
}

@media screen and (max-width: 768px) {
  .mobile-toplinks {
    font-size: 13px !important;
    line-height: 1.1 !important;
    padding: 2px 0 4px 0 !important;
  }

  .mobile-toplinks a {
    font-size: inherit !important;
  }
}

@media screen and (max-width: 768px) {
  /* Reduce MoTD / Mail / Petition font size by ~30% */
  .mobile-toplinks {
    font-size: 11px !important;
    line-height: 1.1 !important;
    padding: 2px 0 4px 0 !important;
  }

  .mobile-toplinks a {
    font-size: inherit !important;
  }
}

@media screen and (max-width: 768px) {
  /* Reduce MoTD / Mail / Petition row by an additional 30% */
  .mobile-toplinks {
    font-size: 8px !important;
    line-height: 1.0 !important;
    padding: 1px 0 2px 0 !important;
  }

  .mobile-toplinks a,
  .mobile-toplinks *,
  .mobile-toplinks b,
  .mobile-toplinks strong {
    font-size: inherit !important;
    line-height: inherit !important;
  }
}

@media screen and (max-width: 768px) {
  /* Make every navigation link use the full width of the nav box */
  .mobile-nav-wrap a,
  .mobile-nav-wrap a.nav,
  .mobile-nav-wrap a.navhi,
  .mobile-nav-wrap a.navhilite {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    min-height: 42px !important;
    line-height: 42px !important;
    padding: 0 10px !important;
    margin: 2px 0 !important;
  }

  /* Remove indentation caused by old table layouts */
  .mobile-nav-wrap br {
    display: none !important;
  }

  /* Make category headers span full width as well */
  .mobile-nav-wrap b,
  .mobile-nav-wrap strong {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    margin: 8px 0 4px 0 !important;
  }
}

@media screen and (max-width: 768px) {
  /* Reduce unused space above the location/title by about 25% */
  body {
    padding-top: 6px !important;
  }

  /* Tighten the first few table rows at the top of the page */
  body > table:first-of-type,
  body > table:first-of-type tr,
  body > table:first-of-type td {
    margin-top: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  /* Reduce spacing around the location heading */
  h1, h2, h3,
  font[size="+1"],
  font[size="+2"],
  font[size="+3"] {
    margin-top: 2px !important;
    margin-bottom: 2px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
}

@media screen and (max-width: 768px) {
  /* Reduce top whitespace by an additional ~25% */
  body {
    padding-top: 2px !important;
  }

  /* Remove nearly all padding from the topmost table rows */
  body > table:first-of-type,
  body > table:first-of-type tr,
  body > table:first-of-type td {
    margin-top: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  /* Tighten spacing around the location title even further */
  h1, h2, h3,
  font[size="+1"],
  font[size="+2"],
  font[size="+3"] {
    margin-top: 0 !important;
    margin-bottom: 1px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    line-height: 1.0 !important;
  }
}

@media screen and (max-width: 768px) {

  /* =========================
     LOGIN PAGE FIXES
     ========================= */

  /* Make the login form stack cleanly on mobile */
  form table,
  form tbody,
  form tr,
  form td {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    text-align: left !important;
  }

  /* Username and password labels */
  form td b,
  form td strong {
    display: block !important;
    margin-bottom: 4px !important;
  }

  /* Login fields */
  form input[type="text"],
  form input[type="password"] {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 42px !important;
    font-size: 18px !important;
    box-sizing: border-box !important;
    margin-bottom: 12px !important;
  }

  /* Login button */
  form input[type="submit"],
  form button {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 44px !important;
    font-size: 18px !important;
    box-sizing: border-box !important;
    margin: 12px 0 !important;
  }

  /* =========================
     FOOTER / COPYRIGHT FIXES
     ========================= */

  /* Make footer flow naturally after all page content */
  .copyright,
  #copyright,
  .footer,
  #footer {
    position: static !important;
    clear: both !important;
    display: block !important;
    width: 100% !important;
    margin-top: 20px !important;
    padding-top: 10px !important;
  }

  /* Add space at the bottom so Safari controls do not overlap content */
  body {
    padding-bottom: 120px !important;
  }

  /* Prevent PayPal and license images from overflowing */
  .copyright img,
  #copyright img,
  .footer img,
  #footer img {
    max-width: 100% !important;
    height: auto !important;
  }
}

@media screen and (max-width: 768px) {
  .mobile-login-cell {
    text-align: center !important;
    padding: 8px !important;
  }

  .mobile-login-cell table,
  .mobile-login-cell tbody,
  .mobile-login-cell tr,
  .mobile-login-cell td {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
  }

  .mobile-login-input,
  .mobile-login-cell input[type="text"],
  .mobile-login-cell input[type="password"] {
    display: block !important;
    width: 90% !important;
    max-width: 320px !important;
    min-height: 42px !important;
    margin: 8px auto !important;
    font-size: 18px !important;
    box-sizing: border-box !important;
  }

  .mobile-login-cell input[type="submit"],
  .mobile-login-cell button {
    display: block !important;
    width: 70% !important;
    max-width: 220px !important;
    min-height: 42px !important;
    margin: 12px auto !important;
    font-size: 18px !important;
  }

  .mobile-footer {
    position: static !important;
    clear: both !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    margin: 28px 0 120px 0 !important;
    padding: 12px !important;
    text-align: center !important;
  }

  .mobile-footer img {
    max-width: 160px !important;
    height: auto !important;
    margin: 8px auto !important;
    display: block !important;
  }
}
