/*
 * Responsive layer for the older table-based pages of quilon.com.
 * Linked from each legacy page; the table classes (rt-fluid, rt-stack,
 * rt-scroll) were added to the markup so desktop layout stays unchanged and
 * only small screens are reflowed.
 */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { overflow-wrap: break-word; word-wrap: break-word; }
img, video, embed, object, iframe { max-width: 100%; }
img[usemap] { max-width: none; }
table { max-width: 100%; }
pre { white-space: pre-wrap; }

.rt-scroll { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }

@media (max-width: 760px) {
  body { margin: 0 !important; padding: 0 8px; box-sizing: border-box; }
  img { height: auto !important; }
  iframe { width: 100% !important; }
  div[style*="width"], div[width], center, p[style*="width"] { max-width: 100% !important; }

  table.rt-fluid, table.rt-stack { width: 100% !important; height: auto !important; }
  table.rt-fluid > tbody > tr > td, table.rt-fluid > tbody > tr > th,
  table.rt-fluid > thead > tr > th, table.rt-fluid > tr > td { width: auto !important; height: auto !important; }

  table.rt-stack, table.rt-stack > tbody, table.rt-stack > thead, table.rt-stack > tfoot,
  table.rt-stack > tbody > tr, table.rt-stack > thead > tr, table.rt-stack > tfoot > tr,
  table.rt-stack > tbody > tr > td, table.rt-stack > tbody > tr > th,
  table.rt-stack > thead > tr > th, table.rt-stack > tfoot > tr > td {
    display: block; width: auto !important; height: auto !important; box-sizing: border-box;
  }
  /* Keep image-map pictures usable: let them scroll sideways instead of shrinking. */
  td:has(> img[usemap]), p:has(> img[usemap]), div:has(> img[usemap]) { overflow-x: auto; }

  /* Pictures floated beside text sit on their own line on phones. */
  img[align="right"], img[align="left"], img[align="RIGHT"], img[align="LEFT"] {
    float: none !important; display: block; margin: 8px auto !important;
  }
  /* AdSense 728x90 leaderboards: clip rather than widen the page. */
  ins.adsbygoogle, .rt-ad { max-width: 100% !important; overflow: hidden; }
}
