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.

/* === Change the top “ribbon” / navbar background image === */
.navbar.cmln-navbar {
    background-color: #c29b6d !important;
    background-image: url("/images/ribbon.png");
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
    min-height: 124px;
}

/* Adjust padding so content appears below the ribbon */
.navbar.cmln-navbar .container {
    padding-top: 130px;
}
/* ── Top “ribbon” behind the navbar ── */
.skin-chameleon .p-navbar {
  background-color: #f0ebe3 !important;    /* parchment-beige fallback */
  background-image: url("/skins/chameleon/resources/images/ribbon.png") !important;
  background-repeat: no-repeat !important;
  background-position: center top !important;
  background-size: cover !important;
}

/* ── Bottom “ribbon” above the footer ── */
.skin-chameleon footer#footer {
  background-color: transparent !important;
  background-image: url("/skins/chameleon/resources/images/ribbon.png") !important;
  background-repeat: no-repeat !important;
  background-position: center bottom !important;
  background-size: cover !important;
  padding-top: 120px;   /* make room for the ribbon—adjust as needed */
}
/* ── Top ribbon behind the navbar ── */
.skin-chameleon .p-navbar {
  /* Make background transparent so the ribbon shows */
  background-color: transparent !important;
  /* Point to wherever you stored ribbon.png */
  background-image: url("/skins/chameleon/resources/images/ribbon.png") !important;
  /* Or, if you put it in your wiki’s /images folder:
     background-image: url("/images/ribbon.png") !important;
  */
  background-repeat: no-repeat !important;
  background-position: center top !important;
  background-size: cover !important;
}