MediaWiki:Mobile.css

Note: After publishing, you may have to bypass your browser's cache to see the changes.

• Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
• Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
• Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.

/* All CSS here will be loaded for users of the mobile site */
/* Mobile-specific overrides for MobileFrontend */
/* ===== HOMEPAGE SECTION ORDER (mobile only) =====
   Puts the Sections grid right after the hero image,
   pushing the banner/about text below it. */
.mainpage-wrap {
    display: flex;
    flex-direction: column;
}
.mainpage-wrap .hero-img       { order: 1; }
.mainpage-wrap .home           { order: 2; }
.mainpage-wrap .banner-cont    { order: 3; }
.mainpage-wrap .about-section  { order: 4; }
.row {
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
}
.column {
    width: 100% !important;
    max-width: 100% !important;
}
.fakeimg img {
    width: 100% !important;
    height: 180px !important;
    object-fit: cover !important;
}
.hero-img img {
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
}
.btn {
    display: block !important;
    text-align: center !important;
}