Mudanças entre as edições de "MediaWiki:Common.css"

De Wiki Gla
Ir para navegação Ir para pesquisar
Etiqueta: Reversão manual
m
 
Linha 1: Linha 1:
/* CSS placed here will be applied to all skins */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:wght@400;600;700&display=swap');


/* temp nicer background before theme changes, ty teg for the idea o/ */
/* body::before {
body {
content: '';
    background-image: url(images/background.png);
position: fixed;
    background-repeat: no-repeat;
top: 0;
left: 0;
width: 100%;
height: 100vh;
background: url('https://wiki.gla.com.br/images/b/b3/Testefundo.png') no-repeat;
filter: brightness(0.6);
 
background-attachment: fixed;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
z-index: -1;
}
*/
/* === FONTE PADRÃO === */
body,
.mw-parser-output,
.mw-headline,
#firstHeading,
h1,
h2,
h3,
h4,
h5,
h6,
p,
ul,
ol,
li,
table,
td,
th,
caption {
    font-family: 'Noto Sans', sans-serif !important;
}
 
/* === LEGENDAS DE IMAGEM === */
.thumbcaption {
    font-size: 1.1em !important;
    text-align: center !important;
    line-height: 1.4;
    font-weight: 400;
}
}


#mw-page-base {
/* === TABELAS ENHANCE === */
     background-image: none;
table.table-enhance {
     background-color: rgba(0,0,0,0);
    max-width: 600px;
    margin: 1em auto;
     border-collapse: collapse;
     background-color: #fff;
    border: 1px solid #ccc;
    font-size: 13px;
    font-family: 'Segoe UI', 'Helvetica Neue', sans-serif;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}
}


div#mw-head div.vectorMenu h3 {
.table-enhance th,
  background-image: none;
.table-enhance td {
    border: 1px solid #e0e0e0;
    padding: 6px 10px;
    text-align: center;
    vertical-align: middle;
}
}


div.vectorMenu h3 span {
.table-enhance th {
     padding-top: 1em;
     background-color: #f5f5f5;
    font-weight: 600;
    color: #333;
}
}


div.vectorTabs {
.table-enhance tr:nth-child(even) td {
     border-top: 1px solid #dceefb;
     background-color: #fafafa;
    height: 2.2em;
}
}


div.vectorTabs li a {
.table-enhance tr:hover td {
     height: 1.95em;
     background-color: #f0f8ff;
    transition: background-color 0.2s ease;
}
}


div.vectorTabs span a {
.table-enhance-vertical td:first-child {
     padding-top: 0.8em;
     font-weight: bold;
    color: #2c3e50;
}
}


#p-personal {
/* === AJUSTES NA SIDEBAR === */
top: 0;
#p-logo {
right: 0;
    background-color: transparent !important;
background-color: #fff;
padding-top: 0.25em;
padding-right: 0.75em;
border-radius: 0px 0px 0px 5px;
}
}


#p-personal ul {
#mw-panel .mw-portlet.portal .vector-menu-content-list>li>a {
padding-left: 0;
    font-size: 0.80rem !important;
    font-family: 'Noto Sans', sans-serif !important;
    font-weight: 600 !important;
}
}


#p-logo {
/* === REMOÇÃO DE BORDAS EM TÍTULOS === */
padding-top: 8px;
.mw-headline {
    border-bottom: none !important;
}
}


div#content {
h1,
     box-shadow: rgba(0,0,0,0.15) 0 0.1em 0.75em;
h2,
h3,
h4,
h5,
h6 {
     border-bottom: none !important;
}
}


div#simpleSearch {
.video-responsivo {
     margin-top: 0.35em;
    max-width: 600px;
    width: 100%;
     margin: 0 auto;
    background: black;
    padding: 0;
    overflow: hidden;
    position: relative;
}
}


#ca-unwatch.icon a,
.video-responsivo video {
#ca-watch.icon a {
    width: 100% !important;
     padding-top: 2.7em;
    height: auto !important;
    display: block;
    margin: 0;
     padding: 0;
    vertical-align: bottom;
}
}


#left-navigation,
#contentSub,
#right-navigation {
#contentSub2 {
     margin-top: 2.75em;
     margin: 0 !important;
    padding: 0 !important;
    display: none;
    /* opcional: se quiser sumir com tudo */
}
}


#p-personal {
/* Discord */
     text-shadow: 0 0 2px #FEFEFE, 0 0 4px #FFF;
#n-Discord {
     font-size: 10px;
    line-height: 1.5em;
}
}


#pt-anonuserpage {
#p-Discord-label {
     margin-bottom: 0.8em;
     display: none;
}
}


/* Fix the `More` tab */
#n-Discord a {
#p-search,
    color: #fff !important;
div#mw-head div.vectorMenu h3 {
    font-weight: bold;
     margin-top: 1px;
     border-radius: 4px;
     background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAABkCAIAAADITs03AAAAO0lEQVR4AeSKhREAMQzDdN5/5uixuEKDpqgBjl2f78wd2DVj1+26/h///PfteVMN7zoGebcg1/Y/ZQQAlAUtQCujIJMAAAAASUVORK5CYII=);
    border: 1px solid #4c57d0;
     background-repeat: repeat-x;
     background-color: #5865f2;
     background-position: bottom left;
    display: block;
    position: relative;
    padding: 4px 4px 3px calc(14px + 6.5px * 2);
     box-shadow: 0 2px 3px rgba(0, 0, 0, 0.1);
     transition: 0.2s;
}
}


#p-search,
#n-Discord a::before {
div#mw-head div.vectorMenu h3,
    font-weight: normal;
div#mw-head div.vectorMenu h3 a {
    opacity: 0.85;
     height: 2.2em;
     margin-left: 1.25em
}
}


div#mw-head div.vectorMenu h3 a:after {
#n-Discord a::after {
     content: '';
     content: '';
     display: block;
     background: url(/images/7/76/Discord-brands.png) no-repeat;
    width: inherit;
     background-size: contain;
    height: 2.2em;
     background-position: center;
     margin: 1px 0 0 1px;
     background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAuCAIAAABmjeQ9AAAAQ0lEQVR4AWVOhQEAIAzC/X+xAXbXeoDFGA3A9yk1n4juBROcUegfarWjP3ojZvEzxs6j+nygmo+zzsk79nY+tOxdEhlf3UHVgUFrVwAAAABJRU5ErkJggg==);
     background-repeat: no-repeat;
     background-repeat: no-repeat;
     background-position: bottom right;
     filter: drop-shadow(0 1px 1px rgba(0, 0, 0, 0.1));
    position: absolute;
    top: 2px;
    left: 4px;
    width: 20px;
    height: 20px;
}
}


#p-search {
#n-Discord a:hover {
     margin: 1px 0 0 0.5em;
     text-decoration: none;
     padding: 0 0.5em;
    background-color: #7885ff;
    border-color: #6c77f0;
     transition: .3s
}
}


#p-cactions > .menu { top: 2.2em; }
/* css atual */
/* ESTILIZAÇÃO PADRÃO */


/* Background Ends Here */
.thumb .thumbcaption .magnify:first-child {
    display: none;
}


/* Faster visible changes */
html {
tr.hide {
    scroll-behavior: auto;
visibility: collapse;
    /*smooth*/
}
}
.hide:not(tr) {
 
display: none;
.dark-mode:root {
    --content-bg: #fcfcfc;
}
}
/* Faster visible changes ends here */


.tabs-label {
:root {
border-radius: 0 0 0 0 !important;
    --content-bg: #fcfcfc;
    --content-text: #000;
    --simpleSearch-bg: #fff;
    --searchInput-text: #aaaaaa;
    --link-text: #0645ad;
    --lightGray: rgba(240, 240, 240);
    --gray: rgb(190, 190, 190);
    --transparent-blue: #338be58c;
    --blue: #338be5;
}
}


.tabs-container {
.dark-mode:root {
border-radius: 0 0 0 0  !important;
    --content-bg: #fcfcfc;
}
}


table.wikitable.stripe > * > tr:nth-child(even) > td,
a:visited,
table.wikitable.stripe2 > * > tr:nth-child(4n+1) > td,
a {
table.wikitable.stripe2 > * > tr:nth-child(4n+2) > td {
    color: var(--link-text) !important;
background-color: #fdfdfd;
}
}


.summon_template a,
/*
.summon_template a.extiw,
body {
.summon_template a.extiw:visited {
position: relative;
  color: white;
  display: inline-block;
  border-bottom: 1px dotted;
}
}
.summon_template a:hover, .summon_template a:active {
body {
  text-decoration: none;
position: relative;
}
}
.summon_template span.image_link a:nth-child(1) {
 
   border-bottom: 0; !important;
body::before {
content: '';
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100vh;
background: url('https://wiki.gla.com.br/images/3/35/Fundodawikiglatest.png') no-repeat;
filter: brightness(0.8);
    
background-attachment: fixed;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
z-index: -1;
}
}
table.summon_template {
*/
    color: white;
body {
    border-spacing: 0;
    border-collapse: separate;
    border-width: 0 5px 0 5px;
    border-style: solid;
     position: relative;
     position: relative;
     width: 627px;
     background-image: url(/images/3/31/Cinza_capriw.png);
    background-repeat: repeat;
    background-attachment: fixed;
}
}
table.summon_template .caption {
 
    background-color: rgba(0, 0, 0, 0.1);
/*
    text-align: center;
  h1,
     font-size: 16pt;
  h2 {
      margin-bottom: 0.6em;
      border-bottom: 0px !important;
  }
  */
#firstHeading {
     border-bottom: 0px !important;
}
}
table.summon_template .subcaption {
 
     background-color: rgba(0, 0, 0, 0.05);
#simpleSearch {
    text-align: center;
     background-color: var(--simpleSearch-bg) !important;
    font-size: 12pt;
}
}
table.summon_template tr > th .tooltiptext {
 
     font-size: 14px;  
#p-personal {
     font-weight: normal;
     right: 1em;
     top: .5em;
}
}
table.summon_template tr > th {
 
     background: rgba(0, 0, 0, 0.5);
#p-search {
     border-style: solid;
     float: left;
     border-width: 5px;
     margin-left: -0.1em;
     text-align: center;
     margin-right: 1em;
     margin-top: -0.4em;
}
}
table.summon_template tr > td {
 
     background: rgba(0, 0, 0, 0.3);
#searchInput {
     border-style: solid;
     background-color: #231813;
     border-width: 5px;
    color: var(--searchInput-text);
     text-align: center;
    width: 100%;
    height: 2.15384615em;
     border: 1px solid #524136;
     padding: 5px 2.15384615em 5px 0.4em;
    font-family: inherit;
     font-size: 0.8125em;
    direction: ltr;
}
}
.summon_template.fire {
 
     background: #fc9084;
.mw-body {
     border-color: #fc9084;
     margin-top: -1px;
    border: 2px solid #5c3f2b !important;
     border-right-width: 2px !important;
}
}
.summon_template.fire td, .summon_template.fire th {
 
     border-color: #fc9084;
/* Force lining numbers in headers (for fonts like Georgia) */
h1,
h2,
.firstHeading {
     -moz-font-feature-settings: "lnum";
    -webkit-font-feature-settings: "lnum";
    font-feature-settings: "lnum";
}
}
.summon_template.water {
 
     background: #84c6fc;
/* Consistent size for sub/sup */
     border-color: #84c6fc;
.mw-body sub,
.mw-body sup,
span.reference
 
/* for Parsoid */
     {
     font-size: 80%;
}
}
.summon_template.water td, .summon_template.water th {
 
     border-color: #84c6fc;
 
/* Hide confusing "Discussion" tab on [[Project:Support_desk]],
      * For sanity, only do this if [[Project_talk:Support_desk]] is a
      * redirect (which goes back to [[Project:Support_desk]]).
      * If that is changed for some reason, it automatically comes back.
      */
.page-Project_Support_desk #ca-talk a.mw-redirect {
     display: none;
}
}
.summon_template.earth {
 
     background: #ba9072;
/* CSS Hover Gallery for Mediawiki */
     border-color: #ba9072;
 
.gallery_zoom_img img {
     -moz-transition: -moz-transform 0.1s ease-in;
     -webkit-transition: -webkit-transform 0.1s ease-in;
    -o-transition: -o-transform 0.1s ease-in;
    transition: transform 0.1 ease-in;
}
}
.summon_template.earth td, .summon_template.earth th {
 
     border-color: #ba9072;
.gallery_zoom_img img:hover {
     -moz-transform: scale(2);
    -webkit-transform: scale(2);
    -o-transform: scale(2);
    transform: scale(2);
}
}
.summon_template.wind {
 
     background: #b4f090;
/*--------------------------------------------------
    border-color: #b4f090;
      CSS CUSTOMIZADO
      --------------------------------------------------*/
 
/*--------------------------------------------------
      Vector
      --------------------------------------------------*/
 
.vector-menu-tabs li {
     background: transparent;
}
}
.summon_template.wind td, .summon_template.wind th {
 
     border-color: #b4f090;
/*--------------------------------------------------
      Tabber
      --------------------------------------------------*/
 
.center-tab .tabber__header {
     justify-content: center;
}
}
.summon_template.light {
 
     background: #f0f08a;
/*--------------------------------------------------
    border-color: #f0f08a
      Tags de uso generalizado
      --------------------------------------------------*/
 
.mt-1 {
     margin-top: .75em;
}
}
.summon_template.light td, .summon_template.light th {
 
     border-color: #f0f08a
.mt-2 {
     margin-top: 1.5em;
}
}
.summon_template.dark {
 
     background: #8472c0;
.mt-4 {
    border-color: #8472c0
     margin-top: 3em;
}
}
.summon_template.dark td, .summon_template.dark th {
 
     border-color: #8472c0
.mt--4 {
     margin-top: -2em;
}
}


.weapon_template a {
.mb-2 {
  color: white;
    margin-bottom: 1em;
  display: inline-block;
  border-bottom: 1px dotted;
}
}


.weapon_template a:hover, .weapon_template a:active {
 
  text-decoration: none;
.d-flex,
.td-flex td {
    display: flex;
}
}


.weapon_template span.image_link a:nth-child(1) {
.d-block {
  border-bottom: 0; !important;
    display: block;
}
}


.weapon .image_assets-sprite img {
.relative {
     outline: 1px dashed #000;
     position: relative;
}
}


span.image_link {
.text-justify {
  white-space: nowrap;
    text-align: justify;
}
}


span.image_link.white a:nth-child(1) {
.align-center {
  border-bottom: 0px;
    align-items: center;
}
}


span.image_link.white a:nth-child(2) {
.align-top {
  color: white;
    align-items: flex-start;
  display: inline-block;
  border-bottom: 1px dotted;
}
}


span.image_link.white a:hover, span.item_link.white a:active {
.justify-between {
  text-decoration: none;
    justify-content: space-between;
}
}


span.bold_link > a {
.justify-center {
  font-weight: bold;
    justify-content: center;
}
}


ul.elementlist {
.border-none {
list-style: none;
    border: none !important;
margin-left: 0.7em;
margin-top: 0;
}
}


ul.elementlist li {
.w-25 {
/* Text color */
    width: 25%;
color: black;
}
}


ul.elementlist li:before {
.h-100 {
     /* Unicode bullet symbol */
     height: 100%;
    content: '\25a0 ';
    /* Bullet color */
    color: black;
    padding-right: 0.5em;
}
}


ul.elementlist li.fire:before {
.flex-wrap {
color: rgb(250,70,50);
    flex-wrap: wrap;
}
}
ul.elementlist li.water:before {
 
color: rgb(50,160,250);
.section-title {
    display: block;
    border-radius: 8px;
    background: linear-gradient(to bottom, #459cca, #5684c8);
    width: fit-content;
    color: white;
    padding: .25em 5em;
    letter-spacing: 1px;
}
}
ul.elementlist li.earth:before {
 
color: rgb(140,70,20);
.badge {
    padding: .25em .57em;
    margin: .45em;
    border-radius: 6px;
    color: white;
    font-weight: bold;
    text-transform: capitalize;
    white-space: nowrap;
    max-height: 1.5em;
    font-size: .9em;
    letter-spacing: 1px;
    box-shadow: rgb(3 102 214 / 30%) 0px 0px 0px 3px;
    background: linear-gradient(to bottom, #459cca, #5684c8);
}
}
ul.elementlist li.wind:before {
 
color: rgb(130,230,70);
.card {
    width: 100%;
    min-height: 14em;
    margin: 0 auto;
    border-radius: 10px;
    box-shadow: rgb(0 0 0 / 9%) 0px 3px 12px;
}
}
ul.elementlist li.light:before {
 
color: rgb(230,230,60);
.card-title {
    display: block;
    padding: .25em 0;
    margin-bottom: 1em;
    width: 100%;
    border-radius: 10px 10px 0 0;
    background: linear-gradient(to bottom, #459cca, #5684c8);
 
    font-size: 1.2em;
    font-weight: bold;
    text-align: center;
    letter-spacing: 1px;
    color: white;
}
}
ul.elementlist li.dark:before {
 
color: rgb(50,20,150);
.scaleUp-hover {
    transition: all .25s ease;
    image-rendering: auto;
    /* ou crisp-edges */
}
}


/* Tabber start */
.scaleUp-hover:hover {
.tabber .tabbertab {
    transform: scale(1.1);
border: none;
padding: 0;
}
}


ul.tabbernav {
 
    margin: 0;
/*--------------------------------------------------
    padding: 3px 0;
      Tooltip
    border: 0;
      --------------------------------------------------*/
    /*border-bottom: 1px solid #CCC;*/
 
     font: bold 14px Ariel, sans-serif !important;
.simple-tooltip-inline {
     border: none !important;
}
}


ul.tabbernav li a {
.tooltipster-default {
     border-radius: 4px !important;
     background-color: rgb(220, 220, 220);
     padding: 3px .5em;
     color: black !important;
     margin-left: 3px;
     box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;
    border: 1px solid #CCC;
    background: #F2F7FF;
    text-decoration: none;
    line-height: 1;
}
}


ul.tabbernav li.tabberactive a {
.tooltipster-arrow {
     background-color: #FFF;
     borde-color: rgb(220, 220, 220) !important;
    border: 1px solid #7ec0ee !important;
}
}


ul.tabbernav li.tabberactive a:hover {
#bigImage {
     color: #000;
     position: absolute;
     background: #FFF;
     transform: translate(0, -100%);
    border: 1px solid #7ec0ee !important;
}
}


/* Hides invididual raid image from Six-Dragon Advent page */
/**********************************
.tabber-images + p > img:first-child {
          Widget:GlobalEventTimer
     display: none;
          **********************************/
.global-event-widget {
    position: relative;
     display: flex;
    justify-content: center;
    align-items: center;
    width: 320px;
    height: 90px;
    margin: 0 auto;
    text-align: center;
    overflow: hidden;
}
}
/* Tabber end */


/* used for vertical alignment of tabber contents */
.global-event-image {
#mw-content-text > .wikitable:first-child tr:nth-child(2) > td:nth-child(2) > div > .tabber {
     width: 100%;
     min-height: 436px;
    max-height: 1000px;
     height: 100%;
     height: 100%;
    object-fit: cover;
}
#global-event-time {
    position: absolute;
    bottom: 3%;
    left: 3px;
    padding: 2px 5px;
    font-size: 1.2em;
    font-weight: bold;
    color: #fff;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8);
    background: linear-gradient(to right, rgba(25, 25, 25, 0.85), rgba(0, 0, 0, 0));
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
    max-width: fit-content;
}
/**********************************
      WIDGET: PAGEVIDEO
      **********************************/
.pagevideo-wrapper {
     display: flex;
     display: flex;
    flex-direction: column;
     justify-content: center;
     justify-content: center;
    align-items: flex-start;
    margin: 20px auto;
    width: 100%;
}
}


#mw-content-text > .wikitable:first-child tr:nth-child(2) > td:nth-child(2) > div > .tabber > .tabbernav {
.pagevideo {
     margin-bottom: auto;
    width: 100%;
    max-width: 800px;
    height: auto;
    border: 1px solid #ccc;
    border-radius: 5px;
     background-color: #000;
}
}


#mw-content-text > .wikitable:first-child tr:nth-child(2) > td:nth-child(2) > div > .tabber > .tabbertab {
@media screen and (max-width: 768px) {
    margin-bottom: auto;
    .pagevideo {
        max-width: 100%;
    }
}
}


/* hide title on Main_Page */
/**********************************
body.page-Main_Page.action-view h1.firstHeading, body.page-Main_Page.action-submit h1.firstHeading { display: none; }
      MEDIAWIKI: SIMBOLO DE LINKS EXTERNOS
      **********************************/
.mw-parser-output .external {
    background-image: none !important;
    padding-right: 0 !important;
}


/* hide discussion on Main_Page */
/**********************************
.page-page-Main_Page #ca-talk { display: none !important; }
      PREDEFINIÇÃO: Titulo
      #firstHeading {
      display: none;
  }
      **********************************/
 
 
#custom-title {
    display: inline-block;
    display: block;
    text-align: left;
}


#custom-title img {
    display: inline-block;
}


/* Gallery "tweaks" */
/*--------------------------------------------------
/* auto-expand gallery slideshow images */
      Pagina Inicial
.gallerybox { display: inline-block !important; }
      --------------------------------------------------*/
/* hide gallery expand slideshow images button */
.initialPage--table {
.oo-ui-iconElement-icon.oo-ui-icon-imageGallery { display: none !important; }
    width: 100%;
/* remove ugly margin */
    text-align: center;
.gallery.mw-gallery-slideshow { margin: 0 !important; }
}


/* Tooltip */
.initialPage--table>tbody>tr>th,
.tooltip {
.initialPage--table>tbody>tr>td {
  position: relative;
    background: transparent !important;
  display: inline;
  border-bottom: 1px dotted black;
}
}


.tooltiptext {
.initialPage--title,
  visibility: hidden;
.initialPage--events {
  min-width: 250px;
    border: none;
  padding: 12px 14px;
    border-collapse: separate;
 
  position: absolute;
  left: 50%;
  bottom: calc(20px + 100%);
  z-index: 99999;
 
  background: #fff;
  box-shadow: 0 2px 0 0 rgba(0,0,0,0.15);
  border: 1px solid #a2a9b1;
  border-radius: 2px;
 
  white-space: normal;
  font-weight: normal;
  font-style: initial;
  text-align: center;
  font-size: 14px;
  line-height: 1.6;
}
}


.tooltiptext:after,
.initialPage--events th,
.tooltiptext:before {
.initialPage--title th {
  content: '';
    color: black !important;
  position: absolute;
    padding: .4em;
  left: 50%;
  border-style: solid;
}
}


.tooltiptext:after {
.initialPage--title th {
  top: 100%;
    background-color: transparent !important;
  bottom: auto;
    font-size: 2em;
  width: 20px;
  height: 20px;
  background: #fff;
  margin-top: -10px;
  margin-left: -10px;
  box-shadow: 1px 1px 0px #a2a9b1;
  transform: rotate(45deg);
  border-width: 0;
}
}


.tooltiptext:before {
.initialPage--events {
  top: 100%;
    display: flex;
  bottom: auto;
    height: 20em;
  border-width: 18px;
  margin-left: -18px;
  border-color: rgba(0,0,0,0.15) transparent transparent transparent;
  pointer-events: none;
}
}


.tooltip .tooltip .tooltiptext,
.initialPage--eventsLogo {
.header-fixed-helper .tooltip .tooltiptext {
    height: 100%;
  bottom: auto;
    padding: .5em 3.5em 2em 0;
  top: calc(20px + 100%);
    display: flex;
    align-items: center;
}
}


.tooltip .tooltip .tooltiptext:after,
.initialPage--events td {
.header-fixed-helper .tooltip .tooltiptext:after {
    text-align: center;
  top: auto;
    display: flex;
  bottom: 100%;
    align-items: center;
  border-width: 15px;
    justify-content: flex-end;
  margin-left: -15px;
  border-color: transparent transparent white transparent;
  width: 0;
  height: 0;
  box-shadow: none;
  background: none;
  transform: none;
}
}


.tooltip .tooltip .tooltiptext:before,
.initialPage--mainContainer {
.header-fixed-helper .tooltip .tooltiptext:before {
    display: flex;
  top: auto;
    align-items: flex-start;
  bottom: 100%;
  border-width: 16px;
  margin-left: -16px;
  border-color: transparent transparent #888 transparent;
}
}


.tooltiptext span.hr {
.initialPage--menuContainer {
     display: block;
     width: 75%;
    height: 1px;
     margin-right: 1.5em;
     background-color: #a2a9b1;
}
}


.tooltiptext hr,
.initialPage--sideMenuContainer {
.tooltiptext span.hr {
    width: 25%;
  margin: 10px 0 12px;
  position: relative;
  background: none;
}
}


.tooltiptext hr:after,
.initialPage--menuTitle {
.tooltiptext span.hr:after {
    display: block;
  content: '';
    text-align: center;
  display: block;
    width: 100%;
  width: 100%;
    font-size: 1.75em;
  height: 1px !important;
    font-weight: bold;
  position: absolute;
 
  left: -14px;
    background: linear-gradient(to bottom, #459cca, #5684c8);
  background: #a2a9b1;
    border-radius: 10px 10px 0 0;
  padding: 0 14px;
    color: white;
}
}


.tooltip:hover > .tooltiptext,
.initialPage--menu {
.tooltip.hover > .tooltiptext {
    display: flex;
  visibility: visible;
    flex-wrap: wrap;
}
}


.tooltiptext {
.initialPage--menuItemContainer {
  opacity: 0;
    display: flex;
  transition: opacity 200ms ease, visibility 0s ease 200ms, transform 200ms ease;
    justify-content: center;
  transform: translate(-50%, 8px);
    flex-wrap: wrap;
 
    padding: 1em 0;
}
}


.tooltip .tooltip .tooltiptext,
.initialPage--menuItem {
.header-fixed-helper .tooltip .tooltiptext {
    width: 22.5%;
  transform: translate(-50%, -8px);
}
}


.tooltip:hover > .tooltiptext,
.initialPage--menuItem a img {
.tooltip.hover > .tooltiptext {
    width: 100%;
  opacity: 1;
  transition-delay: 0s;
  transform: translate(-50%, 0);
}
}


.tooltiptext a { color: #0645ad; border-bottom: 0; }
.initialPage--socialMediaContainer {
.tooltiptext a:visited { color: #0b0080; }
    box-sizing: border-box;
.tooltiptext a:active { color: #faa700; }
    width: 100%;
.tooltiptext a:hover, a:focus { text-decoration: underline; }
    margin-top: 8em;
.tooltiptext { color: #252525; }
    padding: 0 1.5em;
.tooltiptext a.new { color: #ba0000; }
}


/* Remove .mw-body-content stacking context so the tooltip can
.initialPage--socialMedia {
  overlap with elements outside content area and be shown properly */
    position: relative;
.mw-body-content { z-index: auto; }
    border-top: 2px solid #689cc0;
    margin-top: 1em;
}


/* Fixes border-bottom on tooltips in Weapon/Summon template */
.initialPage--socialMedia:before {
.summon_template a,
    content: '';
.summon_template .tooltip,
    position: absolute;
.summon_template .image_link .tooltip a:nth-child(2),
    top: -2px;
.weapon_template a,
    display: block;
.weapon_template .tooltip,
    width: 0;
.weapon_template .image_link .tooltip a:nth-child(2) {
    height: 2px;
  border-bottom: 1px dotted white;
    z-index: 1;
    transition: width .25s ease;
}
}


.summon_template sup a,
.initialPage--socialMedia:hover::before {
.summon_template .tooltip a,
    width: 100%;
.summon_template .image_link .tooltip,
.weapon_template sup a,
.weapon_template .tooltip a,
.weapon_template .image_link .tooltip {
  border-bottom: none;
}
}


.flow-post .flow-post-content {
.initialPage--socialMediaLink {
  overflow: visible;
    display: flex;
    justify-content: space-between;
    align-items: center;
 
    font-size: 1.35em;
    font-weight: 600;
    letter-spacing: .03em;
    color: #689cc0 !important;
 
    padding: .9em .5em;
    transition: color .25s ease;
}
}


/* Tooltip End */
.initialPage--socialMediaLink:visited {
    color: #689cc0 !important;
}


.initialPage--socialMediaLink:hover {
    text-decoration: none;
}


.gridrec td {
.socialMedia--svg {
  background: white; padding: 4px;
    display: flex;
    align-items: center;
}
}
.gridrectoptext td {
 
  vertical-align: text-top;
.socialMedia--svg svg {
    width: 2em;
    fill: #689cc0;
    transition: all .25s ease;
}
}


/* start of styles for Template:GallerySwapImages */
.socialMedia--svg svg path {
.gallery-swap-images {
    fill: inherit;
  display: inline-block;
  position: relative;
  vertical-align: middle
}
}
.gallery-swap-images > a,
 
.gallery-swap-images > img,
/*
.gallery-swap-images > span {
      Discord
  position: absolute;
      */
  top: 0;
 
  left: 0;
.initialPage--socialMedia.discord>.initialPage--socialMediaLink:hover {
  opacity: 0;
    color: #5865f2 !important;
  pointer-events: none;
  transition: opacity 400ms ease;
}
}
.gallery-swap-images .active {
 
  opacity: 1;
.initialPage--socialMedia.discord:before {
  pointer-events: auto;
    background: #5865f2;
  transition: opacity 200ms ease;
}
}
.gallery-swap-images:not(.enabled) :first-child {
 
  opacity: 1;
.initialPage--socialMedia.discord>.initialPage--socialMediaLink:hover>.socialMedia--svg svg {
  pointer-events: auto;
    fill: #5865f2 !important;
  transition: none !important;
}
}
/* end of styles for Template:GallerySwapImages */


/* start of styles for Character Tracker */
/*
.tracker-wrap {
      Instagram
  max-width: 1050px;
      */
 
.initialPage--socialMedia.instagram>.initialPage--socialMediaLink:hover {
    color: #f09433 !important;
}
}
.tracker-item {
 
  float: left;
.initialPage--socialMedia.instagram:before {
  padding: 7px 7px 0px 7px;
    background: linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);
  margin: 1px;
  line-height: 0;
  border-radius: 5px;
  border: 1px solid lightgrey;
  opacity: 0.7;
}
}
.tracker-hide-uncap > .tracker-item {
 
  padding: 7px;
.initialPage--socialMedia.instagram>.initialPage--socialMediaLink:hover>.socialMedia--svg svg {
    fill: url(#gradient-vertical);
}
}
.tracker-item.selected {
 
  background-color: #f1b7a5;
/*
  border-color: #be3f21;
      Facebook
  opacity: 1;
      */
 
.initialPage--socialMedia.facebook>.initialPage--socialMediaLink:hover {
    color: #4267B2 !important;
}
}
.tracker-box {
 
  display: inline-block;
.initialPage--socialMedia.facebook:before {
    background: #4267B2;
}
}
.tracker-filter-group {
 
  display: inline-block;
.initialPage--socialMedia.facebook>.initialPage--socialMediaLink:hover>.socialMedia--svg svg {
  margin-right: 0.2em;
    fill: #4267B2 !important;
}
}
.tracker-wrap label {
 
  font-size: 12px;
/*--------------------------------------------------
  line-height: 1.5;
      Ocultação de componentes
      --------------------------------------------------*/
 
#p-navigation {
    background-color: transparent;
}
}
.tracker-uncap {
 
  position: relative;
#mw-head-base {
  height: 16px;
    background-color: transparent;
  width: 84px;
    width: auto !important;
  padding: 1px 0 0 0;
  margin: 0;
  text-align: center;
}
}
.tracker-hide-uncap .tracker-uncap {
 
  display: none;
#mw-page-base {
    background: transparent;
}
}
.tracker-uncap-star {
 
  position: relative;
#mw-panel #p-tb h3 {
  display: inline-block;
    color: rgb(0, 0, 0);
  width: 16px;
    font-size: .75em;
  height: 16px;
  padding: 0;
  margin: 0;
  background-size: 75%;
  background-repeat: no-repeat;
}
}
.tracker-uncap-base {
 
  background-image: url(https://gbf.wiki/images/d/d1/Icon_Yellow_Star_Empty.png)
#p-tb {
    display: none;
}
}
.tracker-uncap-base.selected {
 
  background-image: url(https://gbf.wiki/images/9/9a/Icon_Yellow_Star.png)
/* #ca-nstab-mediawiki { display: none; } */
/* #ca-talk { display: none; } */
#ca-view {
    display: none;
}
}
.tracker-uncap-max {
 
  background-image: url(https://gbf.wiki/images/c/c4/Icon_Blue_Star.png)
#ca-history {
    display: none;
}
}
.tracker-uncap-max.selected {
 
  background-image: url(https://gbf.wiki/images/7/7b/Icon_Blue_Star_Full.png)
#ca-viewsource {
    display: none !important;
}
}
.tracker-filter-options {
 
  margin-bottom: 4px;
/* #ca-unwatch { display: none; } */
/* #p-cactions { display: none; } */
/*
      Pacientes
      */
 
.table-pacients {
    display: block;
    max-width: 1400px;
    overflow-x: auto;
}
}


.mw-ui-button.mw-ui-disabled {
.table-pacients img {
  background: #e2e5e8 !important;
    width: 15.715em;
  color: #495057 !important;
    height: auto;
  border-color: #9aa0a7 !important;
  cursor: initial;
}
}


.label + .mw-ui-button-group.items > label:first-child {
/*
  border-radius: 0;
      PERSONAGENS
      */
 
.filter--containerSearch {
    display: flex;
    padding: 0 2em;
    justify-content: flex-end;
    align-items: center;
}
}


.tracker-filter-group, .page-filter-group {
.filter--container {
     display: flex;
     display: flex;
     float: left;
     padding: 0 2em;
     margin-bottom: 5px;
     justify-content: space-between;
    align-items: center;
}
}


.tracker-filter-group .label,
.filter {
.page-filter-group .label {
    width: fit-content;
     display: flex;
     display: flex;
    flex-direction: column;
     justify-content: center;
     justify-content: center;
     border-top-right-radius: 0px;
    border: 3px solid #b0cff1;
     border-bottom-right-radius: 0px;
     border-collapse: collapse;
     border-radius: 8px;
}
}


.tracker-filter-group .items,
.filter--title {
.page-filter-group .items {
     display: flex;
     display: flex;
     flex-wrap: wrap;
     border-right: 3px solid #b0cff1;
     flex-grow: 1;
     background: #4c91c9;
     flex-basis: 0;
    padding: 0 1em;
     margin-top: 1px;
    align-items: center;
    border-radius: 4px 0 0 4px;
    font-size: 1.2em;
    letter-spacing: .15em;
     font-weight: bold;
     color: white;
}
 
.filter--icon,
.calcXp--tierIcon {
    padding: .35em .95em;
    background: transparent;
    cursor: pointer;
}
}


.tracker-filter-group .items label,
.filter--icon.tier img {
.page-filter-group .items label {
     filter: grayscale(.0);
     margin-top: -1px;
    flex-grow: 1;
}
}


.tracker-filter-group .items label:first-child,
.filter--icon.tier.active img {
.page-filter-group .items label:first-child {
     box-shadow: none;
     border-left: 0;
}
}


/* end of styles for Character Tracker */
.filter--icon img {
    filter: grayscale(.8);
    border-radius: 10px;
 
    transition: all .25s ease;
}


/* audio player start */
.calcXp--tierIcon img {
.audio-button {
     filter: drop-shadow(0px 1px 8px #4c91c900);
width: 70px;
     border-radius: 10px;
     height: 34px;
    border: none;
    background: url('https://gbf.wiki/images/c/cc/Audioplayer_play.png');
     display: inline-block;


    transition: all .25s ease;
}
}
.audio-button.playing {
 
background: url('https://gbf.wiki/images/e/ef/Audioplayer_stop.png');
.filter--icon.active img {
    box-shadow: rgb(0 0 0 / 24%) 0px 2px 7px;
    filter: grayscale(0);
}
}
/* audio player stop */


/* Tierlist */
.filter--icon.tier.active img,
.tierlist td {
.calcXp--tierIcon.active img {
     padding: 5px !important;
     transform: scale(.85);
}
}


.tierlist.tierlist-multi td {
.filter--icon.tier#bronze.active img,
     max-width: 140px;
.calcXp--tierIcon#bronze.active img {
     filter: drop-shadow(0px 1px 8px #f18a05);
}
}


.tierlist.tierlist-single td:first-child {
.filter--icon.tier#silver.active img,
     max-width: 140px;
.calcXp--tierIcon#silver.active img {
     filter: drop-shadow(0px 1px 8px #8b8b8b);
}
}


.tierlist.tierlist-single {
.filter--icon.tier#gold.active img,
     max-width: 771px;
.calcXp--tierIcon#gold.active img {
     filter: drop-shadow(0px 1px 8px #fbc300);
}
}


.tierlist.tierlist-grades > tbody > tr > td {
.filter--icon.tier#diamond.active img,
     padding: 0 !important;
.calcXp--tierIcon#diamond.active img {
     filter: drop-shadow(0px 1px 8px #0391c5);
}
}


.tierlist hr {
.filter--input {
     box-shadow: 6px 0 #aaa, -6px 0 #aaa;
     box-sizing: border-box;
     margin: 5px 0;
    padding: .45em;
    padding-right: 2.5em;
    border: 3px solid #b0cff1;
    font-size: 1.2em;
    border-radius: 8px;
     width: 23em;
}
}


/* Tierlist Hover */
.filter--inputContainer {
.tierlist-hover-detail {
    box-sizing: border-box;
  position: absolute;
    position: relative;
  z-index: 1;
  left: 0;
  background: #fff;
  border: 1px solid #000;
  padding: 20px;
  box-sizing: border-box;
  pointer-events: none;
}
}


.tierlist-hover-detail td {
.filter--searchButton {
  max-width: none !important;
    cursor: pointer;
    display: inline-block;
    border: 3px solid #b0cff1;
    position: absolute;
    width: 4.5em;
    height: -webkit-fill-available;
    right: 0;
    bottom: 0;
    border-radius: 0 8px 8px 0;
    background: #4c91c9;
 
}
}


.tierlist-hover-detail .wikitable {
.filter--searchButton img {
  margin: 0;
    filter: invert(1);
}
}


.tierlist a[refid]:hover > img {
.calcXp--container {
  position: relative;
    box-sizing: border-box;
  z-index: 2;
    padding: 2.25em 1.25em;
  box-shadow: 0 0 0 20px #fff, 21px -21px 0 #333, -21px -21px 0 #333, -21px 1px 0 #333, 21px 1px 0 #333;
    width: 43em;
    border: 3px solid #b0cff1;
    border-radius: 26px;
}
}


.tierlist.tierlist-multi .tierlist-hover-detail {
.calcXp--resultTitle {
  width: 1192px;
    text-align: center;
    color: #4f7ca0;
    margin: 0;
    margin-top: -.5em !important;
    letter-spacing: .05em;
}
}


.tierlist img {
.calcXp--formItem {
     display: inline-flex;
     display: flex;
     align-items: center;
     align-items: center;
     justify-content: center;
}
 
.calcXp--formItem input {
    box-sizing: border-box;
    padding: .35em;
    border: 2px solid #b0cff1;
     border-radius: 8px;
     text-align: center;
     text-align: center;
     line-height: 1;
     font-size: 1em;
    font-weight: bold;
    letter-spacing: .05em;
    width: 4em;
}
}


/* Stamps Search */
.calcXp--formItem span {
.stampbox .hide {
    font-size: 1.225em;
  display: none;
    font-weight: 500;
    letter-spacing: .05em;
    margin-right: .5em;
    color: #386a93;
}
}


/* Default style for navigation boxes */
#calculate-btn {
.navbox {                     /* Navbox container style */
    box-sizing: border-box;
box-sizing: border-box;
    cursor: pointer;
border: 1px solid #a2a9b1;
    display: block;
width: 100%;
    width: 15em;
clear: both;
    margin: 2em auto;
font-size: 88%;
    padding: .45em 1em;
text-align: center;
 
padding: 1px;
    border: none;
margin: 1em auto 0;       /* Prevent preceding content from clinging to navboxes */
    border-radius: 6px;
    background: #4c91c9;
    box-shadow: rgb(0 0 0 / 24%) 0px 3px 8px;
    color: white;
 
    font-size: 1.35em;
    text-transform: capitalize;
    letter-spacing: 0.05em;
    font-weight: bold;
    transition: .35s ease;
}
}
.navbox .navbox {
 
margin-top: 0;           /* No top margin for nested navboxes */
#calculate-btn:hover {
    color: #ffffff;
    box-shadow: rgb(0 0 0 / 8%) 0px 3px 8px;
    transform: scale(.95);
    background: #4685b8;
}
}
.navbox + .navbox {
 
margin-top: -1px;         /* Single pixel border between adjacent navboxes */
#calc-result {
    margin-top: 1em;
    display: flex;
    justify-content: center;
}
}
.navbox-inner,
 
.navbox-subgroup {
#calc-result .badge {
width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    max-height: 5em;
    width: 5em;
}
}
.navbox-group,
 
.navbox-title,
.calcXp--xpIcon {
.navbox-abovebelow {
    margin-left: -.2em;
padding: 0.25em 1em;      /* Title, group and above/below styles */
line-height: 1.5em;
text-align: center;
}
}
th.navbox-group {             /* Group style */
 
white-space: nowrap;
.calcXp--numberOfPots {
/* @noflip */
    padding-top: .2em;
text-align: right;
    font-size: 1.15em;
}
}
.navbox,
 
.navbox-subgroup {
#characters-container {
background-color: #fdfdfd; /* Background color */
    display: flex;
    flex-wrap: wrap;
    padding: 1em;
}
}
.navbox-list {
 
line-height: 1.5em;
#characters-container>div {
border-color: #fdfdfd;   /* Must match background color */
    box-sizing: border-box;
    display: none;
    padding: 1em;
    width: 19%;
    margin-right: 1%;
}
}
/* cell spacing for navbox cells */
 
tr + tr > .navbox-abovebelow,
#characters-container>div.show {
tr + tr > .navbox-group,
    display: block;
tr + tr > .navbox-image,
tr + tr > .navbox-list {   /* Borders above 2nd, 3rd, etc. rows */
border-top: 2px solid #fdfdfd; /* Must match background color */
}
}
.navbox th,
 
.navbox-title {
#characters-container>div>a>img {
background-color: #ccccff;     /* Level 1 color */
    width: 100%;
    border-radius: 8px;
    filter: grayscale(.3);
    transition: all .25s ease;
}
}
.navbox-abovebelow,
 
th.navbox-group,
#characters-container>div:hover>a>img {
.navbox-subgroup .navbox-title {
    box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
background-color: #ddddff;     /* Level 2 color */
    filter: grayscale(0);
    transform: scale(1.06);
}
}
.navbox-subgroup .navbox-group,
 
.navbox-subgroup .navbox-abovebelow {
.characterPage--splashArt {
background-color: #e6e6ff;     /* Level 3 color */
    position: absolute;
    top: -2%;
    right: -2%;
    width: 35%;
}
}
.navbox-even {
 
background-color: #f7f7f7;     /* Even row striping */
.characterPage--table {
    margin-top: -4em;
    width: 100%;
}
}
.navbox-odd {
 
background-color: transparent; /* Odd row striping */
.characterPage--table>tbody {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
}
}
.navbox .hlist td dl,
 
.navbox .hlist td ol,
.characterPage--table>tbody>.characterPage--mainSection {
.navbox .hlist td ul,
    display: flex;
.navbox td.hlist dl,
    flex-wrap: wrap;
.navbox td.hlist ol,
    justify-content: space-between;
.navbox td.hlist ul {
    width: 65%;
padding: 0.125em 0;       /* Adjust hlist padding in navboxes */
}
}


/* Default styling for Navbar template */
.characterPage--table>tbody>.characterPage--sideSection {
.navbar {
    box-sizing: border-box;
display: inline;
    display: flex;
font-size: 88%;
    justify-content: center;
font-weight: normal;
    width: 33%;
    padding: 0 1em;
}
}
.navbar ul {
 
display: inline;
.characterPage--characterInfoContainer {
white-space: nowrap;
    width: 43%;
}
}
.mw-body-content .navbar ul {
 
line-height: inherit;
.characterPage--statsInfoContainer {
    width: 55%;
}
}
.navbar li {
 
word-spacing: -0.125em;
.stats--container {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    padding: 1.25em;
}
}
.navbar.mini li abbr[title] {
 
font-variant: small-caps;
.stats--container>div {
border-bottom: none;
    width: 45%;
text-decoration: none;
    display: flex;
cursor: inherit;
    align-items: center;
    justify-content: center;
    margin: .5em;
}
}
/* Navbar styling when nested in infobox and navbox */
 
.infobox .navbar {
.stats--container div img {
font-size: 100%;
    width: 2.25em;
}
}
.navbox .navbar {
 
display: block;
.stats--bar {
font-size: 100%;
    display: flex;
    width: -webkit-fill-available;
    justify-content: space-between;
    padding: 0 1.25em;
}
}
.navbox-title .navbar {
 
/* @noflip */
.bar-filled:first-child,
float: left;
.bar-notFilled:first-child {
/* @noflip */
    border-radius: 6px 0 0 6px;
text-align: left;
/* @noflip */
margin-right: 0.5em;
}
}


/* WIP Character Template */
.bar-filled:last-child,
.character-template > tbody > tr:not(:first-child) { background-color: #fff; }
.bar-notFilled:last-child {
    border-radius: 0 6px 6px 0;
}


/* Tabber Fix */
.bar-filled,
/* Prevents tabber contents from showing up for a few frames before the script executes */
.bar-notFilled {
.tabber:not(.tabberlive) > .tabbertab:not(:first-child) { display: none; }
    display: block;
    width: 18%;
    height: 6px;
}


/* Accordion Gallery Swap Images */
.bar-filled {
.accordion-swap-images {
    background: var(--blue);
  position: relative;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  align-items: stretch;
  overflow: hidden;
  text-align: initial;
}
}
.accordion-swap-images a {
 
  display: block;
.bar-notFilled {
  height: inherit;
    background: var(--transparent-blue);
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: auto;
  transition: flex-shrink 200ms ease 30ms, -webkit-flex 200ms ease 30ms, z-index 0ms linear 0ms;
  z-index: 0;
}
}
.accordion-swap-images a.active, .accordion-swap-images a:hover {
 
  flex-grow: 1;
.characterInfo--name {
  flex-shrink: 0;
    margin: 0 !important;
  flex-basis: auto;
  transition: flex-shrink 200ms ease 30ms, -webkit-flex 200ms ease 30ms, z-index 0ms linear 200ms;
  z-index: 1;
}
}
.accordion-swap-images a img {
 
  width: inherit;
.characterInfo--badgeContainer {
  height: inherit;
    display: flex;
  position: absolute;
    justify-content: center;
    flex-wrap: wrap;
    width: fit-content;
    margin: 0 auto;
}
}


/* ----------------------
.characterInfo--contentContainer {
WORLD PAGE STYLE START
     display: flex;
---------------------- */
     justify-content: space-between;
.mw-body {
     padding: .6em 1.3em;
     background-position: 0 0, 0px -4px, 0 0;
     background-repeat: no-repeat;
     background-size: 100%;
}
}


@media screen and (max-width: 800px) {
.characterInfo--imageContainer {
     .mw-body {
     width: 25%;
        background-size: auto 66%;
        background-position: 0 0, top right, 0 0;
    }
}
}


/* ------------ */
.characterInfo--medal {
/* Phantagrande */
     margin-top: -1.5em;
/* ------------ */
.page-Zinkenstill .mw-body {
     background-image:
        linear-gradient(180deg, rgba(255,255,255,0.6), white),
        url(https://gbf.wiki/images/e/e6/Town_bg_10001.jpg),
        -webkit-linear-gradient(left, #88aeb7 0%,#b8d0d3 5%,#cfe8eb 20%,#d2d4cf 80%,#c7cebd 95%,#afc1c5 100%);
}
}


.page-Port_Breeze_Archipelago .mw-body {
 
     background-image:
.characterInfo--infoContainer {
        linear-gradient(180deg, rgba(255,255,255,0.6), white),
     width: 75%;
        url(https://gbf.wiki/images/2/24/Town_bg_20001.jpg),
    text-align: center;
        -webkit-linear-gradient(left, #88aeb7 0%,#b8d0d3 5%,#cfe8eb 20%,#d2d4cf 80%,#c7cebd 95%,#afc1c5 100%);
}
}


.page-Valtz_Duchy .mw-body {
.characterInfo--infoContainer #toc {
     background-image:
     display: none;
        linear-gradient(180deg, rgba(255,255,255,0.6), white),
        url(https://gbf.wiki/images/3/37/Town_bg_20002.jpg),
        -webkit-linear-gradient(left, #88aeb7 0%,#b8d0d3 5%,#cfe8eb 20%,#d2d4cf 80%,#c7cebd 95%,#afc1c5 100%);
}
}


.page-Auguste_Isles .mw-body {
.characterPage--skins {
     background-image:
     width: 100%;
        linear-gradient(180deg, rgba(255,255,255,0.8), white),
        url(https://gbf.wiki/images/7/7f/Town_bg_20003.jpg),
        -webkit-linear-gradient(left, #88aeb7 0%,#b8d0d3 5%,#cfe8eb 20%,#d2d4cf 80%,#c7cebd 95%,#afc1c5 100%);
}
}


.page-Lumacie_Archipelago .mw-body {
.characterPage--characterSkills {
     background-image:
     width: 100%;
        linear-gradient(180deg, rgba(255,255,255,0.7), white),
        url(https://gbf.wiki/images/e/e9/Town_bg_20004.jpg),
        -webkit-linear-gradient(left, #88aeb7 0%,#b8d0d3 5%,#cfe8eb 20%,#d2d4cf 80%,#c7cebd 95%,#afc1c5 100%);
}
}


.page-Albion_Citadel .mw-body {
/*
     background-image:
      Card de Skins
        linear-gradient(180deg, rgba(255,255,255,0.6), white),
      */
        url(https://gbf.wiki/images/7/7c/Town_bg_20005.jpg),
 
        -webkit-linear-gradient(left, #88aeb7 0%,#b8d0d3 5%,#cfe8eb 20%,#d2d4cf 80%,#c7cebd 95%,#afc1c5 100%);
.skins--container {
     display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    padding: -0.75em 0.75em;
    gap: -0.5em;
    /* Adiciona espaçamento consistente entre os itens */
}
}


.page-Mist-Shrouded_Isle .mw-body {
.skins--container span {
     background-image:
     width: 33.3%;
        linear-gradient(180deg, rgba(255,255,255,0.6), white),
    display: flex;
        url(https://gbf.wiki/images/a/ab/Town_bg_20006.jpg),
    justify-content: center;
        -webkit-linear-gradient(left, #88aeb7 0%,#b8d0d3 5%,#cfe8eb 20%,#d2d4cf 80%,#c7cebd 95%,#afc1c5 100%);
    align-items: center;
}
}


.page-Golonzo_Island .mw-body {
.skins--imageSkin {
     background-image:
     max-width: 100%;
        linear-gradient(180deg, rgba(255,255,255,0.6), white),
    /* Limita o tamanho máximo da imagem */
        url(https://gbf.wiki/images/3/38/Town_bg_20007.jpg),
    max-height: 100%;
        -webkit-linear-gradient(left, #88aeb7 0%,#b8d0d3 5%,#cfe8eb 20%,#d2d4cf 80%,#c7cebd 95%,#afc1c5 100%);
    /* Limita o tamanho máximo da imagem */
    object-fit: contain;
    /* Garante que a imagem se ajusta proporcionalmente */
}
}


.page-Amalthea_Island .mw-body {
/*
     background-image:
      Seção das skills do personagem
        linear-gradient(180deg, rgba(255,255,255,0.7), white),
      */
        url(https://gbf.wiki/images/b/b6/Town_bg_20008.jpg),
 
        -webkit-linear-gradient(left, #88aeb7 0%,#b8d0d3 5%,#cfe8eb 20%,#d2d4cf 80%,#c7cebd 95%,#afc1c5 100%);
.tabsContainer {
     width: 95%;
    margin: 0 auto;
    padding-bottom: .5em;
}
}


.page-Former_Capital_Mephorash .mw-body {
.tabsContainer table {
     background-image:
     width: 100%;
        linear-gradient(180deg, rgba(255,255,255,0.6), white),
    border-collapse: collapse;
        url(https://gbf.wiki/images/d/df/Town_bg_20009.jpg),
        -webkit-linear-gradient(left, #88aeb7 0%,#b8d0d3 5%,#cfe8eb 20%,#d2d4cf 80%,#c7cebd 95%,#afc1c5 100%);
}
}


.page-Agastia .mw-body {
.tabsContainer table>tbody>tr>td {
     background-image:
     border-bottom: 2px solid rgb(225, 225, 225);
        linear-gradient(180deg, rgba(255,255,255,0.6), white),
        url(https://gbf.wiki/images/3/3b/Town_bg_20011.jpg),
        -webkit-linear-gradient(left, #88aeb7 0%,#b8d0d3 5%,#cfe8eb 20%,#d2d4cf 80%,#c7cebd 95%,#afc1c5 100%);
}
}


.page-Dydroit_Belt .mw-body {
.tabSkill--container {
     background-image:
     padding-bottom: .85em;
        linear-gradient(180deg, rgba(255,255,255,0.6), white),
    display: flex;
        url(https://gbf.wiki/images/a/a8/Town_bg_20012.jpg),
    max-width: 72em;
        -webkit-linear-gradient(left, #88aeb7 0%,#b8d0d3 5%,#cfe8eb 20%,#d2d4cf 80%,#c7cebd 95%,#afc1c5 100%);
    overflow-x: auto;
}
}


.page-Silverwind_Stretch_North_Vast .mw-body {
.skillInfo--description::-webkit-scrollbar,
    background-image:
.tabSkill--container::-webkit-scrollbar {
        linear-gradient(180deg, rgba(255,255,255,0.6), white),
    width: 8px;
        url(https://gbf.wiki/images/5/55/Town_bg_20014.jpg),
    height: 8px;
        -webkit-linear-gradient(left, #88aeb7 0%,#b8d0d3 5%,#cfe8eb 20%,#d2d4cf 80%,#c7cebd 95%,#afc1c5 100%);
}
}


.skillInfo--description::-webkit-scrollbar-track,
.tabSkill--container::-webkit-scrollbar-track {
    background-color: #4799c954;
    border-radius: 10px;
}


/* ----------- */
.skillInfo--description::-webkit-scrollbar-thumb,
/* Nalhegrande */
.tabSkill--container::-webkit-scrollbar-thumb {
/* ----------- */
    background-color: rgb(85 135 200 / 74%);
    border-radius: 10px;
}


.page-Merkmal_Island .mw-body {
.tab-skill {
     background-image:
     transition: all .25s ease;
        linear-gradient(180deg, rgba(255,255,255,0.6), white),
    width: 100%;
        url(https://gbf.wiki/images/1/19/Town_bg_21001.jpg),
    min-width: 5em;
        -webkit-linear-gradient(left, #88aeb7 0%,#b8d0d3 5%,#cfe8eb 20%,#d2d4cf 80%,#c7cebd 95%,#afc1c5 100%);
}
}


.page-Groz_Island .mw-body {
.tab-skill.active {
     background-image:
     border-color: #459cca;
        linear-gradient(180deg, rgba(255,255,255,0.75), white),
        url(https://gbf.wiki/images/6/63/Town_bg_21002.jpg),
        -webkit-linear-gradient(left, #88aeb7 0%,#b8d0d3 5%,#cfe8eb 20%,#d2d4cf 80%,#c7cebd 95%,#afc1c5 100%);
}
}


.page-Kluger_Island .mw-body {
.tab-skill>div {
     background-image:
     cursor: pointer;
        linear-gradient(180deg, rgba(255,255,255,0.6), white),
    box-sizing: border-box;
        url(https://gbf.wiki/images/e/ee/Town_bg_21003.jpg),
    width: 100%;
        -webkit-linear-gradient(left, #88aeb7 0%,#b8d0d3 5%,#cfe8eb 20%,#d2d4cf 80%,#c7cebd 95%,#afc1c5 100%);
    display: flex;
    justify-content: center;
    align-items: center;
    padding: .25em;
}
}


.page-Bestia_Island .mw-body {
.tab-skill>div>img {
     background-image:
     width: 100%;
        linear-gradient(180deg, rgba(255,255,255,0.6), white),
    max-width: 40px;
        url(https://gbf.wiki/images/e/e7/Town_bg_21004.jpg),
    height: auto;
        -webkit-linear-gradient(left, #88aeb7 0%,#b8d0d3 5%,#cfe8eb 20%,#d2d4cf 80%,#c7cebd 95%,#afc1c5 100%);
}
}


.page-Reiche_Island .mw-body {
.skillInfo--container {
     background-image:
     width: 100%;
        linear-gradient(180deg, rgba(255,255,255,0.6), white),
        url(https://gbf.wiki/images/0/0b/Town_bg_21005.jpg),
        -webkit-linear-gradient(left, #88aeb7 0%,#b8d0d3 5%,#cfe8eb 20%,#d2d4cf 80%,#c7cebd 95%,#afc1c5 100%);
}
}


.page-Starke_Island .mw-body {
.skillInfo--container>td {
     background-image:
     border: none !important;
        linear-gradient(180deg, rgba(255,255,255,0.6), white),
        url(https://gbf.wiki/images/0/0f/Town_bg_21006.jpg),
        -webkit-linear-gradient(left, #88aeb7 0%,#b8d0d3 5%,#cfe8eb 20%,#d2d4cf 80%,#c7cebd 95%,#afc1c5 100%);
}
}


.page-The_Edgelands .mw-body {
.skillInfo {
     background-image:
     display: none;
        linear-gradient(180deg, rgba(255,255,255,0.6), white),
        url(https://gbf.wiki/images/0/0d/Town_bg_21007.jpg),
        -webkit-linear-gradient(left, #88aeb7 0%,#b8d0d3 5%,#cfe8eb 20%,#d2d4cf 80%,#c7cebd 95%,#afc1c5 100%);
}
}


.skillInfo.active {
    display: table-cell;
}


/* ------------ */
.skillInfo.active {
/* Oarlyegrande */
     display: table-cell;
/* ------------ */
 
.page-New_Utopia .mw-body {
     background-image:
        linear-gradient(180deg, rgba(255,255,255,0.6), white),
        url(https://gbf.wiki/images/b/b9/Town_bg_22001.jpg),
        -webkit-linear-gradient(left, #88aeb7 0%,#b8d0d3 5%,#cfe8eb 20%,#d2d4cf 80%,#c7cebd 95%,#afc1c5 100%);
}
}


.skillInfo--videoContainer {


/* Specific page positions */
    align-self: center;
/* (to hide black bar on the top part of some images) */
     width: 45%;
.page-Valtz_Duchy .mw-body {
     background-position: 0 0, 0 calc(-6vw), 0 0;
}
}


.page-Silverwind_Stretch_North_Vast .mw-body {
.skillInfo--skillVideo2 {
     background-position: 0 0, 0 calc(-3vw), 0 0;
     display: none;
    border-radius: 8px;
}
}


.page-The_Edgelands .mw-body {
.skillInfo--skillVideo2.active {
     background-position: 0 0, 0 calc(-0.5vw), 0 0;
     display: flex;
}
}


.page-New_Utopia .mw-body {
.skillInfo--videoSelector {
     background-position: 0 0, 0 calc(-1.6vw), 0 0;
    display: inline-block;
    width: 1.1em;
    height: 1.1em;
    border-radius: 50%;
     background: var(--transparent-blue);
    cursor: pointer;
    margin-right: .85em;
 
    transition: all .25s ease;
}
}


/* --------------------
.skillInfo--videoSelector.active {
WORLD PAGE STYLE END
    background: var(--blue);
-------------------- */
    transform: scale(.8);
}


/* ----------------------------
.skillInfo--infoContainer {
BATTLE RESIST FORMATTING START
    width: 50%;
----------------------------- */
.battle-phase-phase-header {
text-align: center;
background-color: #eaecf0;
}
}


.battle-resist--row > p {
.skillInfo>div>.skillInfo--infoContainer b {
     margin: 0;
     color: #2a87c4 !important;
}
}


.battle-resist--atk {
.skillInfo--infoContainer>center>b {
     color: red;
     font-size: 1.15em;
}
}


.battle-resist--def {
.skillInfo--name {
     color: blue;
    font-size: 1.85em;
    letter-spacing: 1px;
     text-align: center;
}
}


.battle-resist--number {
.skillInfo--description {
     display: inline-block;
     display: inline-block;
     min-width: 35px;
     font-size: 1.03em;
     text-align: right;
    line-height: 1.5em;
    padding: 0 1em;
    height: 12em;
    max-height: 12em;
    overflow-y: auto;
     text-align: justify;
}
}


.battle-resist--hp {
.skillInfo--attributesContainer>h1 {
     min-width: 50px;
    color: #717171;
     padding-right: 4px;
    font-size: 1.4em;
     text-align: center;
     letter-spacing: 1px;
}
}


.battle-resist--atk {
/* card attributes */
     min-width: 90px;
.attribute--cardsContainer {
}
     display: flex;
    align-items: flex-start;
 
    width: fit-content;
    margin: 0 auto;


.battle-resist--def {
    background: var(--lightGray);
     min-width: 55px;
     border: 2px solid var(--gray);
}
}


.battle-resist--debuff {
.cardAttribute {
    box-sizing: border-box;
     display: flex;
     display: flex;
     flex-direction: column;
     flex-direction: column;
     width: auto;
    justify-content: center;
    align-items: center;
     width: 8em;
}
 
.cardAttribute--icon {
    margin: .6em 0;
    height: 2em;
}
 
.cardAttribute--value {
    margin: 0 !important;
 
    font-size: .9em !important;
    font-weight: bold;
    line-height: 1.65em !important;
    letter-spacing: 2px;
     text-align: center;
     text-align: center;
     margin: 0.5em 0 0 0 !important;
     text-transform: uppercase;
}
 
/*------------------------------------
      WANTED
      -----------------------------------*/
 
.selectWanted--container {
    display: flex;
    justify-content: center;
}
 
#selectbox-wanted {
    padding: .35em .5em;
    font-family: sans-serif;
    letter-spacing: .04em;
    font-size: 1.25em;
    width: 21em;
    border: 2px solid #5684c8;
    border-radius: 6px;
}
 
.wantedPortrait--container {
    width: 100%;
}
}


.battle-resist--debuff--resist-immune span.tooltip > a > img  {
.wantedPortrait--title {
     opacity: 0.3;
    width: 100%;
    color: #292929;
    font-size: 1.5em;
    font-weight: bold;
     letter-spacing: .035em;
}
}


.battle-resist--row.battle-resist--debuffs {
.wantedPortraits {
     display: flex;
     display: flex;
     justify-content: space-around;
     flex-wrap: wrap;
     max-width: 800px;
}
     padding-left: 3px;
 
.wantedPortrait {
    box-sizing: border-box;
     width: 18em;
    padding: .35em;
}
 
.wantedPortrait img {
    width: 100%;
}
 
@media screen and (max-width: 1440px) {
    :root {
        font-size: 14px;
     }
 
    .characterInfo--contentContainer {
        padding: .6em;
    }
 
    .characterInfo--infoContainer {
        width: 65%;
    }
 
    .characterInfo--imageContainer {
        width: 35%;
    }
 
    .tabSkill--container {
        max-width: 61em;
        margin: 0 auto;
    }
 
    .tab-skill>div>img {
        max-width: 38px;
    }
 
}
}


/*
@media screen and (max-width: 1220px) {
  This is because status icons are 25x25 in size
    .tabSkill--container {
  However the circle inside the image is only 22px in diameter
        max-width: 48em;
*/
    }
.battle-resist--debuff .battle-resist--debuff--symbol {
    margin-right: 3px;
}
}


/* ----------------------------
  BATTLE RESIST FORMATTING END
----------------------------- */


@media screen and (max-width: 1024px) {
    .flex-wrap-md {
        flex-wrap: wrap;
    }
    .justify-center-md {
        justify-content: center;
    }
    .initialPage--mainContainer {
        flex-wrap: wrap;
    }
    .initialPage--menuContainer {
        width: 100%;
        margin-right: 0;
    }
    .initialPage--sideMenuContainer {
        width: 100%;
        display: flex;
        flex-direction: column;
        margin-top: 1.5em;
    }
    .initialPage--sideMenuContainer .card {
        width: 45%;
        min-height: 15em;
    }
    #event-time {
        bottom: 5%;
        right: 5%;
        font-size: 1.25em;
    }
    .initialPage--socialMediaContainer {
        margin-top: 2em;
        display: flex;
        justify-content: space-between;
    }
    .initialPage--socialMedia {
        width: 32%;
    }
    #p-search {
        margin-right: 1em;
    }
    .filter--containerSearch {
        justify-content: center;
    }
    .filter--container {
        margin-top: 1em;
        flex-wrap: wrap;
        justify-content: center;
    }
    .filter:last-of-type {
        margin-top: 1em;
    }
    #characters-container>div {
        width: 24%;
    }
    .characterPage--splashArt {
        display: none;
    }
    .characterPage--table>tbody>.characterPage--mainSection {
        width: 100%;
        justify-content: flex-start;
    }
    .characterPage--characterInfoContainer {
        width: 38%;
    }
    .characterPage--statsInfoContainer {
        width: 30%;
        margin-left: 1.5%;
    }
    .stats--container>div {
        width: 100%;
    }
    .characterInfo--contentContainer {
        flex-wrap: wrap;
    }
    .characterInfo--imageContainer {
        width: 100%;
        display: flex;
        justify-content: center;
    }
    .characterInfo--medal {
        margin-top: -2.5em;
    }
    .characterInfo--infoContainer {
        width: 100%;
    }
    .tabsContainer {
        width: 100%;
    }
    .tab-skill {
        min-width: 3.5em;
    }
    .tab-skill>div>img {
        max-width: 36px;
    }
    .skillInfo>div {
        flex-wrap: wrap-reverse;
    }
    .skillInfo--infoContainer {
        width: 100%;
    }
    .skillInfo--infoContainer>center>b {
        font-size: 1.2em;
    }
    .skillInfo--name {
        font-size: 2.2em !important;
        letter-spacing: 1px;
        margin-top: .5em !important;
        text-align: center;
    }
    .skillInfo--description {
        font-size: 1.35em !important;
        display: table;
        margin: 1em !important;
        height: 5em;
        max-height: 5em;
    }
    .skillInfo--videoContainer {
        width: 100%;
        margin: 0 auto;
        padding: 1em 10em;
        padding-bottom: 1em;
    }
    .cardAttribute--value {
        letter-spacing: 1px;
        font-size: 1.1em;
    }
    .characterPage--table>tbody>.characterPage--sideSection {
        width: 30%;
        padding-left: 1.5%;
        position: absolute;
        top: 0;
        right: 0;
    }
    .skins--imageSkin {
        width: 100%;
    }
    .skins--container {
        max-height: 14em;
        overflow-x: clip;
        overflow-y: auto;
    }
    .skins--container span {
        width: 50%;
    }
    .calcXp--formItem {
        justify-content: center;
    }
    .calcXp--container:last-of-type {
        margin-top: 2em;
    }
    #p-tb h3 {
        display: none;
    }


/* ---------------------------
OBTAIN LIST FORMATTING START
--------------------------- */
/* Obtain items as raid */
.obtain-list-item,
.obtain-list-item > .image_link {
    display: grid;
    grid-template-columns: 54px auto auto;
    grid-column-gap: 6px;
    align-items: center;
}
}


.obtain-list-item:only-child {
/*******************************************************************************
grid-template-columns: auto 1fr auto;
      PRESET: ABAS
      *******************************************************************************/
.tabela-abas {
    width: 100%;
    border-collapse: collapse;
    text-align: center;
    margin-bottom: 20px;
}
}


/* Obtain items as materials */
.mostrar-aba {
.obtain-list-item > .image_link {
    cursor: pointer;
     justify-items: center;
    padding: 0;
    background-color: transparent;
     text-align: center;
    border: none;
    position: relative;
    transition: all 0.2s ease-in-out;
}
}


/* Obtain items without images */
.imagem-botao {
.obtain-list-item > :only-child:not(.image_link) {
     display: inline-block;
     grid-column-start: 2;
     width: auto;
     justify-self: center;
     height: auto;
     text-align: center !important;
}
}


/* Obtain Text */
.sec-aba-cem {
.obtain-list > :only-child:not(.obtain-list-item) {
    padding: 5px;
     display: block;
     font-weight: bold;
     text-align: center;
     text-align: center;
    color: #333;
}
.mostrar-aba img {
    border: none;
    background-color: transparent;
    margin: 5px;
}
.mostrar-aba:hover::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 3px;
    background-color: rgba(0, 0, 0, 0.4);
    /* Barrinha sutil ao passar o mouse */
}
.mostrar-aba:hover img {
    filter: drop-shadow(0 2px 3px rgba(0, 0, 0, 0.3));
    /* Sombra leve ao passar o mouse */
}
.mostrar-aba:active img {
    filter: drop-shadow(0 1px 1px rgba(0, 0, 0, 0.3));
}
.mostrar-aba.ativa::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 3px;
    background-color: #000;
}
.preset-aba {
    margin: 0;
    padding: 0;
}
.container-conteudo {
    margin: 0;
    padding: 0;
}
}


/* ---------------------------
.aba {
  OBTAIN LIST FORMATTING END
    display: none;
--------------------------- */
    opacity: 0;
    transform: translateY(-10px);
    transition: opacity 0.3s ease, transform 0.3s ease;
    margin-top: 20px;
}


/* -------------------------------
.aba.atual {
  BULLET TABLE COLUMN FORMATTING
    display: block;
--------------------------------*/
    opacity: 1;
.bullet-table td:nth-child(3),
    transform: translateY(0);
.bullet-table td:nth-child(4),
}
.bullet-table td:nth-child(6) {
 
.container-coliseu {
    display: block;
     text-align: center;
     text-align: center;
}
}


/* -------------------------
.coluna-abas {
  WHATSNEW LIST FORMATTING
    flex: 0 0 200px;
------------------------- */
    margin-right: 20px;
.whatsnew-list {
}
     overflow:hidden;
 
/*******************************************************************************
      PRESET: DIÁLOGOS
      *******************************************************************************/
.transcrições {
    background-color: #F2F2F2;
    border-radius: 5px;
    box-shadow: 0 0 6px #B2B2B2;
    display: inline-block;
    padding: 10px 10px 10px 18px;
    position: relative;
     vertical-align: top;
     width: 100%;
     width: 100%;
    color: #000;
    /* Garante que o texto dentro das transcrições será preto */
}
.transcrições b,
.transcrições strong {
    color: #000 !important;
    /* Garante que o texto negrito também será preto */
}
}


.whatsnew-list > span {
.transcrições::before {
    background-color: #F2F2F2;
    content: "\00a0";
    display: block;
    height: 16px;
    position: absolute;
    top: 11px;
    transform: rotate(29deg) skew(-35deg);
    -moz-transform: rotate(29deg) skew(-35deg);
    -ms-transform: rotate(29deg) skew(-35deg);
    -o-transform: rotate(29deg) skew(-35deg);
    -webkit-transform: rotate(29deg) skew(-35deg);
    width: 20px;
}
 
.me {
     float: left;
     float: left;
     margin: 0 0.25em 0.25em 0;
     margin: 5px 45px 5px 20px;
    color: #000;
    /* Garante que o texto dentro da classe .me será preto */
}
 
.me::before {
    box-shadow: -2px 2px 2px 0 rgba(178, 178, 178, .4);
    left: -9px;
}
 
/*******************************************************************************
      PREDEFINIÇÃO ITEMBOX E RESPONSIVIDADE DAS PÁGINAS DE ITEM
      *******************************************************************************/
.item-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: center;
    margin: 20px auto;
    max-width: 100%;
}
 
@media (max-width: 1024px) {
    .item-grid>* {
        flex: 1 1 calc(25% - 10px);
        max-width: calc(25% - 10px);
    }
}
}


.whatsnew-list > span:nth-child(4n + 1) {
@media (max-width: 768px) {
     clear: both
    .item-grid>* {
        flex: 1 1 calc(33.33% - 10px);
        max-width: calc(33.33% - 10px);
     }
}
}


/* -------------------------
@media (max-width: 480px) {
Scenario formatting
    .item-grid>* {
------------------------- */
        flex: 1 1 calc(50% - 10px);
span.scene-font-italic {
        max-width: calc(50% - 10px);
font-style: italic;
    }
}
}


/* -------------------------
@media (max-width: 360px) {
Text colors
    .item-grid>* {
------------------------- */
        flex: 1 1 100%;
        max-width: 100%;
    }
}


.text-color--fire {
.iteminfobox {
color: #C02E1D;
    padding: 10px;
    background: #eeeded;
    border-radius: 25px;
    box-shadow: rgba(24, 27, 46, 0.24) 4px 4px 4px;
    width: 230px;
    height: 270px;
    position: relative;
    text-align: center;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
}
.text-color--water {
 
color: #4169E1;
.iteminfobox b {
    font-size: clamp(10px, 2vw, 14px);
    color: #6587c4;
    text-align: center;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
}
.text-color--earth {
 
color: #8C4614;
/**********************
      VECTOR.CSS
  **********************/
 
/* Geral */
a {
    color: #0645ad;
}
}
.text-color--wind {
 
color: #228B22;
a:visited {
    color: #0645ad;
}
}
.text-color--light {
 
color: #ECAA38;
a.new {
    color: rgb(206, 0, 0) !important;
}
}
.text-color--dark {
 
color: #483D8B;
h1,
h2,
h3,
h4,
h5,
h6 {
    color: #000000;
}
}


.text-color--aura0 {
hr {
color: #222222;
    color: #222;
}
}
.text-color--aura1 {
 
color: #99620f;
ul {
    list-style-image: none;
}
}
.text-color--aura2 {
 
color: #7b0f99;
/* Cabeçalho */
#mw-head-base {
    background: url(http://70.39.70.36/images/f/fd/azul_capriw2.png);
    background-repeat: repeat-x;
    width: 1531px;
    max-height: 63px;
    margin-top: -3.5em;
    display: block;
}
}
.text-color--aura3 {
 
color: #007acc;
/* Navegação */
#p-cactions {
    background: none;
    margin-top: -0.6em;
}
}
.text-color--auramain {
 
color: #e68900;
#p-cactions li {
    background: none;
}
}
.text-color--aurasub {
 
color: #0f9999;
#p-cactions li.selected {
    background: none;
    border: 2px solid #5c3f2a;
}
}


.text-color--cb-n {
#p-cactions li.new {
color: blue;
    background-color: #e2e2e2;
font-size: 87%;
font-weight: 700;
}
}
.text-color--cb-od {
 
color: red;
#p-cactions li a {
font-size: 87%;
    background-color: #e2e2e2;
font-weight: 700;
    color: #7070FF;
}
}
.text-color--cb-tr {
 
color: olive;
#p-cactions li.selected a {
font-size: 87%;
    background-color: #324f74;
font-weight: 700;
}
}


.text-color--added {
/* Barra de Pesquisa */
background-color: LemonChiffon;
#searchInput {
border-radius: 4px;
    background-color: #ffffff;
font-size: 0.8em;
    border-color: #0645ad;
font-weight: 700;
padding: 2px;
}
}
.text-color--new {
 
background-color: PeachPuff;
#content {
border-radius: 4px;  
    color: var(--content-text);
font-size: 0.8em;
    background-color: var(--content-bg) !important;
font-weight: 700;
    border: none !important;
padding: 2px;
    box-shadow: rgba(0, 0, 0, .1) 0px 8px 24px, rgba(0, 0, 0, 0.15) 0px 0px 0px 2px;
}
}
.text-color--removed {
 
background-color: Lavender;
#simpleSearch {
border-radius: 4px;  
    position: relative;
font-size: 0.8em;
    height: 100%;
font-weight: 700;
    background-color: white;
padding: 2px;
}
}
.text-color--reworked {
 
background-color: LightBlue;
/* Menu */
border-radius: 4px;
.vector-menu-tabs,
font-size: 0.8em;
.vector-menu-tabs a,
font-weight: 700;
#mw-head .vector-menu-dropdown h3 {
padding: 2px;
    background: none;
}
}
.text-color--new-effect {
 
background-color: DarkSeaGreen;
.vector-menu-tabs li a {
border-radius: 4px;  
    background-position: center;
font-size: 0.8em;
    background: transparent;
font-weight: 700;
    display: block;
padding: 2px;
    float: left;
    height: 3.07692308em;
    position: relative;
    padding-top: 0.9em;
    padding-left: 8px;
    padding-right: 8px;
    font-size: 0.8125em;
    cursor: pointer;
}
}
.text-color--old-effect {
 
background-color: LightPink;
.vector-menu-tabs .selected {
border-radius: 4px;
    font-weight: bold;
font-size: 0.8em;
    background: #ffffff;
font-weight: 700;
    border: 1px #0645ad solid;
padding: 2px;
}
}


.text-color--highlight-reward {
.vector-menu-tabs ul {
background-color: rgba(255,152,0,0.2);
    float: left;
    height: 100%;
    list-style: none none;
    margin: 0;
    padding: 0;
    margin-top: -0.3em;
}
 
.vector-menu-dropdown .vector-menu-content {
    background-color: none;
    list-style: none none;
    min-width: 100%;
    position: absolute;
    top: 2.5em;
    right: -1px;
    margin: 0;
    border: 2px solid #0645ad !important;
    border-top-width: 0;
    padding: 0;
    box-shadow: 0 1px 1px 0 rgb(0 0 0 / 10%);
    text-align: left;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: opacity 100ms;
    transition: opacity 100ms;
    z-index: 3;
}
}


/* -------------------------
/* Conteúdo */
NVD3 styling
.mw-body {
------------------------- */
    margin-top: -1px;
.nvtooltip {
    border: 1px solid #8d6e63;
position: absolute;
    border-right-width: 1px;
background-color: rgba(255,255,255,1.0);
}
color: rgba(0,0,0,1.0);
padding: 1px;
border: 1px solid rgba(0,0,0,.2);
z-index: 10000;
display: block;


font-family: Arial;
.mw-parser-output small li {
font-size: 13px;
    color: #000000;
text-align: left;
}
pointer-events: none;


white-space: nowrap;
.mw-parser-output tr i {
    color: #000000;
}


-webkit-touch-callout: none;
.mw-parser-output tr big {
-webkit-user-select: none;
    color: #000000;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
}


.nvtooltip {
.mw-parser-output .center .thumbcaption,
background: rgba(255,255,255, 0.8);
.mw-parser-output .tright .thumbcaption {
border: 1px solid rgba(0,0,0,0.5);
    color: #000000;
border-radius: 4px;
}
}


/* Give tooltips that old fade in transition by
/* Tabelas */
  putting a "with-transitions" class on the container div. */
.jquery-tablesorter tr td {
.nvtooltip.with-transitions, .with-transitions .nvtooltip {
    background-color: #fcfcfc !important;
transition: opacity 50ms linear;
    color: #000000 !important;
-moz-transition: opacity 50ms linear;
}
-webkit-transition: opacity 50ms linear;


transition-delay: 200ms;
#mw-content-text .mw-parser-output .jquery-tablesorter {
-moz-transition-delay: 200ms;
    transform: translatex(0px) translatey(0px);
-webkit-transition-delay: 200ms;
    background-color: #fcfcfc;
    color: #000000 !important;
    border-color: #0645ad;
}
}


.nvtooltip.x-nvtooltip,
/* Links */
.nvtooltip.y-nvtooltip {
#mw-normal-catlinks ul a,
padding: 8px;
#mw-normal-catlinks a,
#ca-delete a,
#ca-move a,
#ca-unprotect a {
    color: #0645ad !important;
}
}


.nvtooltip h3 {
#ca-delete a,
margin: 0;
#ca-move a,
padding: 4px 14px;
#ca-unprotect a {
line-height: 18px;
    background-color: #ffffff !important;
font-weight: normal;
    border-color: #0645ad;
background-color: rgba(247,247,247,0.75);
    border-width: 0px;
color: rgba(0,0,0,1.0);
}
text-align: center;


border-bottom: 1px solid #ebebeb;
/* Rodapé */
#footer-info-lastmod {
    display: none !important;
}


-webkit-border-radius: 5px 5px 0 0;
/* Outros */
-moz-border-radius: 5px 5px 0 0;
.mw-destfile-warning {
border-radius: 5px 5px 0 0;
    border: 1px solid #8d6e63;
    padding: 0.5em 1em;
    margin-bottom: 1em;
    color: #f8f9fa;
    background-color: #0d1b2d;
}
}


.nvtooltip p {
.mw-logline-protect {
margin: 0;
    color: #f8f9fa !important;
padding: 5px 14px;
text-align: center;
}
}


.nvtooltip span {
.oo-ui-popupWidget-head>.oo-ui-iconElement-noIcon+.oo-ui-labelElement-label {
display: inline-block;
    margin-left: 12px;
margin: 2px 0;
    color: white;
}
}


.nvtooltip table {
#msupload-div a {
margin: 6px;
    color: #3366cc;
border-spacing:0;
    cursor: pointer;
    color: blue !important;
}
}


#msupload-bottom a {
    font-weight: bold;
    margin-right: 20px;
    color: black !important;
}


.nvtooltip table td {
#msupload-list .file {
padding: 2px 9px 2px 0;
    background: #8b929e;
vertical-align: middle;
    border-top: 1px solid #c8ccd1;
    margin: 0;
    padding: 10px;
    position: relative;
    color: black !important;
}
}


.nvtooltip table td.key {
.wikiEditor-ui-toolbar .booklet>.index {
font-weight:normal;
    float: left;
    width: 20%;
    height: 125px;
    overflow: auto;
    resize: horizontal;
    color: black;
}
}
.nvtooltip table td.value {
 
text-align: right;
.codeEditor-status-message {
font-weight: bold;
    border-left: 1px solid #c8ccd1;
    border-right: 1px solid #c8ccd1;
    padding: 0 0.3em;
    width: 100%;
    display: table-cell;
    color: black !important;
}
}


.nvtooltip table tr.highlight td {
.wikiEditor-ui-toolbar .tabs span.tab a {
padding: 1px 9px 1px 0;
    color: #000000 !important;
border-bottom-style: solid;
    cursor: pointer;
border-bottom-width: 1px;
    display: block;
border-top-style: solid;
    height: 32px;
border-top-width: 1px;
    padding-left: 18px;
    padding-right: 12px;
}
}


.nvtooltip table td.legend-color-guide div {
.wikiEditor-ui-toolbar .group .tool-select .label {
width: 8px;
    position: relative;
height: 8px;
    padding: 0 26px 0 4px;
vertical-align: middle;
    margin: 0;
    cursor: pointer;
    text-decoration: none;
    color: #222 !important;
}
}


.nvtooltip table td.legend-color-guide div {
.wikiEditor-ui-toolbar .group .tool-select .options .option {
width: 12px;
    display: block;
height: 12px;
    padding: 0.5em;
border: 1px solid #999;
    text-decoration: none;
    color: #000 !important;
    white-space: nowrap;
}
}


.nvtooltip .footer {
div.mw-number-text {
padding: 3px;
    color: #888 !important;
text-align: center;
}
}


.nvtooltip-pending-removal {
div.mw-number-text h3 {
pointer-events: none;
    color: #c1c1c1 !important;
display: none;
}
}


/* Tooltip */
.tip2 {
    background-color: #F2F2F2;
    border-radius: 2px;
    box-shadow: 0 0 6px #B2B2B2;
    display: none;
    position: absolute;
    padding: 10px;
    z-index: 1;
}


/* Interactive Layer */
.tooltip {
.nvd3 .nv-interactiveGuideLine {
    position: relative;
pointer-events:none;
}
}
.nvd3 line.nv-guideline {
 
stroke: #ccc;
#tip-espaco {
    margin-left: 10px;
}
}


.nvd3 .nv-groups path.nv-line {
#youtube {
fill: none;
    margin-left: -155px;
}
}


.nvd3 .nv-groups path.nv-area {
.tooltip,
stroke: none;
.tooltip:hover+.tip2,
.tip2:hover {
    display: inline;
}
}


.nvd3 .nv-axis {
/* tira o toggle do indice, ocultar/exibir */
pointer-events:none;
#toc .toctogglelabel {
opacity: 1;
    display: none !important;
}
}


.nvd3 .nv-axis path {
span.toctogglespan {
fill: none;
    display: none !important;
stroke: #000;
stroke-opacity: .75;
shape-rendering: crispEdges;
}
}


.nvd3 .nv-axis path.domain {
/*  WIKITABLE */
stroke-opacity: .75;
table.wikitablec,
table.prettytable {
    margin: 1em 1em 1em 0;
    background: #f9f9f9;
    border: 1px #aaa solid;
    border-collapse: collapse;
}
}


.nvd3 .nv-axis.nv-x path.domain {
table.wikitablecenter,
stroke-opacity: 0;
table.prettytable {
    margin-left: auto;
    margin-right: auto;
    background: #f9f9f9;
    border: 1px #aaa solid;
    border-collapse: collapse;
}
}


.nvd3 .nv-axis line {
table.wikitablec th,
fill: none;
table.wikitablec td,
stroke: #e5e5e5;
table.prettytable th,
shape-rendering: crispEdges;
table.prettytable td {
    border: 1px #aaa solid;
    padding: 0.2em;
    text-align: center;
}
}


.nvd3 .nv-axis .zero line,
table.wikitablec th,
/*this selector may not be necessary*/ .nvd3 .nv-axis line.zero {
table.prettytable th {
stroke-opacity: .75;
    background: #f2f2f2;
    text-align: center;
}
}


.nvd3 .nv-axis .nv-axisMaxMin text {
table.wikitablec caption,
font-weight: bold;
table.prettytable caption {
    margin-left: inherit;
    margin-right: inherit;
    font-weight: bold;
}
}


.nvd3 .x  .nv-axis .nv-axisMaxMin text,
table.prettytablec code,
.nvd3 .x2 .nv-axis .nv-axisMaxMin text,
table.wikitablec code {
.nvd3 .x3 .nv-axis .nv-axisMaxMin text {
    background-color: transparent;
text-anchor: middle
}
}


.nvd3 .nv-axis.nv-disabled {
table.wikitablew-tr th,
opacity: 0;
table.wikitablew-tr td {
    padding: 0.3em 0.4em;
}
}


table.wikitablecenter th,
table.wikitablecenter td,
table.prettytable th,
table.prettytable td {
    border: 1px #aaa solid;
    padding: 0.2em;
    text-align: center;
}


.nvd3.nv-line .nvd3.nv-scatter .nv-groups .nv-point {
table.wikitablecenter th,
fill-opacity: 0;
table.prettytable th {
stroke-opacity: 0;
    background: #f2f2f2;
    text-align: center;
}
}


.nvd3.nv-scatter.nv-single-point .nv-groups .nv-point {
table.wikitablecenter caption,
fill-opacity: .5 !important;
table.prettytable caption {
stroke-opacity: .5 !important;
    margin-left: inherit;
    margin-right: inherit;
    font-weight: bold;
}
}


table.prettytablecenter code,
table.wikitablecenter code {
    background-color: transparent;
}


.with-transitions .nvd3 .nv-groups .nv-point {
table.elements {}
transition: stroke-width 250ms linear, stroke-opacity 250ms linear;
-moz-transition: stroke-width 250ms linear, stroke-opacity 250ms linear;
-webkit-transition: stroke-width 250ms linear, stroke-opacity 250ms linear;


table.elements th,
table.elements td {
    padding: 0.5em;
}
}


.nvd3.nv-scatter .nv-groups .nv-point.hover,
td.effective {
.nvd3 .nv-groups .nv-point.hover {
    background-color: #BFFFBF;
stroke-width: 7px;
fill-opacity: .95 !important;
stroke-opacity: .95 !important;
}
}


.nvd3 .nv-point-paths path {
td.ineffective {
stroke: #aaa;
    background-color: #FFBF7F;
stroke-opacity: 0;
fill: #eee;
fill-opacity: 0;
}
}


.nvd3 .nv-indexLine {
td.nullified {
cursor: ew-resize;
    background-color: #FFBFBF;
}
}


.lineChart svg {
/*  Wikitable White */
  background-color: white;
table.wikitablew,
table.prettytable,
table.wikitablew-tr {
    margin: 1em 0;
    background: #f9f9f9;
    border: 2px #fff solid;
    border-collapse: collapse;
}
}
 
/*
table.wikitablewhite,
* TOCLIMIT UTILITY CSS CLASS
table.prettytable {
*
    margin-left: auto;
* Allow limiting of which header levels are shown in a TOC;
    margin-right: auto;
* <div class="toclimit-3">, for instance, will limit to
    background: #f9f9f9;
* showing ==headings== and ===headings=== but no further.
    border: 2px #fff solid;
* Used in [[Template:TOC]]
     border-collapse: collapse;
*/
.toclimit-2 .toclevel-1 ul,
.toclimit-3 .toclevel-2 ul,
.toclimit-4 .toclevel-3 ul,
.toclimit-5 .toclevel-4 ul,
.toclimit-6 .toclevel-5 ul,
.toclimit-7 .toclevel-6 ul {
     display: none;
}
}


/* ---------------------------
/*  Wikitable White */
   TEMPLATE:BABYL_RAIDS START
table.wikitablenb,
--------------------------- */
table.prettytable,
/* Layer */
table.wikitablenb-tr {
.babyl-layer {
     margin: 1em 0;
     display: flex;
    background: #f9f9f9;
    border: none;
    border-opacity: 0.5;
    border-collapse: collapse;
}
}


.babyl-layers ~ .babyl-layer:not(.active) {
.wikitablenb border: opacity {
     display: none;
     opacity: 0.5;
}
}


.babyl-layer .content-picker {
table.wikitablenoborder,
     display: flex;
table.prettytable {
     width: 300px;
    margin-left: auto;
     flex-direction: column;
     margin-right: auto;
     align-items: center;
     background: #f9f9f9;
     border: 2px #e9e8e8 solid;
     border-collapse: collapse;
}
}


.babyl-layer .content-picker .image {  
/* HOVER DA TABELA*/
     filter: saturate(0.5) brightness(0.5);
.wikitablew td: hover {
     background: #e9e8e8;
}
}


.babyl-layer .content-picker .active .image {
.wikitablew-tr tr: hover {
     filter: none;
     background: #e9e8e8;
}
}


.babyl-layer .content-picker .missions {
.wikitablenb border: hover {
     margin-top: 5px;
     color: #e9e8e8;
    padding-left: 33px;
    cursor: pointer;
}
}


.babyl-layer .content {
table.wikitablew th,
     margin-left: 1em;
table.wikitablew td,
table.prettytable th,
table.prettytable td,
table.wikitablew-tr th,
table.wikitablew-tr td {
     border: 2px #fff solid;
    padding: 0.3em 0.4em;
}
}


@media (max-width: 1400px) {
table.wikitablew th,
.babyl-layer .content {
table.prettytable th,
     transform: scale(0.85);
table.wikitablew-tr th {
    transform-origin: top left;
     background: #eaecf0;
}
}
table.wikitablew caption,
table.prettytable caption,
table.wikitablew-tr caption {
    margin-left: inherit;
    margin-right: inherit;
    font-weight: bold;
}
}


.babyl-layer .content table {
table.prettytablec code,
     margin-top: 0.33em;
table.prettytable code,
table.wikitablew-tr code {
     background-color: transparent;
}
}


/* Hide images on the top of Raids: namespace pages */
table.wikitablewhite th,
.babyl-layer .content .mw-parser-output > p:first-child {
table.wikitablewhite td,
     display: none;
table.prettytable th,
table.prettytable td {
    border: 2px #fff solid;
    padding: 0.2em;
     text-align: center;
}
}


/* Floor */
table.wikitablewhite th,
.babyl-floor {
table.prettytable th,
     display: flex;
table.wikitablew-tr th {
     align-items: center;
     background: #eaecf0;
     clear: both;
     text-align: center;
    border-right: 1px #fff solid;
     padding: 0.3em 0.4em;
}
}


.babyl-floor > .number {
table.wikitablewhite caption,
     width: 30px;
table.prettytable caption,
     margin-right: 3px;
table.wikitablew-tr caption {
     margin-left: inherit;
     margin-right: inherit;
    font-weight: bold;
     text-align: center;
     text-align: center;
}
}


.babyl-floor .quests {
table.prettytablecenter code,
     width: 267px;
table.wikitablewhite code,
     display: flex;
table.wikitablew-tr code {
     justify-content: space-between;
     background-color: #000;
}
 
table.elements {}
 
table.elements th,
table.elements td {
     padding: 0.5em;
}
 
td.effective {
     background-color: #BFFFBF;
}
}


/* Quest */
td.ineffective {
.babyl-quest {
     background-color: #FFBF7F;
     position: relative;
    display: inline-block;
    cursor: pointer;
}
}


.babyl-quest > .number {
td.nullified {
     position: absolute;
     background-color: #FFBFBF;
    top: 5px;
    left: 5px;
    color: white;
    font-size: 10px;
}
}


.babyl-quest > .icons {
/**********************************
     position: absolute;
wiki.gla.com.br/index.php/Predefini%C3%A7%C3%A3o:Img
     top: 6px;
 
     right: 5px;
predefinição:img | deixa as imagens responsivas pro mobile
     display: flex;
**********************************/
.responsive-image {
     max-width: 100%;
     display: block;
     margin: 0 auto;
     overflow: hidden;
}
}


.babyl-quest > .icons img {
.custom-image {
     padding-left: 2px;
     width: 100%;
    max-width: 800px;
    height: auto;
}
}


/* -------------------------
.responsive-image[style*="text-align:left"] {
  TEMPLATE:BABYL_RAIDS END
    margin: 0;
------------------------- */
    text-align: left;
}


/* Style for horizontal lists (separator following item).
.responsive-image[style*="text-align:right"] {
  @source mediawiki.org/wiki/Snippets/Horizontal_lists
  @revision 9 (2016-08-10)
  @author [[User:Edokter]]
*/
.hlist dl,
.hlist ol,
.hlist ul {
     margin: 0;
     margin: 0;
    text-align: right;
}
.responsive-image[style*="text-align:center"] {
    text-align: center;
}
/* ---------------------------------------------------------------------------------------------------------------- */
/* Estilos CSS para o componente de abas MediaWiki */
/* Adicione este CSS na sua MediaWiki (Common.css ou página de estilos) */
/* Container principal responsivo */
.mw-tabber-container {
    width: 100%;
    max-width: 100%;
    margin: 20px 0;
    border: 1px solid #a7d7f9;
    border-radius: 4px;
    background-color: #f8f9fa;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
/* Container das abas */
.mw-tabber-tabs {
    display: flex;
    flex-wrap: wrap;
    background-color: #eaecf0;
    border-bottom: 2px solid #a7d7f9;
     padding: 0;
     padding: 0;
    margin: 0;
    list-style: none;
}
}
/* Display list items inline */
 
.hlist dd,
/* Estilo individual de cada aba */
.hlist dt,
.mw-tabber-tab {
.hlist li {
    flex: 1 1 auto;
     margin: 0;
    min-width: 100px;
     display: inline;
    padding: 12px 20px;
    cursor: pointer;
    background-color: #eaecf0;
    border: none;
    border-right: 1px solid #c8ccd1;
    text-align: center;
    font-size: 14px;
    font-weight: 500;
    color: #0645ad;
    transition: all 0.2s ease;
     user-select: none;
     position: relative;
}
}
/* Display nested lists inline */
 
.hlist.inline,
.mw-tabber-tab:last-child {
.hlist.inline dl,
     border-right: none;
.hlist.inline ol,
.hlist.inline ul,
.hlist dl dl, .hlist dl ol, .hlist dl ul,
.hlist ol dl, .hlist ol ol, .hlist ol ul,
.hlist ul dl, .hlist ul ol, .hlist ul ul {
     display: inline;
}
}
/* Hide empty list items */
 
.hlist .mw-empty-li,
/* Hover nas abas */
.hlist .mw-empty-elt {
.mw-tabber-tab:hover {
     display: none;
    background-color: #f8f9fa;
     color: #0b0080;
}
}
/* Generate interpuncts */
 
.hlist dt:after {
/* Aba ativa */
     content: ": ";
.mw-tabber-tab.active {
    background-color: #ffffff;
    color: #0645ad;
     border-bottom: 3px solid #0645ad;
    font-weight: 600;
}
}
.hlist dd:after,
 
.hlist li:after {
/* Container do conteúdo */
     content: " · ";
.mw-tabber-content {
     font-weight: bold;
    padding: 20px;
     background-color: #ffffff;
     min-height: 200px;
}
}
.hlist dd:last-child:after,
 
.hlist dt:last-child:after,
/* Painel de conteúdo individual */
.hlist li:last-child:after {
.mw-tabber-panel {
     content: none;
     display: none;
    animation: fadeIn 0.3s ease;
}
}
/* Add parentheses around nested lists */
 
.hlist dd dd:first-child:before, .hlist dd dt:first-child:before, .hlist dd li:first-child:before,
.mw-tabber-panel.active {
.hlist dt dd:first-child:before, .hlist dt dt:first-child:before, .hlist dt li:first-child:before,
     display: block;
.hlist li dd:first-child:before, .hlist li dt:first-child:before, .hlist li li:first-child:before {
     content: " (";
    font-weight: normal;
}
}
.hlist dd dd:last-child:after, .hlist dd dt:last-child:after, .hlist dd li:last-child:after,
 
.hlist dt dd:last-child:after, .hlist dt dt:last-child:after, .hlist dt li:last-child:after,
/* Animação de fade in */
.hlist li dd:last-child:after, .hlist li dt:last-child:after, .hlist li li:last-child:after {
@keyframes fadeIn {
     content: ")";
     from {
     font-weight: normal;
        opacity: 0;
        transform: translateY(5px);
     }
 
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
}
/* Put ordinals in front of ordered list items */
 
.hlist ol {
/* Responsividade para tablets */
     counter-reset: listitem;
@media (max-width: 768px) {
    .mw-tabber-tabs {
        flex-direction: column;
    }
 
     .mw-tabber-tab {
        border-right: none;
        border-bottom: 1px solid #c8ccd1;
        width: 100%;
    }
 
    .mw-tabber-tab.active {
        border-bottom: 3px solid #0645ad;
        border-right: none;
    }
 
    .mw-tabber-content {
        padding: 15px;
    }
}
}
.hlist ol > li {
 
     counter-increment: listitem;
/* Responsividade para mobile */
@media (max-width: 480px) {
    .mw-tabber-tab {
        padding: 10px 15px;
        font-size: 13px;
    }
 
     .mw-tabber-content {
        padding: 12px;
        min-height: 150px;
    }
}
}
.hlist ol > li:before {
 
    content: " " counter(listitem) "\a0";
 
/**************
gurren (2026)
**************/
.gla-responsive-frame{
  width: fit-content;
  max-width: 100%;
  margin: 12px auto;
  padding: 0;
  background: transparent;
  box-shadow: none;
}
}
.hlist dd ol > li:first-child:before,
 
.hlist dt ol > li:first-child:before,
/* neutraliza molduras do MediaWiki */
.hlist li ol > li:first-child:before {
.gla-responsive-frame .thumbinner,
    content: " (" counter(listitem) "\a0";
.gla-responsive-frame .thumb,
.gla-responsive-frame figure,
.gla-responsive-frame .mw-file-description{
  max-width: 100% !important;
  width: auto !important;
  padding: 0 !important;
  margin: 0 auto !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  box-sizing: border-box;
}
}


/*
/* imagem: tamanho natural + responsivo */
   Style for horizontal lists (separator following item) ends.
.gla-responsive-frame img{
*/
  display: block !important;
   max-width: 100% !important;
  width: auto !important;
  height: auto !important;
  margin: 0 auto !important;
  border: 0 !important;
  border-radius: 8px; /* pode tirar também se quiser totalmente cru */
}

Edição atual tal como às 00h46min de 9 de fevereiro de 2026

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:wght@400;600;700&display=swap');

/* body::before {
	content: '';
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	background: url('https://wiki.gla.com.br/images/b/b3/Testefundo.png') no-repeat;
	filter: brightness(0.6);
  
	background-attachment: fixed;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	z-index: -1;
}
*/
/* === FONTE PADRÃO === */
body,
.mw-parser-output,
.mw-headline,
#firstHeading,
h1,
h2,
h3,
h4,
h5,
h6,
p,
ul,
ol,
li,
table,
td,
th,
caption {
    font-family: 'Noto Sans', sans-serif !important;
}

/* === LEGENDAS DE IMAGEM === */
.thumbcaption {
    font-size: 1.1em !important;
    text-align: center !important;
    line-height: 1.4;
    font-weight: 400;
}

/* === TABELAS ENHANCE === */
table.table-enhance {
    max-width: 600px;
    margin: 1em auto;
    border-collapse: collapse;
    background-color: #fff;
    border: 1px solid #ccc;
    font-size: 13px;
    font-family: 'Segoe UI', 'Helvetica Neue', sans-serif;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.table-enhance th,
.table-enhance td {
    border: 1px solid #e0e0e0;
    padding: 6px 10px;
    text-align: center;
    vertical-align: middle;
}

.table-enhance th {
    background-color: #f5f5f5;
    font-weight: 600;
    color: #333;
}

.table-enhance tr:nth-child(even) td {
    background-color: #fafafa;
}

.table-enhance tr:hover td {
    background-color: #f0f8ff;
    transition: background-color 0.2s ease;
}

.table-enhance-vertical td:first-child {
    font-weight: bold;
    color: #2c3e50;
}

/* === AJUSTES NA SIDEBAR === */
#p-logo {
    background-color: transparent !important;
}

#mw-panel .mw-portlet.portal .vector-menu-content-list>li>a {
    font-size: 0.80rem !important;
    font-family: 'Noto Sans', sans-serif !important;
    font-weight: 600 !important;
}

/* === REMOÇÃO DE BORDAS EM TÍTULOS === */
.mw-headline {
    border-bottom: none !important;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    border-bottom: none !important;
}

.video-responsivo {
    max-width: 600px;
    width: 100%;
    margin: 0 auto;
    background: black;
    padding: 0;
    overflow: hidden;
    position: relative;
}

.video-responsivo video {
    width: 100% !important;
    height: auto !important;
    display: block;
    margin: 0;
    padding: 0;
    vertical-align: bottom;
}

#contentSub,
#contentSub2 {
    margin: 0 !important;
    padding: 0 !important;
    display: none;
    /* opcional: se quiser sumir com tudo */
}

/* Discord */
#n-Discord {
    font-size: 10px;
    line-height: 1.5em;
}

#p-Discord-label {
    display: none;
}

#n-Discord a {
    color: #fff !important;
    font-weight: bold;
    border-radius: 4px;
    border: 1px solid #4c57d0;
    background-color: #5865f2;
    display: block;
    position: relative;
    padding: 4px 4px 3px calc(14px + 6.5px * 2);
    box-shadow: 0 2px 3px rgba(0, 0, 0, 0.1);
    transition: 0.2s;
}

#n-Discord a::before {
    font-weight: normal;
    opacity: 0.85;
    margin-left: 1.25em
}

#n-Discord a::after {
    content: '';
    background: url(/images/7/76/Discord-brands.png) no-repeat;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    filter: drop-shadow(0 1px 1px rgba(0, 0, 0, 0.1));
    position: absolute;
    top: 2px;
    left: 4px;
    width: 20px;
    height: 20px;
}

#n-Discord a:hover {
    text-decoration: none;
    background-color: #7885ff;
    border-color: #6c77f0;
    transition: .3s
}

/* css atual */
/* ESTILIZAÇÃO PADRÃO */

.thumb .thumbcaption .magnify:first-child {
    display: none;
}

html {
    scroll-behavior: auto;
    /*smooth*/
}

.dark-mode:root {
    --content-bg: #fcfcfc;
}

:root {
    --content-bg: #fcfcfc;
    --content-text: #000;
    --simpleSearch-bg: #fff;
    --searchInput-text: #aaaaaa;
    --link-text: #0645ad;
    --lightGray: rgba(240, 240, 240);
    --gray: rgb(190, 190, 190);
    --transparent-blue: #338be58c;
    --blue: #338be5;
}

.dark-mode:root {
    --content-bg: #fcfcfc;
}

a:visited,
a {
    color: var(--link-text) !important;
}

/*
body {
	position: relative;
}
body {
	position: relative;
}

body::before {
	content: '';
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	background: url('https://wiki.gla.com.br/images/3/35/Fundodawikiglatest.png') no-repeat;
	filter: brightness(0.8);
  
	background-attachment: fixed;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	z-index: -1;
}
*/
body {
    position: relative;
    background-image: url(/images/3/31/Cinza_capriw.png);
    background-repeat: repeat;
    background-attachment: fixed;
}

/*
  h1,
  h2 {
      margin-bottom: 0.6em;
      border-bottom: 0px !important;
  }
  */
#firstHeading {
    border-bottom: 0px !important;
}

#simpleSearch {
    background-color: var(--simpleSearch-bg) !important;
}

#p-personal {
    right: 1em;
    top: .5em;
}

#p-search {
    float: left;
    margin-left: -0.1em;
    margin-right: 1em;
    margin-top: -0.4em;
}

#searchInput {
    background-color: #231813;
    color: var(--searchInput-text);
    width: 100%;
    height: 2.15384615em;
    border: 1px solid #524136;
    padding: 5px 2.15384615em 5px 0.4em;
    font-family: inherit;
    font-size: 0.8125em;
    direction: ltr;
}

.mw-body {
    margin-top: -1px;
    border: 2px solid #5c3f2b !important;
    border-right-width: 2px !important;
}

/* Force lining numbers in headers (for fonts like Georgia) */
h1,
h2,
.firstHeading {
    -moz-font-feature-settings: "lnum";
    -webkit-font-feature-settings: "lnum";
    font-feature-settings: "lnum";
}

/* Consistent size for sub/sup */
.mw-body sub,
.mw-body sup,
span.reference

/* for Parsoid */
    {
    font-size: 80%;
}


/* Hide confusing "Discussion" tab on [[Project:Support_desk]],
       * For sanity, only do this if [[Project_talk:Support_desk]] is a
       * redirect (which goes back to [[Project:Support_desk]]).
       * If that is changed for some reason, it automatically comes back.
       */
.page-Project_Support_desk #ca-talk a.mw-redirect {
    display: none;
}

/* CSS Hover Gallery for Mediawiki */

.gallery_zoom_img img {
    -moz-transition: -moz-transform 0.1s ease-in;
    -webkit-transition: -webkit-transform 0.1s ease-in;
    -o-transition: -o-transform 0.1s ease-in;
    transition: transform 0.1 ease-in;
}

.gallery_zoom_img img:hover {
    -moz-transform: scale(2);
    -webkit-transform: scale(2);
    -o-transform: scale(2);
    transform: scale(2);
}

/*--------------------------------------------------
      CSS CUSTOMIZADO
      --------------------------------------------------*/

/*--------------------------------------------------
      Vector 
      --------------------------------------------------*/

.vector-menu-tabs li {
    background: transparent;
}

/*--------------------------------------------------
      Tabber 
      --------------------------------------------------*/

.center-tab .tabber__header {
    justify-content: center;
}

/*--------------------------------------------------
      Tags de uso generalizado
      --------------------------------------------------*/

.mt-1 {
    margin-top: .75em;
}

.mt-2 {
    margin-top: 1.5em;
}

.mt-4 {
    margin-top: 3em;
}

.mt--4 {
    margin-top: -2em;
}

.mb-2 {
    margin-bottom: 1em;
}


.d-flex,
.td-flex td {
    display: flex;
}

.d-block {
    display: block;
}

.relative {
    position: relative;
}

.text-justify {
    text-align: justify;
}

.align-center {
    align-items: center;
}

.align-top {
    align-items: flex-start;
}

.justify-between {
    justify-content: space-between;
}

.justify-center {
    justify-content: center;
}

.border-none {
    border: none !important;
}

.w-25 {
    width: 25%;
}

.h-100 {
    height: 100%;
}

.flex-wrap {
    flex-wrap: wrap;
}

.section-title {
    display: block;
    border-radius: 8px;
    background: linear-gradient(to bottom, #459cca, #5684c8);
    width: fit-content;
    color: white;
    padding: .25em 5em;
    letter-spacing: 1px;
}

.badge {
    padding: .25em .57em;
    margin: .45em;
    border-radius: 6px;
    color: white;
    font-weight: bold;
    text-transform: capitalize;
    white-space: nowrap;
    max-height: 1.5em;
    font-size: .9em;
    letter-spacing: 1px;
    box-shadow: rgb(3 102 214 / 30%) 0px 0px 0px 3px;
    background: linear-gradient(to bottom, #459cca, #5684c8);
}

.card {
    width: 100%;
    min-height: 14em;
    margin: 0 auto;
    border-radius: 10px;
    box-shadow: rgb(0 0 0 / 9%) 0px 3px 12px;
}

.card-title {
    display: block;
    padding: .25em 0;
    margin-bottom: 1em;
    width: 100%;
    border-radius: 10px 10px 0 0;
    background: linear-gradient(to bottom, #459cca, #5684c8);

    font-size: 1.2em;
    font-weight: bold;
    text-align: center;
    letter-spacing: 1px;
    color: white;
}

.scaleUp-hover {
    transition: all .25s ease;
    image-rendering: auto;
    /* ou crisp-edges */
}

.scaleUp-hover:hover {
    transform: scale(1.1);
}


/*--------------------------------------------------
      Tooltip 
      --------------------------------------------------*/

.simple-tooltip-inline {
    border: none !important;
}

.tooltipster-default {
    background-color: rgb(220, 220, 220);
    color: black !important;
    box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;
}

.tooltipster-arrow {
    borde-color: rgb(220, 220, 220) !important;
}

#bigImage {
    position: absolute;
    transform: translate(0, -100%);
}

/**********************************
          Widget:GlobalEventTimer
          **********************************/
.global-event-widget {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 320px;
    height: 90px;
    margin: 0 auto;
    text-align: center;
    overflow: hidden;
}

.global-event-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

#global-event-time {
    position: absolute;
    bottom: 3%;
    left: 3px;
    padding: 2px 5px;
    font-size: 1.2em;
    font-weight: bold;
    color: #fff;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8);
    background: linear-gradient(to right, rgba(25, 25, 25, 0.85), rgba(0, 0, 0, 0));
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
    max-width: fit-content;
}

/**********************************
      WIDGET: PAGEVIDEO
      **********************************/
.pagevideo-wrapper {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    margin: 20px auto;
    width: 100%;
}

.pagevideo {
    width: 100%;
    max-width: 800px;
    height: auto;
    border: 1px solid #ccc;
    border-radius: 5px;
    background-color: #000;
}

@media screen and (max-width: 768px) {
    .pagevideo {
        max-width: 100%;
    }
}

/**********************************
      MEDIAWIKI: SIMBOLO DE LINKS EXTERNOS
      **********************************/
.mw-parser-output .external {
    background-image: none !important;
    padding-right: 0 !important;
}

/**********************************
      PREDEFINIÇÃO: Titulo
      #firstHeading {
      display: none;
  }
      **********************************/


#custom-title {
    display: inline-block;
    display: block;
    text-align: left;
}

#custom-title img {
    display: inline-block;
}

/*--------------------------------------------------
      Pagina Inicial
      --------------------------------------------------*/
.initialPage--table {
    width: 100%;
    text-align: center;
}

.initialPage--table>tbody>tr>th,
.initialPage--table>tbody>tr>td {
    background: transparent !important;
}

.initialPage--title,
.initialPage--events {
    border: none;
    border-collapse: separate;
}

.initialPage--events th,
.initialPage--title th {
    color: black !important;
    padding: .4em;
}

.initialPage--title th {
    background-color: transparent !important;
    font-size: 2em;
}

.initialPage--events {
    display: flex;
    height: 20em;
}

.initialPage--eventsLogo {
    height: 100%;
    padding: .5em 3.5em 2em 0;
    display: flex;
    align-items: center;
}

.initialPage--events td {
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.initialPage--mainContainer {
    display: flex;
    align-items: flex-start;
}

.initialPage--menuContainer {
    width: 75%;
    margin-right: 1.5em;
}

.initialPage--sideMenuContainer {
    width: 25%;
}

.initialPage--menuTitle {
    display: block;
    text-align: center;
    width: 100%;
    font-size: 1.75em;
    font-weight: bold;

    background: linear-gradient(to bottom, #459cca, #5684c8);
    border-radius: 10px 10px 0 0;
    color: white;
}

.initialPage--menu {
    display: flex;
    flex-wrap: wrap;
}

.initialPage--menuItemContainer {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;

    padding: 1em 0;
}

.initialPage--menuItem {
    width: 22.5%;
}

.initialPage--menuItem a img {
    width: 100%;
}

.initialPage--socialMediaContainer {
    box-sizing: border-box;
    width: 100%;
    margin-top: 8em;
    padding: 0 1.5em;
}

.initialPage--socialMedia {
    position: relative;
    border-top: 2px solid #689cc0;
    margin-top: 1em;
}

.initialPage--socialMedia:before {
    content: '';
    position: absolute;
    top: -2px;
    display: block;
    width: 0;
    height: 2px;
    z-index: 1;
    transition: width .25s ease;
}

.initialPage--socialMedia:hover::before {
    width: 100%;
}

.initialPage--socialMediaLink {
    display: flex;
    justify-content: space-between;
    align-items: center;

    font-size: 1.35em;
    font-weight: 600;
    letter-spacing: .03em;
    color: #689cc0 !important;

    padding: .9em .5em;
    transition: color .25s ease;
}

.initialPage--socialMediaLink:visited {
    color: #689cc0 !important;
}

.initialPage--socialMediaLink:hover {
    text-decoration: none;
}

.socialMedia--svg {
    display: flex;
    align-items: center;
}

.socialMedia--svg svg {
    width: 2em;
    fill: #689cc0;
    transition: all .25s ease;
}

.socialMedia--svg svg path {
    fill: inherit;
}

/*
      Discord
      */

.initialPage--socialMedia.discord>.initialPage--socialMediaLink:hover {
    color: #5865f2 !important;
}

.initialPage--socialMedia.discord:before {
    background: #5865f2;
}

.initialPage--socialMedia.discord>.initialPage--socialMediaLink:hover>.socialMedia--svg svg {
    fill: #5865f2 !important;
}

/*
      Instagram
      */

.initialPage--socialMedia.instagram>.initialPage--socialMediaLink:hover {
    color: #f09433 !important;
}

.initialPage--socialMedia.instagram:before {
    background: linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);
}

.initialPage--socialMedia.instagram>.initialPage--socialMediaLink:hover>.socialMedia--svg svg {
    fill: url(#gradient-vertical);
}

/*
      Facebook
      */

.initialPage--socialMedia.facebook>.initialPage--socialMediaLink:hover {
    color: #4267B2 !important;
}

.initialPage--socialMedia.facebook:before {
    background: #4267B2;
}

.initialPage--socialMedia.facebook>.initialPage--socialMediaLink:hover>.socialMedia--svg svg {
    fill: #4267B2 !important;
}

/*--------------------------------------------------
      Ocultação de componentes
      --------------------------------------------------*/

#p-navigation {
    background-color: transparent;
}

#mw-head-base {
    background-color: transparent;
    width: auto !important;
}

#mw-page-base {
    background: transparent;
}

#mw-panel #p-tb h3 {
    color: rgb(0, 0, 0);
    font-size: .75em;
}

#p-tb {
    display: none;
}

/* #ca-nstab-mediawiki { display: none; } */
/* #ca-talk { display: none; } */
#ca-view {
    display: none;
}

#ca-history {
    display: none;
}

#ca-viewsource {
    display: none !important;
}

/* #ca-unwatch { display: none; } */
/* #p-cactions { display: none; } */
/*
      Pacientes
      */

.table-pacients {
    display: block;
    max-width: 1400px;
    overflow-x: auto;
}

.table-pacients img {
    width: 15.715em;
    height: auto;
}

/*
      PERSONAGENS
      */

.filter--containerSearch {
    display: flex;
    padding: 0 2em;
    justify-content: flex-end;
    align-items: center;
}

.filter--container {
    display: flex;
    padding: 0 2em;
    justify-content: space-between;
    align-items: center;
}

.filter {
    width: fit-content;
    display: flex;
    justify-content: center;
    border: 3px solid #b0cff1;
    border-collapse: collapse;
    border-radius: 8px;
}

.filter--title {
    display: flex;
    border-right: 3px solid #b0cff1;
    background: #4c91c9;
    padding: 0 1em;
    align-items: center;
    border-radius: 4px 0 0 4px;
    font-size: 1.2em;
    letter-spacing: .15em;
    font-weight: bold;
    color: white;
}

.filter--icon,
.calcXp--tierIcon {
    padding: .35em .95em;
    background: transparent;
    cursor: pointer;
}

.filter--icon.tier img {
    filter: grayscale(.0);
}

.filter--icon.tier.active img {
    box-shadow: none;
}

.filter--icon img {
    filter: grayscale(.8);
    border-radius: 10px;

    transition: all .25s ease;
}

.calcXp--tierIcon img {
    filter: drop-shadow(0px 1px 8px #4c91c900);
    border-radius: 10px;

    transition: all .25s ease;
}

.filter--icon.active img {
    box-shadow: rgb(0 0 0 / 24%) 0px 2px 7px;
    filter: grayscale(0);
}

.filter--icon.tier.active img,
.calcXp--tierIcon.active img {
    transform: scale(.85);
}

.filter--icon.tier#bronze.active img,
.calcXp--tierIcon#bronze.active img {
    filter: drop-shadow(0px 1px 8px #f18a05);
}

.filter--icon.tier#silver.active img,
.calcXp--tierIcon#silver.active img {
    filter: drop-shadow(0px 1px 8px #8b8b8b);
}

.filter--icon.tier#gold.active img,
.calcXp--tierIcon#gold.active img {
    filter: drop-shadow(0px 1px 8px #fbc300);
}

.filter--icon.tier#diamond.active img,
.calcXp--tierIcon#diamond.active img {
    filter: drop-shadow(0px 1px 8px #0391c5);
}

.filter--input {
    box-sizing: border-box;
    padding: .45em;
    padding-right: 2.5em;
    border: 3px solid #b0cff1;
    font-size: 1.2em;
    border-radius: 8px;
    width: 23em;
}

.filter--inputContainer {
    box-sizing: border-box;
    position: relative;
}

.filter--searchButton {
    cursor: pointer;
    display: inline-block;
    border: 3px solid #b0cff1;
    position: absolute;
    width: 4.5em;
    height: -webkit-fill-available;
    right: 0;
    bottom: 0;
    border-radius: 0 8px 8px 0;
    background: #4c91c9;

}

.filter--searchButton img {
    filter: invert(1);
}

.calcXp--container {
    box-sizing: border-box;
    padding: 2.25em 1.25em;
    width: 43em;
    border: 3px solid #b0cff1;
    border-radius: 26px;
}

.calcXp--resultTitle {
    text-align: center;
    color: #4f7ca0;
    margin: 0;
    margin-top: -.5em !important;
    letter-spacing: .05em;
}

.calcXp--formItem {
    display: flex;
    align-items: center;
}

.calcXp--formItem input {
    box-sizing: border-box;
    padding: .35em;
    border: 2px solid #b0cff1;
    border-radius: 8px;
    text-align: center;
    font-size: 1em;
    font-weight: bold;
    letter-spacing: .05em;
    width: 4em;
}

.calcXp--formItem span {
    font-size: 1.225em;
    font-weight: 500;
    letter-spacing: .05em;
    margin-right: .5em;
    color: #386a93;
}

#calculate-btn {
    box-sizing: border-box;
    cursor: pointer;
    display: block;
    width: 15em;
    margin: 2em auto;
    padding: .45em 1em;

    border: none;
    border-radius: 6px;
    background: #4c91c9;
    box-shadow: rgb(0 0 0 / 24%) 0px 3px 8px;
    color: white;

    font-size: 1.35em;
    text-transform: capitalize;
    letter-spacing: 0.05em;
    font-weight: bold;
    transition: .35s ease;
}

#calculate-btn:hover {
    color: #ffffff;
    box-shadow: rgb(0 0 0 / 8%) 0px 3px 8px;
    transform: scale(.95);
    background: #4685b8;
}

#calc-result {
    margin-top: 1em;
    display: flex;
    justify-content: center;
}

#calc-result .badge {
    display: flex;
    align-items: center;
    justify-content: center;
    max-height: 5em;
    width: 5em;
}

.calcXp--xpIcon {
    margin-left: -.2em;
}

.calcXp--numberOfPots {
    padding-top: .2em;
    font-size: 1.15em;
}

#characters-container {
    display: flex;
    flex-wrap: wrap;
    padding: 1em;
}

#characters-container>div {
    box-sizing: border-box;
    display: none;
    padding: 1em;
    width: 19%;
    margin-right: 1%;
}

#characters-container>div.show {
    display: block;
}

#characters-container>div>a>img {
    width: 100%;
    border-radius: 8px;
    filter: grayscale(.3);
    transition: all .25s ease;
}

#characters-container>div:hover>a>img {
    box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
    filter: grayscale(0);
    transform: scale(1.06);
}

.characterPage--splashArt {
    position: absolute;
    top: -2%;
    right: -2%;
    width: 35%;
}

.characterPage--table {
    margin-top: -4em;
    width: 100%;
}

.characterPage--table>tbody {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
}

.characterPage--table>tbody>.characterPage--mainSection {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 65%;
}

.characterPage--table>tbody>.characterPage--sideSection {
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    width: 33%;
    padding: 0 1em;
}

.characterPage--characterInfoContainer {
    width: 43%;
}

.characterPage--statsInfoContainer {
    width: 55%;
}

.stats--container {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    padding: 1.25em;
}

.stats--container>div {
    width: 45%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: .5em;
}

.stats--container div img {
    width: 2.25em;
}

.stats--bar {
    display: flex;
    width: -webkit-fill-available;
    justify-content: space-between;
    padding: 0 1.25em;
}

.bar-filled:first-child,
.bar-notFilled:first-child {
    border-radius: 6px 0 0 6px;
}

.bar-filled:last-child,
.bar-notFilled:last-child {
    border-radius: 0 6px 6px 0;
}

.bar-filled,
.bar-notFilled {
    display: block;
    width: 18%;
    height: 6px;
}

.bar-filled {
    background: var(--blue);
}

.bar-notFilled {
    background: var(--transparent-blue);
}

.characterInfo--name {
    margin: 0 !important;
}

.characterInfo--badgeContainer {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    width: fit-content;
    margin: 0 auto;
}

.characterInfo--contentContainer {
    display: flex;
    justify-content: space-between;
    padding: .6em 1.3em;
}

.characterInfo--imageContainer {
    width: 25%;
}

.characterInfo--medal {
    margin-top: -1.5em;
}


.characterInfo--infoContainer {
    width: 75%;
    text-align: center;
}

.characterInfo--infoContainer #toc {
    display: none;
}

.characterPage--skins {
    width: 100%;
}

.characterPage--characterSkills {
    width: 100%;
}

/*
      Card de Skins
      */

.skins--container {
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    padding: -0.75em 0.75em;
    gap: -0.5em;
    /* Adiciona espaçamento consistente entre os itens */
}

.skins--container span {
    width: 33.3%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.skins--imageSkin {
    max-width: 100%;
    /* Limita o tamanho máximo da imagem */
    max-height: 100%;
    /* Limita o tamanho máximo da imagem */
    object-fit: contain;
    /* Garante que a imagem se ajusta proporcionalmente */
}

/*
      Seção das skills do personagem
      */

.tabsContainer {
    width: 95%;
    margin: 0 auto;
    padding-bottom: .5em;
}

.tabsContainer table {
    width: 100%;
    border-collapse: collapse;
}

.tabsContainer table>tbody>tr>td {
    border-bottom: 2px solid rgb(225, 225, 225);
}

.tabSkill--container {
    padding-bottom: .85em;
    display: flex;
    max-width: 72em;
    overflow-x: auto;
}

.skillInfo--description::-webkit-scrollbar,
.tabSkill--container::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

.skillInfo--description::-webkit-scrollbar-track,
.tabSkill--container::-webkit-scrollbar-track {
    background-color: #4799c954;
    border-radius: 10px;
}

.skillInfo--description::-webkit-scrollbar-thumb,
.tabSkill--container::-webkit-scrollbar-thumb {
    background-color: rgb(85 135 200 / 74%);
    border-radius: 10px;
}

.tab-skill {
    transition: all .25s ease;
    width: 100%;
    min-width: 5em;
}

.tab-skill.active {
    border-color: #459cca;
}

.tab-skill>div {
    cursor: pointer;
    box-sizing: border-box;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: .25em;
}

.tab-skill>div>img {
    width: 100%;
    max-width: 40px;
    height: auto;
}

.skillInfo--container {
    width: 100%;
}

.skillInfo--container>td {
    border: none !important;
}

.skillInfo {
    display: none;
}

.skillInfo.active {
    display: table-cell;
}

.skillInfo.active {
    display: table-cell;
}

.skillInfo--videoContainer {

    align-self: center;
    width: 45%;
}

.skillInfo--skillVideo2 {
    display: none;
    border-radius: 8px;
}

.skillInfo--skillVideo2.active {
    display: flex;
}

.skillInfo--videoSelector {
    display: inline-block;
    width: 1.1em;
    height: 1.1em;
    border-radius: 50%;
    background: var(--transparent-blue);
    cursor: pointer;
    margin-right: .85em;

    transition: all .25s ease;
}

.skillInfo--videoSelector.active {
    background: var(--blue);
    transform: scale(.8);
}

.skillInfo--infoContainer {
    width: 50%;
}

.skillInfo>div>.skillInfo--infoContainer b {
    color: #2a87c4 !important;
}

.skillInfo--infoContainer>center>b {
    font-size: 1.15em;
}

.skillInfo--name {
    font-size: 1.85em;
    letter-spacing: 1px;
    text-align: center;
}

.skillInfo--description {
    display: inline-block;
    font-size: 1.03em;
    line-height: 1.5em;
    padding: 0 1em;
    height: 12em;
    max-height: 12em;
    overflow-y: auto;
    text-align: justify;
}

.skillInfo--attributesContainer>h1 {
    color: #717171;
    font-size: 1.4em;
    text-align: center;
    letter-spacing: 1px;
}

/* card attributes */
.attribute--cardsContainer {
    display: flex;
    align-items: flex-start;

    width: fit-content;
    margin: 0 auto;

    background: var(--lightGray);
    border: 2px solid var(--gray);
}

.cardAttribute {
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 8em;
}

.cardAttribute--icon {
    margin: .6em 0;
    height: 2em;
}

.cardAttribute--value {
    margin: 0 !important;

    font-size: .9em !important;
    font-weight: bold;
    line-height: 1.65em !important;
    letter-spacing: 2px;
    text-align: center;
    text-transform: uppercase;
}

/*------------------------------------
      WANTED
      -----------------------------------*/

.selectWanted--container {
    display: flex;
    justify-content: center;
}

#selectbox-wanted {
    padding: .35em .5em;
    font-family: sans-serif;
    letter-spacing: .04em;
    font-size: 1.25em;
    width: 21em;
    border: 2px solid #5684c8;
    border-radius: 6px;
}

.wantedPortrait--container {
    width: 100%;
}

.wantedPortrait--title {
    width: 100%;
    color: #292929;
    font-size: 1.5em;
    font-weight: bold;
    letter-spacing: .035em;
}

.wantedPortraits {
    display: flex;
    flex-wrap: wrap;
}

.wantedPortrait {
    box-sizing: border-box;
    width: 18em;
    padding: .35em;
}

.wantedPortrait img {
    width: 100%;
}

@media screen and (max-width: 1440px) {
    :root {
        font-size: 14px;
    }

    .characterInfo--contentContainer {
        padding: .6em;
    }

    .characterInfo--infoContainer {
        width: 65%;
    }

    .characterInfo--imageContainer {
        width: 35%;
    }

    .tabSkill--container {
        max-width: 61em;
        margin: 0 auto;
    }

    .tab-skill>div>img {
        max-width: 38px;
    }

}

@media screen and (max-width: 1220px) {
    .tabSkill--container {
        max-width: 48em;
    }
}


@media screen and (max-width: 1024px) {

    .flex-wrap-md {
        flex-wrap: wrap;
    }

    .justify-center-md {
        justify-content: center;
    }

    .initialPage--mainContainer {
        flex-wrap: wrap;
    }

    .initialPage--menuContainer {
        width: 100%;
        margin-right: 0;
    }

    .initialPage--sideMenuContainer {
        width: 100%;
        display: flex;
        flex-direction: column;
        margin-top: 1.5em;
    }

    .initialPage--sideMenuContainer .card {
        width: 45%;
        min-height: 15em;
    }

    #event-time {
        bottom: 5%;
        right: 5%;
        font-size: 1.25em;
    }

    .initialPage--socialMediaContainer {
        margin-top: 2em;
        display: flex;
        justify-content: space-between;
    }

    .initialPage--socialMedia {
        width: 32%;
    }

    #p-search {
        margin-right: 1em;
    }

    .filter--containerSearch {
        justify-content: center;
    }

    .filter--container {
        margin-top: 1em;
        flex-wrap: wrap;
        justify-content: center;
    }

    .filter:last-of-type {
        margin-top: 1em;
    }

    #characters-container>div {
        width: 24%;
    }

    .characterPage--splashArt {
        display: none;
    }

    .characterPage--table>tbody>.characterPage--mainSection {
        width: 100%;
        justify-content: flex-start;
    }

    .characterPage--characterInfoContainer {
        width: 38%;
    }

    .characterPage--statsInfoContainer {
        width: 30%;
        margin-left: 1.5%;
    }

    .stats--container>div {
        width: 100%;
    }

    .characterInfo--contentContainer {
        flex-wrap: wrap;
    }

    .characterInfo--imageContainer {
        width: 100%;
        display: flex;
        justify-content: center;
    }

    .characterInfo--medal {
        margin-top: -2.5em;
    }

    .characterInfo--infoContainer {
        width: 100%;
    }

    .tabsContainer {
        width: 100%;
    }

    .tab-skill {
        min-width: 3.5em;
    }

    .tab-skill>div>img {
        max-width: 36px;
    }

    .skillInfo>div {
        flex-wrap: wrap-reverse;
    }

    .skillInfo--infoContainer {
        width: 100%;
    }

    .skillInfo--infoContainer>center>b {
        font-size: 1.2em;
    }

    .skillInfo--name {
        font-size: 2.2em !important;
        letter-spacing: 1px;
        margin-top: .5em !important;
        text-align: center;
    }

    .skillInfo--description {
        font-size: 1.35em !important;
        display: table;
        margin: 1em !important;

        height: 5em;
        max-height: 5em;
    }

    .skillInfo--videoContainer {
        width: 100%;
        margin: 0 auto;
        padding: 1em 10em;
        padding-bottom: 1em;
    }

    .cardAttribute--value {
        letter-spacing: 1px;
        font-size: 1.1em;
    }

    .characterPage--table>tbody>.characterPage--sideSection {
        width: 30%;
        padding-left: 1.5%;
        position: absolute;
        top: 0;
        right: 0;
    }

    .skins--imageSkin {
        width: 100%;
    }

    .skins--container {
        max-height: 14em;
        overflow-x: clip;
        overflow-y: auto;
    }

    .skins--container span {
        width: 50%;
    }

    .calcXp--formItem {
        justify-content: center;
    }

    .calcXp--container:last-of-type {
        margin-top: 2em;
    }

    #p-tb h3 {
        display: none;
    }

}

/*******************************************************************************
      PRESET: ABAS
      *******************************************************************************/
.tabela-abas {
    width: 100%;
    border-collapse: collapse;
    text-align: center;
    margin-bottom: 20px;
}

.mostrar-aba {
    cursor: pointer;
    padding: 0;
    background-color: transparent;
    text-align: center;
    border: none;
    position: relative;
    transition: all 0.2s ease-in-out;
}

.imagem-botao {
    display: inline-block;
    width: auto;
    height: auto;
}

.sec-aba-cem {
    padding: 5px;
    font-weight: bold;
    text-align: center;
    color: #333;
}

.mostrar-aba img {
    border: none;
    background-color: transparent;
    margin: 5px;
}

.mostrar-aba:hover::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 3px;
    background-color: rgba(0, 0, 0, 0.4);
    /* Barrinha sutil ao passar o mouse */
}

.mostrar-aba:hover img {
    filter: drop-shadow(0 2px 3px rgba(0, 0, 0, 0.3));
    /* Sombra leve ao passar o mouse */
}

.mostrar-aba:active img {
    filter: drop-shadow(0 1px 1px rgba(0, 0, 0, 0.3));
}

.mostrar-aba.ativa::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 3px;
    background-color: #000;
}

.preset-aba {
    margin: 0;
    padding: 0;
}

.container-conteudo {
    margin: 0;
    padding: 0;
}

.aba {
    display: none;
    opacity: 0;
    transform: translateY(-10px);
    transition: opacity 0.3s ease, transform 0.3s ease;
    margin-top: 20px;
}

.aba.atual {
    display: block;
    opacity: 1;
    transform: translateY(0);
}

.container-coliseu {
    display: block;
    text-align: center;
}

.coluna-abas {
    flex: 0 0 200px;
    margin-right: 20px;
}

/*******************************************************************************
      PRESET: DIÁLOGOS
      *******************************************************************************/
.transcrições {
    background-color: #F2F2F2;
    border-radius: 5px;
    box-shadow: 0 0 6px #B2B2B2;
    display: inline-block;
    padding: 10px 10px 10px 18px;
    position: relative;
    vertical-align: top;
    width: 100%;
    color: #000;
    /* Garante que o texto dentro das transcrições será preto */
}

.transcrições b,
.transcrições strong {
    color: #000 !important;
    /* Garante que o texto negrito também será preto */
}

.transcrições::before {
    background-color: #F2F2F2;
    content: "\00a0";
    display: block;
    height: 16px;
    position: absolute;
    top: 11px;
    transform: rotate(29deg) skew(-35deg);
    -moz-transform: rotate(29deg) skew(-35deg);
    -ms-transform: rotate(29deg) skew(-35deg);
    -o-transform: rotate(29deg) skew(-35deg);
    -webkit-transform: rotate(29deg) skew(-35deg);
    width: 20px;
}

.me {
    float: left;
    margin: 5px 45px 5px 20px;
    color: #000;
    /* Garante que o texto dentro da classe .me será preto */
}

.me::before {
    box-shadow: -2px 2px 2px 0 rgba(178, 178, 178, .4);
    left: -9px;
}

/*******************************************************************************
       PREDEFINIÇÃO ITEMBOX E RESPONSIVIDADE DAS PÁGINAS DE ITEM
      *******************************************************************************/
.item-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: center;
    margin: 20px auto;
    max-width: 100%;
}

@media (max-width: 1024px) {
    .item-grid>* {
        flex: 1 1 calc(25% - 10px);
        max-width: calc(25% - 10px);
    }
}

@media (max-width: 768px) {
    .item-grid>* {
        flex: 1 1 calc(33.33% - 10px);
        max-width: calc(33.33% - 10px);
    }
}

@media (max-width: 480px) {
    .item-grid>* {
        flex: 1 1 calc(50% - 10px);
        max-width: calc(50% - 10px);
    }
}

@media (max-width: 360px) {
    .item-grid>* {
        flex: 1 1 100%;
        max-width: 100%;
    }
}

.iteminfobox {
    padding: 10px;
    background: #eeeded;
    border-radius: 25px;
    box-shadow: rgba(24, 27, 46, 0.24) 4px 4px 4px;
    width: 230px;
    height: 270px;
    position: relative;
    text-align: center;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.iteminfobox b {
    font-size: clamp(10px, 2vw, 14px);
    color: #6587c4;
    text-align: center;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/**********************
      VECTOR.CSS
  **********************/

/* Geral */
a {
    color: #0645ad;
}

a:visited {
    color: #0645ad;
}

a.new {
    color: rgb(206, 0, 0) !important;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    color: #000000;
}

hr {
    color: #222;
}

ul {
    list-style-image: none;
}

/* Cabeçalho */
#mw-head-base {
    background: url(http://70.39.70.36/images/f/fd/azul_capriw2.png);
    background-repeat: repeat-x;
    width: 1531px;
    max-height: 63px;
    margin-top: -3.5em;
    display: block;
}

/* Navegação */
#p-cactions {
    background: none;
    margin-top: -0.6em;
}

#p-cactions li {
    background: none;
}

#p-cactions li.selected {
    background: none;
    border: 2px solid #5c3f2a;
}

#p-cactions li.new {
    background-color: #e2e2e2;
}

#p-cactions li a {
    background-color: #e2e2e2;
    color: #7070FF;
}

#p-cactions li.selected a {
    background-color: #324f74;
}

/* Barra de Pesquisa */
#searchInput {
    background-color: #ffffff;
    border-color: #0645ad;
}

#content {
    color: var(--content-text);
    background-color: var(--content-bg) !important;
    border: none !important;
    box-shadow: rgba(0, 0, 0, .1) 0px 8px 24px, rgba(0, 0, 0, 0.15) 0px 0px 0px 2px;
}

#simpleSearch {
    position: relative;
    height: 100%;
    background-color: white;
}

/* Menu */
.vector-menu-tabs,
.vector-menu-tabs a,
#mw-head .vector-menu-dropdown h3 {
    background: none;
}

.vector-menu-tabs li a {
    background-position: center;
    background: transparent;
    display: block;
    float: left;
    height: 3.07692308em;
    position: relative;
    padding-top: 0.9em;
    padding-left: 8px;
    padding-right: 8px;
    font-size: 0.8125em;
    cursor: pointer;
}

.vector-menu-tabs .selected {
    font-weight: bold;
    background: #ffffff;
    border: 1px #0645ad solid;
}

.vector-menu-tabs ul {
    float: left;
    height: 100%;
    list-style: none none;
    margin: 0;
    padding: 0;
    margin-top: -0.3em;
}

.vector-menu-dropdown .vector-menu-content {
    background-color: none;
    list-style: none none;
    min-width: 100%;
    position: absolute;
    top: 2.5em;
    right: -1px;
    margin: 0;
    border: 2px solid #0645ad !important;
    border-top-width: 0;
    padding: 0;
    box-shadow: 0 1px 1px 0 rgb(0 0 0 / 10%);
    text-align: left;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: opacity 100ms;
    transition: opacity 100ms;
    z-index: 3;
}

/* Conteúdo */
.mw-body {
    margin-top: -1px;
    border: 1px solid #8d6e63;
    border-right-width: 1px;
}

.mw-parser-output small li {
    color: #000000;
}

.mw-parser-output tr i {
    color: #000000;
}

.mw-parser-output tr big {
    color: #000000;
}

.mw-parser-output .center .thumbcaption,
.mw-parser-output .tright .thumbcaption {
    color: #000000;
}

/* Tabelas */
.jquery-tablesorter tr td {
    background-color: #fcfcfc !important;
    color: #000000 !important;
}

#mw-content-text .mw-parser-output .jquery-tablesorter {
    transform: translatex(0px) translatey(0px);
    background-color: #fcfcfc;
    color: #000000 !important;
    border-color: #0645ad;
}

/* Links */
#mw-normal-catlinks ul a,
#mw-normal-catlinks a,
#ca-delete a,
#ca-move a,
#ca-unprotect a {
    color: #0645ad !important;
}

#ca-delete a,
#ca-move a,
#ca-unprotect a {
    background-color: #ffffff !important;
    border-color: #0645ad;
    border-width: 0px;
}

/* Rodapé */
#footer-info-lastmod {
    display: none !important;
}

/* Outros */
.mw-destfile-warning {
    border: 1px solid #8d6e63;
    padding: 0.5em 1em;
    margin-bottom: 1em;
    color: #f8f9fa;
    background-color: #0d1b2d;
}

.mw-logline-protect {
    color: #f8f9fa !important;
}

.oo-ui-popupWidget-head>.oo-ui-iconElement-noIcon+.oo-ui-labelElement-label {
    margin-left: 12px;
    color: white;
}

#msupload-div a {
    color: #3366cc;
    cursor: pointer;
    color: blue !important;
}

#msupload-bottom a {
    font-weight: bold;
    margin-right: 20px;
    color: black !important;
}

#msupload-list .file {
    background: #8b929e;
    border-top: 1px solid #c8ccd1;
    margin: 0;
    padding: 10px;
    position: relative;
    color: black !important;
}

.wikiEditor-ui-toolbar .booklet>.index {
    float: left;
    width: 20%;
    height: 125px;
    overflow: auto;
    resize: horizontal;
    color: black;
}

.codeEditor-status-message {
    border-left: 1px solid #c8ccd1;
    border-right: 1px solid #c8ccd1;
    padding: 0 0.3em;
    width: 100%;
    display: table-cell;
    color: black !important;
}

.wikiEditor-ui-toolbar .tabs span.tab a {
    color: #000000 !important;
    cursor: pointer;
    display: block;
    height: 32px;
    padding-left: 18px;
    padding-right: 12px;
}

.wikiEditor-ui-toolbar .group .tool-select .label {
    position: relative;
    padding: 0 26px 0 4px;
    margin: 0;
    cursor: pointer;
    text-decoration: none;
    color: #222 !important;
}

.wikiEditor-ui-toolbar .group .tool-select .options .option {
    display: block;
    padding: 0.5em;
    text-decoration: none;
    color: #000 !important;
    white-space: nowrap;
}

div.mw-number-text {
    color: #888 !important;
}

div.mw-number-text h3 {
    color: #c1c1c1 !important;
}

/* Tooltip */
.tip2 {
    background-color: #F2F2F2;
    border-radius: 2px;
    box-shadow: 0 0 6px #B2B2B2;
    display: none;
    position: absolute;
    padding: 10px;
    z-index: 1;
}

.tooltip {
    position: relative;
}

#tip-espaco {
    margin-left: 10px;
}

#youtube {
    margin-left: -155px;
}

.tooltip,
.tooltip:hover+.tip2,
.tip2:hover {
    display: inline;
}

/* tira o toggle do indice, ocultar/exibir */
#toc .toctogglelabel {
    display: none !important;
}

span.toctogglespan {
    display: none !important;
}

/*   WIKITABLE */
table.wikitablec,
table.prettytable {
    margin: 1em 1em 1em 0;
    background: #f9f9f9;
    border: 1px #aaa solid;
    border-collapse: collapse;
}

table.wikitablecenter,
table.prettytable {
    margin-left: auto;
    margin-right: auto;
    background: #f9f9f9;
    border: 1px #aaa solid;
    border-collapse: collapse;
}

table.wikitablec th,
table.wikitablec td,
table.prettytable th,
table.prettytable td {
    border: 1px #aaa solid;
    padding: 0.2em;
    text-align: center;
}

table.wikitablec th,
table.prettytable th {
    background: #f2f2f2;
    text-align: center;
}

table.wikitablec caption,
table.prettytable caption {
    margin-left: inherit;
    margin-right: inherit;
    font-weight: bold;
}

table.prettytablec code,
table.wikitablec code {
    background-color: transparent;
}

table.wikitablew-tr th,
table.wikitablew-tr td {
    padding: 0.3em 0.4em;
}

table.wikitablecenter th,
table.wikitablecenter td,
table.prettytable th,
table.prettytable td {
    border: 1px #aaa solid;
    padding: 0.2em;
    text-align: center;
}

table.wikitablecenter th,
table.prettytable th {
    background: #f2f2f2;
    text-align: center;
}

table.wikitablecenter caption,
table.prettytable caption {
    margin-left: inherit;
    margin-right: inherit;
    font-weight: bold;
}

table.prettytablecenter code,
table.wikitablecenter code {
    background-color: transparent;
}

table.elements {}

table.elements th,
table.elements td {
    padding: 0.5em;
}

td.effective {
    background-color: #BFFFBF;
}

td.ineffective {
    background-color: #FFBF7F;
}

td.nullified {
    background-color: #FFBFBF;
}

/*   Wikitable White */
table.wikitablew,
table.prettytable,
table.wikitablew-tr {
    margin: 1em 0;
    background: #f9f9f9;
    border: 2px #fff solid;
    border-collapse: collapse;
}

table.wikitablewhite,
table.prettytable {
    margin-left: auto;
    margin-right: auto;
    background: #f9f9f9;
    border: 2px #fff solid;
    border-collapse: collapse;
}

/*   Wikitable White */
table.wikitablenb,
table.prettytable,
table.wikitablenb-tr {
    margin: 1em 0;
    background: #f9f9f9;
    border: none;
    border-opacity: 0.5;
    border-collapse: collapse;
}

.wikitablenb border: opacity {
    opacity: 0.5;
}

table.wikitablenoborder,
table.prettytable {
    margin-left: auto;
    margin-right: auto;
    background: #f9f9f9;
    border: 2px #e9e8e8 solid;
    border-collapse: collapse;
}

/* HOVER DA TABELA*/
.wikitablew td: hover {
    background: #e9e8e8;
}

.wikitablew-tr tr: hover {
    background: #e9e8e8;
}

.wikitablenb border: hover {
    color: #e9e8e8;
}

table.wikitablew th,
table.wikitablew td,
table.prettytable th,
table.prettytable td,
table.wikitablew-tr th,
table.wikitablew-tr td {
    border: 2px #fff solid;
    padding: 0.3em 0.4em;
}

table.wikitablew th,
table.prettytable th,
table.wikitablew-tr th {
    background: #eaecf0;
}

table.wikitablew caption,
table.prettytable caption,
table.wikitablew-tr caption {
    margin-left: inherit;
    margin-right: inherit;
    font-weight: bold;
}

table.prettytablec code,
table.prettytable code,
table.wikitablew-tr code {
    background-color: transparent;
}

table.wikitablewhite th,
table.wikitablewhite td,
table.prettytable th,
table.prettytable td {
    border: 2px #fff solid;
    padding: 0.2em;
    text-align: center;
}

table.wikitablewhite th,
table.prettytable th,
table.wikitablew-tr th {
    background: #eaecf0;
    text-align: center;
    border-right: 1px #fff solid;
    padding: 0.3em 0.4em;
}

table.wikitablewhite caption,
table.prettytable caption,
table.wikitablew-tr caption {
    margin-left: inherit;
    margin-right: inherit;
    font-weight: bold;
    text-align: center;
}

table.prettytablecenter code,
table.wikitablewhite code,
table.wikitablew-tr code {
    background-color: #000;
}

table.elements {}

table.elements th,
table.elements td {
    padding: 0.5em;
}

td.effective {
    background-color: #BFFFBF;
}

td.ineffective {
    background-color: #FFBF7F;
}

td.nullified {
    background-color: #FFBFBF;
}

/**********************************
wiki.gla.com.br/index.php/Predefini%C3%A7%C3%A3o:Img

predefinição:img | deixa as imagens responsivas pro mobile
**********************************/
.responsive-image {
    max-width: 100%;
    display: block;
    margin: 0 auto;
    overflow: hidden;
}

.custom-image {
    width: 100%;
    max-width: 800px;
    height: auto;
}

.responsive-image[style*="text-align:left"] {
    margin: 0;
    text-align: left;
}

.responsive-image[style*="text-align:right"] {
    margin: 0;
    text-align: right;
}

.responsive-image[style*="text-align:center"] {
    text-align: center;
}


/* ---------------------------------------------------------------------------------------------------------------- */

/* Estilos CSS para o componente de abas MediaWiki */
/* Adicione este CSS na sua MediaWiki (Common.css ou página de estilos) */

/* Container principal responsivo */
.mw-tabber-container {
    width: 100%;
    max-width: 100%;
    margin: 20px 0;
    border: 1px solid #a7d7f9;
    border-radius: 4px;
    background-color: #f8f9fa;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

/* Container das abas */
.mw-tabber-tabs {
    display: flex;
    flex-wrap: wrap;
    background-color: #eaecf0;
    border-bottom: 2px solid #a7d7f9;
    padding: 0;
    margin: 0;
    list-style: none;
}

/* Estilo individual de cada aba */
.mw-tabber-tab {
    flex: 1 1 auto;
    min-width: 100px;
    padding: 12px 20px;
    cursor: pointer;
    background-color: #eaecf0;
    border: none;
    border-right: 1px solid #c8ccd1;
    text-align: center;
    font-size: 14px;
    font-weight: 500;
    color: #0645ad;
    transition: all 0.2s ease;
    user-select: none;
    position: relative;
}

.mw-tabber-tab:last-child {
    border-right: none;
}

/* Hover nas abas */
.mw-tabber-tab:hover {
    background-color: #f8f9fa;
    color: #0b0080;
}

/* Aba ativa */
.mw-tabber-tab.active {
    background-color: #ffffff;
    color: #0645ad;
    border-bottom: 3px solid #0645ad;
    font-weight: 600;
}

/* Container do conteúdo */
.mw-tabber-content {
    padding: 20px;
    background-color: #ffffff;
    min-height: 200px;
}

/* Painel de conteúdo individual */
.mw-tabber-panel {
    display: none;
    animation: fadeIn 0.3s ease;
}

.mw-tabber-panel.active {
    display: block;
}

/* Animação de fade in */
@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(5px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Responsividade para tablets */
@media (max-width: 768px) {
    .mw-tabber-tabs {
        flex-direction: column;
    }

    .mw-tabber-tab {
        border-right: none;
        border-bottom: 1px solid #c8ccd1;
        width: 100%;
    }

    .mw-tabber-tab.active {
        border-bottom: 3px solid #0645ad;
        border-right: none;
    }

    .mw-tabber-content {
        padding: 15px;
    }
}

/* Responsividade para mobile */
@media (max-width: 480px) {
    .mw-tabber-tab {
        padding: 10px 15px;
        font-size: 13px;
    }

    .mw-tabber-content {
        padding: 12px;
        min-height: 150px;
    }
}


/**************
gurren (2026)
**************/
.gla-responsive-frame{
  width: fit-content;
  max-width: 100%;
  margin: 12px auto;
  padding: 0;
  background: transparent;
  box-shadow: none;
}

/* neutraliza molduras do MediaWiki */
.gla-responsive-frame .thumbinner,
.gla-responsive-frame .thumb,
.gla-responsive-frame figure,
.gla-responsive-frame .mw-file-description{
  max-width: 100% !important;
  width: auto !important;
  padding: 0 !important;
  margin: 0 auto !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  box-sizing: border-box;
}

/* imagem: tamanho natural + responsivo */
.gla-responsive-frame img{
  display: block !important;
  max-width: 100% !important;
  width: auto !important;
  height: auto !important;
  margin: 0 auto !important;
  border: 0 !important;
  border-radius: 8px; /* pode tirar também se quiser totalmente cru */
}