MédiaWiki:Common.css

De Inkipédia
Specdep icon.png
Cette page a été marquée pour suppression.
La raison invoquée est use MediaWiki:Common.css

Veuillez utiliser la page de discussion de l'article si vous souhaitez discuter ou contester la suppression.

Administrateurs : Veuillez consulter la page de discussion pour toute discussion à ce sujet. N'oubliez pas de supprimer tous les redirections, liens et transclusions relatifs à cette page si elle est supprimée.

/* MediaWiki:Interwiki.css - for favicons and styling relating to interwiki */ @import url("https://splatoonwiki.org/wiki/MediaWiki:Interwiki.css?action=raw&ctype=text/css");

/* MediaWiki:Rights.css - for username color highlights depending on rights level */ @import url("https://splatoonwiki.org/wiki/MediaWiki:Rights.css?action=raw&ctype=text/css");

/* MediaWiki:Backgrounds.css - for background URL styling classes */ @import url("https://splatoonwiki.org/wiki/MediaWiki:Backgrounds.css?action=raw&ctype=text/css");

/* MediaWiki:SiteColor.css - for Template:SiteColor classes */ @import url("https://splatoonwiki.org/wiki/MediaWiki:SiteColor.css?action=raw&ctype=text/css");

/* Importing font used elsewhere on the site */ @import URL("https://fonts.googleapis.com/css?family=Quantico:700"); @import url('https://fonts.googleapis.com/css2?family=Acme&display=swap');

/* Remember, anything here applies to all skins. */

root {
 --global-footer: url("https://cdn.wikimg.net/en/splatoonwiki/images/0/06/Footer-mask.png");
 --global-stripes: url("https://cdn.wikimg.net/en/splatoonwiki/images/9/9a/Inkipedia_background_S3.svg") !important;

}

/* Causes MediaWiki:Tagline to display */ .mw-body #siteSub {

 display: block;

}

/* Hide licensing menu on Special:Upload */ .mw-htmlform-field-Licenses, .mw-upload-editlicenses {

 display: none;

}

/* Enable custom list style types */ div.note-list ol.references {

 list-style-type: inherit;

}

/* Prevent list items in columns from breaking into the next column */ .list-columns li {

 page-break-inside: avoid;

}

/* Allow limiting of which header levels are shown in a TOC.

, for instance, will limit to showing ==headings== and ===headings=== but no further. */

.toclimit-2 .toclevel-1 ul, .toclimit-3 .toclevel-2 ul, .toclimit-4 .toclevel-3 ul, .toclimit-5 .toclevel-4 ul {

 display: none;

}

/* Prevents some things from displaying on the main page */ body.page-Main_Page #ca-delete, body.page-Main_Page #ca-move, body.page-Main_Page #deleteconfirm, body.page-Main_Page #siteSub, body.page-Main_Page #contentSub, body.page-Main_Page h1.firstHeading, body.page-Main_Page_S2 #ca-delete, body.page-Main_Page_S2 #ca-move, body.page-Main_Page_S2 #deleteconfirm, body.page-Main_Page_S2 #siteSub, body.page-Main_Page_S2 h1.firstHeading {

 display: none !important;

}

/* For things that should only appear when printed. Used in gear checklists. */ .onlyprint {

 display: none;

}

/* Use sans-serif font for optimal display of some languages. This helps templates that use the 'lang' attribute, like Template:Localized name and Template:NewsDialogue. zh = Chinese, ja = Japanese, ko = Korean. */

lang(zh),
lang(ja),
lang(ko) {
 font-family: sans-serif;

}

/* Fix issue where top margin looks problematic within a sublist. Issue impacts all skins. */ li>ul:first-child, li>ol:first-child {

 margin-top: 0;

}

/*==================================================

 LINKS

==================================================*/

/* Links' color */ a:link, a:hover, a:active, div#mw-panel a:link, div.vector-menu-content li a:link, div.vector-menu-content ul.vector-menu-content-list li.selected a:link, li a:hover {

 color: var(--link-internal, #378B00);

}

/* Visited links' color */ a:visited, a:visited:hover, div#mw-panel a:visited, div.vector-menu-content li a:visited, div.vector-menu-content ul.vector-menu-content-list li.selected a:visited, li a:visited:hover {

 color: var(--link-visited, var(--link-internal, #378B00));

}

/* Underline links when hovering over */ a:hover {

 text-decoration: underline;

}

/* Non-existent page link color (i.e. red links) */ div.vector-menu-content li.new a, div.vector-menu-content li.new a:visited, div.vector-menu-content li.new a, div.vector-menu-content li.new, a.new,

  1. p-personal a.new,

a.new {

 color: var(--link-missing, #BA0000);

}

/*==================================================

 INPUT

==================================================*/

/* text input */ .oo-ui-textInputWidget.oo-ui-widget-enabled:hover .oo-ui-inputWidget-input:focus {

 border-color: var(--selected, #3366cc);

}

.oo-ui-textInputWidget.oo-ui-widget-enabled .oo-ui-inputWidget-input:focus {

 border-color: var(--selected, #3366cc);
 box-shadow: inset 0 0 0 1px var(--shadow, #3366cc);

}

/* dropdown menu */ .oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle:focus {

 border-color: var(--selected, #3366cc);
 box-shadow: inset 0 0 0 1px var(--shadow, #3366cc);

}

.oo-ui-menuOptionWidget.oo-ui-optionWidget-selected {

 color: var(--ui-main-theme, #008B2A);
 background-color: var(--page, #EBFFEC);

}

.oo-ui-menuOptionWidget.oo-ui-optionWidget-selected.oo-ui-menuOptionWidget.oo-ui-optionWidget-highlighted, .oo-ui-menuOptionWidget.oo-ui-optionWidget-pressed.oo-ui-menuOptionWidget.oo-ui-optionWidget-highlighted {

 color: var(--ui-main-theme, #008B2A);
 background-color: var(--ui-main-theme-b, rgba(0, 139, 42, 0.1));

}

/* primary button */ .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive>.oo-ui-buttonElement-button {

 background-color: var(--ui-main-theme, #008B2A);
 border-color: var(--border, #008B2A);

}

.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive>.oo-ui-buttonElement-button:hover {

 background-color: var(--ui-main-theme, #378B00);
 /* Fallback not checked */
 border-color: var(--page, #378B00);

}

.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive>.oo-ui-buttonElement-button:active, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive>.oo-ui-buttonElement-button:active:focus, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-buttonElement-pressed>.oo-ui-buttonElement-button, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-buttonElement-active>.oo-ui-buttonElement-button, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-popupToolGroup-active>.oo-ui-buttonElement-button {

 background-color: var(--ui-main-theme, #006400);
 border-color: var(--border, #006400);

}

.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive>.oo-ui-buttonElement-button:focus {

 border-color: var(--border, #008B2A);
 box-shadow: inset 0 0 0 1px var(--border, #008B2A), inset 0 0 0 2px var(--input, #fff);

}

/* secondary button */ .oo-ui-buttonElement-framed.oo-ui-widget-enabled>.oo-ui-buttonElement-button:focus {

 border-color: var(--border, #008B2A);
 box-shadow: inset 0 0 0 1px var(--border, #008B2A);

}

/* recent changes buttons */ .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-buttonElement-active>.oo-ui-buttonElement-button {

 color: var(--ui-main-theme, #006400);
 border-color: var(--border, #006400);

}

.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-buttonElement-active>.oo-ui-buttonElement-button:focus {

 border-color: var(--border, #008B2A);
 box-shadow: inset 0 0 0 1px var(--border, #008B2A), inset 0 0 0 2px var(--input, #fff);

}

/* checkbox */ .oo-ui-checkboxInputWidget {

 /* Fix checkboxes' containers being displayed away from the check */
 display: flex;

}

.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox'] {

 /* Fix checks not appearing by inheriting opacity 0 */
 opacity: 0.75;

}

.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:focus+span {

 border-color: var(--border, #008B2A);
 box-shadow: inset 0 0 0 1px var(--border, #008B2A);

}

.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:hover+span {

 border-color: var(--ui-main-theme, #378B00);
 /* Fallback not checked */

}

.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:active+span {

 background-color: var(--ui-main-theme, #006400);
 border-color: var(--border, #006400);
 box-shadow: inset 0 0 0 1px var(--ui-main-theme, #006400);

}

.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:checked+span, .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:indeterminate+span {

 background-color: var(--ui-main-theme, #008B2A);
 border-color: var(--border, #008B2A);

}

.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:checked:focus+span, .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:indeterminate:focus+span {

 background-color: var(--ui-main-theme, #008B2A);
 border-color: var(--border, #008B2A);
 box-shadow: inset 0 0 0 1px var(--selected, #36c), inset 0 0 0 2px var(--ui-main-theme, #008B2A);

}

.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:checked:hover+span, .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:indeterminate:hover+span {

 background-color: var(--ui-main-theme, #378B00);
 border-color: var(--ui-main-theme, #378B00);
 /* Fallback not checked */

}

.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:checked:active+span, .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:indeterminate:active+span {

 background-color: var(--ui-main-theme, #006400);
 border-color: var(--border, #006400);
 box-shadow: inset 0 0 0 1px var(--ui-main-theme, #006400);

}

/* radio button */ .oo-ui-radioInputWidget.oo-ui-widget-enabled [type='radio']:hover+span {

 border-color: var(--ui-main-theme, #378B00);
 /* Fallback not checked */

}

.oo-ui-radioInputWidget.oo-ui-widget-enabled [type='radio']:active+span {

 background-color: var(--ui-main-theme, #006400);
 border-color: var(--border, #006400);

}

.oo-ui-radioInputWidget.oo-ui-widget-enabled [type='radio']:checked+span {

 border-color: var(--border, #008B2A);

}

.oo-ui-radioInputWidget.oo-ui-widget-enabled [type='radio']:checked:hover+span {

 border-color: var(--ui-main-theme, #378B00);
 /* Fallback not checked */

}

.oo-ui-radioInputWidget.oo-ui-widget-enabled [type='radio']:checked:active+span {

 border-color: var(--border, #006400);
 box-shadow: inset 0 0 0 1px var(--ui-main-theme, #006400);

}

.oo-ui-radioInputWidget.oo-ui-widget-enabled [type='radio']:checked:active+span:before {

 border-color: var(--border, #006400);

}

/* ReplaceText widget */ .oo-ui-messageWidget.oo-ui-messageWidget-block.oo-ui-flaggedElement-warning {

 background-color: var(--page);
 border-color: var(--ui-warning);

}

/*==================================================

 BOXES

==================================================*/

.widget {

 background-image: url("//cdn.wikimg.net/en/splatoonwiki/images/2/26/Amiibo_main_bg.png");
 box-shadow: 0px 0px 15px var(--page, white) inset;
 width: 25%;
 border-style: solid;
 border-color: var(--divider, #AADC00);
 border-radius: 10px;
 border-width: 10px 1px 10px 1px;
 padding: 15px;
 margin: 5px;

}

.widget1 {

 background-image: url("//cdn.wikimg.net/en/splatoonwiki/images/2/26/Amiibo_main_bg.png");
 box-shadow: 0px 0px 15px var(--page, white) inset;
 width: 75%;
 border-style: solid;
 border-color: var(--divider, #AADC00);
 border-radius: 10px;
 border-width: 10px 1px 10px 1px;
 padding: 15px;
 margin: 5px;

}

.widget2 {

 background-image: url("//cdn.wikimg.net/en/splatoonwiki/images/2/26/Amiibo_main_bg.png");
 box-shadow: 0px 0px 15px var(--page, white) inset;
 width: 100%;
 border-style: solid;
 border-color: var(--divider, #AADC00);
 border-radius: 10px;
 border-width: 10px 1px 10px 1px;
 padding: 15px;
 margin: 5px;

}

.widget3 {

 background-image: url("//cdn.wikimg.net/en/splatoonwiki/images/6/62/S2_Fes_Main_BG3.png");
 box-shadow: 0px 0px 25px var(--shadow, black) inset;
 overflow: hidden;
 width: 100%;
 border-style: solid;
 border-color: var(--divider, #13EB92);
 border-radius: 10px;
 border-width: 10px 1px 10px 1px;
 padding: 15px;
 margin: 5px;

}

.widget4 {

 background-image: url("//cdn.wikimg.net/en/splatoonwiki/images/2/26/Amiibo_main_bg.png");
 box-shadow: 0px 0px 15px var(--page, white) inset;
 width: 100%;
 border-style: solid;
 border-color: #FF8000;
 border-radius: 10px;
 border-width: 10px 1px 10px 1px;
 padding: 15px;
 margin: 5px;

}

.widget5 {

 background-image: url("//cdn.wikimg.net/en/splatoonwiki/images/2/26/Amiibo_main_bg.png");
 box-shadow: 0px 0px 15px var(--page, white) inset;
 width: 50%;
 border-style: solid;
 border-color: var(--divider, #AADC00);
 border-radius: 10px;
 border-width: 10px 1px 10px 1px;
 padding: 15px;
 margin: 5px;

}

.widget6 {

 background-image: url("//cdn.wikimg.net/en/splatoonwiki/images/2/26/Amiibo_main_bg.png");
 box-shadow: 0px 0px 15px var(--page, white) inset;
 width: 100%;
 border-style: solid;
 border-color: var(--body-2, #424242);
 border-radius: 10px;
 border-width: 10px 1px 10px 1px;
 padding: 15px;
 margin: 5px;

}

.widgett {

 background-image: url("//cdn.wikimg.net/en/splatoonwiki/images/2/26/Amiibo_main_bg.png");
 box-shadow: 0px 0px 15px var(--page, white) inset;
 width: 97%;
 border-style: solid;
 border-color: var(--divider, #AADC00);
 border-radius: 10px;
 border-width: 10px 0 10px 0;
 position: relative;
 padding: 15px;

}

.btextwidget {

 background-color: rgba(255, 255, 255, 0.5);
 border-color: rgba(255, 255, 255, 0.7);
 border-style: solid;
 border-width: 2px;
 border-radius: 10px;
 text-align: center;
 font-size: 24px;
 font-weight: 600;
 position: relative;

}

  1. widcontent {
 justify-content: center;
 display: flex;
 display: -webkit-flex;

}

.textwidget, .cd {

 padding: 5px;
 background-color: rgba(255, 255, 255, 0.5);
 border-color: rgba(255, 255, 255, 0.7);
 border-style: solid;
 border-width: 2px;
 border-radius: 10px;
 text-align: center;
 position: relative;
 overflow: hidden;

}

  1. tex2 {
 margin-left: 25%;

}

  1. widgfa {
 position: relative;
 left: 1.5%;
 max-width: 85%;

}

.infobox {

 background-color: var(--ui-main-theme-b, rgba(140, 220, 0, 0.1));
 width: 25%;
 border-radius: 10px;
 padding: 10px;
 border-style: solid;
 border-color: var(--divider, #AADC00);
 border-width: 10px 1px 10px 1px;

}

.infobox1 {

 background-color: var(--ui-main-theme-b, rgba(140, 220, 0, 0.3));
 border-style: solid;
 border-color: var(--ui-main-theme, rgba(140, 220, 0, 0.5));
 border-width: 1px 1px 1px 5px;
 border-radius: 5px;
 color: var(--input-text, #190707);
 font-size: 115%;
 padding: 1em;
 margin: 5px;

}

.infobox td {

 padding: 5px;

}

.infobox td b {

 padding: 6px;
 background: -moz-linear-gradient(left, var(--ui-main-theme-b, rgba(140, 220, 0, 0.3)) 0%, var(--input-text, #190707) 100%);
 background: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(140, 220, 0, 0.3)), color-stop(100%, var(--input-text, #190707)));
 background: -webkit-linear-gradient(left, var(--ui-main-theme-b, rgba(140, 220, 0, 0.3)) 0%, var(--input-text, #190707) 100%);
 background: -o-linear-gradient(left, var(--ui-main-theme-b, rgba(140, 220, 0, 0.3)) 0%, var(--input-text, #190707) 100%);
 background: -ms-linear-gradient(left, var(--ui-main-theme-b, rgba(140, 220, 0, 0.3)) 0%, var(--input-text, #190707) 100%);
 background: linear-gradient(to right, var(--ui-main-theme-b, rgba(140, 220, 0, 0.3)) 0%, var(--input-text, #190707) 100%);
 border-style: solid;
 border-color: var(--ui-main-theme, rgba(140, 220, 0, 0.5));
 border-width: 1px 0 1px 5px;
 border-radius: 5px 0 0 5px;

}

/* removes borders from table cells to complement zebra stripes */ table.nocellborder>thead>tr>th, table.nocellborder>tbody>tr>th, table.nocellborder>tbody>tr>td {

 border-style: none;

}

/* left-aligns header cell text to complement zebra stripes */ table.nocellborder>thead>tr>th, table.nocellborder>tbody>tr>th {

 text-align: left;

}

/* Give `stickyheader` class tables sticky headers that stay on-screen even when the page scrolls, very useful for list articles */ table.stickyheader {

 position: relative;

}

table.stickyheader thead, table.stickyheader tbody th {

 position: sticky;
 top: 0;

}


/*==================================================

 Interactive Music

==================================================*/

/* Checkbox styling */ .i-checkbox {

 border: 3px solid var(--shadow, black);
 border-radius: 5px;
 width: 25px;
 height: 25px;
 text-align: center;
 display: inline-block;

}

.i-checkbox-checked {

 width: 100%;
 height: 100%;
 font-size: 18px;

}

/* Category header */ .i-categoryh- {

 font-size: 26px;

}

/* Subcategory header */ .i-categorys- {

 font-size: 22px;
 margin-left: 10px

}

/* Sizes for columns in Interactive Music */ /* Column1 */ .i-column1 {

 width: 25%

}

/* Column2 */ .i-column2 {

 width: 10%

}

/* Column4 */ .i-column4 {

 width: 350px

}

/*==================================================

 OTHER

==================================================*/

/* Smaller text size for link suggestions */

  1. ui-id-1 {
 font-size: inherit;

}

/* Countdowns start with their metadata until the Js changes them. So they should start invisible */ countdown {

 display: none;

}

.noscript {

 display: none;

}

.schedulesplit {

 display: table-cell;

}

/* Prevent line breaks in silly places:

  1) Where desired
  2) Links when we don't want them to
  3) Bold "links" to the page itself */

.nowrap, .nowraplinks a, .nowraplinks .selflink {

 white-space: nowrap;

}

/* Prevent text selection */ .noselect {

 -webkit-touch-callout: none;
 -webkit-user-select: none;
 -khtml-user-select: none;
 -moz-user-select: none;
 -ms-user-select: none;
 user-select: none;

}

/* force-display-none */ .force-display-none {

 display: none !important

}

/* Warnings like "This user is blocked. Here is the log" */ div.mw-warning-with-logexcerpt {

 padding: 10px;
 border-radius: 20px;

}

/* hide sensitive data on file pages */

  1. mw_metadata .exif-gpslatitude,
  2. mw_metadata .exif-gpslongitude,
  3. mw_metadata .exif-artist {
 display: none;

}


/*==================================================

 3D/2D Viewer

==================================================*/

/* 3D/2D viewer */ .container-2d {

 display: block;
 position: relative;

}

.viewer-2d {

 position: relative;
 width: 100%;
 height: 100%;
 top: 0;
 left: 0;

}

.switch-to-3d {

 position: absolute;
 top: 0;
 right: 0;
 background: url("https://cdn.wikimg.net/en/splatoonwiki/images/6/65/2D_icon.png");
 width: 92px;
 height: 48px;
 z-index: 999;
 opacity: 0.5;
 cursor: pointer;
 cursor: hand;
 transition: opacity 0.2s;

}

.switch-to-2d {

 position: absolute;
 top: 0;
 right: 0;
 background: url("https://cdn.wikimg.net/en/splatoonwiki/images/7/7e/3D_icon.png");
 width: 92px;
 height: 48px;
 z-index: 999;
 opacity: 0.5;
 cursor: pointer;
 cursor: hand;
 transition: opacity 0.2s;

}

.switch-to-3d:hover, .switch-to-2d:hover {

 opacity: 1.0;

}

/* 3D model viewer */ .viewer-3d span {

 display: none;

}

.viewer-3d {

 margin: 4px;
 display: block;
 cursor: move;
 position: relative;

}

.viewer-3d-frame {

 position: absolute;

}

.viewer-3d-overlay {

 background: url("https://cdn.wikimg.net/en/splatoonwiki/images/e/ed/3D_rotation_icon.png") bottom right no-repeat;
 width: 100%;
 height: 100%;
 opacity: 0.5;
 position: relative;

}

/* End 3D model viewer */

/* New 3D viewer specific CSS */ .viewer-3d-container {

 display: block;
 padding: 2px;
 margin-left: auto;
 margin-right: auto;
 width: 288px;

}

.viewer-3d-container ul {

 padding: 0px;
 margin: 0px;

}

.viewer-3d-container ul li {

 display: block;
 margin: 0px;
 margin-top: 2px;
 /* For vertical spacing of the buttons */
 list-style: none;
 text-align: center;

}

.viewer-3d-container ul a {

 display: block;
 width: 134px;
 padding: 4px;
 text-decoration: none;
 font-size: 1.25em;
 opacity: .75;

}

.viewer-3d-container ul a:hover {

 opacity: 1;

}

.view-selector-default-left {

 border-radius: 10px;
 float: left;
 background: #e2e2e2;

}

.view-selector-default-right {

 border-radius: 10px;
 float: right;
 background: #e2e2e2;

}

.view-selector-default-full {

 border-radius: 10px;
 width: 100%;
 float: left;
 clear: both;
 background: #e2e2e2;

}

.view-selector-default-full a {

 width: 100% !important;

}

/* End new 3D viewer */

/* Button icons */

/* Base icon element style */ .pro-icon, .switch-icon {

 background: currentcolor;
 display: inline-block;
 height: 28px;
 mask-size: contain;
 vertical-align: middle;
 width: 28px;
 -webkit-mask-size: contain;

}

/* Icon URLs */

root {
 --pro-icon-controller-outline: url("https://cdn.wikimg.net/en/splatoonwiki/images/3/35/Pro_Icon_Controller_Outline.svg");
 --pro-icon-d-pad-down: url("https://cdn.wikimg.net/en/splatoonwiki/images/d/df/Pro_Icon_D-Pad_Down.svg");
 --pro-icon-d-pad-left: url("https://cdn.wikimg.net/en/splatoonwiki/images/7/7e/Pro_Icon_D-Pad_Left.svg");
 --pro-icon-d-pad-right: url("https://cdn.wikimg.net/en/splatoonwiki/images/2/2a/Pro_Icon_D-Pad_Right.svg");
 --pro-icon-d-pad-up: url("https://cdn.wikimg.net/en/splatoonwiki/images/8/89/Pro_Icon_D-Pad_Up.svg");
 --pro-icon-d-pad: url("https://cdn.wikimg.net/en/splatoonwiki/images/e/e8/Pro_Icon_D-Pad.svg");
 --pro-icon-gyro-pitch: url("https://cdn.wikimg.net/en/splatoonwiki/images/9/9c/Pro_Icon_Gyro_Pitch.svg");
 --pro-icon-gyro-roll: url("https://cdn.wikimg.net/en/splatoonwiki/images/5/55/Pro_Icon_Gyro_Roll.svg");
 --pro-icon-gyro-yaw: url("https://cdn.wikimg.net/en/splatoonwiki/images/7/7d/Pro_Icon_Gyro_Yaw.svg");
 --switch-icon-a: url("https://cdn.wikimg.net/en/splatoonwiki/images/5/5a/Switch_Icon_A.svg");
 --switch-icon-b: url("https://cdn.wikimg.net/en/splatoonwiki/images/7/7f/Switch_Icon_B.svg");
 --switch-icon-capture: url("https://cdn.wikimg.net/en/splatoonwiki/images/7/77/Switch_Icon_Capture.svg");
 --switch-icon-home: url("https://cdn.wikimg.net/en/splatoonwiki/images/d/da/Switch_Icon_Home.svg");
 --switch-icon-l: url("https://cdn.wikimg.net/en/splatoonwiki/images/3/3e/Switch_Icon_L.svg");
 --switch-icon-left-stick-all: url("https://cdn.wikimg.net/en/splatoonwiki/images/0/0b/Switch_Icon_Left_Stick_All.svg");
 --switch-icon-left-stick-click: url("https://cdn.wikimg.net/en/splatoonwiki/images/5/58/Switch_Icon_Left_Stick_Click.svg");
 --switch-icon-left-stick-down: url("https://cdn.wikimg.net/en/splatoonwiki/images/e/e2/Switch_Icon_Left_Stick_Down.svg");
 --switch-icon-left-stick-left-right: url("https://cdn.wikimg.net/en/splatoonwiki/images/4/49/Switch_Icon_Left_Stick_Left-Right.svg");
 --switch-icon-left-stick-left: url("https://cdn.wikimg.net/en/splatoonwiki/images/9/95/Switch_Icon_Left_Stick_Left.svg");
 --switch-icon-left-stick-right: url("https://cdn.wikimg.net/en/splatoonwiki/images/1/14/Switch_Icon_Left_Stick_Right.svg");
 --switch-icon-left-stick-up-down: url("https://cdn.wikimg.net/en/splatoonwiki/images/0/06/Switch_Icon_Left_Stick_Up-Down.svg");
 --switch-icon-left-stick-up: url("https://cdn.wikimg.net/en/splatoonwiki/images/7/7c/Switch_Icon_Left_Stick_Up.svg");
 --switch-icon-left-stick: url("https://cdn.wikimg.net/en/splatoonwiki/images/7/73/Switch_Icon_Left_Stick.svg");
 --switch-icon-minus: url("https://cdn.wikimg.net/en/splatoonwiki/images/6/6d/Switch_Icon_Minus.svg");
 --switch-icon-plus: url("https://cdn.wikimg.net/en/splatoonwiki/images/c/c9/Switch_Icon_Plus.svg");
 --switch-icon-r: url("https://cdn.wikimg.net/en/splatoonwiki/images/d/d0/Switch_Icon_R.svg");
 --switch-icon-right-stick-all: url("https://cdn.wikimg.net/en/splatoonwiki/images/7/73/Switch_Icon_Right_Stick_All.svg");
 --switch-icon-right-stick-click: url("https://cdn.wikimg.net/en/splatoonwiki/images/d/d8/Switch_Icon_Right_Stick_Click.svg");
 --switch-icon-right-stick-down: url("https://cdn.wikimg.net/en/splatoonwiki/images/4/47/Switch_Icon_Right_Stick_Down.svg");
 --switch-icon-right-stick-left-right: url("https://cdn.wikimg.net/en/splatoonwiki/images/a/a2/Switch_Icon_Right_Stick_Left-Right.svg");
 --switch-icon-right-stick-left: url("https://cdn.wikimg.net/en/splatoonwiki/images/b/b1/Switch_Icon_Right_Stick_Left.svg");
 --switch-icon-right-stick-right: url("https://cdn.wikimg.net/en/splatoonwiki/images/f/f2/Switch_Icon_Right_Stick_Right.svg");
 --switch-icon-right-stick-up-down: url("https://cdn.wikimg.net/en/splatoonwiki/images/c/c1/Switch_Icon_Right_Stick_Up-Down.svg");
 --switch-icon-right-stick-up: url("https://cdn.wikimg.net/en/splatoonwiki/images/7/78/Switch_Icon_Right_Stick_Up.svg");
 --switch-icon-right-stick: url("https://cdn.wikimg.net/en/splatoonwiki/images/f/f6/Switch_Icon_Right_Stick.svg");
 --switch-icon-sl: url("https://cdn.wikimg.net/en/splatoonwiki/images/3/35/Switch_Icon_SL.svg");
 --switch-icon-sr: url("https://cdn.wikimg.net/en/splatoonwiki/images/c/c3/Switch_Icon_SR.svg");
 --switch-icon-x: url("https://cdn.wikimg.net/en/splatoonwiki/images/2/24/Switch_Icon_X.svg");
 --switch-icon-y: url("https://cdn.wikimg.net/en/splatoonwiki/images/c/c5/Switch_Icon_Y.svg");
 --switch-icon-zl: url("https://cdn.wikimg.net/en/splatoonwiki/images/7/79/Switch_Icon_ZL.svg");
 --switch-icon-zr: url("https://cdn.wikimg.net/en/splatoonwiki/images/1/1e/Switch_Icon_ZR.svg");

}

/* Icon styles */ .pro-icon.controller-outline {

 mask-image: var(--pro-icon-controller-outline);
 -webkit-mask-image: var(--pro-icon-controller-outline);

}

.pro-icon.d-pad-down {

 mask-image: var(--pro-icon-d-pad-down);
 -webkit-mask-image: var(--pro-icon-d-pad-down);

}

.pro-icon.d-pad-left {

 mask-image: var(--pro-icon-d-pad-left);
 -webkit-mask-image: var(--pro-icon-d-pad-left);

}

.pro-icon.d-pad-right {

 mask-image: var(--pro-icon-d-pad-right);
 -webkit-mask-image: var(--pro-icon-d-pad-right);

}

.pro-icon.d-pad-up {

 mask-image: var(--pro-icon-d-pad-up);
 -webkit-mask-image: var(--pro-icon-d-pad-up);

}

.pro-icon.d-pad {

 mask-image: var(--pro-icon-d-pad);
 -webkit-mask-image: var(--pro-icon-d-pad);

}

.pro-icon.gyro-pitch {

 mask-image: var(--pro-icon-gyro-pitch);
 -webkit-mask-image: var(--pro-icon-gyro-pitch);

}

.pro-icon.gyro-roll {

 mask-image: var(--pro-icon-gyro-roll);
 -webkit-mask-image: var(--pro-icon-gyro-roll);

}

.pro-icon.gyro-yaw {

 mask-image: var(--pro-icon-gyro-yaw);
 -webkit-mask-image: var(--pro-icon-gyro-yaw);

}

.switch-icon.a {

 mask-image: var(--switch-icon-a);
 -webkit-mask-image: var(--switch-icon-a);

}

.switch-icon.b {

 mask-image: var(--switch-icon-b);
 -webkit-mask-image: var(--switch-icon-b);

}

.switch-icon.capture {

 mask-image: var(--switch-icon-capture);
 -webkit-mask-image: var(--switch-icon-capture);

}

.switch-icon.home {

 mask-image: var(--switch-icon-home);
 -webkit-mask-image: var(--switch-icon-home);

}

.switch-icon.l {

 mask-image: var(--switch-icon-l);
 -webkit-mask-image: var(--switch-icon-l);

}

.switch-icon.left-stick-all {

 mask-image: var(--switch-icon-left-stick-all);
 -webkit-mask-image: var(--switch-icon-left-stick-all);

}

.switch-icon.left-stick-click {

 mask-image: var(--switch-icon-left-stick-click);
 -webkit-mask-image: var(--switch-icon-left-stick-click);

}

.switch-icon.left-stick-down {

 mask-image: var(--switch-icon-left-stick-down);
 -webkit-mask-image: var(--switch-icon-left-stick-down);

}

.switch-icon.left-stick-left-right {

 mask-image: var(--switch-icon-left-stick-left-right);
 -webkit-mask-image: var(--switch-icon-left-stick-left-right);

}

.switch-icon.left-stick-left {

 mask-image: var(--switch-icon-left-stick-left);
 -webkit-mask-image: var(--switch-icon-left-stick-left);

}

.switch-icon.left-stick-right {

 mask-image: var(--switch-icon-left-stick-right);
 -webkit-mask-image: var(--switch-icon-left-stick-right);

}

.switch-icon.left-stick-up-down {

 mask-image: var(--switch-icon-left-stick-up-down);
 -webkit-mask-image: var(--switch-icon-left-stick-up-down);

}

.switch-icon.left-stick-up {

 mask-image: var(--switch-icon-left-stick-up);
 -webkit-mask-image: var(--switch-icon-left-stick-up);

}

.switch-icon.left-stick {

 mask-image: var(--switch-icon-left-stick);
 -webkit-mask-image: var(--switch-icon-left-stick);

}

.switch-icon.minus {

 mask-image: var(--switch-icon-minus);
 -webkit-mask-image: var(--switch-icon-minus);

}

.switch-icon.plus {

 mask-image: var(--switch-icon-plus);
 -webkit-mask-image: var(--switch-icon-plus);

}

.switch-icon.r {

 mask-image: var(--switch-icon-r);
 -webkit-mask-image: var(--switch-icon-r);

}

.switch-icon.right-stick-all {

 mask-image: var(--switch-icon-right-stick-all);
 -webkit-mask-image: var(--switch-icon-right-stick-all);

}

.switch-icon.right-stick-click {

 mask-image: var(--switch-icon-right-stick-click);
 -webkit-mask-image: var(--switch-icon-right-stick-click);

}

.switch-icon.right-stick-down {

 mask-image: var(--switch-icon-right-stick-down);
 -webkit-mask-image: var(--switch-icon-right-stick-down);

}

.switch-icon.right-stick-left-right {

 mask-image: var(--switch-icon-right-stick-left-right);
 -webkit-mask-image: var(--switch-icon-right-stick-left-right);

}

.switch-icon.right-stick-left {

 mask-image: var(--switch-icon-right-stick-left);
 -webkit-mask-image: var(--switch-icon-right-stick-left);

}

.switch-icon.right-stick-right {

 mask-image: var(--switch-icon-right-stick-right);
 -webkit-mask-image: var(--switch-icon-right-stick-right);

}

.switch-icon.right-stick-up-down {

 mask-image: var(--switch-icon-right-stick-up-down);
 -webkit-mask-image: var(--switch-icon-right-stick-up-down);

}

.switch-icon.right-stick-up {

 mask-image: var(--switch-icon-right-stick-up);
 -webkit-mask-image: var(--switch-icon-right-stick-up);

}

.switch-icon.right-stick {

 mask-image: var(--switch-icon-right-stick);
 -webkit-mask-image: var(--switch-icon-right-stick);

}

.switch-icon.sl {

 mask-image: var(--switch-icon-sl);
 -webkit-mask-image: var(--switch-icon-sl);

}

.switch-icon.sr {

 mask-image: var(--switch-icon-sr);
 -webkit-mask-image: var(--switch-icon-sr);

}

.switch-icon.x {

 mask-image: var(--switch-icon-x);
 -webkit-mask-image: var(--switch-icon-x);

}

.switch-icon.y {

 mask-image: var(--switch-icon-y);
 -webkit-mask-image: var(--switch-icon-y);

}

.switch-icon.zl {

 mask-image: var(--switch-icon-zl);
 -webkit-mask-image: var(--switch-icon-zl);

}

.switch-icon.zr {

 mask-image: var(--switch-icon-zr);
 -webkit-mask-image: var(--switch-icon-zr);

}

/* Infobox styles */

/* Supporting CSS for Template:GearCategory */

root {
 --gear-icon-clothing: url("https://cdn.wikimg.net/en/splatoonwiki/images/7/78/S2_Icon_Clothing.png");
 --gear-icon-headgear: url("https://cdn.wikimg.net/en/splatoonwiki/images/1/12/S2_Icon_Headgear.png");
 --gear-icon-shoes: url("https://cdn.wikimg.net/en/splatoonwiki/images/a/a5/S2_Icon_Shoes.png");

}

.gear-category {

 display: inline-block;
 position: relative;
 vertical-align: middle;

}

.gear-category a, .gear-category a:hover {

 display: block;
 height: 100%;
 left: 0;
 position: absolute;
 text-decoration: none;
 top: 0;
 width: 100%;

}

.gear-category::before {

 background: currentcolor;
 content: "";
 height: 100%;
 left: 0;
 mask-position: center;
 mask-repeat: no-repeat;
 mask-size: contain;
 opacity: 0.6;
 position: absolute;
 top: 0;
 width: 100%;
 -webkit-mask-position: center;
 -webkit-mask-repeat: no-repeat;
 -webkit-mask-size: contain;

}

.gear-category.Clothing::before {

 mask-image: var(--gear-icon-clothing);
 -webkit-mask-image: var(--gear-icon-clothing);

}

.gear-category.Headgear::before {

 mask-image: var(--gear-icon-headgear);
 -webkit-mask-image: var(--gear-icon-headgear);

}

.gear-category.Shoes::before {

 mask-image: var(--gear-icon-shoes);
 -webkit-mask-image: var(--gear-icon-shoes);

}

/* New infobox implementation styles */ .infobox {

 box-shadow: 0 0 16px var(--page, #ffffff) inset;

}

/* dark gallery */ .darkgallery div.thumb {

 background-color: #000505 !important;

}

/* light gallery */ .lightgallery div.thumb {

 background-color: #f8f9fa !important;

}

.img-greyscale {

 filter: grayscale(100%);

}