MediaWiki:Common.css

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

.w-100 { width:100% } .justify-center { justify-content:center }

.flex { display: flex }

.inline-flex { display: inline-flex }

.flex-auto { flex: 1 1 auto; min-width: 0; min-height: 0 }

.flex-none { flex: none }

.flex-column { flex-direction: column }

.flex-row { flex-direction: row }

.flex-wrap { flex-wrap: wrap }

.flex-nowrap { flex-wrap: nowrap }

.flex-wrap-reverse { flex-wrap: wrap-reverse }

.flex-column-reverse { flex-direction: column-reverse }

.flex-row-reverse { flex-direction: row-reverse }

/* spoiler hover */ .spoiler { filter: blur(4px); } .spoiler:hover { filter: blur(0); }

/* Remove external link icons */ a.external.text { background: none; padding-right: 0; }

/* Tabs */ .tabContainer { display: flex; flex-wrap: wrap; padding: 1em; justify-content: center; gap: .2em; } .tabContainer > div { border: 1px solid transparent; background-color: #EAECF0; color: black; padding: 0.2em .4em 0.2em; margin-right: 5px; border-radius: 3px; }

/* Infobox styling */ .portable-infobox .pi-header a { text-decoration: none; border-bottom: 1px dotted; }

.portable-infobox { width: 340px; }

.portable-infobox .pi-title { text-align: center; }

.portable-infobox .pi-image-thumbnail { max-width: 340px; height: auto; }

.portable-infobox .pi-item-spacing { padding: 3px 10px; border: 0px; }

/* Remove main page title */ body.page-NU_carnival_Wiki h1#firstHeading, body.page-NU_carnival_Wiki #siteSub, body.page-NU_carnival_Wiki #contentSub, body.page-NU_carnival_Wiki #contentSub2 { display: none; }

.menulink a:link{ color:#FFFFFF; }

/* Navigation */

.mp-section { display: flex; flex-direction: row; flex-wrap: wrap; gap: 0 1.5em; }

.mp-section > div { max-width: 100%; }

.mp-section > .mp-flex-1-1 { flex-grow: 1; flex-shrink: 1; }

.mp-section > .mp-flex-2-1 { flex-grow: 2; flex-shrink: 1; }

.mp-section > .mp-flex-basis-200 { flex-basis: 200px; }

.mp-section > .mp-flex-basis-300 { flex-basis: 300px; }

/* */

.mw-parser-output .mp-navigation{ margin-bottom:1.5em; display:grid; grid-gap:20px; grid-template-columns:repeat(auto-fill,minmax(12em,auto)) } .mw-parser-output .mp-nav-button{ border:1px solid #2FD9E3; background-color:rgba(47,217,227,0.1) } .mw-parser-output .mp-link{ border:1px solid #2FD9E3; background-color:rgba(47,217,227,0.1) } @media only screen and (max-width:576px){ .mw-parser-output .mp-navigation{ grid-template-columns:repeat(3,12em)!important; grid-template-rows:repeat(5,3em); overflow-x:scroll } } body.skin-citizen .mw-parser-output .mp-nav-button{ background-color:#F9FAFB; border:1px solid #EAECF0; border-radius:8px } body.skin-citizen .mw-parser-output .mp-nav-button:hover{ background-color:#EAECF0; border:1px solid #C7CCD1; transition:0.15s ease-in-out } body.skin-citizen .mw-parser-output .mp-nav-button a{   color:#54595D; }

/* Navigation button */ .mp-nav-button { display: inline-block; position: relative; height: 3em; box-sizing: border-box; }

.mp-nav-button a { display: inline-block; position: relative; z-index: 1; width: 100%; height: 100%; padding: 0.6em 0 0.6em 48px; box-sizing: border-box; }

.mp-nav-button img { position: absolute; left: 15px; top: 0.8em; }