/* Loaded after all theme styles and Customizer CSS. */
@media screen and (max-width:700px) {
  html body { background:#f3f4f6 !important; font-size:15px !important; }
  body .mon-site-content,
  body .mon-main,
  body .mon-home-main { background:#f3f4f6 !important; }
  body .mon-home-main { padding-top:14px !important; }
  body .mon-home-main > .mon-wrap { padding-right:16px !important; padding-left:16px !important; }

  body .mon-home-main .mon-hero {
    width:100% !important;
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    grid-template-rows:240px 120px 120px !important;
    gap:10px !important;
    margin:0 !important;
    overflow:visible !important;
  }
  body .mon-home-main .mon-hero-card,
  body .mon-home-main .mon-hero-card:nth-child(n) {
    display:block !important;
    min-width:0 !important;
    min-height:0 !important;
    border-radius:8px !important;
  }
  body .mon-home-main .mon-hero-card:first-child {
    grid-column:1 / -1 !important;
    grid-row:1 !important;
  }
  body .mon-home-main .mon-hero-card:nth-child(2),
  body .mon-home-main .mon-hero-card:nth-child(3),
  body .mon-home-main .mon-hero-card:nth-child(4),
  body .mon-home-main .mon-hero-card:nth-child(5) {
    grid-column:span 1 !important;
    grid-row:auto !important;
  }
  body .mon-home-main .mon-hero-media::after {
    background:linear-gradient(0deg,rgba(31,41,55,.94),rgba(31,41,55,.50) 40%,rgba(31,41,55,.03) 78%) !important;
  }
  body .mon-home-main .mon-hero-content {
    padding:10px !important;
    background:linear-gradient(0deg,rgba(75,85,99,.42),rgba(75,85,99,0) 70%) !important;
  }
  body .mon-home-main .mon-hero-card:first-child .mon-hero-content { padding:15px 13px 13px !important; }
  body .mon-home-main .mon-hero-card:first-child .mon-hero-title {
    max-width:100% !important;
    margin:7px 0 6px !important;
    font-size:18px !important;
    font-weight:850 !important;
    line-height:1.16 !important;
    letter-spacing:-.018em !important;
  }
  body .mon-home-main .mon-hero-card:first-child .mon-hero-meta { font-size:10px !important; }
  body .mon-home-main .mon-hero-card:not(:first-child) .mon-hero-content { padding:10px !important; }
  body .mon-home-main .mon-hero-card:not(:first-child) .mon-hero-title {
    display:-webkit-box !important;
    overflow:hidden !important;
    -webkit-box-orient:vertical !important;
    -webkit-line-clamp:2 !important;
    margin:6px 0 0 !important;
    font-size:13px !important;
    font-weight:800 !important;
    line-height:1.18 !important;
  }
  body .mon-home-main .mon-hero .mon-category { padding:4px 8px !important; font-size:9px !important; }
  body .mon-home-main .mon-hero-card:not(:first-child) .mon-hero-meta { display:none !important; }

  body .mon-portal-grid { gap:20px !important; margin-top:20px !important; }
  body .mon-latest-column, body .mon-portal-right { gap:20px !important; }
  body .mon-latest-column { padding:0 !important; border:0 !important; border-radius:0 !important; background:#fff !important; box-shadow:none !important; }
  body .mon-main-section-head { min-height:62px !important; margin:0 !important; padding:0 0 12px !important; border-bottom:1px solid #e5e7eb !important; }
  body .mon-main-section-head h2, body .mon-panel-head h2 { font-size:17px !important; }
  body .mon-main-section-head .mon-heading-icon { width:36px !important; height:36px !important; padding:9px !important; border:1px solid #f5c5d1 !important; border-radius:11px !important; color:#ef1747 !important; background:#fff4f7 !important; }
  body .mon-main-section-head .mon-heading-icon .mon-icon { width:18px !important; height:18px !important; }
  body .mon-all-news-link { min-height:34px !important; padding:7px 11px !important; border:1px solid #d1d5db !important; border-radius:11px !important; color:#111827 !important; background:#fff !important; font-size:12px !important; font-weight:800 !important; }
  body .mon-latest-list { margin-top:0 !important; }
  body .mon-latest-list .mon-list-card { grid-template-columns:112px minmax(0,1fr) !important; min-height:96px !important; gap:12px !important; margin:0 !important; padding:16px 0 !important; border-bottom:1px solid #e5e7eb !important; }
  body .mon-latest-list .mon-list-card .mon-thumb { width:112px !important; height:80px !important; min-height:80px !important; border-radius:7px !important; }
  body .mon-latest-list .mon-list-card .mon-card-body { padding:0 !important; }
  body .mon-latest-list .mon-list-card .mon-card-title { font-size:15px !important; line-height:1.28 !important; }
  body .mon-latest-list .mon-list-card .mon-category { margin-top:6px !important; color:#ef1747 !important; font-size:11px !important; font-weight:850 !important; letter-spacing:.04em !important; }
  body .mon-latest-list .mon-list-card .mon-meta { gap:7px !important; margin-top:5px !important; color:#6b7280 !important; font-size:11px !important; }
  body .mon-icon { display:inline-block !important; width:1em !important; height:1em !important; flex:0 0 auto !important; vertical-align:-.125em !important; overflow:visible !important; }
  body .mon-social-link .mon-icon, body .mon-footer .mon-icon { width:18px !important; height:18px !important; }
  body .mon-footer-grid { gap:28px !important; padding:34px 0 24px !important; }
  body .mon-footer-title { font-size:15px !important; }
  body .mon-footer-about { font-size:13px !important; line-height:1.65 !important; }
  body .mon-footer-categories { font-size:13px !important; gap:11px 20px !important; }
  body .mon-contact-list { font-size:12px !important; line-height:1.55 !important; }
  body .mon-contact-list li b { font-size:11px !important; }
  body .mon-footer-bottom { font-size:11px !important; line-height:1.5 !important; }
}

/* Separate white hero container above the gray homepage content. */
@media screen and (max-width:700px) {
  body .mon-home-main > .mon-wrap { padding:0 !important; }
  body .mon-home-main .mon-hero {
    width:100% !important;
    margin:12px 0 0 !important;
    padding:16px !important;
    box-sizing:border-box !important;
    background:#fff !important;
    grid-template-rows:240px 120px 120px !important;
  }
  body .mon-home-main .mon-portal-grid {
    margin-top:20px !important;
    padding:0 16px !important;
    box-sizing:border-box !important;
  }
}
