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.
@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;700&display=swap');
/* ─────────────────────────────────────────────────────────
Base & Background
───────────────────────────────────────────────────────── */
html, body {
margin: 0;
padding: 0;
font-family: 'Cinzel', Georgia, serif;
background: url('/images/wiki_background.png') center center fixed no-repeat;
background-size: cover;
color: #333;
}
/* ─────────────────────────────────────────────────────────
Header (full width)
───────────────────────────────────────────────────────── */
#mw-head {
clear: both;
background: #4B0082;
border-bottom: 3px solid #F28C28;
padding: 0.75em 2em;
position: relative;
z-index: 20;
}
#p-personal, #p-search {
background: rgba(255,255,255,0.9);
border-radius: 6px;
padding: 0.5em 1em;
margin: 0.5em;
}
#p-personal a, #p-search a {
color: #4B0082 !important;
text-decoration: none;
}
#p-personal a:hover, #p-search a:hover {
color: #E67E22 !important;
}
/* ─────────────────────────────────────────────────────────
Sidebar (float layout)
───────────────────────────────────────────────────────── */
#mw-panel {
float: left;
width: 260px;
margin: 1.5em;
background: rgba(255,255,255,0.95);
padding: 1em;
border-radius: 8px;
box-shadow: 0 3px 10px rgba(0,0,0,0.2);
z-index: 10;
}
/* ─────────────────────────────────────────────────────────
Main Content (cleared float)
───────────────────────────────────────────────────────── */
#content {
margin: 1.5em 2em 2em calc(260px + 1.5em);
background: rgba(255,255,255,0.95);
padding: 2em;
border-radius: 8px;
box-shadow: 0 3px 12px rgba(0,0,0,0.1);
overflow: visible;
clear: right;
}
/* Ensure the inner content area text aligns properly */
#mw-content-text {
margin: 0;
padding: 0;
}
/* ─────────────────────────────────────────────────────────
Headings & Links
───────────────────────────────────────────────────────── */
h1, h2, h3, h4 {
font-family: 'Cinzel', serif;
color: #C0392B;
margin-top: 1em;
margin-bottom: 0.5em;
}
a {
color: #229C88;
text-decoration: none;
}
a:hover {
color: #D645B1;
text-decoration: underline;
}
/* ─────────────────────────────────────────────────────────
Tables (RPG‑style)
───────────────────────────────────────────────────────── */
table.wikitable {
width: 100%;
border-collapse: collapse;
margin: 1.5em 0;
background: transparent;
}
table.wikitable caption {
background: #4B0082;
color: #fff;
padding: 0.5em;
font-weight: bold;
text-align: center;
}
table.wikitable th {
background: #E0D6F9;
color: #222;
border: 1px solid #ccc;
padding: 0.75em;
text-align: center;
}
table.wikitable td {
background: transparent;
border: 1px solid #ccc;
padding: 0.75em;
vertical-align: top;
}
/* ─────────────────────────────────────────────────────────
Footer (full width)
───────────────────────────────────────────────────────── */
#footer {
clear: both;
background: #4B0082;
color: #eee;
padding: 1em 2em;
text-align: center;
border-top: 2px solid #D645B1;
position: relative;
z-index: 20;
}
#footer a {
color: #ddd !important;
margin: 0 0.5em;
font-size: 0.9em;
}
#footer a:hover {
color: #fff !important;
text-decoration: underline;
}
/* ─────────────────────────────────────────────────────────
Responsive: stack sidebar + content
───────────────────────────────────────────────────────── */
@media (max-width: 900px) {
#mw-head, #footer {
padding: 1em;
}
#mw-panel, #content {
float: none;
margin: 1em !important;
width: auto !important;
}
#content {
margin-top: 0;
}
}