MediaWiki:Common.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)
• Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
• Opera: Press Ctrl-F5.

/* CSS placed here will be applied to all skins */
@import url('https://use.typekit.net/oov2wcw.css');

.skin-minerva.page-Main_Page #firstHeading {
    display: none;
}

/*  visualClear CSS class definition for SocialProfile extension
    because Vector does not include the definition anymore; see
    https://phabricator.wikimedia.org/T328235 and 
    https://phabricator.wikimedia.org/T287962 */
.visualClear {
	clear: both;
}

/* 1) Config */
:root{
  /* If using Adobe Fonts: set the first item to the EXACT family name from your kit CSS
     (often "century-gothic"). If not, keep "Century Gothic" first to use system-installed font. */
  --title-font: "century-gothic", "Century Gothic", "URW Gothic L", "Apple Gothic", "Avant Garde", sans-serif;
  --title-stroke: 0.0035em;        /* 0.35% of font size */
  --title-stroke-color: #000;      /* outline colour (auto-switched in dark mode below) */
}

/* 2) Target page titles across common skins */
.mw-page-title-main,
h1#firstHeading,
.firstHeading {
  font-family: var(--title-font) !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* 3) True stroke where supported (Chromium/Edge/Safari) */
@supports (-webkit-text-stroke: 1px black) {
  .mw-page-title-main,
  h1#firstHeading,
  .firstHeading {
    -webkit-text-stroke: var(--title-stroke) var(--title-stroke-color);
    text-stroke: var(--title-stroke) var(--title-stroke-color);
    -webkit-text-fill-color: currentColor; /* preserve the fill as the current text colour */
    text-shadow: none; /* avoid double-thick look */
  }
}

/* 4) Firefox fallback: simulate stroke with shadows */
@supports not (-webkit-text-stroke: 1px black) {
  .mw-page-title-main,
  h1#firstHeading,
  .firstHeading {
    text-shadow:
      var(--title-stroke) 0 0 var(--title-stroke-color),
      calc(-1 * var(--title-stroke)) 0 0 var(--title-stroke-color),
      0 var(--title-stroke) 0 var(--title-stroke-color),
      0 calc(-1 * var(--title-stroke)) 0 var(--title-stroke-color),
      var(--title-stroke) var(--title-stroke) 0 var(--title-stroke-color),
      calc(-1 * var(--title-stroke)) var(--title-stroke) 0 var(--title-stroke-color),
      var(--title-stroke) calc(-1 * var(--title-stroke)) 0 var(--title-stroke-color),
      calc(-1 * var(--title-stroke)) calc(-1 * var(--title-stroke)) 0 var(--title-stroke-color);
  }
}

/* 5) Dark mode: make the outline light for contrast */
@media (prefers-color-scheme: dark) {
  :root { --title-stroke-color: rgba(255,255,255,0.85); }
}

/* 6) Keep subtitles clean */
#siteSub, .subtitle { -webkit-text-stroke: 0; text-stroke: 0; text-shadow: none; }