MediaWiki:Common.css: Difference between revisions

From BigBro Know
Jump to navigation Jump to search
Add AlphaX landing page CSS classes and animations
No edit summary
 
(11 intermediate revisions by the same user not shown)
Line 1: Line 1:
/* ========================================== */
/* ========================================== */
/* Alpha Orange Design System — AlphaX Wiki   */
/* BigBro Orange Design System — BigBro Know   */
/* ========================================== */
/* ========================================== */


Line 33: Line 33:
.mw-parser-output h3,
.mw-parser-output h3,
.mw-parser-output h4 {
.mw-parser-output h4 {
   color: #FF6600 !important;
   color: #FF7900 !important;
   border-bottom: 1px solid #2E2E2E !important;
   border-bottom: 1px solid #2E2E2E !important;
}
}
Line 39: Line 39:
/* Links */
/* Links */
a, a:visited {
a, a:visited {
   color: #FF6600 !important;
   color: #FF7900 !important;
}
}
a:hover {
a:hover {
   color: #FF8533 !important;
   color: #FFA24A !important;
   text-decoration: underline;
   text-decoration: underline;
}
}
Line 60: Line 60:
}
}
#mw-panel a:hover, .vector-menu a:hover {
#mw-panel a:hover, .vector-menu a:hover {
   color: #FF6600 !important;
   color: #FF7900 !important;
}
}


Line 73: Line 73:
}
}
.mw-portlet-personal a:hover {
.mw-portlet-personal a:hover {
   color: #FF6600 !important;
   color: #FF7900 !important;
}
}


Line 79: Line 79:
#p-cactions .selected a,
#p-cactions .selected a,
.mw-portlet-views .selected a {
.mw-portlet-views .selected a {
   color: #FF6600 !important;
   color: #FF7900 !important;
   border-bottom: 2px solid #FF6600 !important;
   border-bottom: 2px solid #FF7900 !important;
   background: transparent !important;
   background: transparent !important;
}
}
Line 91: Line 91:
}
}
#p-views li a:hover {
#p-views li a:hover {
   color: #FF6600 !important;
   color: #FF7900 !important;
}
}


Line 124: Line 124:
}
}
.toc a {
.toc a {
   color: #FF6600 !important;
   color: #FF7900 !important;
}
}
.toc .tocnumber {
.toc .tocnumber {
   color: #FF6600 !important;
   color: #FF7900 !important;
}
}


Line 154: Line 154:
}
}
#footer a:hover {
#footer a:hover {
   color: #FF6600 !important;
   color: #FF7900 !important;
}
}


Line 164: Line 164:


/* ============================================ */
/* ============================================ */
/* Alpha Orange Component Classes              */
/* BigBro Orange Component Classes              */
/* ============================================ */
/* ============================================ */


Line 236: Line 236:
   margin: 4px 0;
   margin: 4px 0;
   text-decoration: none;
   text-decoration: none;
   color: #FF6600 !important;
   color: #FF7900 !important;
}
}
.ax-card a:hover {
.ax-card a:hover {
   text-decoration: underline;
   text-decoration: underline;
   color: #FF8533 !important;
   color: #FFA24A !important;
}
}
.ax-card-title a {
.ax-card-title a {
Line 247: Line 247:
}
}
.ax-card-title a:hover {
.ax-card-title a:hover {
   color: #FF6600 !important;
   color: #FF7900 !important;
}
}


Line 345: Line 345:
   background: rgba(255,102,0,0.08);
   background: rgba(255,102,0,0.08);
   border-color: rgba(255,102,0,0.35);
   border-color: rgba(255,102,0,0.35);
   color: #FF8533 !important;
   color: #FFA24A !important;
}
}
.ax-link-row a {
.ax-link-row a {
Line 351: Line 351:
}
}
.ax-link-row:hover a {
.ax-link-row:hover a {
   color: #FF8533 !important;
   color: #FFA24A !important;
}
}


Line 369: Line 369:
.ax-accent-bar {
.ax-accent-bar {
   height: 2px;
   height: 2px;
   background: linear-gradient(to right, #FF6600, #FF8533);
   background: linear-gradient(to right, #FF7900, #FFA24A);
   border-radius: 2px;
   border-radius: 2px;
   margin-bottom: 20px;
   margin-bottom: 20px;
Line 384: Line 384:
/* Sexual Health card hero image */
/* Sexual Health card hero image */
#ax-sexual-health-hero {
#ax-sexual-health-hero {
   background-image: url("https://alphax.wiki/images/4/43/Sexual_Health_Hero.jpg");
   background-image: url("/images/4/43/Sexual_Health_Hero.jpg");
   background-size: cover;
   background-size: cover;
   background-position: center;
   background-position: center;
Line 454: Line 454:


.ax-cat-title a {
.ax-cat-title a {
   color: #FF6600 !important;
   color: #FF7900 !important;
   text-decoration: none;
   text-decoration: none;
}
}


.ax-cat-title a:hover {
.ax-cat-title a:hover {
   color: #FF8533 !important;
   color: #FFA24A !important;
   text-decoration: underline;
   text-decoration: underline;
}
}
Line 503: Line 503:
}
}


/* AlphaX Landing Page Styles */
/* BigBro Know Landing Page Styles */
@keyframes scrollUp{0%{transform:translateY(0)}100%{transform:translateY(-50%)}}
@keyframes scrollUp{0%{transform:translateY(0)}100%{transform:translateY(-50%)}}
@keyframes glowLine{0%,100%{box-shadow:0 0 18px 4px rgba(255,107,26,0.5)}50%{box-shadow:0 0 36px 10px rgba(255,107,26,0.9)}}
@keyframes glowLine{0%,100%{box-shadow:0 0 18px 4px rgba(255,107,26,0.5)}50%{box-shadow:0 0 36px 10px rgba(255,107,26,0.9)}}
Line 524: Line 524:
.ax-section-card a:hover{color:#FF6B1A;}
.ax-section-card a:hover{color:#FF6B1A;}
#mw-content-text .ax-path-card a{color:#fff;text-decoration:none;}
#mw-content-text .ax-path-card a{color:#fff;text-decoration:none;}
/* Hide leaked template parameter labels in translated /de articles */
.ka-article pre { display: none !important; }
/* ============================================ */
/* BigBro Orange — Button Text Color Fix        */
/* Ensures white text on orange gradient btns  */
/* ============================================ */
.btn-primary,
.btn-primary:visited,
.btn-nav,
.btn-nav:visited {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}
.btn-primary:hover,
.btn-nav:hover {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}
/* ===================================================================== */
/* FULL-BLEED LANDING — Homepage only                                    */
/* Hides Vector skin chrome so the custom landing renders edge-to-edge  */
/* like bigbro.men. The page's own fixed nav becomes the top bar.        */
/* Scoped to body.page-Homepage — inner wiki articles are untouched.    */
/* ===================================================================== */
body.page-Homepage #mw-head,
body.page-Homepage #mw-head-base,
body.page-Homepage #mw-page-base,
body.page-Homepage #mw-panel,
body.page-Homepage #left-navigation,
body.page-Homepage #right-navigation,
body.page-Homepage #p-logo,
body.page-Homepage .mw-indicators,
body.page-Homepage #siteSub,
body.page-Homepage #contentSub,
body.page-Homepage #contentSub2,
body.page-Homepage .mw-first-heading,
body.page-Homepage h1.firstHeading,
body.page-Homepage #jump-to-nav,
body.page-Homepage .mw-jump-link,
body.page-Homepage #footer,
body.page-Homepage #mw-footer,
body.page-Homepage .printfooter,
body.page-Homepage .catlinks,
body.page-Homepage #catlinks,
body.page-Homepage #mw-data-after-content,
body.page-Homepage #mw-navigation-heading {
  display: none !important;
}
/* Content area: full width, no skin offset, no padding/border */
body.page-Homepage,
body.page-Homepage #content,
body.page-Homepage .mw-body,
body.page-Homepage #mw-content,
body.page-Homepage #mw-content-text,
body.page-Homepage #bodyContent,
body.page-Homepage .mw-content-ltr,
body.page-Homepage .mw-parser-output {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: #0D0D0D !important;
  max-width: none !important;
  width: auto !important;
}
body.page-Homepage #content,
body.page-Homepage .mw-body {
  margin-left: 0 !important;
  box-shadow: none !important;
}
/* Let the custom landing manage its own scroll/overflow */
body.page-Homepage { overflow-x: hidden !important; }
/* Restore landing button / nav text colors (override global orange link rule) */
/* Filled gradient buttons: dark ink (matches bigbro.men .btn-primary) */
body.page-Homepage .btn-p,
body.page-Homepage .btn-p:visited,
body.page-Homepage .hcp,
body.page-Homepage .hcp:visited,
body.page-Homepage .ab-cta,
body.page-Homepage .ab-cta:visited,
body.page-Homepage .nlb,
body.page-Homepage .lb.on,
body.page-Homepage .lb.on:visited,
body.page-Homepage_de .btn-p,
body.page-Homepage_de .btn-p:visited,
body.page-Homepage_de .hcp,
body.page-Homepage_de .hcp:visited,
body.page-Homepage_de .ab-cta,
body.page-Homepage_de .ab-cta:visited,
body.page-Homepage_de .nlb,
body.page-Homepage_de .lb.on,
body.page-Homepage_de .lb.on:visited,
body.page-Homepage_fr .btn-p,
body.page-Homepage_fr .btn-p:visited,
body.page-Homepage_fr .hcp,
body.page-Homepage_fr .hcp:visited,
body.page-Homepage_fr .ab-cta,
body.page-Homepage_fr .ab-cta:visited,
body.page-Homepage_fr .nlb,
body.page-Homepage_fr .lb.on,
body.page-Homepage_fr .lb.on:visited,
body.page-Homepage_es .btn-p,
body.page-Homepage_es .btn-p:visited,
body.page-Homepage_es .hcp,
body.page-Homepage_es .hcp:visited,
body.page-Homepage_es .ab-cta,
body.page-Homepage_es .ab-cta:visited,
body.page-Homepage_es .nlb,
body.page-Homepage_es .lb.on,
body.page-Homepage_es .lb.on:visited,
body.page-Homepage_pt .btn-p,
body.page-Homepage_pt .btn-p:visited,
body.page-Homepage_pt .hcp,
body.page-Homepage_pt .hcp:visited,
body.page-Homepage_pt .ab-cta,
body.page-Homepage_pt .ab-cta:visited,
body.page-Homepage_pt .nlb,
body.page-Homepage_pt .lb.on,
body.page-Homepage_pt .lb.on:visited {
  color: #0D0D0D !important;
  -webkit-text-fill-color: #0D0D0D !important;
}
/* Ghost button + over-image labels stay light */
body.page-Homepage .hcs,
body.page-Homepage .hcs:visited,
body.page-Homepage .tn,
body.page-Homepage_de .hcs,
body.page-Homepage_de .hcs:visited,
body.page-Homepage_de .tn,
body.page-Homepage_fr .hcs,
body.page-Homepage_fr .hcs:visited,
body.page-Homepage_fr .tn,
body.page-Homepage_es .hcs,
body.page-Homepage_es .hcs:visited,
body.page-Homepage_es .tn,
body.page-Homepage_pt .hcs,
body.page-Homepage_pt .hcs:visited,
body.page-Homepage_pt .tn {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}
body.page-Homepage .nl,
body.page-Homepage .nl:visited,
body.page-Homepage .lb.av,
body.page-Homepage .lb.av:visited {
  color: #888888 !important;
  -webkit-text-fill-color: #888888 !important;
}
body.page-Homepage .nl:hover,
body.page-Homepage .lb.av:hover { color: #ffffff !important; -webkit-text-fill-color:#ffffff !important; }
body.page-Homepage .lb.dim { color: #333333 !important; -webkit-text-fill-color:#333333 !important; }
/* Footer + section links inherit the design, not the global orange underline */
body.page-Homepage .fl a:hover { text-decoration: none !important; }
/* ===================================================================== */
/* FULL-BLEED LANDING — Homepage language subpages (DE, FR, ES, PT)      */
/* Identical to body.page-Homepage rules above                            */
/* ===================================================================== */
/* --- DE --- */
body.page-Homepage_de #mw-head,
body.page-Homepage_de #mw-head-base,
body.page-Homepage_de #mw-page-base,
body.page-Homepage_de #mw-panel,
body.page-Homepage_de #left-navigation,
body.page-Homepage_de #right-navigation,
body.page-Homepage_de #p-logo,
body.page-Homepage_de .mw-indicators,
body.page-Homepage_de #siteSub,
body.page-Homepage_de #contentSub,
body.page-Homepage_de #contentSub2,
body.page-Homepage_de .mw-first-heading,
body.page-Homepage_de h1.firstHeading,
body.page-Homepage_de #jump-to-nav,
body.page-Homepage_de .mw-jump-link,
body.page-Homepage_de #footer,
body.page-Homepage_de #mw-footer,
body.page-Homepage_de .printfooter,
body.page-Homepage_de .catlinks,
body.page-Homepage_de #catlinks,
body.page-Homepage_de #mw-data-after-content,
body.page-Homepage_de #mw-navigation-heading {
  display: none !important;
}
body.page-Homepage_de,
body.page-Homepage_de #content,
body.page-Homepage_de .mw-body,
body.page-Homepage_de #mw-content,
body.page-Homepage_de #mw-content-text,
body.page-Homepage_de #bodyContent,
body.page-Homepage_de .mw-content-ltr,
body.page-Homepage_de .mw-parser-output {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: #0D0D0D !important;
  max-width: none !important;
  width: auto !important;
}
body.page-Homepage_de #content,
body.page-Homepage_de .mw-body {
  margin-left: 0 !important;
  box-shadow: none !important;
}
body.page-Homepage_de { overflow-x: hidden !important; }
/* --- FR --- */
body.page-Homepage_fr #mw-head,
body.page-Homepage_fr #mw-head-base,
body.page-Homepage_fr #mw-page-base,
body.page-Homepage_fr #mw-panel,
body.page-Homepage_fr #left-navigation,
body.page-Homepage_fr #right-navigation,
body.page-Homepage_fr #p-logo,
body.page-Homepage_fr .mw-indicators,
body.page-Homepage_fr #siteSub,
body.page-Homepage_fr #contentSub,
body.page-Homepage_fr #contentSub2,
body.page-Homepage_fr .mw-first-heading,
body.page-Homepage_fr h1.firstHeading,
body.page-Homepage_fr #jump-to-nav,
body.page-Homepage_fr .mw-jump-link,
body.page-Homepage_fr #footer,
body.page-Homepage_fr #mw-footer,
body.page-Homepage_fr .printfooter,
body.page-Homepage_fr .catlinks,
body.page-Homepage_fr #catlinks,
body.page-Homepage_fr #mw-data-after-content,
body.page-Homepage_fr #mw-navigation-heading {
  display: none !important;
}
body.page-Homepage_fr,
body.page-Homepage_fr #content,
body.page-Homepage_fr .mw-body,
body.page-Homepage_fr #mw-content,
body.page-Homepage_fr #mw-content-text,
body.page-Homepage_fr #bodyContent,
body.page-Homepage_fr .mw-content-ltr,
body.page-Homepage_fr .mw-parser-output {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: #0D0D0D !important;
  max-width: none !important;
  width: auto !important;
}
body.page-Homepage_fr #content,
body.page-Homepage_fr .mw-body {
  margin-left: 0 !important;
  box-shadow: none !important;
}
body.page-Homepage_fr { overflow-x: hidden !important; }
/* --- ES --- */
body.page-Homepage_es #mw-head,
body.page-Homepage_es #mw-head-base,
body.page-Homepage_es #mw-page-base,
body.page-Homepage_es #mw-panel,
body.page-Homepage_es #left-navigation,
body.page-Homepage_es #right-navigation,
body.page-Homepage_es #p-logo,
body.page-Homepage_es .mw-indicators,
body.page-Homepage_es #siteSub,
body.page-Homepage_es #contentSub,
body.page-Homepage_es #contentSub2,
body.page-Homepage_es .mw-first-heading,
body.page-Homepage_es h1.firstHeading,
body.page-Homepage_es #jump-to-nav,
body.page-Homepage_es .mw-jump-link,
body.page-Homepage_es #footer,
body.page-Homepage_es #mw-footer,
body.page-Homepage_es .printfooter,
body.page-Homepage_es .catlinks,
body.page-Homepage_es #catlinks,
body.page-Homepage_es #mw-data-after-content,
body.page-Homepage_es #mw-navigation-heading {
  display: none !important;
}
body.page-Homepage_es,
body.page-Homepage_es #content,
body.page-Homepage_es .mw-body,
body.page-Homepage_es #mw-content,
body.page-Homepage_es #mw-content-text,
body.page-Homepage_es #bodyContent,
body.page-Homepage_es .mw-content-ltr,
body.page-Homepage_es .mw-parser-output {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: #0D0D0D !important;
  max-width: none !important;
  width: auto !important;
}
body.page-Homepage_es #content,
body.page-Homepage_es .mw-body {
  margin-left: 0 !important;
  box-shadow: none !important;
}
body.page-Homepage_es { overflow-x: hidden !important; }
/* --- PT --- */
body.page-Homepage_pt #mw-head,
body.page-Homepage_pt #mw-head-base,
body.page-Homepage_pt #mw-page-base,
body.page-Homepage_pt #mw-panel,
body.page-Homepage_pt #left-navigation,
body.page-Homepage_pt #right-navigation,
body.page-Homepage_pt #p-logo,
body.page-Homepage_pt .mw-indicators,
body.page-Homepage_pt #siteSub,
body.page-Homepage_pt #contentSub,
body.page-Homepage_pt #contentSub2,
body.page-Homepage_pt .mw-first-heading,
body.page-Homepage_pt h1.firstHeading,
body.page-Homepage_pt #jump-to-nav,
body.page-Homepage_pt .mw-jump-link,
body.page-Homepage_pt #footer,
body.page-Homepage_pt #mw-footer,
body.page-Homepage_pt .printfooter,
body.page-Homepage_pt .catlinks,
body.page-Homepage_pt #catlinks,
body.page-Homepage_pt #mw-data-after-content,
body.page-Homepage_pt #mw-navigation-heading {
  display: none !important;
}
body.page-Homepage_pt,
body.page-Homepage_pt #content,
body.page-Homepage_pt .mw-body,
body.page-Homepage_pt #mw-content,
body.page-Homepage_pt #mw-content-text,
body.page-Homepage_pt #bodyContent,
body.page-Homepage_pt .mw-content-ltr,
body.page-Homepage_pt .mw-parser-output {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: #0D0D0D !important;
  max-width: none !important;
  width: auto !important;
}
body.page-Homepage_pt #content,
body.page-Homepage_pt .mw-body {
  margin-left: 0 !important;
  box-shadow: none !important;
}
body.page-Homepage_pt { overflow-x: hidden !important; }
/* ===================================================================== */
/* Homepage section headings: white + no underline (article pages keep      */
/* the global orange heading style).                                        */
/* ===================================================================== */
body.page-Homepage .mw-parser-output h1,
body.page-Homepage .mw-parser-output h2,
body.page-Homepage .mw-parser-output h3,
body.page-Homepage .mw-parser-output h4,
body.page-Homepage_de .mw-parser-output h1,
body.page-Homepage_de .mw-parser-output h2,
body.page-Homepage_de .mw-parser-output h3,
body.page-Homepage_de .mw-parser-output h4,
body.page-Homepage_fr .mw-parser-output h1,
body.page-Homepage_fr .mw-parser-output h2,
body.page-Homepage_fr .mw-parser-output h3,
body.page-Homepage_fr .mw-parser-output h4,
body.page-Homepage_es .mw-parser-output h1,
body.page-Homepage_es .mw-parser-output h2,
body.page-Homepage_es .mw-parser-output h3,
body.page-Homepage_es .mw-parser-output h4,
body.page-Homepage_pt .mw-parser-output h1,
body.page-Homepage_pt .mw-parser-output h2,
body.page-Homepage_pt .mw-parser-output h3,
body.page-Homepage_pt .mw-parser-output h4 {
  color: #FFFFFF !important;
  border-bottom: none !important;
}
/* BigBro logo size constraint */
div[style*="max-width:280px"] .mw-file-element {
    max-width: 280px !important;
    width: 100% !important;
    height: auto !important;
}

Latest revision as of 03:03, 1 July 2026

/* ========================================== */
/* BigBro Orange Design System — BigBro Know   */
/* ========================================== */

/* --- GLOBAL SITE SKIN --- */

body {
  background: #0D0D0D !important;
  color: #FFFFFF !important;
}

/* Content area */
#content, .mw-body, .mw-body-content {
  background: #0D0D0D !important;
  color: #FFFFFF !important;
  border: none !important;
}

/* Page title */
h1.firstHeading, .mw-first-heading {
  color: #FFFFFF !important;
  border-bottom: 1px solid #2E2E2E !important;
}

/* All headings */
h1, h2, h3, h4, h5, h6 {
  color: #FFFFFF !important;
  border-bottom-color: #2E2E2E !important;
}

/* Section headings on wiki pages */
.mw-parser-output h2,
.mw-parser-output h3,
.mw-parser-output h4 {
  color: #FF7900 !important;
  border-bottom: 1px solid #2E2E2E !important;
}

/* Links */
a, a:visited {
  color: #FF7900 !important;
}
a:hover {
  color: #FFA24A !important;
  text-decoration: underline;
}

/* Sidebar / navigation */
#mw-panel, .vector-menu, nav.mw-navigation {
  background: #0D0D0D !important;
}

#mw-panel .portal, .vector-menu-content {
  background: #0D0D0D !important;
  border-color: #2E2E2E !important;
}

#mw-panel a, .vector-menu a {
  color: #999999 !important;
}
#mw-panel a:hover, .vector-menu a:hover {
  color: #FF7900 !important;
}

/* Top navigation bar */
#mw-head, .vector-header, header {
  background: #0D0D0D !important;
  border-bottom: 1px solid #2E2E2E !important;
}

.mw-portlet-personal a, #pt-userpage a, #pt-login a {
  color: #999999 !important;
}
.mw-portlet-personal a:hover {
  color: #FF7900 !important;
}

/* Tab navigation (Read / Edit / History) */
#p-cactions .selected a,
.mw-portlet-views .selected a {
  color: #FF7900 !important;
  border-bottom: 2px solid #FF7900 !important;
  background: transparent !important;
}

.vector-tab-noaction a,
#p-views li a {
  color: #999999 !important;
  background: transparent !important;
  border-color: #2E2E2E !important;
}
#p-views li a:hover {
  color: #FF7900 !important;
}

/* Search bar */
#searchInput, .oo-ui-textInputWidget input {
  background: #1A1A1A !important;
  border: 1px solid #2E2E2E !important;
  color: #FFFFFF !important;
  border-radius: 8px !important;
}
#searchInput:focus, .oo-ui-textInputWidget input:focus {
  border-color: rgba(255,102,0,0.5) !important;
  outline: none !important;
}

/* Search button */
#searchButton, .searchButton {
  background: #1A1A1A !important;
  border-color: #2E2E2E !important;
  color: #999999 !important;
}

/* Table of contents */
#toc, .toc {
  background: #1A1A1A !important;
  border: 1px solid #2E2E2E !important;
  color: #999999 !important;
  border-radius: 12px !important;
}
.toctitle h2 {
  color: #FFFFFF !important;
}
.toc a {
  color: #FF7900 !important;
}
.toc .tocnumber {
  color: #FF7900 !important;
}

/* Info/warning boxes */
.mw-message-box, .successbox, .warningbox, .errorbox {
  background: #1A1A1A !important;
  border-color: #2E2E2E !important;
  color: #FFFFFF !important;
  border-radius: 10px !important;
}

/* Edit toolbar */
.wikiEditor-ui {
  background: #1A1A1A !important;
  border-color: #2E2E2E !important;
}

/* Footer */
#footer, .mw-footer {
  background: #0D0D0D !important;
  border-top: 1px solid #2E2E2E !important;
  color: #666666 !important;
}
#footer a {
  color: #999999 !important;
}
#footer a:hover {
  color: #FF7900 !important;
}

/* Scrollbar */
::-webkit-scrollbar { width: 4px; }
::-webkit-scrollbar-track { background: #0D0D0D; }
::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.05); border-radius: 2px; }
::-webkit-scrollbar-thumb:hover { background: rgba(255,102,0,0.2); }

/* ============================================ */
/* BigBro Orange Component Classes               */
/* ============================================ */

/* HERO BANNER */
.ax-hero {
  padding: 28px 26px;
  margin: 10px 0 24px;
  border-radius: 18px;
  background: #1A1A1A;
  border: 1px solid #2E2E2E;
  color: #FFFFFF;
}
.ax-hero-title {
  font-size: 30px;
  font-weight: 700;
  letter-spacing: 0.4px;
  color: #FFFFFF;
}
.ax-hero-sub {
  margin-top: 6px;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: #666666;
}
.ax-hero-desc {
  margin-top: 14px;
  max-width: 900px;
  line-height: 1.7;
  color: #999999;
}

/* GRID */
.ax-grid {
  display: grid;
  gap: 16px;
  margin: 20px 0 30px;
}
.ax-grid-4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
@media (max-width: 1200px) {
  .ax-grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  .ax-grid-4 { grid-template-columns: 1fr; }
}

/* CARDS */
.ax-card {
  padding: 18px;
  border-radius: 16px;
  background: #1A1A1A;
  border: 1px solid #2E2E2E;
  transition: all 0.2s ease;
  color: #FFFFFF;
}
.ax-card:hover {
  border-color: rgba(255,102,0,0.5);
  box-shadow: 0 0 20px rgba(255,102,0,0.08);
}
.ax-card-title {
  font-size: 17px;
  font-weight: 700;
  margin-bottom: 10px;
  letter-spacing: 0.3px;
  color: #FFFFFF !important;
}
.ax-card a {
  display: block;
  margin: 4px 0;
  text-decoration: none;
  color: #FF7900 !important;
}
.ax-card a:hover {
  text-decoration: underline;
  color: #FFA24A !important;
}
.ax-card-title a {
  color: #FFFFFF !important;
  font-weight: 700;
}
.ax-card-title a:hover {
  color: #FF7900 !important;
}

/* SECTION */
.ax-section {
  margin: 30px 0;
}
.ax-section-title {
  font-size: 11px;
  font-weight: 600;
  margin-bottom: 14px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #666666;
}
.ax-list {
  line-height: 1.7;
  color: #999999;
}

/* FOOTNOTE / ABOUT BOX */
.ax-footnote {
  padding: 20px 22px;
  border-radius: 14px;
  background: #1A1A1A;
  border: 1px solid #2E2E2E;
  font-size: 14px;
  color: #999999;
  line-height: 1.7;
}

/* ARTICLE META BOX */
.ax-meta {
  margin: 12px 0 22px;
  padding: 16px 18px;
  border-radius: 14px;
  background: #1A1A1A;
  border: 1px solid #2E2E2E;
  max-width: 900px;
}
.ax-meta-row {
  display: flex;
  gap: 10px;
  padding: 6px 0;
  border-bottom: 1px solid rgba(255,255,255,0.05);
}
.ax-meta-row:last-child {
  border-bottom: none;
}
.ax-meta-k {
  width: 220px;
  color: #666666;
  font-weight: 600;
}
.ax-meta-v {
  flex: 1;
  color: #999999;
}

/* PILL TAGS / TOPIC BADGES */
.ax-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(255,102,0,0.08);
  border: 1px solid rgba(255,102,0,0.25);
  padding: 8px 16px;
  border-radius: 999px;
  font-size: 13px;
  color: #FFFFFF;
  transition: all 0.2s;
}
.ax-pill:hover {
  background: rgba(255,102,0,0.15);
  border-color: rgba(255,102,0,0.5);
}
.ax-pill a {
  color: #FFFFFF !important;
  text-decoration: none;
}

/* ARTICLE LINK ROW */
.ax-link-row {
  display: block;
  padding: 9px 14px;
  background: rgba(255,255,255,0.03);
  border: 1px solid #2E2E2E;
  border-radius: 10px;
  color: #FFFFFF !important;
  text-decoration: none;
  font-size: 13.5px;
  line-height: 1.4;
  transition: all 0.2s;
  margin-bottom: 8px;
}
.ax-link-row:hover {
  background: rgba(255,102,0,0.08);
  border-color: rgba(255,102,0,0.35);
  color: #FFA24A !important;
}
.ax-link-row a {
  color: #FFFFFF !important;
}
.ax-link-row:hover a {
  color: #FFA24A !important;
}

/* SECTION DIVIDER LABEL */
.ax-divider-label {
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #666666;
  font-weight: 600;
  margin-bottom: 18px;
  padding-bottom: 10px;
  border-bottom: 1px solid #2E2E2E;
}

/* ORANGE GRADIENT ACCENT BAR */
.ax-accent-bar {
  height: 2px;
  background: linear-gradient(to right, #FF7900, #FFA24A);
  border-radius: 2px;
  margin-bottom: 20px;
}

/* Translation notice override */
.mw-translate-editpage-list {
  background: #1A1A1A !important;
  border-color: #2E2E2E !important;
  color: #999999 !important;
}


/* Sexual Health card hero image */
#ax-sexual-health-hero {
  background-image: url("/images/4/43/Sexual_Health_Hero.jpg");
  background-size: cover;
  background-position: center;
}





/* ============================================
   CATEGORY GRID COMPONENT - ax-cat-grid
   Reusable 8-box responsive category grid
   Matches Sexual Health card design exactly
   ============================================ */

/* Grid container: 4 columns desktop */
.ax-cat-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin: 0 0 32px 0;
}

/* Individual card */
.ax-cat-card {
  background: #1A1A1A;
  border: 1px solid #2E2E2E;
  border-radius: 16px;
  overflow: hidden;
  transition: border-color 0.2s, box-shadow 0.2s;
  cursor: pointer;
  display: flex;
  flex-direction: column;
}

.ax-cat-card:hover {
  border-color: rgba(255,102,0,0.5);
  box-shadow: 0 0 20px rgba(255,102,0,0.08);
}

/* Image area - fixed height banner, full width */
.ax-cat-img {
  width: 100%;
  height: 140px;
  background-color: #111;
  background-size: cover;
  background-position: center center;
  border-radius: 15px 15px 0 0;
  flex-shrink: 0;
}

/* Card body */
.ax-cat-body {
  padding: 16px 18px 18px 18px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 1;
}

/* Category title */
.ax-cat-title {
  font-size: 15px;
  font-weight: 700;
  color: #FFFFFF;
  letter-spacing: 0.2px;
  line-height: 1.3;
}

.ax-cat-title a {
  color: #FF7900 !important;
  text-decoration: none;
}

.ax-cat-title a:hover {
  color: #FFA24A !important;
  text-decoration: underline;
}

/* Short description */
.ax-cat-desc {
  font-size: 13px;
  line-height: 1.55;
  color: #999999;
}

/* Tablet: 2 columns */
@media (max-width: 900px) {
  .ax-cat-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* Mobile: 1 column */
@media (max-width: 500px) {
  .ax-cat-grid {
    grid-template-columns: 1fr;
  }
}


/* Knowledge Areas grid on Main Page */
#ax-knowledge-section {
  margin: 0 0 32px 0;
}

#ax-knowledge-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
}


/* === Start Here page: scrolling tile animation === */
@keyframes scrollUp {
  0%   { transform: translateY(0); }
  100% { transform: translateY(-50%); }
}

/* BigBro Know Landing Page Styles */
@keyframes scrollUp{0%{transform:translateY(0)}100%{transform:translateY(-50%)}}
@keyframes glowLine{0%,100%{box-shadow:0 0 18px 4px rgba(255,107,26,0.5)}50%{box-shadow:0 0 36px 10px rgba(255,107,26,0.9)}}
.ax-path-card{border-radius:16px;overflow:hidden;position:relative;height:230px;border-left:4px solid #FF6B1A;border-top:1px solid #2a2a2a;border-right:1px solid #2a2a2a;border-bottom:1px solid #2a2a2a;transition:transform 0.25s ease,box-shadow 0.25s ease;cursor:pointer;display:block;}
.ax-path-card:hover{transform:translateY(-4px) scale(1.02);box-shadow:0 12px 40px rgba(255,107,26,0.25);}
.ax-section-card{display:flex;align-items:center;gap:14px;background:#141414;border:1px solid #252525;border-left:4px solid #FF6B1A;border-radius:12px;padding:16px 18px;transition:background 0.2s,transform 0.2s;margin-bottom:0;}
.ax-section-card:hover{background:#1c1c1c;transform:translateX(4px);}
.ax-pill{display:inline-block;background:rgba(255,107,26,0.12);border:1px solid rgba(255,107,26,0.3);color:#FF6B1A;font-size:10px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;padding:3px 10px;border-radius:20px;margin-bottom:10px;}
.ax-glow-bar{height:2px;background:linear-gradient(90deg,transparent,#FF6B1A,transparent);animation:glowLine 3s ease-in-out infinite;}
.ax-stat{text-align:center;padding:16px 10px;}
.ax-stat-num{font-size:28px;font-weight:900;color:#FF6B1A;letter-spacing:-1px;}
.ax-stat-label{font-size:10px;color:#666;letter-spacing:2px;text-transform:uppercase;margin-top:2px;}
.ax-topic-tag{display:inline-block;background:#1a1a1a;border:1px solid #2d2d2d;color:#bbb;font-size:11px;padding:5px 12px;border-radius:20px;margin:3px;transition:all 0.2s;text-decoration:none;}
.ax-topic-tag:hover{background:#FF6B1A !important;color:#000 !important;border-color:#FF6B1A;}
.ax-feed-item{padding:8px 0;border-bottom:1px solid #1a1a1a;font-size:13px;color:#ccc;line-height:1.4;}
.ax-feed-item a{color:#ccc;text-decoration:none;}
.ax-feed-item a:hover{color:#FF6B1A;}
.ax-feed-tag{color:#FF6B1A;font-size:10px;display:block;margin-top:2px;}
.ax-section-card a{color:#fff;text-decoration:none;font-weight:700;font-size:13px;}
.ax-section-card a:hover{color:#FF6B1A;}
#mw-content-text .ax-path-card a{color:#fff;text-decoration:none;}


/* Hide leaked template parameter labels in translated /de articles */
.ka-article pre { display: none !important; }

/* ============================================ */
/* BigBro Orange — Button Text Color Fix         */
/* Ensures white text on orange gradient btns  */
/* ============================================ */
.btn-primary,
.btn-primary:visited,
.btn-nav,
.btn-nav:visited {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}
.btn-primary:hover,
.btn-nav:hover {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* ===================================================================== */
/* FULL-BLEED LANDING — Homepage only                                    */
/* Hides Vector skin chrome so the custom landing renders edge-to-edge   */
/* like bigbro.men. The page's own fixed nav becomes the top bar.        */
/* Scoped to body.page-Homepage — inner wiki articles are untouched.     */
/* ===================================================================== */
body.page-Homepage #mw-head,
body.page-Homepage #mw-head-base,
body.page-Homepage #mw-page-base,
body.page-Homepage #mw-panel,
body.page-Homepage #left-navigation,
body.page-Homepage #right-navigation,
body.page-Homepage #p-logo,
body.page-Homepage .mw-indicators,
body.page-Homepage #siteSub,
body.page-Homepage #contentSub,
body.page-Homepage #contentSub2,
body.page-Homepage .mw-first-heading,
body.page-Homepage h1.firstHeading,
body.page-Homepage #jump-to-nav,
body.page-Homepage .mw-jump-link,
body.page-Homepage #footer,
body.page-Homepage #mw-footer,
body.page-Homepage .printfooter,
body.page-Homepage .catlinks,
body.page-Homepage #catlinks,
body.page-Homepage #mw-data-after-content,
body.page-Homepage #mw-navigation-heading {
  display: none !important;
}

/* Content area: full width, no skin offset, no padding/border */
body.page-Homepage,
body.page-Homepage #content,
body.page-Homepage .mw-body,
body.page-Homepage #mw-content,
body.page-Homepage #mw-content-text,
body.page-Homepage #bodyContent,
body.page-Homepage .mw-content-ltr,
body.page-Homepage .mw-parser-output {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: #0D0D0D !important;
  max-width: none !important;
  width: auto !important;
}
body.page-Homepage #content,
body.page-Homepage .mw-body {
  margin-left: 0 !important;
  box-shadow: none !important;
}
/* Let the custom landing manage its own scroll/overflow */
body.page-Homepage { overflow-x: hidden !important; }

/* Restore landing button / nav text colors (override global orange link rule) */
/* Filled gradient buttons: dark ink (matches bigbro.men .btn-primary) */
body.page-Homepage .btn-p,
body.page-Homepage .btn-p:visited,
body.page-Homepage .hcp,
body.page-Homepage .hcp:visited,
body.page-Homepage .ab-cta,
body.page-Homepage .ab-cta:visited,
body.page-Homepage .nlb,
body.page-Homepage .lb.on,
body.page-Homepage .lb.on:visited,
body.page-Homepage_de .btn-p,
body.page-Homepage_de .btn-p:visited,
body.page-Homepage_de .hcp,
body.page-Homepage_de .hcp:visited,
body.page-Homepage_de .ab-cta,
body.page-Homepage_de .ab-cta:visited,
body.page-Homepage_de .nlb,
body.page-Homepage_de .lb.on,
body.page-Homepage_de .lb.on:visited,
body.page-Homepage_fr .btn-p,
body.page-Homepage_fr .btn-p:visited,
body.page-Homepage_fr .hcp,
body.page-Homepage_fr .hcp:visited,
body.page-Homepage_fr .ab-cta,
body.page-Homepage_fr .ab-cta:visited,
body.page-Homepage_fr .nlb,
body.page-Homepage_fr .lb.on,
body.page-Homepage_fr .lb.on:visited,
body.page-Homepage_es .btn-p,
body.page-Homepage_es .btn-p:visited,
body.page-Homepage_es .hcp,
body.page-Homepage_es .hcp:visited,
body.page-Homepage_es .ab-cta,
body.page-Homepage_es .ab-cta:visited,
body.page-Homepage_es .nlb,
body.page-Homepage_es .lb.on,
body.page-Homepage_es .lb.on:visited,
body.page-Homepage_pt .btn-p,
body.page-Homepage_pt .btn-p:visited,
body.page-Homepage_pt .hcp,
body.page-Homepage_pt .hcp:visited,
body.page-Homepage_pt .ab-cta,
body.page-Homepage_pt .ab-cta:visited,
body.page-Homepage_pt .nlb,
body.page-Homepage_pt .lb.on,
body.page-Homepage_pt .lb.on:visited {
  color: #0D0D0D !important;
  -webkit-text-fill-color: #0D0D0D !important;
}
/* Ghost button + over-image labels stay light */
body.page-Homepage .hcs,
body.page-Homepage .hcs:visited,
body.page-Homepage .tn,
body.page-Homepage_de .hcs,
body.page-Homepage_de .hcs:visited,
body.page-Homepage_de .tn,
body.page-Homepage_fr .hcs,
body.page-Homepage_fr .hcs:visited,
body.page-Homepage_fr .tn,
body.page-Homepage_es .hcs,
body.page-Homepage_es .hcs:visited,
body.page-Homepage_es .tn,
body.page-Homepage_pt .hcs,
body.page-Homepage_pt .hcs:visited,
body.page-Homepage_pt .tn {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}
body.page-Homepage .nl,
body.page-Homepage .nl:visited,
body.page-Homepage .lb.av,
body.page-Homepage .lb.av:visited {
  color: #888888 !important;
  -webkit-text-fill-color: #888888 !important;
}
body.page-Homepage .nl:hover,
body.page-Homepage .lb.av:hover { color: #ffffff !important; -webkit-text-fill-color:#ffffff !important; }
body.page-Homepage .lb.dim { color: #333333 !important; -webkit-text-fill-color:#333333 !important; }
/* Footer + section links inherit the design, not the global orange underline */
body.page-Homepage .fl a:hover { text-decoration: none !important; }

/* ===================================================================== */
/* FULL-BLEED LANDING — Homepage language subpages (DE, FR, ES, PT)      */
/* Identical to body.page-Homepage rules above                            */
/* ===================================================================== */

/* --- DE --- */
body.page-Homepage_de #mw-head,
body.page-Homepage_de #mw-head-base,
body.page-Homepage_de #mw-page-base,
body.page-Homepage_de #mw-panel,
body.page-Homepage_de #left-navigation,
body.page-Homepage_de #right-navigation,
body.page-Homepage_de #p-logo,
body.page-Homepage_de .mw-indicators,
body.page-Homepage_de #siteSub,
body.page-Homepage_de #contentSub,
body.page-Homepage_de #contentSub2,
body.page-Homepage_de .mw-first-heading,
body.page-Homepage_de h1.firstHeading,
body.page-Homepage_de #jump-to-nav,
body.page-Homepage_de .mw-jump-link,
body.page-Homepage_de #footer,
body.page-Homepage_de #mw-footer,
body.page-Homepage_de .printfooter,
body.page-Homepage_de .catlinks,
body.page-Homepage_de #catlinks,
body.page-Homepage_de #mw-data-after-content,
body.page-Homepage_de #mw-navigation-heading {
  display: none !important;
}

body.page-Homepage_de,
body.page-Homepage_de #content,
body.page-Homepage_de .mw-body,
body.page-Homepage_de #mw-content,
body.page-Homepage_de #mw-content-text,
body.page-Homepage_de #bodyContent,
body.page-Homepage_de .mw-content-ltr,
body.page-Homepage_de .mw-parser-output {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: #0D0D0D !important;
  max-width: none !important;
  width: auto !important;
}

body.page-Homepage_de #content,
body.page-Homepage_de .mw-body {
  margin-left: 0 !important;
  box-shadow: none !important;
}

body.page-Homepage_de { overflow-x: hidden !important; }

/* --- FR --- */
body.page-Homepage_fr #mw-head,
body.page-Homepage_fr #mw-head-base,
body.page-Homepage_fr #mw-page-base,
body.page-Homepage_fr #mw-panel,
body.page-Homepage_fr #left-navigation,
body.page-Homepage_fr #right-navigation,
body.page-Homepage_fr #p-logo,
body.page-Homepage_fr .mw-indicators,
body.page-Homepage_fr #siteSub,
body.page-Homepage_fr #contentSub,
body.page-Homepage_fr #contentSub2,
body.page-Homepage_fr .mw-first-heading,
body.page-Homepage_fr h1.firstHeading,
body.page-Homepage_fr #jump-to-nav,
body.page-Homepage_fr .mw-jump-link,
body.page-Homepage_fr #footer,
body.page-Homepage_fr #mw-footer,
body.page-Homepage_fr .printfooter,
body.page-Homepage_fr .catlinks,
body.page-Homepage_fr #catlinks,
body.page-Homepage_fr #mw-data-after-content,
body.page-Homepage_fr #mw-navigation-heading {
  display: none !important;
}

body.page-Homepage_fr,
body.page-Homepage_fr #content,
body.page-Homepage_fr .mw-body,
body.page-Homepage_fr #mw-content,
body.page-Homepage_fr #mw-content-text,
body.page-Homepage_fr #bodyContent,
body.page-Homepage_fr .mw-content-ltr,
body.page-Homepage_fr .mw-parser-output {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: #0D0D0D !important;
  max-width: none !important;
  width: auto !important;
}

body.page-Homepage_fr #content,
body.page-Homepage_fr .mw-body {
  margin-left: 0 !important;
  box-shadow: none !important;
}

body.page-Homepage_fr { overflow-x: hidden !important; }

/* --- ES --- */
body.page-Homepage_es #mw-head,
body.page-Homepage_es #mw-head-base,
body.page-Homepage_es #mw-page-base,
body.page-Homepage_es #mw-panel,
body.page-Homepage_es #left-navigation,
body.page-Homepage_es #right-navigation,
body.page-Homepage_es #p-logo,
body.page-Homepage_es .mw-indicators,
body.page-Homepage_es #siteSub,
body.page-Homepage_es #contentSub,
body.page-Homepage_es #contentSub2,
body.page-Homepage_es .mw-first-heading,
body.page-Homepage_es h1.firstHeading,
body.page-Homepage_es #jump-to-nav,
body.page-Homepage_es .mw-jump-link,
body.page-Homepage_es #footer,
body.page-Homepage_es #mw-footer,
body.page-Homepage_es .printfooter,
body.page-Homepage_es .catlinks,
body.page-Homepage_es #catlinks,
body.page-Homepage_es #mw-data-after-content,
body.page-Homepage_es #mw-navigation-heading {
  display: none !important;
}

body.page-Homepage_es,
body.page-Homepage_es #content,
body.page-Homepage_es .mw-body,
body.page-Homepage_es #mw-content,
body.page-Homepage_es #mw-content-text,
body.page-Homepage_es #bodyContent,
body.page-Homepage_es .mw-content-ltr,
body.page-Homepage_es .mw-parser-output {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: #0D0D0D !important;
  max-width: none !important;
  width: auto !important;
}

body.page-Homepage_es #content,
body.page-Homepage_es .mw-body {
  margin-left: 0 !important;
  box-shadow: none !important;
}

body.page-Homepage_es { overflow-x: hidden !important; }

/* --- PT --- */
body.page-Homepage_pt #mw-head,
body.page-Homepage_pt #mw-head-base,
body.page-Homepage_pt #mw-page-base,
body.page-Homepage_pt #mw-panel,
body.page-Homepage_pt #left-navigation,
body.page-Homepage_pt #right-navigation,
body.page-Homepage_pt #p-logo,
body.page-Homepage_pt .mw-indicators,
body.page-Homepage_pt #siteSub,
body.page-Homepage_pt #contentSub,
body.page-Homepage_pt #contentSub2,
body.page-Homepage_pt .mw-first-heading,
body.page-Homepage_pt h1.firstHeading,
body.page-Homepage_pt #jump-to-nav,
body.page-Homepage_pt .mw-jump-link,
body.page-Homepage_pt #footer,
body.page-Homepage_pt #mw-footer,
body.page-Homepage_pt .printfooter,
body.page-Homepage_pt .catlinks,
body.page-Homepage_pt #catlinks,
body.page-Homepage_pt #mw-data-after-content,
body.page-Homepage_pt #mw-navigation-heading {
  display: none !important;
}

body.page-Homepage_pt,
body.page-Homepage_pt #content,
body.page-Homepage_pt .mw-body,
body.page-Homepage_pt #mw-content,
body.page-Homepage_pt #mw-content-text,
body.page-Homepage_pt #bodyContent,
body.page-Homepage_pt .mw-content-ltr,
body.page-Homepage_pt .mw-parser-output {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: #0D0D0D !important;
  max-width: none !important;
  width: auto !important;
}

body.page-Homepage_pt #content,
body.page-Homepage_pt .mw-body {
  margin-left: 0 !important;
  box-shadow: none !important;
}

body.page-Homepage_pt { overflow-x: hidden !important; }

/* ===================================================================== */
/* Homepage section headings: white + no underline (article pages keep      */
/* the global orange heading style).                                        */
/* ===================================================================== */
body.page-Homepage .mw-parser-output h1,
body.page-Homepage .mw-parser-output h2,
body.page-Homepage .mw-parser-output h3,
body.page-Homepage .mw-parser-output h4,
body.page-Homepage_de .mw-parser-output h1,
body.page-Homepage_de .mw-parser-output h2,
body.page-Homepage_de .mw-parser-output h3,
body.page-Homepage_de .mw-parser-output h4,
body.page-Homepage_fr .mw-parser-output h1,
body.page-Homepage_fr .mw-parser-output h2,
body.page-Homepage_fr .mw-parser-output h3,
body.page-Homepage_fr .mw-parser-output h4,
body.page-Homepage_es .mw-parser-output h1,
body.page-Homepage_es .mw-parser-output h2,
body.page-Homepage_es .mw-parser-output h3,
body.page-Homepage_es .mw-parser-output h4,
body.page-Homepage_pt .mw-parser-output h1,
body.page-Homepage_pt .mw-parser-output h2,
body.page-Homepage_pt .mw-parser-output h3,
body.page-Homepage_pt .mw-parser-output h4 {
  color: #FFFFFF !important;
  border-bottom: none !important;
}


/* BigBro logo size constraint */
div[style*="max-width:280px"] .mw-file-element {
    max-width: 280px !important;
    width: 100% !important;
    height: auto !important;
}