MediaWiki:Vector-2022.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.
/* The Perfect Tower II wiki: skin theme for Vector 2022.
*
* Brand values come from the TPT2 Community Brand Kit. The server loads tpt.css and the MediaWiki
* adapter (tpt-mediawiki.css) before this page, so every --tpt-* token already follows the reader's
* Appearance choice (day, night, automatic). This file only maps the skin onto those tokens:
* use var(--tpt-*), never a copied colour value.
*
* Source: wiki repository, onwiki/MediaWiki/Vector-2022.css.
*/
/* ---------- Skin colours -> brand tokens ---------- */
/* One block for every theme: the tokens switch, the mapping does not. html:root ties Vector's
night/OS rules on specificity and wins because site CSS loads later. Print keeps Vector's light values. */
@media screen {
html:root,
html .notheme,
html .skin-invert {
--color-base: var(--tpt-ink);
--color-base-fixed: var(--tpt-ink);
--color-base--hover: var(--tpt-ink);
--color-base--subtle: var(--tpt-ink-subtle);
--color-emphasized: var(--tpt-ink);
--color-subtle: var(--tpt-ink-muted);
--color-placeholder: var(--tpt-ink-subtle);
--color-disabled: var(--tpt-ink-subtle);
--color-inverted: var(--tpt-bg);
--color-inverted-fixed: var(--tpt-on-accent);
--color-progressive: var(--tpt-accent);
--color-progressive--hover: var(--tpt-accent);
--color-progressive--active: var(--tpt-accent);
--color-progressive--focus: var(--tpt-accent);
--color-visited: var(--tpt-accent);
--color-destructive: var(--tpt-danger);
--color-destructive--hover: var(--tpt-danger);
--color-destructive--active: var(--tpt-danger);
--color-destructive--focus: var(--tpt-danger);
--color-destructive--visited: var(--tpt-danger);
--color-link-red: var(--tpt-danger);
--color-link-red--hover: var(--tpt-danger);
--color-link-red--active: var(--tpt-danger);
--color-link-red--focus: var(--tpt-danger);
--color-link-red--visited: var(--tpt-danger);
--color-error: var(--tpt-danger);
--color-warning: var(--tpt-warning);
--color-success: var(--tpt-success);
--color-notice: var(--tpt-ink);
--color-content-added: var(--tpt-success);
--color-content-removed: var(--tpt-danger);
--background-color-base: var(--tpt-bg);
--background-color-base-fixed: var(--tpt-surface);
--background-color-neutral: var(--tpt-surface-alt);
--background-color-neutral-subtle: var(--tpt-surface);
--background-color-interactive: var(--tpt-surface-alt);
--background-color-interactive-subtle: var(--tpt-surface);
--background-color-disabled: var(--tpt-surface-alt);
--background-color-disabled-subtle: var(--tpt-surface);
--background-color-inverted: var(--tpt-ink);
--background-color-progressive: var(--tpt-accent-fill);
--background-color-progressive--hover: var(--tpt-brand-sun);
--background-color-progressive--active: var(--tpt-accent-fill);
--background-color-progressive--focus: var(--tpt-accent-fill);
--background-color-progressive-subtle: color-mix(in srgb, var(--tpt-accent-fill) 14%, var(--tpt-bg));
--background-color-destructive: var(--tpt-danger);
--background-color-destructive--hover: var(--tpt-danger);
--background-color-destructive--active: var(--tpt-danger);
--background-color-destructive--focus: var(--tpt-danger);
--background-color-destructive-subtle: color-mix(in srgb, var(--tpt-danger) 14%, var(--tpt-bg));
--background-color-error: var(--tpt-danger);
--background-color-error--hover: var(--tpt-danger);
--background-color-error--active: var(--tpt-danger);
--background-color-error-subtle: color-mix(in srgb, var(--tpt-danger) 14%, var(--tpt-bg));
--background-color-warning-subtle: color-mix(in srgb, var(--tpt-warning) 14%, var(--tpt-bg));
--background-color-success-subtle: color-mix(in srgb, var(--tpt-success) 14%, var(--tpt-bg));
--background-color-notice-subtle: var(--tpt-surface);
--background-color-content-added: color-mix(in srgb, var(--tpt-success) 20%, var(--tpt-bg));
--background-color-content-removed: color-mix(in srgb, var(--tpt-danger) 20%, var(--tpt-bg));
--background-color-transparent: transparent;
--background-color-backdrop-light: color-mix(in srgb, var(--tpt-bg) 65%, transparent);
--background-color-backdrop-dark: color-mix(in srgb, var(--tpt-outline) 65%, transparent);
--background-color-button-quiet--hover: var(--tpt-surface-alt);
--background-color-button-quiet--active: var(--tpt-line);
--background-color-input-binary--checked: var(--tpt-accent-fill);
--background-color-tab-list-item-framed--hover: var(--tpt-surface-alt);
--background-color-tab-list-item-framed--active: var(--tpt-surface-alt);
--border-color-base: var(--tpt-line-strong);
--border-color-subtle: var(--tpt-line);
--border-color-muted: var(--tpt-line);
--border-color-divider: var(--tpt-line);
--border-color-interactive: var(--tpt-line-strong);
--border-color-disabled: var(--tpt-line);
--border-color-inverted: var(--tpt-bg);
--border-color-progressive: var(--tpt-accent-fill);
--border-color-progressive--hover: var(--tpt-accent-fill);
--border-color-progressive--active: var(--tpt-accent-fill);
--border-color-progressive--focus: var(--tpt-focus);
--border-color-destructive: var(--tpt-danger);
--border-color-destructive--hover: var(--tpt-danger);
--border-color-destructive--active: var(--tpt-danger);
--border-color-destructive--focus: var(--tpt-focus);
--border-color-error: var(--tpt-danger);
--border-color-error--hover: var(--tpt-danger);
--border-color-warning: var(--tpt-warning);
--border-color-success: var(--tpt-success);
--border-color-notice: var(--tpt-line-strong);
--border-color-content-added: var(--tpt-success);
--border-color-content-removed: var(--tpt-danger);
--border-color-transparent: transparent;
--border-color-input--hover: var(--tpt-ink-muted);
--border-color-input-binary: var(--tpt-line-strong);
--border-color-input-binary--hover: var(--tpt-ink-muted);
--border-color-input-binary--active: var(--tpt-accent-fill);
--border-color-input-binary--focus: var(--tpt-focus);
--border-color-input-binary--checked: var(--tpt-accent-fill);
--outline-color-progressive--focus: var(--tpt-focus);
--box-shadow-color-base: var(--tpt-outline);
--box-shadow-color-progressive--active: var(--tpt-accent-fill);
--box-shadow-color-progressive--focus: var(--tpt-focus);
--box-shadow-color-progressive-selected: var(--tpt-accent-fill);
--box-shadow-color-progressive-selected--hover: var(--tpt-accent-fill);
--box-shadow-color-progressive-selected--active: var(--tpt-accent-fill);
--box-shadow-color-destructive--focus: var(--tpt-focus);
--box-shadow-color-inverted: var(--tpt-bg);
--box-shadow-color-transparent: transparent;
--filter-invert-icon: invert(1);
--filter-invert-primary-button-icon: none;
}
/* Skin icons are dark masks: invert them only on dark grounds. */
html.skin-theme-clientpref-day,
html .notheme,
html .skin-invert {
--filter-invert-icon: none;
}
}
@media screen and (prefers-color-scheme: light) {
html.skin-theme-clientpref-os {
--filter-invert-icon: none;
}
}
/* ---------- Type ---------- */
html,
body {
font-family: var(--tpt-font-body);
}
.vector-feature-custom-font-size-clientpref-1 {
--line-height-medium: 1.625; /* 16/26, the kit's body text */
}
.mw-body h1,
.mw-body .mw-heading1,
.mw-body-content h1,
.mw-body-content .mw-heading1,
.mw-body-content h2,
.mw-body-content .mw-heading2,
.mw-body-content h3,
.mw-body-content h4,
.mw-body-content h5,
.mw-body-content h6 {
font-family: var(--tpt-font-heading);
color: var(--tpt-ink);
}
pre,
code,
tt,
kbd,
samp,
.mw-code {
font-family: var(--tpt-font-mono);
}
.mw-editsection,
.mw-editsection-like {
font-family: var(--tpt-font-body);
font-size: 13px;
font-weight: 400;
letter-spacing: 0;
text-transform: none;
}
/* Page title: the one Oxanium line per view. */
.mw-body h1.firstHeading,
.mw-body .firstHeading {
font-family: var(--tpt-font-display);
font-weight: 800;
font-size: 2.75rem; /* 44px */
line-height: 1.05;
text-transform: uppercase;
letter-spacing: 0;
text-wrap: balance;
border: 0;
padding: 4px 0 2px;
}
@media screen and (max-width: 719px) {
.mw-body h1.firstHeading,
.mw-body .firstHeading {
font-size: 2rem; /* 32px */
}
}
.vector-page-titlebar {
box-shadow: none;
border-bottom: 0;
padding-top: 8px;
}
.vector-page-titlebar::after {
display: none;
}
/* Article headings. */
.mw-body-content h2,
.mw-body-content .mw-heading2 h2 {
font-weight: 600;
font-size: 1.75rem; /* 28px */
line-height: 1.2;
letter-spacing: .01em;
text-transform: uppercase;
margin: 2.25rem 0 1rem;
padding-bottom: 10px;
border-bottom: 1px solid var(--tpt-line);
}
.mw-body-content .mw-heading2 {
border-bottom: 1px solid var(--tpt-line);
margin: 2.25rem 0 1rem;
padding-bottom: 10px;
}
.mw-body-content .mw-heading2 h2 {
border: 0;
margin: 0;
padding: 0;
}
.mw-body-content h3,
.mw-body-content .mw-heading3 h3 {
font-weight: 600;
font-size: 1.3125rem; /* 21px */
line-height: 1.35;
margin-top: 1.75rem;
}
.mw-body-content h4,
.mw-body-content h5,
.mw-body-content h6 {
font-weight: 500;
font-size: 1.0625rem; /* 17px */
letter-spacing: .02em;
}
.mw-body-content h1 {
font-weight: 600;
text-transform: uppercase;
}
/* Prose stays at the kit's 720px measure; tables, galleries and navboxes may use the full column. */
.mw-parser-output > p,
.mw-parser-output > ul,
.mw-parser-output > ol,
.mw-parser-output > dl,
.mw-parser-output > blockquote {
max-width: var(--tpt-size-measure);
}
.mw-body-content a:not(.mw-file-description):not(.image) {
text-decoration-thickness: 1px;
text-underline-offset: 3px;
}
.mw-body-content a:not(.mw-file-description):not(.image):hover {
text-decoration: underline;
text-decoration-thickness: 2px;
}
/* ---------- Header ---------- */
/* Surface with the kit's 3px ember-to-sun strip (.tpt-header::before). Painted as a background layer
because .mw-header is a positioned, z-indexed child that would cover a pseudo-element. */
.vector-header-container {
background:
linear-gradient(90deg, var(--tpt-brand-ember), var(--tpt-brand-sun)) top left / 100% 3px no-repeat,
var(--tpt-surface);
border-bottom: 1px solid var(--tpt-line);
}
.vector-header-container .mw-header {
background: transparent;
min-height: 64px;
padding-top: 3px;
}
.vector-header-container .vector-sticky-header {
background:
linear-gradient(90deg, var(--tpt-brand-ember), var(--tpt-brand-sun)) top left / 100% 3px no-repeat,
var(--tpt-surface);
border-bottom: 1px solid var(--tpt-line);
min-height: 56px;
padding-top: 3px;
}
.mw-header {
align-items: center;
}
/* Phones: logo left, search and menus right, on one row. Below 640px Vector stacks the two halves
(.vector-header { flex-flow: column }) and stretches both to 100%. */
@media screen and (max-width: 639px) {
.vector-header-container .vector-header {
flex-flow: row nowrap;
}
.mw-header .vector-header-start {
width: auto;
flex: 1 1 auto;
min-width: 0;
}
.mw-header .vector-header-end {
width: auto;
flex: 0 0 auto;
}
.mw-logo {
min-width: 0;
}
}
/* Lockup: the symbol plus "Wiki" in the display face, like the website's header. */
.mw-logo-container.skin-invert {
filter: none !important;
--tpt-ink: inherit;
}
.mw-logo {
align-items: center;
text-decoration: none;
}
.mw-logo-icon {
width: 31px;
height: 36px;
margin-right: 10px;
}
.mw-logo-wordmark {
font-size: 0;
color: var(--tpt-ink);
}
.mw-logo-wordmark::after {
content: "Wiki";
font-family: var(--tpt-font-display);
font-weight: 800;
font-size: 24px;
line-height: 1;
text-transform: uppercase;
letter-spacing: 0;
}
/* Search field: the kit's .tpt-search. */
.vector-header .cdx-text-input__input,
.vector-sticky-header .cdx-text-input__input,
#searchInput {
min-height: 40px;
background: var(--tpt-bg);
color: var(--tpt-ink);
border: 2px solid var(--tpt-line-strong);
border-radius: var(--tpt-radius-1);
font-size: 15px;
box-shadow: none;
}
.vector-header .cdx-text-input__input:focus,
.vector-sticky-header .cdx-text-input__input:focus,
#searchInput:focus {
border-color: var(--tpt-focus);
box-shadow: none;
outline: none;
}
.vector-header .cdx-search-input__end-button {
min-height: 40px;
border-radius: var(--tpt-radius-1);
}
/* Header buttons and links: the kit's uppercase nav style. */
.vector-user-links .vector-menu-content-list > li > a,
.vector-user-links #pt-createaccount-2 a,
.vector-user-links #pt-login-2 a {
font-family: var(--tpt-font-heading);
font-weight: 500;
font-size: 14px;
letter-spacing: .06em;
text-transform: uppercase;
color: var(--tpt-ink-muted);
text-decoration: none;
}
.vector-user-links .vector-menu-content-list > li > a:hover {
color: var(--tpt-ink);
}
/* Website links added by the server (user-page portlet): Play button in the kit's primary style. */
#pt-tpt-play a {
display: inline-flex;
align-items: center;
height: 36px;
padding: 0 14px;
background: var(--tpt-accent-fill);
color: var(--tpt-on-accent) !important;
border: 2px solid var(--tpt-outline);
border-radius: var(--tpt-radius-1);
box-shadow: var(--tpt-extrude);
}
#pt-tpt-play a:hover {
background: var(--tpt-brand-sun);
}
/* ---------- Page grid: main menu left, contents right (kit sizes: 248px nav, 340px aside) ---------- */
@media screen and (min-width: 1120px) {
.vector-feature-main-menu-pinned-enabled .mw-page-container-inner {
grid-template-columns: var(--tpt-size-wiki-nav) minmax(0, 1fr);
}
/* The nav starts level with the page title, with or without a contents column. */
.vector-column-start {
margin-top: 0;
}
.vector-main-menu-container .vector-main-menu {
padding-top: 20px;
}
.mw-header {
grid-template-columns: var(--tpt-size-wiki-nav) minmax(0, 1fr);
}
}
@media screen and (min-width: 1400px) {
/* The contents list moves out of the left column into its own column on the right. */
.vector-feature-main-menu-pinned-enabled.vector-feature-toc-pinned-clientpref-1.vector-toc-available .mw-page-container-inner {
grid-template-columns: var(--tpt-size-wiki-nav) minmax(0, 1fr) 15rem;
grid-template-areas:
'siteNotice siteNotice siteNotice'
'mainMenu pageContent toc'
'footer footer footer';
}
.vector-feature-main-menu-pinned-enabled.vector-feature-toc-pinned-clientpref-1.vector-toc-available .vector-column-start {
display: contents;
}
.vector-feature-main-menu-pinned-enabled.vector-feature-toc-pinned-clientpref-1.vector-toc-available .vector-main-menu-container {
grid-area: mainMenu;
margin-left: 0;
}
.vector-feature-main-menu-pinned-enabled.vector-feature-toc-pinned-clientpref-1.vector-toc-available .vector-column-start > .vector-sticky-pinned-container {
grid-area: toc;
align-self: start;
}
.vector-feature-main-menu-pinned-enabled.vector-feature-toc-pinned-clientpref-1.vector-toc-available .vector-column-start > .vector-sticky-pinned-container::after {
display: none;
}
}
/* ---------- Main menu (left nav) ---------- */
.vector-main-menu-container .vector-main-menu,
.vector-dropdown .vector-main-menu {
font-size: 14px;
line-height: 20px;
}
.vector-main-menu .vector-pinnable-header {
display: none;
}
/* Vector 2022 is the only skin, so "Switch to old look" has nowhere to go. */
.vector-main-menu-action-opt-out {
display: none;
}
.vector-main-menu .vector-menu-heading,
.vector-main-menu #p-navigation .vector-menu-heading {
display: block;
font-family: var(--tpt-font-heading);
font-weight: 500;
font-size: 11px;
line-height: 14px;
letter-spacing: .1em;
text-transform: uppercase;
color: var(--tpt-ink-muted);
border: 0;
margin: 20px 0 6px;
padding: 0 10px;
}
.vector-main-menu .vector-menu:first-of-type .vector-menu-heading {
margin-top: 8px;
}
.vector-main-menu .vector-menu-content-list .mw-list-item {
padding: 0;
margin: 0;
}
.vector-main-menu .vector-menu-content-list .mw-list-item a {
display: flex;
align-items: center;
gap: 10px;
padding: 5px 10px;
border-radius: var(--tpt-radius-1);
color: var(--tpt-ink-muted);
text-decoration: none;
background-image: none;
}
.vector-main-menu .vector-menu-content-list .mw-list-item a:hover {
background: var(--tpt-surface);
color: var(--tpt-ink);
}
.vector-main-menu .vector-menu-content-list .mw-list-item.selected a,
.vector-main-menu .vector-menu-content-list .mw-list-item a.mw-selflink {
background: var(--tpt-surface-alt);
color: var(--tpt-ink);
font-weight: 600;
}
/* Building links: a facility hexagon in the game's resource colour. */
#p-Town .mw-list-item[id^="n-"] a::before {
content: "";
width: 12px;
height: 14px;
flex: none;
background: var(--tpt-fac, transparent);
clip-path: polygon(50% 0, 100% 27.5%, 100% 72.5%, 50% 100%, 0 72.5%, 0 27.5%);
}
#p-Town #n-Town a::before,
#p-Town #n-All-buildings a::before {
display: none;
}
#n-Power-Plant { --tpt-fac: var(--tpt-fac-power-plant); }
#n-Mine { --tpt-fac: var(--tpt-fac-mine); }
#n-Factory { --tpt-fac: var(--tpt-fac-factory); }
#n-Headquarters { --tpt-fac: var(--tpt-fac-headquarters); }
#n-Arcade { --tpt-fac: var(--tpt-fac-arcade); }
#n-Laboratory { --tpt-fac: var(--tpt-fac-laboratory); }
#n-Shipyard { --tpt-fac: var(--tpt-fac-shipyard); }
#n-Trading-Post { --tpt-fac: var(--tpt-fac-trading-post); }
#n-Workshop { --tpt-fac: var(--tpt-fac-workshop); }
#n-Museum { --tpt-fac: var(--tpt-fac-museum); }
#n-Construction-Firm { --tpt-fac: var(--tpt-fac-construction-firm); }
#n-Statue-of-Cubos { --tpt-fac: var(--tpt-fac-statue-of-cubos); }
/* External links in the menu: the website's arrow. */
.vector-main-menu .mw-list-item a.external::after,
.vector-main-menu .mw-list-item a[rel~="nofollow"]::after {
content: "\2197";
margin-left: auto;
font-size: 12px;
color: var(--tpt-ink-subtle);
}
/* ---------- Contents (TOC) ---------- */
.vector-toc {
font-size: 14px;
line-height: 20px;
}
.vector-toc .vector-pinnable-header-label {
font-family: var(--tpt-font-heading);
font-weight: 500;
font-size: 11px;
letter-spacing: .1em;
text-transform: uppercase;
color: var(--tpt-ink-muted);
}
.vector-toc .vector-toc-link {
color: var(--tpt-ink-muted);
padding: 4px 0;
}
.vector-toc .vector-toc-link:hover {
color: var(--tpt-ink);
text-decoration: none;
}
.vector-toc .vector-toc-list-item-active > .vector-toc-link,
.vector-toc .vector-toc-level-1-active:not(.vector-toc-list-item-expanded) > .vector-toc-link,
.vector-toc .vector-toc-list-item-active.vector-toc-level-1-active > .vector-toc-link {
color: var(--tpt-ink) !important;
font-weight: 600;
box-shadow: inset 3px 0 0 var(--tpt-accent-fill);
padding-left: 10px;
}
/* ---------- Page tabs (Read / Edit / History) ---------- */
.vector-page-toolbar-container {
border-bottom: 2px solid var(--tpt-line);
}
.vector-menu-tabs .mw-list-item a {
font-family: var(--tpt-font-heading);
font-weight: 500;
font-size: 14px;
letter-spacing: .06em;
text-transform: uppercase;
color: var(--tpt-ink-muted) !important;
}
.vector-menu-tabs .mw-list-item.selected a,
.vector-menu-tabs .mw-list-item.selected a:visited {
color: var(--tpt-ink) !important;
border-bottom: 3px solid var(--tpt-accent-fill);
}
.vector-menu-tabs .mw-list-item a:hover {
color: var(--tpt-ink) !important;
}
.vector-page-toolbar .vector-dropdown-label {
font-family: var(--tpt-font-heading);
font-weight: 500;
letter-spacing: .06em;
text-transform: uppercase;
}
/* ---------- Dropdowns, menus, buttons ---------- */
.vector-dropdown .vector-dropdown-content {
background: var(--tpt-surface);
border: 1px solid var(--tpt-line);
border-radius: var(--tpt-radius-2);
box-shadow: var(--tpt-lift);
}
.cdx-button,
.mw-ui-button {
border-radius: var(--tpt-radius-1);
}
.cdx-button--action-progressive.cdx-button--weight-primary,
.mw-ui-button.mw-ui-progressive {
color: var(--tpt-on-accent);
border-color: var(--tpt-outline);
box-shadow: var(--tpt-extrude);
}
/* ---------- Content chrome ---------- */
#siteSub {
display: none;
}
/* The Main Page brings its own hero. */
.page-Main_Page.action-view .vector-page-titlebar .firstHeading {
position: absolute;
width: 1px;
height: 1px;
overflow: hidden;
clip-path: inset(50%);
white-space: nowrap;
}
/* External links: the website's arrow, in the link colour (Vector's icon is a fixed blue image). */
.mw-parser-output a.external {
background-image: none;
padding-right: 0;
}
.mw-parser-output a.external::after {
content: "";
display: inline-block;
width: .72em;
height: .72em;
margin-left: .2em;
background-color: currentColor;
opacity: .75;
-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='square'%3E%3Cpath d='M14 4h6v6M20 4l-9 9M18 14v6H4V6h6'/%3E%3C/svg%3E") center / contain no-repeat;
mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='square'%3E%3Cpath d='M14 4h6v6M20 4l-9 9M18 14v6H4V6h6'/%3E%3C/svg%3E") center / contain no-repeat;
}
.mw-parser-output a.external:has(img)::after,
.mw-parser-output .plainlinks a.external::after {
display: none;
}
#contentSub,
#contentSub2,
.mw-content-subtitle {
color: var(--tpt-ink-subtle);
font-size: 13px;
}
.catlinks {
background: transparent;
border: 0;
border-top: 1px solid var(--tpt-line);
border-radius: 0;
margin-top: 40px;
padding: 16px 0 0;
}
.catlinks > div > a:first-child {
font-family: var(--tpt-font-heading);
font-weight: 500;
font-size: 13px;
letter-spacing: .08em;
text-transform: uppercase;
color: var(--tpt-ink-muted);
}
.catlinks li {
border: 0 !important;
padding: 0 !important;
margin: 0 6px 6px 0;
}
.catlinks li a {
display: inline-flex;
align-items: center;
height: 22px;
padding: 0 8px;
border-radius: var(--tpt-radius-1);
background: var(--tpt-surface-alt);
color: var(--tpt-ink-muted);
font-family: var(--tpt-font-heading);
font-weight: 500;
font-size: 12px;
letter-spacing: .08em;
text-transform: uppercase;
text-decoration: none;
}
.catlinks li a:hover {
color: var(--tpt-ink);
background: var(--tpt-line);
}
/* ---------- Footer ---------- */
.mw-footer-container {
background: transparent;
border-top: 1px solid var(--tpt-line);
margin-top: 48px;
}
.mw-footer {
border: 0;
font-size: 13px;
line-height: 20px;
color: var(--tpt-ink-subtle);
}
.mw-footer li {
color: var(--tpt-ink-subtle);
}
.mw-footer a {
color: var(--tpt-ink-muted);
}
#footer-icons {
display: none;
}