/* smackwater.css — responsive patch that keeps the original look */

/* Basic sanity */
* { box-sizing: border-box; }
img { max-width: 100%; height: auto; }

/* Page background stays black */
html, body { margin: 0; padding: 0; background: #000; }

/* Center the whole layout and keep the orange frame look */
table[width="80%"] {
  width: 80%;
  margin: 0 auto;
}

/* Mobile */
@media (max-width: 800px) {

  /* Outer orange frame fits the screen */
  table[width="80%"] {
    width: 96% !important;
  }

  /* Any inner 65% tables should expand on phones */
  table[width="65%"] {
    width: 96% !important;
  }

  /* Scale any old fixed-width images */
  img[width] {
    width: 100% !important;
    height: auto !important;
  }

  /* Title size on phones */
  font[size="6"] {
    font-size: 34px !important;
    line-height: 1.1 !important;
  }

  /* NAV: wrap buttons (this targets the NAV table by ID) */
  #sw-nav, #sw-nav tbody, #sw-nav tr { width: 100% !important; }
  #sw-nav tr {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 8px !important;
  }
  #sw-nav td {
    display: block !important;
    flex: 0 0 48% !important;   /* 2 per row */
    max-width: 48% !important;
    text-align: center !important;
    padding: 6px 0 !important;
  }
  #sw-nav td a { display: block !important; }
  #sw-nav font[size="2"] { font-size: 14px !important; }
}/* Reduce excess orange spacing on phones */@media (max-width: 800px) {  /* Remove fixed table heights */  table[height] {    height: auto !important;  }  td[height] {    height: auto !important;  }  /* Reduce empty paragraph spacing */  p {    margin: 10px 0 !important;  }  /* Remove extra padding inside orange cell */  td[bgcolor="#CC3300"] {    padding-top: 10px !important;    padding-bottom: 10px !important;  }}
/* Mobile: make the orange panel fill the screen height (uniform pages) */
@media (max-width: 800px) {
  td[bgcolor="#CC3300"] {
    min-height: 100vh !important;
    display: block !important;
  }
}

