Diferencia entre revisiones de «MediaWiki:Common.css»

De Inkipedia
(Solucionado errores menores)
(Soporte 3D y música interactiva)
Línea 782: Línea 782:
table.nocellborder > tbody > tr > th {
table.nocellborder > tbody > tr > th {
   text-align: left;
   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
}
}


Línea 855: Línea 896:
   display: none;
   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 */

Revisión del 12:51 15 jul 2022

/* 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-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 {
  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;
}

/* NIWA affiliate color */
a[href="/wiki/User:Raltseye"], a[href="/wiki/User:Espyo"] {
  color: #319471;
}

/* 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: #006400;
  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 */
}

/* Color de links para ARMS Institute */
#bodyContent a[href^="https://armswiki.org"] {
  background: url("//cdn.wikimg.net/en/splatoonwiki/images/9/92/ARMS_Institute_favicon.png") no-repeat scroll right center transparent;
  padding-right: 18px;
}

/* Color de links para para Bulbapedia */
#bodyContent a[href^="https://bulbapedia.bulbagarden.net/wiki"] {
  background: url("//cdn.wikimg.net/en/splatoonwiki/images/7/75/Bulbapedia_favicon.png") no-repeat scroll right center transparent;
  padding-right: 18px;
}

/* Color de links para Donkey Kong Wiki */
#bodyContent a[href^="https://www.dkwiki.com"] {
  background: url("//cdn.wikimg.net/en/splatoonwiki/images/2/29/Donkey_Kong_Wiki_link.png") no-repeat scroll right center transparent;
  padding-right: 18px;
}

/* Color de links para Dragalia Lost Wiki */
#bodyContent a[href^="https://dragalialost.wiki"] {
  background: url("//cdn.wikimg.net/en/splatoonwiki/images/b/b6/Dragalia_Lost_Wiki_favicon.png") no-repeat scroll right center transparent;
  padding-right: 18px;
}

/* Color de links para Dragon Quest Wiki*/
#bodyContent a[href^="https://dragon-quest.org/wiki"] {
  background: url("//cdn.wikimg.net/en/splatoonwiki/images/9/96/Dragon_Quest_Wiki_favicon.png") no-repeat scroll right center transparent;
  padding-right: 18px;
}

/* Color de links para Fire Emblem Wiki */
#bodyContent a[href^="https://fireemblemwiki.org"] {
  background: url("//cdn.wikimg.net/en/splatoonwiki/images/c/cb/Fire_Emblem_Wiki_favicon.png") no-repeat scroll right center transparent;
  padding-right: 18px;
}

/* Color de links para F-Zero Wiki */
#bodyContent a[href^="http://mutecity.org/wiki"] {
  background: url("//cdn.wikimg.net/en/splatoonwiki/images/0/0e/F-Zero_Wiki_favicon.png") no-repeat scroll right center transparent;
  padding-right: 18px;
}

/* Color de links para Golden Sun Universe */
#bodyContent a[href^="https://goldensunwiki.net/wiki"] {
  background: url("//cdn.wikimg.net/en/splatoonwiki/images/0/0c/Golden_Sun_Universe_favicon.png") no-repeat scroll right center transparent;
  padding-right: 18px;
}

/* Color de links para Hard Drop Wiki */
#bodyContent a[href^="https://harddrop.com/wiki"] {
  background: url("//cdn.wikimg.net/en/splatoonwiki/images/4/48/Hard_Drop_Wiki_favicon.png") no-repeat scroll right center transparent;
  padding-right: 18px;
}

/* Color de links para Icaruspedia */
#bodyContent a[href^="https://kidicaruswiki.org"] {
  background: url("//cdn.wikimg.net/en/splatoonwiki/images/4/4d/Icaruspedia_favicon.png") no-repeat scroll right center transparent;
  padding-right: 18px;
}

/* Color de links para Lylat Wiki */
#bodyContent a[href^="https://www.starfoxwiki.info/wiki"] {
  background: url("//cdn.wikimg.net/en/splatoonwiki/images/b/ba/Lylat_Wiki_favicon.png") no-repeat scroll right center transparent;
  padding-right: 18px;
}

/* Color de links para Metroid Wiki */
#bodyContent a[href^="https://www.metroidwiki.org"] {
  background: url("//cdn.wikimg.net/en/splatoonwiki/images/0/0a/Metroid_Wiki_favicon.png") no-repeat scroll right center transparent;
  padding-right: 18px;
}

/* Color de links para NintendoWiki */
#bodyContent a[href^="http://niwanetwork.org/wiki"] {
  background: url("//cdn.wikimg.net/en/splatoonwiki/images/a/a9/NWiki_favicon.png") no-repeat scroll right center transparent;
  padding-right: 18px;
}

/* Color de links para Nookipedia */
#bodyContent a[href^="https://nookipedia.com"] {
  background: url("//cdn.wikimg.net/en/splatoonwiki/images/f/f7/Nookipedia_favicon.png") no-repeat scroll right center transparent;
  padding-right: 18px;
}

/* Color de links para Pikipedia */
#bodyContent a[href^="https://www.pikminwiki.com"] {
  background: url("//cdn.wikimg.net/en/splatoonwiki/images/4/4e/Pikipedia_favicon.png") no-repeat scroll right center transparent;
  padding-right: 18px;
}

/* Color de links para Pikmin Fanon */
#bodyContent a[href^="https://www.pikminfanon.com"] {
  background: url("//cdn.wikimg.net/en/splatoonwiki/images/1/11/Pikmin_Fanon_favicon.png") no-repeat scroll right center transparent;
  padding-right: 18px;
}

/* Color de links para SmashWiki */
#bodyContent a[href^="https://www.ssbwiki.com"] {
  background: url("//cdn.wikimg.net/en/splatoonwiki/images/7/78/Smash_Wiki_favicon.png") no-repeat scroll right center transparent;
  padding-right: 18px;
}

/* Color de links para Starfy Wiki */
#bodyContent a[href^="https://starfywiki.org"] {
  background: url("//cdn.wikimg.net/en/splatoonwiki/images/4/41/Starfy_Wiki_favicon.png") no-repeat scroll right center transparent;
  padding-right: 18px;
}

/* Color de links para StrategyWiki */
#bodyContent a[href^="https://strategywiki.org"] {
  background: url("//cdn.wikimg.net/en/splatoonwiki/images/9/9f/StrategyWiki_favicon.png") no-repeat scroll right center transparent;
  padding-right: 18px;
}

/* Color de links para Super Mario Wiki */
#bodyContent a[href^="https://www.mariowiki.com"] {
  background: url("//cdn.wikimg.net/en/splatoonwiki/images/c/ca/Super_Mario_Wiki_favicon.png") no-repeat scroll right center transparent;
  padding-right: 18px;
}

/* Color de links para Ukikipedia */
#bodyContent a[href^="https://ukikipedia.net/wiki"] {
  background: url("//cdn.wikimg.net/en/splatoonwiki/images/c/c8/Ukikipedia_favicon.png") no-repeat scroll right center transparent;
  padding-right: 18px;
}

/* Color de links para Wars Wiki */
#bodyContent a[href^="https://warswiki.org/wiki"] {
  background: url("//cdn.wikimg.net/en/splatoonwiki/images/c/ca/Wars_Wiki_favicon.png") no-repeat scroll right center transparent;
  padding-right: 18px;
}

/* Color de links para WikiBound */
#bodyContent a[href^="https://wikibound.info/wiki"] {
  background: url("//cdn.wikimg.net/en/splatoonwiki/images/d/dd/WikiBound_favicon.png") no-repeat scroll right center transparent;
  padding-right: 18px;
}

/* Color de links para WiKirby */
#bodyContent a[href^="https://wikirby.com/wiki"] {
  background: url("//cdn.wikimg.net/en/splatoonwiki/images/4/4a/Wikirby_favicon.png") no-repeat scroll right center transparent;
  padding-right: 18px;
}

/* Color de links para Zelda Wiki */
#bodyContent a[href^="https://zelda.gamepedia.com"] {
  background: url("//cdn.wikimg.net/en/splatoonwiki/images/8/87/Zelda_Wiki_favicon.png") no-repeat scroll right center transparent;
  padding-right: 18px;
}

/* Color de links para Xeno Series Wiki */
#bodyContent a[href^="https://xenoserieswiki.org"] {
  background: url("//cdn.wikimg.net/en/splatoonwiki/images/a/a8/Xeno_Series_Wiki_favicon.png") no-repeat scroll right center transparent;
  padding-right: 18px;
}


/*==================================================
  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,
table.sitecolor-niwa > thead > tr > th,
table.sitecolor-niwa > tbody > tr > th,
table.sitecolor-niwa > tbody > tr > td {
  border-color: rgba(255, 128, 0, 1);  /* NIWA naranja */
}

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-niwa.zebra-even > tbody > tr:nth-child(even) > td,
table.sitecolor-niwa.zebra-odd > tbody > tr:nth-child(odd) > td {
  background-color: rgba(255, 128, 0, 0.15);  /* NIWA naranja */
}

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-niwa.zebra-vert tbody td:nth-child(even) {
  background-color: rgba(241, 121, 42, 0.15);  /* NIWA naranja */
}

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 */