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

/* Customizing Citizen Skin */

/* Overall Background and Text Color */
body {
    background-color: #000000; /* Black background */
    color: #90FF90; /* Light green text */
}

/* Header Customization */
#header,
#masthead {
    background-color: #4B0000; /* Dark maroon header background */
    color: #FFFFFF; /* White text color */
}

/* Navigation Bar Customization */
#navbar {
    background-color: #3C3C3C; /* Dark grey for navigation bar */
    border-bottom: 2px solid #B22222; /* Dark red highlight color */
}

#navbar a,
#navbar .selected {
    color: #FFFFFF; /* White links in navigation */
}

#navbar a:hover {
    color: #90FF90; /* Light green on hover */
}

/* Footer Customization */
#footer {
    background-color: #4B0000; /* Dark maroon for footer */
    color: #FFFFFF; /* White text color */
}

/* Button Customization */
button,
input[type="button"] {
    background-color: #B22222; /* Dark red button background */
    color: #FFFFFF; /* Button text color */
    border-radius: 5px;
}

/* Text Area and Input Field Customization */
textarea,
input[type="text"],
input[type="password"],
input[type="email"],
input[type="url"],
input[type="search"],
input[type="tel"] {
    background-color: #1C1C1C; /* Dark background for fields */
    color: #FFFFFF; /* White text color for input fields */
    border: 1px solid #4B0000; /* Dark maroon border */
    padding: 8px; /* Padding for comfort */
    border-radius: 4px; /* Rounded corners */
    font-family: monospace; /* Monospace font for consistency */
}

/* Table Styles */
table {
    width: 100%;
    border-collapse: collapse;
}

table th, 
table td {
    border: 1px solid #4B0000; /* Dark maroon border for tables */
    padding: 8px;
}

table th {
    background-color: #3C3C3C; /* Dark grey for table headers */
    color: #FFFFFF; /* White text for headers */
}

/* Links */
a {
    color: #90FF90; /* Light green link color */
    text-decoration: none; /* Remove underline */
}

a:hover {
    color: #FF4500; /* Red-orange on hover */
    text-decoration: underline; /* Underline on hover */
}

/* Customizing Code Blocks */
pre,
code {
    background-color: #1C1C1C; /* Dark background for code */
    color: #FFFFFF; /* White text for code */
    padding: 10px;
    border-radius: 5px;
    overflow: auto; /* Ensures long lines are scrollable */
}

/* Highlighting Code Syntax (optional, if using a syntax highlighter) */
code {
    font-family: monospace; /* Monospace font for code */
}

/* Media Queries for Responsiveness */
@media (max-width: 600px) {
    #navbar {
        font-size: 14px; /* Smaller font size on mobile */
    }

    body {
        padding: 10px; /* Padding for mobile */
    }
}