MediaWiki:Common.css
MediaWiki interface page
More actions
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.
/* CSS placed here will be applied to all skins */
/*
* ============================================================
* eve.wiki — MediaWiki:Common.css
* EVE Online theme override for the Citizen skin
* ============================================================
* Install: paste this into MediaWiki:Common.css on your wiki
* Requires: Citizen skin (github.com/StarCitizenTools/mediawiki-skins-Citizen)
* Fonts: add to MediaWiki:Common.css or LocalSettings.php $wgHooks
* ============================================================
*/
/* ------------------------------------------------------------
GOOGLE FONTS IMPORT
------------------------------------------------------------ */
@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;600;700;900&family=Rajdhani:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap');
/* ============================================================
SECTION 1: CITIZEN SKIN CSS VARIABLE OVERRIDES
These map directly onto Citizen's internal token system.
============================================================ */
/* -- Light mode (Citizen uses :root for light) -- */
:root,
.skin-citizen,
.skin-citizen-theme-day {
/* Core backgrounds */
--color-surface-0: #0d0f14; /* page background */
--color-surface-1: #131720; /* primary panels */
--color-surface-2: #171c26; /* secondary panels */
--color-surface-3: #1c2230; /* raised elements */
--color-surface-4: #1f2638; /* hover state */
/* Borders */
--border-color-base: #233042;
--border-color-subtle: #1a2230;
--border-color-strong: #2e3f58;
/* Text */
--color-base: #d7e0ea;
--color-base--subtle: #93a4b5;
--color-base--emphasized: #eef3fa;
--color-link: #4fc3e8;
--color-link--visited: #7aa8c8;
--color-link--active: #80d8f5;
/* Accents */
--color-primary: #4fc3e8; /* cyan — primary */
--color-primary--hover: #80d8f5;
--color-secondary: #c8a84b; /* gold — secondary */
--color-secondary--hover: #e0c870;
/* Progressive / destructive */
--color-progressive: #4fc3e8;
--color-progressive--hover: #80d8f5;
--color-destructive: #cc4444;
/* Header / nav */
--color-header-background: #080a10;
--color-header-border: #233042;
/* Sidebar */
--color-toc-background: #131720;
--color-sidebar-background: #0f1218;
/* Citizen's internal tokens */
--color-icon-base: #4fc3e8;
--color-icon-subtle: #93a4b5;
--color-accent: #4fc3e8;
--color-accent-hover: #80d8f5;
--color-menu-item-hover-background: #1c2230;
/* Typography sizes */
--font-size-base: 15px;
--font-size-small: 13px;
--font-size-large: 17px;
--font-size-h1: 28px;
--font-size-h2: 20px;
--font-size-h3: 16px;
--font-size-h4: 14px;
/* Line height */
--line-height-base: 1.65;
/* Spacing */
--space-unit: 8px;
--border-radius-base: 2px;
--border-radius-medium: 4px;
/* Shadow */
--box-shadow-card: 0 2px 12px rgba(0,0,0,.4);
--box-shadow-menu: 0 4px 20px rgba(0,0,0,.6);
/* Scrollbar */
scrollbar-color: #233042 #0d0f14;
scrollbar-width: thin;
}
/* -- Dark mode / night mode -- */
.skin-citizen-theme-night,
[data-theme="dark"] {
--color-surface-0: #0a0c10;
--color-surface-1: #0f1218;
--color-surface-2: #131720;
--color-surface-3: #171c26;
--color-surface-4: #1c2230;
}
/* ============================================================
SECTION 2: GLOBAL BASE OVERRIDES
============================================================ */
/* Body & page background */
body,
.skin-citizen {
background-color: var(--color-surface-0) !important;
color: var(--color-base) !important;
font-family: 'Rajdhani', sans-serif !important;
font-size: var(--font-size-base) !important;
line-height: var(--line-height-base) !important;
-webkit-font-smoothing: antialiased;
}
/* Subtle scanline texture over entire page */
body::before {
content: '';
position: fixed;
inset: 0;
pointer-events: none;
z-index: 9999;
background-image:
linear-gradient(rgba(79,195,232,.015) 1px, transparent 1px),
linear-gradient(90deg, rgba(79,195,232,.015) 1px, transparent 1px);
background-size: 48px 48px;
}
/* Links */
a,
.mw-parser-output a {
color: var(--color-link) !important;
text-decoration: none;
transition: color .12s ease;
}
a:hover,
.mw-parser-output a:hover {
color: var(--color-link--active) !important;
text-decoration: underline;
}
a:visited,
.mw-parser-output a:visited {
color: var(--color-link--visited) !important;
}
/* Headings */
h1, .mw-parser-output h1 {
font-family: 'Orbitron', sans-serif !important;
font-size: var(--font-size-h1) !important;
font-weight: 700 !important;
color: var(--color-base--emphasized) !important;
letter-spacing: .5px;
border-bottom: 1px solid #233042 !important;
padding-bottom: 6px !important;
margin-bottom: 14px !important;
}
h2, .mw-parser-output h2 {
font-family: 'Orbitron', sans-serif !important;
font-size: var(--font-size-h2) !important;
font-weight: 600 !important;
color: #4fc3e8 !important;
letter-spacing: 1px;
border-bottom: 1px solid #1a4a60 !important;
padding-bottom: 4px !important;
margin: 20px 0 8px !important;
display: flex;
align-items: center;
gap: 8px;
}
h2::before {
content: '';
display: inline-block;
width: 3px;
height: 16px;
background: #4fc3e8;
flex-shrink: 0;
}
h3, .mw-parser-output h3 {
font-family: 'Orbitron', sans-serif !important;
font-size: var(--font-size-h3) !important;
font-weight: 600 !important;
color: #c8a84b !important;
letter-spacing: .8px;
margin: 14px 0 6px !important;
border-bottom: none !important;
}
h4, .mw-parser-output h4 {
font-family: 'Rajdhani', sans-serif !important;
font-size: var(--font-size-h4) !important;
font-weight: 700 !important;
color: var(--color-base--subtle) !important;
letter-spacing: 1.5px;
text-transform: uppercase;
margin: 10px 0 5px !important;
}
/* ============================================================
SECTION 3: CITIZEN HEADER / TOPBAR
============================================================ */
/* Main header bar */
#citizen-header,
.citizen-header {
background: #080a10 !important;
border-bottom: 1px solid #233042 !important;
box-shadow: none !important;
}
/* Header glow line */
#citizen-header::after,
.citizen-header::after {
content: '';
position: absolute;
bottom: 0; left: 0; right: 0;
height: 1px;
background: linear-gradient(90deg,
transparent 0%,
#1a7fa0 20%,
#4fc3e8 50%,
#1a7fa0 80%,
transparent 100%
);
opacity: .5;
pointer-events: none;
}
/* Site logo / wordmark */
#citizen-header .citizen-header__wordmark,
.citizen-wordmark {
font-family: 'Orbitron', sans-serif !important;
font-weight: 700 !important;
font-size: 16px !important;
letter-spacing: 2px !important;
color: #eef3fa !important;
}
/* Nav links in header */
#citizen-header a,
.citizen-header a {
font-family: 'Rajdhani', sans-serif !important;
font-weight: 600 !important;
letter-spacing: .8px;
color: #93a4b5 !important;
transition: color .12s ease !important;
}
#citizen-header a:hover,
.citizen-header a:hover {
color: #4fc3e8 !important;
text-decoration: none !important;
}
/* Search bar */
.citizen-search__form,
#searchform,
.oo-ui-textInputWidget input {
background: #131720 !important;
border: 1px solid #233042 !important;
color: #d7e0ea !important;
font-family: 'Rajdhani', sans-serif !important;
border-radius: 2px !important;
transition: border-color .12s ease, box-shadow .12s ease !important;
}
.citizen-search__form:focus-within,
#searchform:focus-within {
border-color: #2a8cb0 !important;
box-shadow: 0 0 0 2px rgba(79,195,232,.12) !important;
}
.citizen-search__form input::placeholder,
#searchInput::placeholder {
color: #4e5f72 !important;
}
/* Search suggestion dropdown */
.citizen-search__suggestions,
.suggestions-results {
background: #131720 !important;
border: 1px solid #233042 !important;
border-top: none !important;
border-radius: 0 0 2px 2px !important;
}
.citizen-search__suggestion:hover,
.suggestions-result:hover,
.suggestions-result.oo-ui-optionWidget-highlighted {
background: #1c2230 !important;
color: #4fc3e8 !important;
}
/* ============================================================
SECTION 4: SIDEBAR / TOC
============================================================ */
/* Left sidebar */
#citizen-sidebar,
.citizen-sidebar {
background: #0f1218 !important;
border-right: 1px solid #1a2230 !important;
}
/* Sidebar section headings */
.citizen-sidebar .citizen-nav__heading,
#citizen-sidebar .citizen-nav__heading,
.citizen-toc__title {
font-family: 'Orbitron', sans-serif !important;
font-size: 9px !important;
font-weight: 600 !important;
letter-spacing: 2.5px !important;
color: #c8a84b !important;
text-transform: uppercase !important;
border-bottom: 1px solid #3a2e12 !important;
padding-bottom: 6px !important;
margin-bottom: 4px !important;
}
/* Sidebar links */
.citizen-sidebar a,
#citizen-sidebar a,
.citizen-nav__item a {
font-family: 'Rajdhani', sans-serif !important;
font-size: 13.5px !important;
font-weight: 500 !important;
color: #93a4b5 !important;
transition: color .12s, background .12s !important;
border-radius: 2px !important;
}
.citizen-sidebar a:hover,
#citizen-sidebar a:hover,
.citizen-nav__item a:hover {
color: #4fc3e8 !important;
background: rgba(79,195,232,.05) !important;
text-decoration: none !important;
}
.citizen-nav__item--active a,
.citizen-nav__item.active a {
color: #4fc3e8 !important;
background: rgba(79,195,232,.08) !important;
border-left: 2px solid #4fc3e8 !important;
}
/* Floating Table of Contents */
.citizen-toc,
#citizen-toc {
background: #131720 !important;
border: 1px solid #233042 !important;
border-top: 2px solid #4fc3e8 !important;
border-radius: 2px !important;
}
.citizen-toc__title {
color: #4fc3e8 !important;
font-family: 'Orbitron', sans-serif !important;
font-size: 10px !important;
letter-spacing: 2px !important;
}
.citizen-toc a {
color: #93a4b5 !important;
font-family: 'Rajdhani', sans-serif !important;
font-size: 13px !important;
}
.citizen-toc a:hover {
color: #4fc3e8 !important;
}
.citizen-toc__item--active > a {
color: #4fc3e8 !important;
border-left: 2px solid #4fc3e8 !important;
}
/* ============================================================
SECTION 5: ARTICLE CONTENT AREA
============================================================ */
/* Content wrapper */
#mw-content-text,
.mw-parser-output {
color: var(--color-base) !important;
font-family: 'Rajdhani', sans-serif !important;
font-size: 15px !important;
line-height: 1.7 !important;
}
/* Page first heading */
#firstHeading,
.page-heading h1 {
font-family: 'Orbitron', sans-serif !important;
font-size: 28px !important;
font-weight: 700 !important;
color: #eef3fa !important;
letter-spacing: .5px !important;
border-bottom: 1px solid #233042 !important;
padding-bottom: 8px !important;
}
/* Article tabs (read / discussion / history / edit) */
#p-views .vector-tab-noaction a,
.citizen-page-tabs a,
#ca-nstab-main a,
#ca-talk a,
#ca-history a,
#ca-edit a,
#ca-ve-edit a {
font-family: 'Rajdhani', sans-serif !important;
font-size: 12px !important;
font-weight: 600 !important;
letter-spacing: 1px !important;
text-transform: uppercase !important;
color: #4e5f72 !important;
border-bottom: 2px solid transparent !important;
transition: color .12s, border-color .12s !important;
padding: 6px 12px !important;
}
#p-views .vector-tab-noaction a:hover,
.citizen-page-tabs a:hover {
color: #4fc3e8 !important;
border-bottom-color: #4fc3e8 !important;
}
#ca-nstab-main.selected a,
#ca-nstab-main a.selected,
.selected a {
color: #4fc3e8 !important;
border-bottom-color: #4fc3e8 !important;
}
/* ============================================================
SECTION 6: TABLES
Infoboxes, wikitables, data tables
============================================================ */
/* Generic wikitable */
.wikitable,
.mw-parser-output .wikitable {
background: #131720 !important;
border: 1px solid #233042 !important;
border-collapse: collapse !important;
color: #d7e0ea !important;
font-family: 'Rajdhani', sans-serif !important;
font-size: 14px !important;
width: 100%;
}
.wikitable th,
.mw-parser-output .wikitable th {
background: #0f1218 !important;
color: #d7e0ea !important;
font-family: 'Orbitron', sans-serif !important;
font-size: 9px !important;
font-weight: 600 !important;
letter-spacing: 1.5px !important;
text-transform: uppercase !important;
padding: 8px 12px !important;
border: 1px solid #233042 !important;
}
.wikitable td,
.mw-parser-output .wikitable td {
padding: 6px 12px !important;
border: 1px solid #1a2230 !important;
vertical-align: middle !important;
}
.wikitable tr:nth-child(even),
.mw-parser-output .wikitable tr:nth-child(even) {
background: rgba(255,255,255,.02) !important;
}
.wikitable tr:hover,
.mw-parser-output .wikitable tr:hover {
background: #1c2230 !important;
}
/* Sortable table arrows */
.wikitable th.headerSort::after,
.wikitable .headerSort::after {
color: #4fc3e8 !important;
}
/* Infobox — right-floated ship/item boxes */
.infobox,
.mw-parser-output .infobox {
background: #131720 !important;
border: 1px solid #233042 !important;
border-top: 2px solid #4fc3e8 !important;
color: #d7e0ea !important;
font-family: 'Rajdhani', sans-serif !important;
font-size: 13.5px !important;
float: right !important;
clear: right !important;
margin: 0 0 16px 20px !important;
min-width: 220px !important;
max-width: 280px !important;
}
.infobox th,
.mw-parser-output .infobox th {
background: #0f1218 !important;
color: #eef3fa !important;
font-family: 'Orbitron', sans-serif !important;
font-size: 9px !important;
letter-spacing: 2px !important;
text-transform: uppercase !important;
padding: 5px 10px !important;
border: 1px solid #233042 !important;
}
/* Infobox title row (first th with colspan) */
.infobox th[colspan],
.mw-parser-output .infobox caption,
.mw-parser-output .infobox th:first-child[colspan] {
background: #0a0c10 !important;
color: #eef3fa !important;
font-family: 'Orbitron', sans-serif !important;
font-size: 12px !important;
letter-spacing: 1.5px !important;
text-align: center !important;
padding: 8px !important;
}
.infobox td,
.mw-parser-output .infobox td {
padding: 4px 10px !important;
border-bottom: 1px solid #1a2230 !important;
vertical-align: middle !important;
}
.infobox tr:nth-child(even) td,
.mw-parser-output .infobox tr:nth-child(even) td {
background: rgba(255,255,255,.025) !important;
}
/* ============================================================
SECTION 7: NOTICE / CALLOUT BOXES
============================================================ */
/* Generic MW message boxes */
.mw-message-box,
.ambox,
.mw-parser-output .ambox {
background: #131720 !important;
border: 1px solid #233042 !important;
border-left: 3px solid #4fc3e8 !important;
color: #d7e0ea !important;
font-family: 'Rajdhani', sans-serif !important;
margin: 12px 0 !important;
}
.mw-message-box-warning,
.ambox-warning {
border-left-color: #c8a84b !important;
background: rgba(200,168,75,.04) !important;
}
.mw-message-box-error,
.ambox-delete,
.ambox-content {
border-left-color: #cc4444 !important;
background: rgba(204,68,68,.04) !important;
}
.mw-message-box-notice,
.ambox-notice {
border-left-color: #4fc3e8 !important;
background: rgba(79,195,232,.04) !important;
}
/* ============================================================
SECTION 8: CODE BLOCKS
============================================================ */
code, kbd, samp, tt,
.mw-parser-output code,
.mw-parser-output pre {
font-family: 'JetBrains Mono', 'Courier New', monospace !important;
font-size: 13px !important;
background: #0a0c10 !important;
color: #4fc3e8 !important;
border: 1px solid #1a2230 !important;
border-radius: 2px !important;
padding: 1px 6px !important;
}
.mw-parser-output pre {
padding: 12px 16px !important;
overflow-x: auto !important;
line-height: 1.5 !important;
}
/* ============================================================
SECTION 9: CITIZEN CARD / FEATURE COMPONENTS
============================================================ */
/* Citizen's card component */
.citizen-card,
.ext-citizen-card {
background: #131720 !important;
border: 1px solid #233042 !important;
border-top: 2px solid #233042 !important;
border-radius: 2px !important;
transition: border-color .15s, background .15s !important;
}
.citizen-card:hover,
.ext-citizen-card:hover {
background: #171c26 !important;
border-color: #2e3f58 !important;
border-top-color: #4fc3e8 !important;
}
/* ============================================================
SECTION 10: CUSTOM EVE.WIKI COMPONENTS
(classes you add manually to wikitext via templates)
============================================================ */
/* -- EVE Stat Grid --
Usage: wrap a wikitable in <div class="evewiki-stat-grid">
---------------------------------------------------------- */
.evewiki-stat-grid {
display: grid !important;
grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
gap: 6px !important;
margin: 10px 0 !important;
}
.evewiki-stat-grid .evewiki-stat {
background: #131720;
border: 1px solid #233042;
border-top: 2px solid #2e3f58;
padding: 8px 10px;
text-align: center;
transition: border-top-color .15s;
}
.evewiki-stat-grid .evewiki-stat:hover {
border-top-color: #4fc3e8;
}
.evewiki-stat .label {
font-family: 'Orbitron', sans-serif;
font-size: 8px;
font-weight: 600;
letter-spacing: 1.5px;
color: #4e5f72;
text-transform: uppercase;
display: block;
margin-bottom: 4px;
}
.evewiki-stat .value {
font-family: 'JetBrains Mono', monospace;
font-size: 18px;
color: #eef3fa;
display: block;
line-height: 1;
}
.evewiki-stat .value.pos { color: #3acc7a; }
.evewiki-stat .value.neg { color: #cc4444; }
.evewiki-stat .value.cyan { color: #4fc3e8; }
.evewiki-stat .value.gold { color: #c8a84b; }
.evewiki-stat .unit {
font-size: 10px;
color: #4e5f72;
margin-left: 2px;
}
/* -- EVE Tag / Chip --
Usage: <span class="evewiki-tag evewiki-tag--cyan">Wormhole</span>
---------------------------------------------------------- */
.evewiki-tag {
display: inline-block;
font-family: 'Rajdhani', sans-serif;
font-size: 10px;
font-weight: 600;
letter-spacing: 1.5px;
text-transform: uppercase;
padding: 2px 8px;
border: 1px solid #233042;
color: #4e5f72;
background: #131720;
vertical-align: middle;
}
.evewiki-tag--cyan {
border-color: #153d50;
color: #4fc3e8;
background: rgba(79,195,232,.06);
}
.evewiki-tag--gold {
border-color: #3a2e12;
color: #c8a84b;
background: rgba(200,168,75,.06);
}
.evewiki-tag--red {
border-color: #3a1a1a;
color: #cc4444;
background: rgba(204,68,68,.06);
}
.evewiki-tag--green {
border-color: #1a3a28;
color: #3acc7a;
background: rgba(58,204,122,.06);
}
/* -- Wave Accordion --
Usage: wrap wave tables in .evewiki-wave-accordion
JS in Common.js handles toggle
---------------------------------------------------------- */
.evewiki-wave {
border: 1px solid #233042;
margin-bottom: 4px;
}
.evewiki-wave-header {
display: flex;
align-items: center;
gap: 8px;
padding: 8px 14px;
background: #171c26;
cursor: pointer;
user-select: none;
transition: background .12s;
font-family: 'Rajdhani', sans-serif;
}
.evewiki-wave-header:hover {
background: #1c2230;
}
.evewiki-wave.is-open .evewiki-wave-header {
background: #0f1218;
border-bottom: 1px solid #233042;
}
.evewiki-wave-num {
font-family: 'Orbitron', sans-serif;
font-size: 9px;
font-weight: 700;
letter-spacing: 2px;
color: #4fc3e8;
background: rgba(79,195,232,.08);
border: 1px solid #153d50;
padding: 2px 8px;
flex-shrink: 0;
}
.evewiki-wave-title {
font-size: 13px;
font-weight: 600;
color: #d7e0ea;
flex: 1;
}
.evewiki-wave-trigger-label {
font-size: 10px;
font-weight: 600;
letter-spacing: .5px;
padding: 2px 7px;
border: 1px solid #3a1a1a;
color: #cc4444;
background: rgba(204,68,68,.06);
}
.evewiki-wave-body {
display: none;
}
.evewiki-wave.is-open .evewiki-wave-body {
display: block;
}
.evewiki-wave-chevron {
color: #4e5f72;
font-size: 10px;
transition: transform .15s;
}
.evewiki-wave.is-open .evewiki-wave-chevron {
transform: rotate(180deg);
}
/* -- Wormhole class color dots --
Usage: <span class="evewiki-wh-dot evewiki-wh-dot--c5"></span>
---------------------------------------------------------- */
.evewiki-wh-dot {
display: inline-block;
width: 8px;
height: 8px;
border-radius: 50%;
border: 1px solid currentColor;
vertical-align: middle;
margin-right: 4px;
}
.evewiki-wh-dot--c1 { background: #4fc3e8; border-color: #4fc3e8; }
.evewiki-wh-dot--c2 { background: #5dc8a0; border-color: #5dc8a0; }
.evewiki-wh-dot--c3 { background: #a0c850; border-color: #a0c850; }
.evewiki-wh-dot--c4 { background: #c8a84b; border-color: #c8a84b; }
.evewiki-wh-dot--c5 { background: #e08040; border-color: #e08040; }
.evewiki-wh-dot--c6 { background: #cc4444; border-color: #cc4444; }
/* -- Notice boxes (custom) --
---------------------------------------------------------- */
.evewiki-notice {
border-left: 3px solid #4fc3e8;
background: rgba(79,195,232,.04);
padding: 10px 14px;
margin: 12px 0;
font-family: 'Rajdhani', sans-serif;
font-size: 14px;
color: #d7e0ea;
}
.evewiki-notice--warn {
border-left-color: #c8a84b;
background: rgba(200,168,75,.04);
}
.evewiki-notice--danger {
border-left-color: #cc4444;
background: rgba(204,68,68,.04);
}
.evewiki-notice-label {
font-family: 'Orbitron', sans-serif;
font-size: 8px;
font-weight: 700;
letter-spacing: 2px;
text-transform: uppercase;
color: #4fc3e8;
display: block;
margin-bottom: 4px;
opacity: .7;
}
.evewiki-notice--warn .evewiki-notice-label { color: #c8a84b; }
.evewiki-notice--danger .evewiki-notice-label { color: #cc4444; }
/* ============================================================
SECTION 11: CITIZEN FOOTER
============================================================ */
#citizen-footer,
.citizen-footer,
#footer {
background: #080a10 !important;
border-top: 1px solid #233042 !important;
color: #4e5f72 !important;
font-family: 'Rajdhani', sans-serif !important;
font-size: 12px !important;
}
#citizen-footer a,
.citizen-footer a,
#footer a {
color: #4e5f72 !important;
transition: color .12s !important;
}
#citizen-footer a:hover,
.citizen-footer a:hover,
#footer a:hover {
color: #4fc3e8 !important;
text-decoration: none !important;
}
/* ============================================================
SECTION 12: RESPONSIVE TWEAKS
============================================================ */
@media (max-width: 860px) {
.evewiki-stat-grid {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
.infobox,
.mw-parser-output .infobox {
float: none !important;
margin: 0 0 16px 0 !important;
max-width: 100% !important;
width: 100% !important;
}
}
@media (max-width: 480px) {
.evewiki-stat-grid {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
h2, .mw-parser-output h2 {
font-size: 15px !important;
}
#firstHeading {
font-size: 22px !important;
}
}
/* ============================================================
SECTION 13: SCROLLBAR STYLING (Webkit)
============================================================ */
::-webkit-scrollbar {
width: 6px;
height: 6px;
}
::-webkit-scrollbar-track {
background: #0d0f14;
}
::-webkit-scrollbar-thumb {
background: #233042;
border-radius: 0;
}
::-webkit-scrollbar-thumb:hover {
background: #2e3f58;
}
/* ============================================================
SECTION 14: SELECTION COLOR
============================================================ */
::selection {
background: rgba(79,195,232,.2);
color: #eef3fa;
}