MediaWiki:Monobook.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.

/* ============================================================
   VoyeurWeb Monobook – MW 1.41 compatibility overrides
   Works on top of the original 2007 monobook-old.css file
   ============================================================ */

/* --- Global dark background + readable text for new elements --- */
html, body,
#globalWrapper,
.mw-body,
.mw-body-content,
.mw-parser-output,
#content,
#bodyContent {
    background: #222 !important;
    color: #ccc !important;
}

/* Make sure all headings stay light */
.mw-parser-output h1,
.mw-parser-output h2,
.mw-parser-output h3,
.mw-parser-output h4,
.mw-parser-output h5,
.mw-parser-output h6 {
    color: #ccc !important;
}

/* Links in new MW output */
.mw-parser-output a {
    color: #ffbbbb !important;
}
.mw-parser-output a:hover {
    color: #ff0000 !important;
}

/* TOC + contents box in new MW */
#toc,
#toc * {
    background: #111 !important;
    color: #ccc !important;
}
#toc {
    border: 1px solid #990000 !important;
}
#toc a {
    color: #ffbbbb !important;
}
#toc a:hover {
    color: #ff0000 !important;
}

/* System message boxes (warnings, errors, success) */
.mw-message-box,
.mw-message-box-error,
.mw-message-box-warning,
.mw-message-box-success {
    background-color: #333 !important;
    color: #ccc !important;
    border: 1px solid #bf0000 !important;
}

/* Category links box at bottom of page */
#catlinks {
    background-color: #330000 !important;
    border-color: #bf0000 !important;
    color: #ccc !important;
}
#catlinks a {
    color: #ffbbbb !important;
}
#catlinks a:hover {
    color: #ff0000 !important;
}

/* --- Left navigation tweaks (newer Monobook/portlet code) --- */
#column-one {
    background: #000 !important;
}
#column-one .portlet,
#column-one .pBody {
    background: #161616 !important;
    color: #ccc !important;
    border: 1px solid #bf0000 !important;
}
#column-one .portlet a {
    color: #ffbbbb !important;
}
#column-one .portlet a:hover {
    color: #ff0000 !important;
}

/* --- Full-width VoyeurWeb header banner --- */
#mw-head-base,
#mw-head {
    background: #000 url(/images/VWwi.png) no-repeat center top !important;
    background-size: contain !important;   /* keep the original aspect */
    height: 140px !important;             /* banner height */
    border-bottom: 1px solid #bf0000 !important;
}

/* Don’t show the small square logo box on top of the banner */
#p-logo {
    display: none !important;
}

/* Personal tools (username / prefs / log out) inside the banner, top-right */
#p-personal {
    position: absolute !important;
    right: 20px !important;
    top: 10px !important;
    margin: 0 !important;
    padding: 0 !important;
    background: none !important;
}

/* Page tabs (Main page / Discussion / Edit / etc.) under the banner */
#p-cactions {
    position: absolute !important;
    left: 75px !important;
    top: 115px !important;    /* bottom edge of the banner */
    margin: 0 !important;
    padding-left: 1em !important;
    z-index: 20 !important;
}

/* Make sure the tabs themselves still look like the old skin */
#p-cactions li a {
    background: #333 !important;
    color: #ccc !important;
    border: 1px solid #990000 !important;
}
#p-cactions li.selected a {
    background: #333 !important;
    color: #ffffff !important;
}

/* Push main content down so it does not overlap the banner/tabs */
#content {
    margin-top: 155px !important;  /* adjust a few px up/down if you like */
}

/* Footer text colors */
#footer {
    background: #333 !important;
    border-top: 1px solid #bf0000 !important;
    color: #ccc !important;
}
#footer a {
    color: #ffbbbb !important;
}
#footer a:hover {
    color: #ff0000 !important;
}