/* Narrow-screen adaptation for the preserved 980px legacy design. */
@media (max-width: 767px) {
  html, body { min-width: 0 !important; width: 100%; overflow-x: hidden; }
  #wrap, #header, #container, #container2, #footer, .footerZone {
    box-sizing: border-box;
    width: 100% !important;
    min-width: 0 !important;
  }
  #header { height: auto !important; min-height: 126px; }
  #utilityNav { right: 10px; }
  .logo { margin-left: 12px !important; }
  #mainNav { position: relative; top: auto; right: auto; width: 100%; height: auto; overflow: visible; }
  #mainNav ul { box-sizing: border-box; display: flex; flex-wrap: wrap; justify-content: center; width: 100%; margin: 0; padding: 0; }
  #mainNav li { float: none; }
  #mainNav li a { padding-left: 10px; padding-right: 10px; font-size: 14px; }
  .mainBanner {
    box-sizing: border-box;
    width: 100% !important;
    height: 0 !important;
    padding-top: 36%;
    background-position: center top !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
  }
  #container2 #leftColumn {
    position: static !important;
    float: none !important;
    width: 100% !important;
    min-height: 0;
    margin: 12px 0 0 !important;
  }
  .navLeftBg, .navLeft { width: 100% !important; }
  .navLeft ul { display: flex; flex-wrap: wrap; }
  .navLeft li { box-sizing: border-box; width: 50%; }
  .adbanner { display: none; }
  #container2 #centerColumn { float: none !important; width: 100% !important; }
  .indideBanner { width: 100% !important; height: auto !important; }
  .indideBanner img { width: 100% !important; height: auto !important; }
  #container2 #breadcrumb { position: static !important; box-sizing: border-box; width: 100%; padding: 8px 16px; text-align: right; }
  .maincenter { box-sizing: border-box; width: 100% !important; margin-bottom: 30px; }
  .maincenterZone, #insidepage_com { box-sizing: border-box; max-width: 100%; padding-left: 12px; padding-right: 12px; }
  .maincenterZone table, #insidepage_com table { display: block; width: 100% !important; max-width: 100%; margin-left: 0 !important; margin-right: 0 !important; overflow-x: auto; }
  img { max-width: 100%; height: auto; }
  input, textarea, select { box-sizing: border-box; max-width: 100%; }
  #footerLinks, .accessibility, .copyright { box-sizing: border-box; width: 100%; padding-left: 12px; padding-right: 12px; }
}