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)
• Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.

/* ==========================================================================
   OSRS EXACT REPLICA DESIGN SYSTEM
   ========================================================================== */

/* Custom Fonts */
@font-face {
    font-family: 'Kingthings Petrock';
    src: url('/resources/assets/fonts/Kingthings_Petrock.woff2') format('woff2');
}
@font-face {
    font-family: 'League Spartan';
    src: url('/resources/assets/fonts/LeagueSpartan-Bold.woff2') format('woff2');
}
@font-face {
    font-family: 'Museo Sans';
    src: url('/resources/assets/fonts/MuseoSans-500.woff2') format('woff2');
}
@font-face {
    font-family: 'RuneScape Chat';
    src: url('/resources/assets/fonts/RuneScape-Chat.woff2') format('woff2');
}

/* Base Body Override */
body {
    background: url('/resources/assets/background_stone.png') repeat !important;
    background-color: #2b2b2b !important;
    font-family: 'Museo Sans', Arial, sans-serif;
}

/* Content Parchment Container */
#content {
    background: url('/resources/assets/background_parchment.png') repeat #f1e7d3 !important;
    border: 3px solid #3d2b1f !important;
    border-radius: 4px;
    margin-top: 15px;
}

#mw-content-text {
    background-color: transparent !important;
}

/* Header Styling */
h1, h2, h3, h4, h5, h6 {
    font-family: 'Kingthings Petrock', serif;
    color: #4a3c28;
    border-bottom: 1px solid #b3a07d; /* Gold trim */
}

/* Margin Collapse Fix for Nested Lists/Tables in columns */
.mw-parser-output .column-grid > * {
    margin-top: 0;
}
.mw-parser-output .column-grid > *:last-child {
    margin-bottom: 0;
}

/* Responsive Scaling */
@media screen and (max-width: 980px) {
    #content { margin: 10px; border-width: 2px; }
}

/* Reader Mode */
body.reader-mode-active #mw-panel,
body.reader-mode-active #mw-head {
    display: none;
}
body.reader-mode-active #content {
    margin-left: auto;
    margin-right: auto;
    max-width: 960px;
    padding: 40px;
}