MediaWiki:Common.css

/* General body styling */ body { background-color: #7B9CC6; /* Medium blue */ font-family: 'Segoe UI', 'Helvetica Neue', Helvetica, Arial, sans-serif; color: #333333; /* Dark grey */ line-height: 1.6; }

/* Content area styling */ position: relative; /* For pseudo-element */ }
 * 1) content, #mw-content-text {

/* Pseudo-element for background image */ content: ''; display: block; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: url('https://png.pngtree.com/background/20210712/original/pngtree-mysterious-cosmic-space-galaxy-nebula-background-picture-image_1179108.jpg'), linear-gradient(to bottom, rgba(255,255,255,0.8), rgba(255,255,255,0.8)); background-size: cover; background-repeat: no-repeat; z-index: 0; pointer-events: none; }
 * 1) content::before, #mw-content-text::before {

position: relative; z-index: 1; }
 * 1) content > *, #mw-content-text > * {

/* Header styling */ background: linear-gradient(to bottom, #0044cc, #000080); /* Subtle gradient from a lighter blue to navy */ color: #FFFFFF; /* White text for contrast */ padding: 20px 40px; /* Uniform padding for a more modern look */ font-family: 'Segoe UI', 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif; /* Modern, clean font */ font-size: 2em; /* Adjust font size as necessary */ text-align: center; /* Centered text */ box-shadow: none; /* No box-shadow for a flatter design */ border: none; /* No border for a modern look */ border-radius: 4px; /* Optional: slight rounding of corners */ }
 * 1) firstHeading {

/* Link styling */ a { color: #1A3D7C; text-decoration: none; }

a:hover { text-decoration: underline; }

/* Sidebar and TOC styling */ background-color: #DAE4F0; border: 1px solid #AAAAAA; padding: 5px; margin-bottom: 10px; }
 * 1) sidebar, #p-navigation, #p-interaction, #p-tb, #p-languages, #p-categories, .toc {

color: #2A4D6E; }
 * 1) p-navigation a, #p-interaction a, #p-tb a, #p-languages a, #p-categories a, .toc a {

.mw-collapsible-toggle { color: #2A4D6E; }

/* Table, Thumbnail, Infobox, Navigation box and News section styling */ table, .thumb, .infobox, .navbox, .news-and-updates { border: 1px solid #AAAAAA; background-color: #F8F8FF; padding: 3px; margin-bottom: 10px; }

/* Footer styling */ background-color: #1A3D7C; color: white; padding: 10px 20px; text-align: center; border-top: 5px solid #FFD700; }
 * 1) footer {

/* Main Page specific styling */ .page-Main_Page #content { padding: 20px; }

/* Main page layout styling */ .page-Main_Page #content { display: grid; grid-template-columns: 3fr 1fr; /* Allocates space for main content and sidebar */ grid-gap: 20px; }

/* Styling for the welcome and introduction sections */ .page-Main_Page #mw-content-text > h2:first-of-type, .page-Main_Page #mw-content-text > p:first-of-type { background-color: #f2f2f2; padding: 10px 20px; border-left: 4px solid #0056b3; margin: 10px 0; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); }

/* Ensure sections span the full width before the news box */ .page-Main_Page #mw-content-text > h2, .page-Main_Page #mw-content-text > p, .page-Main_Page #mw-content-text > ul { grid-column: 1 / -1; }

/* Float the news and updates to the right */ .page-Main_Page .news-and-updates { background-color: #f9f9f9; padding: 15px; border: 1px solid #d3d3d3; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); position: sticky; top: 20px; align-self: flex-start; }

/* Style the news and updates heading */ .page-Main_Page .news-and-updates > h2 { border-bottom: 2px solid #ddd; padding-bottom: 5px; margin-bottom: 10px; }

/* Style the community and interactive elements sections */ .page-Main_Page .community, .page-Main_Page .interactive-elements { background-color: #eef2f7; padding: 10px; margin-bottom: 10px; }

/* Adjust heading style */ .page-Main_Page h2 { color: #333; border-bottom: none; padding-bottom: 0; }

/* Adjust link color for better contrast */ .page-Main_Page a { color: #1a0dab; /* A more standard link color */ }

.page-Main_Page a:hover { text-decoration: underline; }

/* Add some space around each section for better readability */ .page-Main_Page h2, .page-Main_Page p, .page-Main_Page ul, .page-Main_Page .community, .page-Main_Page .interactive-elements { margin: 20px 0; }

.main-page-container { display: flex; flex-wrap: wrap; }

.welcome-introduction { flex-basis: 100%; background-color: #f0f0f0; padding: 20px; border-bottom: 2px solid #d3d3d3; }

.main-content { flex: 1; }

.sections-list, .statistics-list, .community-list { list-style-type: none; padding-left: 0; }

.sections-list li a, .statistics-list li a, .community-list li a { text-decoration: none; color: #1a0dab; padding: 5px 10px; display: inline-block; }

.sections-list li a:hover, .statistics-list li a:hover, .community-list li a:hover { text-decoration: underline; background-color: #e9e9e9; }

.news-and-updates { flex-basis: 300px; margin-left: 20px; padding: 10px; border: 1px solid #d3d3d3; box-shadow: 0 2px 5px rgba(0,0,0,0.2); }

/* Add more styling as needed */