Jump to content

Main Page

From Adaris
Revision as of 04:09, 8 September 2024 by Oros (talk | contribs)

/* General styling for boxes and headings */ .mp-box { border: 1px solid #a39171; /* A soft, warm earthy border */ padding: 0 0.5em 0.5em; margin-top: 2px; background-color: #faf3e3; /* Light parchment-like background for a magical, old-world feel */ }

.mp-h2, .skin-timeless .mp-h2 { border: 1px solid #a39171; /* Soft earthy borders */ margin: 0.5em 0; padding: 0.4em 0.6em; font-size: 120%; font-weight: bold; font-family: inherit; color: #594a35; /* A deep, brownish text color */ background-color: #e1d3b5; /* Muted gold for heading backgrounds */ }

/* Less prominent text */ .mp-later { font-size: 85%; font-weight: normal; color: #7d6f54; /* Muted brown for minor text */ }

/* Welcome text at the top */

  1. mp-welcomecount {

text-align: center; margin: 0.4em; }

  1. mp-welcome {

font-size: 162%; padding: 0.1em; color: #594a35; /* Deep brown for the welcome text */ }

  1. mp-welcome h1,
  2. mp-welcome .mw-heading1 {

font-size: inherit; font-family: inherit; display: inline; border: none; }

  1. mp-free {

font-size: 95%; color: #7a6a50; /* Muted brown to suggest nature and harmony */ }

  1. articlecount {

font-size: 85%; color: #7d6f54; /* Slightly softer brown for article count */ }

/* Clear floats */ .mp-contains-float::after { content: ""; display: block; clear: both; }

/* Flexbox for layout on larger screens */ @media (min-width: 875px) { #mp-upper { display: flex; }

#mp-left { flex: 1 1 55%; margin-right: 2px; }

#mp-right { flex: 1 1 45%; margin-left: 2px; } }

/* Color scheme for specific sections */ @media screen { #mp-topbanner { background-color: #faf3e3; /* Light parchment background */ border-color: #a39171; /* Soft earthy border */ }

#mp-banner { background-color: #e1d3b5; /* Muted gold background */ border-color: #c7b28e; /* Soft gold border */ }

#mp-left { background-color: #f7efe3; /* Lighter beige for the left column */ border-color: #a39171; /* Soft earthy border */ }

#mp-left .mp-h2 { background-color: #e9ddc3; /* Soft beige for a natural vibe */ border-color: #b9a583; /* Darker beige border */ color: #594a35; /* Deep brown for text */ }

#mp-right { background-color: #faf3e3; /* Muted parchment for an enchanted look */ border-color: #a39171; /* Soft gold for contrast */ }

#mp-right .mp-h2 { background-color: #e1d3b5; /* Muted gold for a soft, readable feel */ border-color: #b09d7b; /* Darker beige for contrast */ }

#mp-middle { background-color: #f4f0e6; /* Parchment-like background for a classic fantasy vibe */ border-color: #a39171; /* Warm earthy touch */ }

#mp-lower { background-color: #f7efe3; /* Pale beige for the lower section */ border-color: #c7b28e; /* Soft beige border */ }

#mp-bottom { border-color: #a39171; /* Soft brownish border for the bottom */ }

#mp-bottom .mp-h2 { background-color: #f0e6d8; /* Soft parchment background */ border-color: #b09d7b; /* Warm brown border */ } }

/* Dark mode color scheme */ html.skin-theme-clientpref-night #mp-topbanner { background-color: #333333; border-color: #676767; }

html.skin-theme-clientpref-night #mp-banner { background-color: #3b3b3b; border-color: #5c5c5c; }

html.skin-theme-clientpref-night #mp-left { background-color: #2f2f2f; border-color: #4a4a4a; }

html.skin-theme-clientpref-night #mp-right { background-color: #2f2f2f; border-color: #4a4a4a; }

html.skin-theme-clientpref-night #mp-lower { background-color: #3b3b3b; border-color: #5c5c5c; }

/* Button-like styling for "Read the full article" and "Explore More" links */ .explore-more { margin-top: 15px; clear: both; display: flex; justify-content: center; }

.explore-more p a, .read-more a { font-size: 1.2em; font-weight: bold; color: #594a35; /* Deep brown for links */ text-decoration: none; padding: 10px 15px; background-color: #e1d3b5; /* Soft parchment background */ border: 2px solid #b09d7b; /* Darker brown border */ border-radius: 10px; display: inline-block; text-align: center; transition: background-color 0.3s, color 0.3s; }

.explore-more p a:hover, .read-more a:hover { background-color: #b09d7b; /* Darker beige on hover */ color: #ffffff; /* White text on hover */ }

/* Featured picture container styling */

  1. mp-tfp {

border: 1px solid #b09d7b; /* Border for the featured image container */ padding: 10px; border-radius: 5px; background-color: #faf3e3; /* Light parchment background */ text-align: center; }

/* Featured caption styling */ .featured-caption { margin-top: 10px; font-size: 0.9em; color: #594a35; /* Deep brown */ text-align: center; font-style: italic; }

/* Ensure layout stays in two columns */ @media (min-width: 875px) { #mp-upper { display: flex; justify-content: space-between; } }