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.

/* CSS placed here will be applied to all skins */

/* Note template styles - wiki-style info boxes */
.note {
  border:1px solid #ccc;
  border-left-width:6px;
  background:#f9f9f9;
  padding:12px 16px;
  margin:1em 0;
  border-radius:4px;
  box-shadow:0 1px 2px rgb(0 0 0 / 0.1);
  font-family:"Segoe UI",Tahoma,Geneva,Verdana,sans-serif;
  font-size:14px;
  line-height:1.4 
}
.note-info {
  border-left-color:#5bc0de;
  background:#d9edf7;
  color:#31708f 
}
.note-error {
  border-left-color:#d9534f;
  background:#f2dede;
  color:#a94442 
}
.note-warn {
  border-left-color:#f0ad4e;
  background:#fcf8e3;
  color:#8a6d3b 
}
.note-reminder {
  border-left-color:#5cb85c;
  background:#dff0d8;
  color:#3c763d 
}
.note-inline {
  display:inline-block;
  padding:2px 6px;
  font-size:90%;
  vertical-align:middle;
  margin:0 0.3em;
  border-radius:3px;
  border-left-width:3px;
  box-shadow:none 
}
.note-inline.note-info {
  border-left-color:#5bc0de;
  background:#e1f0fa;
  color:#31708f 
}
.note-inline.note-error {
  border-left-color:#d9534f;
  background:#f8d7da;
  color:#a94442 
}
.note-inline.note-warn {
  border-left-color:#f0ad4e;
  background:#faf1d6;
  color:#8a6d3b 
}
.note-inline.note-reminder {
  border-left-color:#5cb85c;
  background:#d8e9d1;
  color:#3c763d 
}
:root {
  --bg-main:#f2f9fc;
  --bg-surface:#ffffff;
  --bg-sidebar:#e0f2f9;
  --bg-footer:#cde7f2;
  --bg-tabs:#c0e3f2;
  --border-color:#99cfe5;
  --accent:#339dc3;
  --accent-hover:#247fa3;
  --text-main:#1a1a1a;
  --text-muted:#4d4d4d
}
body,
html {
  margin:0;
  padding:0;
  font-family:"Segoe UI","Helvetica Neue",sans-serif;
  background:var(--bg-main);
  color:var(--text-main);
  line-height:1.6
}
#mw-panel {
  background-color:none;
  border-right:none;
  padding-top:1em
}
#p-logo {
  background:none;
  margin-bottom:1em
}
.vector-menu h3 {
  color:var(--accent);
  font-weight:bold;
  padding:0.5em 1em
}
.vector-menu-portal ul {
  list-style:none;
  padding-left:1em
}
.vector-menu-portal li a {
  display:block;
  padding:0.3em 0.5em;
  color:var(--accent);
  border-radius:4px
}
.vector-menu-portal li a:hover {
  background:var(--bg-tabs);
  color:var(--accent-hover)
}
#footer {
  padding:2em;
  text-align:center;
  font-size:0.9em;
  color:var(--text-muted)
}
.wikitable,
table.infobox {
  border:1px solid var(--border-color);
  background:var(--bg-surface);
  color:var(--text-main);
  margin:1em 0;
  width:100%
}
#firstHeading {
  color:var(--accent);
  font-size:1.8em;
  margin-bottom:0.5em
}
h1,
h2,
h3,
h4,
h5,
h6 {
  color:var(--accent);
  margin-top:1.5em;
  margin-bottom:0.6em
}
a {
  color:var(--accent);
  text-decoration: underline dotted;
  }
a:hover {
  color:var(--accent-hover);
  text-decoration:underline;
}
@media screen and (max-width:768px) {
  #mw-panel {
    padding:0.5em
  }
  #searchform {
    flex-direction:column
  }
  #content,
  .mw-body {
    padding:1em
  }
}