/* Phone portrait only. Everything is inside the media query, so desktop and landscape are untouched. */
@media (max-width: 600px) and (orientation: portrait) {
  html, body { overflow-x: hidden; max-width: 100%; }
  html body #dm .dmInner, html body #dm .dmHeaderContainer, html body #dm .dmLayoutWrapper, html body #dm #hcontainer, html body #dm .dmBody { min-width: 0 !important; width: 100% !important; max-width: 100% !important; }
  img, video, iframe { max-width: 100%; height: auto; }
  iframe { max-width: 100%; }
  html body #dm #dm_content .dmRespRow, html body #dm #dm_content .dmRespColsWrapper, html body #dm #dm_content .dmRespCol { min-width: 0 !important; max-width: 100% !important; box-sizing: border-box; }
  html body #dm #dm_content .dmRespRow { padding-left: 14px !important; padding-right: 14px !important; }
  html body #dm #dm_content .dmRespRow .dmNewParagraph, html body #dm #dm_content .dmRespRow .imageWidget, html body #dm #dm_content .dmRespRow .dmWidget { margin-left: 0 !important; margin-right: 0 !important; max-width: 100% !important; }
  html body #dm #dm_content .dmRespCol { padding-left: 0 !important; padding-right: 0 !important; }
  .dmRespColsWrapper { display: block !important; }
  .dmRespCol { width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; float: none !important; }
  .dmNewParagraph p, .dmNewParagraph span, .dmNewParagraph li { overflow-wrap: anywhere; }
  table { max-width: 100%; display: block; overflow-x: auto; }

  /* header: logo + hamburger, menu opens beneath */
  .stickyHeaderSpacer { display: none !important; }
  .dmHeaderResp .imageWidget { text-align: left; }
  #mobileMenuBtn { position: absolute; top: 12px; right: 28px; z-index: 50; width: 44px; height: 40px; border: 0; border-radius: 6px;
    background: rgba(255,255,255,.2); cursor: pointer; padding: 0; }
  #mobileMenuBtn span { display: block; width: 24px; height: 3px; margin: 5px auto; background: #fff; border-radius: 2px; }
  .dmHeaderResp nav.unifiednav { display: none !important; }
  body.mobile-menu-open #dm .dmHeaderResp nav.unifiednav { display: block !important; width: auto !important; max-width: none !important; margin: 0 !important; position: fixed !important; top: 64px !important; left: 0 !important; right: 0 !important; box-sizing: border-box; }
  body.mobile-menu-open .unifiednav__container { display: block !important; position: static !important; width: 100% !important; }
  body.mobile-menu-open .unifiednav__item-wrap { display: block !important; width: 100% !important; float: none !important; }
  body.mobile-menu-open #dm .unifiednav__item, body.mobile-menu-open #dm .unifiednav__item .nav-item-text { display: block !important; padding: 12px 6px !important; font-size: 18px !important; line-height: 1.3 !important; white-space: normal !important; padding-right: 48px !important; text-align: left !important; border-top: 1px solid rgba(255,255,255,.25); }
  body.mobile-menu-open .unifiednav__item-wrap.sub-open > .unifiednav__container_sub-nav { display: block !important; position: static !important; visibility: visible !important; opacity: 1 !important;
    transform: none !important; box-shadow: none !important; background: transparent !important; padding-left: 16px !important; width: 100% !important; }
  body.mobile-menu-open #dm .unifiednav__container_sub-nav .unifiednav__item { font-size: 16px !important; padding: 10px 14px !important; }
  body.mobile-menu-open .unifiednav__container_sub-nav { display: none !important; }
  .unifiednav .icon { display: none !important; }
  body.mobile-menu-open .unifiednav__item-wrap { position: relative !important; }
  .subToggle { position: absolute; top: 4px; right: 14px; width: 44px; height: 40px; border: 0; background: transparent; color: #fff; font-size: 22px; cursor: pointer; z-index: 2; }
  .sub-open > .subToggle { transform: rotate(180deg); }
  /* menu floats over the page instead of pushing it down */
  body.mobile-menu-open .dmHeaderResp nav.unifiednav { position: fixed !important; left: 0; right: 0; top: 64px; z-index: 99; background: #84a59d; padding: 0 14px 14px; box-shadow: 0 6px 12px rgba(0,0,0,.25); max-height: calc(100vh - 64px); overflow-y: auto; margin: 0 !important; }
  body.mobile-menu-open { overflow: hidden !important; }

  /* readable text and full-width buttons */
  .dmNewParagraph p, .dmNewParagraph span { line-height: 1.45; }
  .dmButtonLink { max-width: 100%; box-sizing: border-box; white-space: normal !important; }
  .dmRespRow[class*="hide-for-small"], .hide-for-small { display: none !important; }
  .dmRespCol.hide-for-small { display: none !important; }
  #dmPopup, .cookie-bar { max-width: 100%; }

  /* compact fixed top bar; page content is pushed down by the same amount so nothing is hidden underneath */
  html body #dm .dmHeaderContainer { position: fixed !important; top: 0 !important; left: 0; right: 0; height: 64px !important; min-height: 0 !important; z-index: 100; overflow: visible !important; transform: none !important; }
  html body #dm #hcontainer, html body #dm #hcontainer.dmHeader { height: 64px !important; min-height: 0 !important; padding: 0 !important; box-sizing: border-box !important; background: #84a59d !important; }
  html body #dm .dmHeaderResp, html body #dm .dmHeaderResp .dmRespRow { height: 64px !important; min-height: 0 !important; padding-top: 0 !important; padding-bottom: 0 !important; background: transparent !important; }
  html body #dm .dmHeaderResp .dmRespColsWrapper { height: 64px !important; display: flex !important; align-items: center; margin: 0 !important; padding: 0 !important; }
  html body #dm .dmHeaderResp .dmRespCol { height: auto !important; padding: 0 !important; margin: 0 !important; }
  html body #dm .dmHeaderResp .imageWidget { margin: 0 !important; padding: 0 !important; text-align: left !important; }
  html body #dm .dmHeaderResp .imageWidget img { width: auto !important; height: 44px !important; }
  html body #dm .dmHeaderResp .dmRespCol:not(:first-child) > *:not(nav):not(.dmLinksMenu) { display: none !important; }
  html body #dm .dmLayoutWrapper { padding-top: 64px !important; box-sizing: border-box; }
  html body #dm #dm-outer-wrapper .dmHeaderContainer #hcontainer.u_hcontainer.dmHeader { padding: 0 !important; }
  html body #dm .dmHeaderResp .imageWidget { height: 64px !important; display: flex !important; align-items: center; }
  html body #dm .dmHeaderResp .imageWidget img { margin: 0 !important; }
}