MediaWiki:Common.css

De Inkipedia
Revisión del 20:50 2 nov 2022 de A22PG (discusión | contribs.) (Eliminada la decoración de Halloween)

Nota: Después de publicar, quizás necesite actualizar la caché de su navegador para ver los cambios.

  • Firefox/Safari: Mantenga presionada la tecla Shift mientras pulsa el botón Actualizar, o presiona Ctrl+F5 o Ctrl+R (⌘+R en Mac)
  • Google Chrome: presione Ctrl+Shift+R (⌘+Shift+R en Mac)
  • Internet Explorer/Edge: mantenga presionada Ctrl mientras pulsa Actualizar, o presione Ctrl+F5
  • Opera: Presiona Ctrl+F5.
/* Los estilos CSS definidos aquí se aplicarán a todas las pieles (skins) */

/* Hacer que se muestre [[MediaWiki:Tagline]] */
.mw-body #siteSub {
  display: block;
}

/* Habilitar los tipos de estilo de lista personalizados */
div.note-list ol.references {
  list-style-type: inherit;
}

/* Evitar que los elementos de la lista en las columnas pasen a la siguiente columna */
.list-columns li {
page-break-inside: avoid;
}

/* Limitar los niveles de cabecera TOC que se muestran
   <div class="toclimit-3">, por ejemplo, se limitará a mostrar ==encabezados== y ===encabezados=== pero no más. */
.toclimit-2 .toclevel-1 ul,
.toclimit-3 .toclevel-2 ul,
.toclimit-4 .toclevel-3 ul,
.toclimit-5 .toclevel-4 ul {
  display: none;
}

/* Evita que algunas cosas se muestren en la página principal */
body.page-Página_principal #ca-delete, body.page-Página_principal #ca-move, body.page-Página_principal #deleteconfirm, body.page-Página_principal #siteSub, body.page-Página_principal #contentSub, body.page-Página_principal h1.firstHeading {
  display: none !important;
}

/* Para cosas que sólo deben aparecer cuando se imprimen. Se utiliza en las listas de control de los equipos. */
.onlyprint {
  display: none;
}


/*==================================================
  LINKS
==================================================*/


/* Color de links */
a:link, 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 {
  text-decoration: none;
  color: #378B00;
}

/* Color de links visitados */
a:visited, 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 {
  text-decoration: none;
  color: #008B2A;
}

/* Subrayar los enlaces al pasar el ratón por encima */
a:hover {
  text-decoration: underline;
}


/* Color para nombres de administradores */
a[href="/wiki/Usuario:A22PG"], a[href="/wiki/Usuario:Shahar"], a[href="/wiki/Usuario:Killer1001"], a[href="/wiki/Usuario:AkaRojo"], a[href="/wiki/Usuario:JandroJG7"]{
  color: #7D11E3;
  font-weight: 700;
}

/* Color para nombres de burócratas */
a[href="/wiki/Usuario:Slate"], a[href="/wiki/Usuario:Prod"] {
  color: #DAA520;
  font-weight: 700;
}

/* Color de link inexistente */
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, #p-personal a.new, a.new {
  text-decoration: none;
  color: #BA0000;  /* Red */
}


/*==================================================
  ENTRADAS
==================================================*/


/* Entrada de texto */
.oo-ui-textInputWidget.oo-ui-widget-enabled:hover .oo-ui-inputWidget-input:focus {
  border-color: #008B2A;
}
.oo-ui-textInputWidget.oo-ui-widget-enabled .oo-ui-inputWidget-input:focus {
  border-color: #008B2A;
  box-shadow:inset 0 0 0 1px #008B2A;
}

/* Menú desplegable */
.oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle:focus {
  border-color: #008B2A;
  box-shadow:inset 0 0 0 1px #008B2A;
}
.oo-ui-menuOptionWidget.oo-ui-optionWidget-selected {
 background-color: #EBFFEC;
 color: #008B2A;
}
.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 {
 background-color: rgba(0,139,42,0.1);
 color: #008B2A;
}

/* Botón principal */
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button {
  background-color: #008B2A;
  border-color: #008B2A;
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:hover {
  background-color: #378B00;
  border-color: #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: #006400;
  border-color: #006400;
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:focus {
  border-color: #008B2A;
  box-shadow:inset 0 0 0 1px #008B2A,inset 0 0 0 2px #fff;
}

/* Botón secundario */
.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button:focus {
  border-color: #008B2A;
  box-shadow:inset 0 0 0 1px #008B2A;
}

/* Botón de cambios recientes */
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-buttonElement-active > .oo-ui-buttonElement-button {
  background-color: #006400;
  border-color: #006400;
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-buttonElement-active > .oo-ui-buttonElement-button:focus {
  border-color: #008B2A;
  box-shadow: inset 0 0 0 1px #008B2A, inset 0 0 0 2px #fff
}

/* Casilla de verificación */
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:focus + span {
  border-color: #008B2A;
  box-shadow:inset 0 0 0 1px #008B2A;
}
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:hover + span {
  border-color: #378B00;
}
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:active + span {
  background-color: #006400;
  border-color: #006400;
  box-shadow:inset 0 0 0 1px #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: #008B2A;
  border-color: #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: #008B2A;
  border-color: #008B2A;
  box-shadow:inset 0 0 0 1px #36c,inset 0 0 0 2px #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: #378B00;
  border-color: #378B00;
}
.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: #006400;
  border-color: #006400;
  box-shadow:inset 0 0 0 1px #006400;
}

/* Radio del botón */
.oo-ui-radioInputWidget.oo-ui-widget-enabled [type='radio']:hover + span {
 border-color: #378B00;
}
.oo-ui-radioInputWidget.oo-ui-widget-enabled [type='radio']:active + span {
 background-color: #006400;
 border-color: #006400;
}
.oo-ui-radioInputWidget.oo-ui-widget-enabled [type='radio']:checked + span {
 border-color: #008B2A;
}
.oo-ui-radioInputWidget.oo-ui-widget-enabled [type='radio']:checked:hover + span {
 border-color: #378B00;
}
.oo-ui-radioInputWidget.oo-ui-widget-enabled [type='radio']:checked:active + span {
 border-color: #006400;
 box-shadow: inset 0 0 0 1px #006400;
}
.oo-ui-radioInputWidget.oo-ui-widget-enabled [type='radio']:checked:active + span:before {
 border-color: #006400;
}


/*==================================================
  INFOBOXES
==================================================*/


.widget {
  background-image: url("//cdn.wikimg.net/en/splatoonwiki/images/2/26/Amiibo_main_bg.png");
  box-shadow: 0px 0px 15px white inset;
  width: 25%;
  border-style: solid;
  border-color: #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 white inset;
  width: 75%;
  border-style: solid;
  border-color: #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 white inset;
  width: 100%;
  border-style: solid;
  border-color: #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 black inset;
  overflow: hidden;
  width: 100%;
  border-style: solid;
  border-color: #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 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 white inset;
  width: 50%;
  border-style: solid;
  border-color: #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 white inset;
  width: 100%;
  border-style: solid;
  border-color: #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 white inset;
  width: 97%;
  border-style: solid;
  border-color: #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;
}

#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;
}

#tex2 {
  margin-left: 25%;
}

#widgfa {
  position: relative;
  left: 1.5%;
  max-width: 85%;
}

.infobox {
  background-color: rgba(140,220,0,0.1);
  width: 25%;
  border-radius: 10px;
  padding: 10px;
  border-style: solid;
  border-color: #AADC00;
  border-width: 10px 1px 10px 1px;
}

.infobox1 {
  background-color: rgba(140,220,0,0.3);
  border-style: solid;
  border-color: rgba(140,220,0,0.5);
  border-width: 1px 1px 1px 5px;
  border-radius: 5px;
  color: #190707;
  font-size: 115%;
  padding: 1em;
  margin: 5px;
}

.infobox td {
  padding: 5px;
}

  .infobox td b {
    padding: 6px;
    background: -moz-linear-gradient(left, rgba(140,220,0,0.3) 0%, rgba(140,220,0,0) 100%);
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(140,220,0,0.3)), color-stop(100%,rgba(140,220,0,0)));
    background: -webkit-linear-gradient(left, rgba(140,220,0,0.3) 0%,rgba(140,220,0,0) 100%);
    background: -o-linear-gradient(left, rgba(140,220,0,0.3) 0%,rgba(140,220,0,0) 100%);
    background: -ms-linear-gradient(left, rgba(140,220,0,0.3) 0%,rgba(140,220,0,0) 100%);
    background: linear-gradient(to right, rgba(140,220,0,0.3) 0%,rgba(140,220,0,0) 100%);
    border-style: solid;
    border-color: rgba(140,220,0,0.5);
    border-width: 1px 0 1px 5px;
    border-radius: 5px 0 0 5px;
  }


/*==================================================
  TABLAS
==================================================*/


/* Clase wikitable para el color de las tablas.
   Los colores por defecto están pensados para las tablas generadas por MediaWiki como la tabla del historial de archivos.
   Hay otros esquemas de color disponibles para usar en Mainspace; ver las clases Sitecolor más abajo. */
table.wikitable {
  background-color: #fff;
  color: #222;
  margin: 1em 0;
  border-style: solid;
  border-width: 5px 2px;
  border-color: #006400;  /* green */
  border-collapse: collapse;
  box-shadow: 0 0 1em rgba(0, 0, 0, 0.25);
}

table.wikitable > thead > tr > th,
table.wikitable > tbody > tr > th,
table.wikitable > tbody > tr > td {
  border-style: solid;
  border-width: 1px;
  border-color: #006400;
  padding: 0.2em 0.4em;
}

table.wikitable > thead > tr > th,
table.wikitable > tbody > tr > th {
  color: #fff;
  background-color: #378b00;  /* Verde, el mismo tono utilizado para los enlaces */
}

table.wikitable > caption {
  font-weight: bold;
}

/* Clases para añadir colores del sitio a las tablas 
   Los colores del sitio están documentados en [[Template:SiteColor]] */
table.sitecolor-generic,
table.sitecolor-generic > thead > tr > th,
table.sitecolor-generic > tbody > tr > th,
table.sitecolor-generic > tbody > tr > td {
  border-color: rgba(0, 153, 255, 1);  /* Genérico azul */
}

table.sitecolor-generic > thead > tr > th,
table.sitecolor-generic > tbody > tr > th {
  background-color: rgba(0, 153, 255, 0.25);
  color: #222;
}

table.sitecolor-s,
table.sitecolor-s > thead > tr > th,
table.sitecolor-s > tbody > tr > th,
table.sitecolor-s > tbody > tr > td {
  border-color: rgba(170, 220, 0, 1);  /* Splatoon verde */
}

table.sitecolor-s > thead > tr > th,
table.sitecolor-s > tbody > tr > th {
  background-color: rgba(170, 220, 0, 0.25);
  color: #222;
}

table.sitecolor-s2,
table.sitecolor-s2 > thead > tr > th,
table.sitecolor-s2 > tbody > tr > th,
table.sitecolor-s2 > tbody > tr > td {
  border-color: rgba(240, 60, 120, 1);  /* Splatoon 2 rosa */
}

table.sitecolor-s2 > thead > tr > th,
table.sitecolor-s2 > tbody > tr > th {
  background-color: rgba(240, 60, 120, 0.25);
  color: #222;
}

table.sitecolor-oe,
table.sitecolor-oe > thead > tr > th,
table.sitecolor-oe > tbody > tr > th,
table.sitecolor-oe > tbody > tr > td {
  border-color: rgba(174, 21, 102, 1);  /* Octo Expansion color de tinta por defecto */
}

table.sitecolor-oe > thead > tr > th,
table.sitecolor-oe > tbody > tr > th {
  background-color: rgba(174, 21, 102, 0.25);
  color: #222;
}

table.sitecolor-am,
table.sitecolor-am > thead > tr > th,
table.sitecolor-am > tbody > tr > th,
table.sitecolor-am > tbody > tr > td {
  border-color: rgba(128, 128, 128, 1);  /* Area mutante negro */
}

table.sitecolor-am > thead > tr > th,
table.sitecolor-am > tbody > tr > th {
  background-color: rgba(128, 128, 128, 0.25);
  color: #222;
}

table.sitecolor-s3,
table.sitecolor-s3 > thead > tr > th,
table.sitecolor-s3 > tbody > tr > th,
table.sitecolor-s3 > tbody > tr > td {
  border-color: rgba(235, 238, 61, 1);  /* Splatoon 3 amarillo */
}

table.sitecolor-s3 > thead > tr > th,
table.sitecolor-s3 > tbody > tr > th {
  background-color: rgba(235, 238, 61, 0.25);
  color: #222;
}

table.sitecolor-niwa > thead > tr > th,
table.sitecolor-niwa > tbody > tr > th {
  background-color: rgba(255, 128, 0, 0.25);
  color: #222;
}

table.sitecolor-sr,
table.sitecolor-sr > thead > tr > th,
table.sitecolor-sr > tbody > tr > th,
table.sitecolor-sr > tbody > tr > td {
  border-color: rgba(241, 121, 42, 1);  /* Salmon Run naranja apagado */
}

table.sitecolor-sr > thead > tr > th,
table.sitecolor-sr > tbody > tr > th {
  background-color: rgba(241, 121, 42, 0.25);
  color: #222;
}

/* Alterna los colores de fondo de las filas en las tablas de estilo "cebra"
   Hay opciones pares e impares para seleccionar qué fila cambia de color primero */
table.sitecolor-generic.zebra-even > tbody > tr:nth-child(even) > td,
table.sitecolor-generic.zebra-odd > tbody > tr:nth-child(odd) > td {
  background-color: rgba(0, 153, 255, 0.15);  /* Genérico azul */
}

table.sitecolor-s.zebra-even > tbody > tr:nth-child(even) > td,
table.sitecolor-s.zebra-odd > tbody > tr:nth-child(odd) > td {
  background-color: rgba(170, 220, 0, 0.15);  /* Splatoon verde */
}

table.sitecolor-s2.zebra-even > tbody > tr:nth-child(even) > td,
table.sitecolor-s2.zebra-odd > tbody > tr:nth-child(odd) > td {
  background-color: rgba(240, 60, 120, 0.15);  /* Splatoon 2 rosa */
}

table.sitecolor-oe.zebra-even > tbody > tr:nth-child(even) > td,
table.sitecolor-oe.zebra-odd > tbody > tr:nth-child(odd) > td {
  background-color: rgba(174, 21, 102, 1);  /* Octo expansion color de tinta por defecto */
}

table.sitecolor-oe.zebra-even > tbody > tr:nth-child(even) > td,
table.sitecolor-oe.zebra-odd > tbody > tr:nth-child(odd) > td {
  background-color: rgba(128, 128, 128, 1);  /* Octo expansion color de tinta por defecto */
}

table.sitecolor-s3.zebra-even > tbody > tr:nth-child(even) > td,
table.sitecolor-s3.zebra-odd > tbody > tr:nth-child(odd) > td {
  background-color: rgba(235, 238, 61, 1);  /* Splatoon 3 amarillo */
}

table.sitecolor-sr.zebra-even > tbody > tr:nth-child(even) > td,
table.sitecolor-sr.zebra-odd > tbody > tr:nth-child(odd) > td {
  background-color: rgba(241, 121, 42, 0.15);  /* Salmon Run naranja apagado */
}

/* Clase cebra destinada a ser utilizada en el espacio de nombres de Inkipedia, por ejemplo la página de personal */
table.zebra-inkipedia > tbody > tr:nth-child(odd) > td {
  background-color: rgba(55, 139, 0, 0.2)  /* Verde, el mismo tono usado en los links pero con un 20% de opacidad */
}

/* Rayas verticales de cebra */
table.sitecolor-generic.zebra-vert tbody td:nth-child(even) {
  background-color: rgba(0, 153, 255, 0.15);  /* Genérico azul */
}

table.sitecolor-s.zebra-vert tbody td:nth-child(even) {
  background-color: rgba(170, 220, 0, 0.15);  /* Splatoon verde */
}

table.sitecolor-s2.zebra-vert tbody td:nth-child(even) {
  background-color: rgba(240, 60, 120, 0.15);  /* Splatoon 2 rosa */
}

table.sitecolor-s3.zebra-vert tbody td:nth-child(even) {
  background-color: rgba(235, 238, 61, 0.15);  /* Splatoon 3 amarillo */
}

table.sitecolor-oe.zebra-vert tbody td:nth-child(even) {
  background-color: rgba(174, 21, 102, 1);  /* Octo expansion color de tinta por defecto */
}

table.sitecolor-oe.zebra-vert tbody td:nth-child(even) {
  background-color: rgba(128, 128, 128, 1);  /* Octo expansion color de tinta por defecto */
}

table.sitecolor-sr.zebra-vert tbody td:nth-child(even) {
  background-color: rgba(255, 128, 0, 0.15);  /* Salmon Run naranja apagado */
}

/* Elimina los bordes de las celdas de la tabla para complementar las rayas de cebra */
table.nocellborder > thead > tr > th,
table.nocellborder > tbody > tr > th,
table.nocellborder > tbody > tr > td {
  border-style: none;
}

/* Alinea a la izquierda el texto de la celda de cabecera para complementar las rayas de cebra */
table.nocellborder > thead > tr > th,
table.nocellborder > tbody > tr > th {
  text-align: left;
}

/*==================================================
  Música interactiva
  ==================================================*/

/* Estilo de las casillas de verificación */
.i-checkbox{
        border:3px solid black;
        border-radius:5px;
        width:25px;
        height:25px;
        text-align:center;
        display:inline-block;
}
.i-checkbox-checked{
        width:100%;
        height:100%;
        font-size:18px;
}
/* Cabecera de categoría */
.i-categoryh-{
        font-size:26px;
}
/* Cabezera de subcategoría */
.i-categorys-{
        font-size:22px;
        margin-left:10px
}
/* Tamaños de las columnas en la música interactiva */
/* Columna1 */
.i-column1{
        width:25%
}
/* Columna2 */
.i-column2{
        width:10%
}
/* Columna4 */
.i-column4{
        width:350px
}


/*==================================================
  FUENTES PERSONALIZADAS
==================================================*/


@font-face {
    font-family: Splatoon;
    src: url("https://frozenpandaman.github.io/Splatoon1.otf") format("opentype");
}

@font-face {
    font-family: Splatoon2;
    src: url("https://frozenpandaman.github.io/Splatoon2.otf") format("opentype");
}


/*==================================================
  OTROS
==================================================*/


/* Tamaño de texto más pequeño para las sugerencias de enlaces */
#ui-id-1 {
  font-size: inherit;
}

/* Las cuentas atrás comienzan con sus metadatos hasta que el Js
   los cambie. Por lo tanto, deberían empezar invisibles */
countdown {
  display: none;
}

.noscript { display: none; }
.schedulesplit { display: table-cell; }

/* Evite los saltos de línea en lugares tontos:
   1) Cuando se desee
   2) Los enlaces cuando no los queramos
   3) "Enlaces" en negrita a la propia página */
.nowrap,
.nowraplinks a,
.nowraplinks .selflink {
  white-space: nowrap;
}

/* Impedir la selección de texto */
.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 {
    display:none !important
}

/* Avisos como "Este usuario está bloqueado" */
div.mw-warning-with-logexcerpt {
    padding:10px;
    border-radius:20px;
}

/* Ocultar datos confidenciales en las páginas de los archivos */
#mw_metadata .exif-gpslatitude,
#mw_metadata .exif-gpslongitude {
  display: none;
}

/*==================================================
  Vista 3D/2D
==================================================*/

/* Vista 3D/2D */
.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;
}

/* Visualización del modelo 3D */
.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;
}
/* Final de la visualización del modelo 3D */

/* Nuevo CSS específico para el visor 3D */
.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;
}

/* Fin de la nueva visualización 3D */

/******************************* Icono de botones ********************************/
/* Estilo del elemento icono base */
.pro-icon,
.switch-icon {
        background       : currentcolor;
        display          : inline-block;
        height           : 28px;
        mask-size        : contain;
        vertical-align   : middle;
        width            : 28px;
        -webkit-mask-size: contain;
}
/* URLs de iconos */
: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");
}
/* Estilos de iconos */
.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-right); -webkit-mask-image: var(--switch-icon-left-stick-right); }
.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 *******************************/
/* Soporte CSS para 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);
}
/* Nuevos estilos de implementación de infoboxes */
.infobox {
        box-shadow: 0 0 16px var(--page, #ffffff) inset;
}

/* Visualización en Halloween 
:root{
		--global-stripes: url(https://cdn.wikimg.net/es/splatoonwiki/images/f/f1/Halloween_fondo_Inkipedia.png) !important;
}
*/