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.

/* Clear Vector skin defaults */
.mw-body, .skin-vector .mw-body, .mw-page-container {
    background: none !important;
    background-color: transparent !important;
}

/* Base body styles */
body.skin-vector {
    background-color: #1a1a1a !important;
    color: #e0e0e0 !important;
    font-family: 'Georgia', serif !important;
}

/* Main Page with image and overlay */
body.skin-vector.page-Main_Page {
    background-color: #1a1a1a !important;
    background-image: url('https://sunderingthegodswiki.com/images/e/e4/STG_Wiki_Background.jpg') !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: cover !important;
    background-attachment: fixed !important;
}

body.skin-vector.page-Main_Page::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.4); /* Adjust opacity (0.2 to 0.6) as needed */
    z-index: -1;
}

/* Flexbox layout for content and infobox */
.mw-parser-output {
    display: flex; /* Creates a flex container */
    flex-wrap: wrap; /* Allows wrapping if content exceeds width */
    color: #FFFFFF !important; /* White text for dark background */
}
.mw-parser-output h2, .mw-parser-output h3, .mw-parser-output h4, .mw-parser-output h5, .mw-parser-output h6 {
    color: #FFFFFF !important; /* White headings for dark background */
}
.infobox {
    width: 22em; /* Matches template width */
    margin: 0 0 1em 1em; /* Bottom and left margin */
    order: 2; /* Places infobox after main content in flex order */
}
.mw-parser-output > :not(.infobox) {
    flex: 1; /* Allows main content to take remaining space */
    min-width: 0; /* Prevents overflow issues */
    margin-right: 1em; /* Space between content and infobox */
}