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

De Wiki Gla
Ir para navegação Ir para pesquisar
Etiqueta: Revertido
 
Linha 1: Linha 1:
/* Consistent size for <small>, <sub> and <sup> */
/*--------------------------------------------------
small {
ESTILIZAÇÃO PADRÃO
font-size: 85%;
--------------------------------------------------*/
 
html{
scroll-behavior: smooth;
}
 
: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;
}
 
.mw-body h1, .mw-body-content h1, .mw-body-content h2{
font-family: sans-serif!important;
}
 
a:visited,
a {
color: var(--link-text) !important;
}
 
body {
background-image: url(/images/3/31/Cinza_capriw.png);
background-repeat: repeat;
background-attachment: fixed;
}
}


.mw-body-content sub,
h1, h2 {
.mw-body-content sup,
    margin-bottom: 0.6em;
span.reference /* para Parsoid */ {
    border-bottom: 0px !important;
font-size: 80%;
}
}


/* Don't display some stuff on the main page */
#content {
body.page-Wikipédia_Página_principal #t-cite,
overflow-x: clip;
body.page-Wikipédia_Página_principal #lastmod,
body.page-Wikipédia_Página_principal #siteSub,
    color: var(--content-text);
body.page-Wikipédia_Página_principal #contentSub,
    background-color: var(--content-bg) !important;
body.page-Wikipédia_Página_principal h1.firstHeading {
border: none!important;
display: none !important;
box-shadow: rgba(0, 0, 0, .1) 0px 8px 24px, rgba(0, 0, 0, 0.15) 0px 0px 0px 2px;
}
}


/* Reduzir saltos de página ao esconder conteúdo recolhido/dispensado */
#simpleSearch {
.client-js .mw-special-Watchlist #watchlist-message,
    background-color: var(--simpleSearch-bg) !important;
.client-js .NavFrame.collapsed .NavContent,
}
.client-js .collapsible:not( .mw-made-collapsible).collapsed > tbody > tr:not(:first-child) {
 
display: none;
#p-personal{
right: 1em;
    top: .5em;
}
}


/* Criação de tópicos nas esplanadas "geral" e "propostas" */
#p-search {
/* Formata o aviso */
float: left;
div.aviso-novo-item-esplanada {
    margin-left: -0.1em;
font-style: italic;
    margin-right: 1em;
    margin-top: -0.4em;
}
}


/* Oculta ligação vermelha durante a criação dos tópicos */
#searchInput {
div.aviso-novo-item-esplanada + p>a.new {
    background-color: #231813;
display:none;
    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;  
}
}


/* Resultados de busca */
.mw-body {
.mw-search-results {
    margin-top: -1px;
margin-left: 0;
    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";
}
}


.mw-search-results li {
/* Consistent size for sub/sup */
margin: 0;
.mw-body sub,
padding: 0.35em 1em;
.mw-body sup,
border-bottom: 1px solid #d3daed;
span.reference /* for Parsoid */ {
background-color: #f6f8fc;
    font-size: 80%;
list-style-type: none;
list-style-image: none;
}
}


/* Modelos de predefinições */


/* infobox */
/* Hide confusing "Discussion" tab on [[Project:Support_desk]],
.infobox {
* For sanity, only do this if [[Project_talk:Support_desk]] is a
border: 1px solid #a2a9b1;
* redirect (which goes back to [[Project:Support_desk]]).
border-spacing: 3px;
* If that is changed for some reason, it automatically comes back.
background-color: #f8f9fa;
*/
color: black;
.page-Project_Support_desk #ca-talk a.mw-redirect {
/* @noflip */
display: none;
margin: 0.5em 0 0.5em 1em;
padding: 0.2em;
/* @noflip */
float: right;
/* @noflip */
clear: right;
font-size: 88%;
line-height: 1.5em;
}
}


.infobox td,
/* CSS Hover Gallery for Mediawiki */
.infobox th {
 
vertical-align: top;
.gallery_zoom_img img{
/* @noflip */
-moz-transition:-moz-transform 0.1s ease-in;  
text-align: left;
-webkit-transition:-webkit-transform 0.1s ease-in;
-o-transition:-o-transform 0.1s ease-in;
transition:transform 0.1 ease-in;
}
}


.infobox caption {
.gallery_zoom_img img:hover{
font-size: 125%;
-moz-transform:scale(2);  
font-weight: bold;
-webkit-transform:scale(2);
padding: 0.2em;
-o-transform:scale(2);
text-align: center;
transform:scale(2);
}
}


.infobox.bordered {
/*--------------------------------------------------
border-collapse: collapse;
CSS CUSTOMIZADO
--------------------------------------------------*/
 
/*--------------------------------------------------
Vector
--------------------------------------------------*/
 
.vector-menu-tabs li {
background: transparent ;
}
}


.infobox.bordered td,
/*--------------------------------------------------
.infobox.bordered th {
Tabber
border: 1px solid #a2a9b1;
--------------------------------------------------*/
 
.center-tab .tabber__header {
    justify-content: center;
}
}


.infobox.sisterproject {
/*--------------------------------------------------
width: 20em;
Tags de uso generalizado
font-size: 90%;
--------------------------------------------------*/
 
.mt-1{
margin-top: .75em;
}
}


.infobox.standard-talk {
.mt-2{
border: 1px solid #c0c090;
margin-top: 1.5em;
background-color: #f8eaba;
}
}


.infobox.standard-talk.bordered td,
.mt-4{
.infobox.standard-talk.bordered th {
margin-top: 3em;
border: 1px solid #c0c090;
}
}


/* Estilos para infocaixa com bordas com linhas fundidas */
.mt--4{
.infobox.bordered .mergedtoprow td,
margin-top: -2em;
.infobox.bordered .mergedtoprow th {
border: 0;
border-top: 1px solid #a2a9b1;
/* @noflip */
border-right: 1px solid #a2a9b1;
}
}


.infobox.bordered .mergedrow td,
.mb-2{
.infobox.bordered .mergedrow th {
margin-bottom: 1em;
border: 0;
/* @noflip */
border-right: 1px solid #a2a9b1;
}
}


/* Estilos para infocaixas de geografia */
 
.infobox.geography {
.d-flex,
border-collapse: collapse;
.td-flex td{
line-height: 1.2em;
display:flex;
font-size: 90%;
}
}


.infobox.geography  td,
.d-block{
.infobox.geography  th {
display: block;
border-top: 1px solid #a2a9b1;
padding: 0.4em 0.6em 0.4em 0.6em;
}
}


.infobox.geography .mergedtoprow td,
.relative{
.infobox.geography .mergedtoprow th {
position:relative;
border-top: 1px solid #a2a9b1;
padding: 0.4em 0.6em 0.2em 0.6em;
}
}


.infobox.geography .mergedrow td,
.text-justify{
.infobox.geography .mergedrow th {
text-align: justify;
border: 0;
padding: 0 0.6em 0.2em 0.6em;
}
}


.infobox.geography .mergedbottomrow td,
.align-center{
.infobox.geography .mergedbottomrow th {
align-items: center;
border-top: 0;
border-bottom: 1px solid #a2a9b1;
padding: 0 0.6em 0.4em 0.6em;
}
}


.infobox.geography .maptable td,
.align-top{
.infobox.geography .maptable th {
align-items: flex-start;
border: 0;
padding: 0;
}
}


/**
.justify-between{
* @deprecated: Remover assim que todas as ocorrências forem trocadas por "wikitable"
justify-content: space-between;
* @see: [[WP:Esplanada/propostas/Acabar com as tabelas bonitas! (4jul2012)]]
*/
table.prettytable {
margin: 1em 1em 1em 0;
background: #f9f9f9;
border: 1px #aaa solid;
border-collapse: collapse;
}
}


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


table.prettytable th {
.border-none{
background: #f2f2f2;
border: none!important;
text-align: center;
}
}


table.prettytable caption {
.w-25{
font-weight: bold;
width: 25%;
}
}


/* Predefinições informativas e mensagens MediaWiki */
.h-100 {
.caixa {
height: 100%;
width: 80%;
margin: 0 auto;
padding: .1em;
border: 1px solid #C7C7C7;
}
}


.caixaMW {
.flex-wrap{
margin: 1px 0;
flex-wrap: wrap;
padding: .1em;
font-size: 93%;
line-height:120%;
clear: both;
}
}


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


.caixaMW.infodestaque,
.badge{
.caixa.infodestaque {
padding: .25em .57em;
background-color: #f5faff;
margin: .45em;
border: 1px solid #cedff2;
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);
}
}


.caixaMW.aviso,
.card{
.caixa.aviso {
width: 100%;
background-color:#fff3f3;
min-height: 14em;
border: 1px solid #ffc9c9;
margin: 0 auto;
border-radius: 10px;
box-shadow: rgb(0 0 0 / 9%) 0px 3px 12px;
}
}


.caixaMW.avisodestaque,
.card-title{
.caixa.avisodestaque {
display: block;
background-color:#fff;
padding:.25em 0;
border: 2px solid #f00;
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;
}
}


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


/* Make the list of references smaller */
.scaleUp-hover:hover {
.references-small {
transform: scale(1.1);
font-size: 90%;
}
}


/* Realce a azul das referências ''clicadas'' para ajudar na navegação */
 
body.action-info .mw-body-content :target,
/*--------------------------------------------------
.citation:target {
Tooltip
background-color: #def;  /* Fallback */
--------------------------------------------------*/
background-color: rgba(0, 127, 255, 0.133);
 
.simple-tooltip-inline{
border: none!important;
}
}


/* Formatação de citações. Quebrar URLs longas etc., em vez de uma caixa transbordante */
.tooltipster-default{
.citation {
background-color: rgb(220, 220, 220);
word-wrap: break-word;
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{
Para números e IDs de documentos ligados, em que o número
borde-color: rgb(220, 220, 220)!important;
não precisa ser mostrado em uma tela ou dispositivo de mão,
mas deve ser incluído na versão impressa
*/
@media screen, handheld {
.citation .printonly {
display: none;
}
}
}


/**
#bigImage{
* Style for horizontal lists (separator following item).
position: absolute;
* @source https://www.mediawiki.org/wiki/Snippets/Horizontal_lists
transform: translate(0, -100%);
* @revision 7 (2015-11-12)
* @author [[User:Edokter]]
*/
.hlist dl,
.hlist ol,
.hlist ul {
margin: 0;
padding: 0;
}
}


/* Display list items inline */
/*--------------------------------------------------
.hlist dd,
Pagina Inicial
.hlist dt,
--------------------------------------------------*/
.hlist li {
.initialPage--table{
margin: 0;
width: 100%;
display: inline;
text-align: center;
}
}


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


.nonumtoc #toc ul,
.initialPage--title,
.nonumtoc .toc ul {
.initialPage--events{
line-height: 1.5em;
border: none;
list-style: none none;
border-collapse: separate;
margin: .3em 0 0;
padding: 0;
}
}


.hlist.nonumtoc #toc ul ul,
.initialPage--events th,  
.hlist.nonumtoc .toc ul ul {
.initialPage--title th {
/* @noflip */
color: black !important;
margin: 0;
padding: .4em;
}
}


/* Display nested lists inline */
.initialPage--title th {
.hlist.inline,
background-color: transparent !important;
.hlist.inline dl,
font-size: 2em;
.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 */
.initialPage--events{
.hlist .mw-empty-li {
display: flex;
display: none;
height: 20em;
}
}


/* Generate interpuncts */
.event-image{
.hlist dt:after {
aspect-ratio: 32 / 10;
content: ": ";
width: -webkit-fill-available;
max-width: 350px;
height: auto;
object-fit: fill;
position: relative;
}
}


.hlist dd:after,
#event-time{
.hlist li:after {
position: absolute;
content: " · ";
bottom: 3%;
right: 15%;
letter-spacing: 2px;
font-size: 1.15em;
font-weight: bold;
font-weight: bold;
color: #fff;
}
}


.hlist dd:last-child:after,
.initialPage--eventsLogo{
.hlist dt:last-child:after,
height: 100%;
.hlist li:last-child:after {
padding: .5em 3.5em 2em 0;
content: none;
display: flex;
align-items: center;
}
}


/* Add parentheses around nested lists */
.initialPage--events td{
.hlist dd dd:first-child:before, .hlist dd dt:first-child:before, .hlist dd li:first-child:before,
text-align:center;
.hlist dt dd:first-child:before, .hlist dt dt:first-child:before, .hlist dt li:first-child:before,
display: flex;
.hlist li dd:first-child:before, .hlist li dt:first-child:before, .hlist li li:first-child:before {
align-items: center;
content: " (";
justify-content: flex-end;
font-weight: normal;
}
}


.hlist dd dd:last-child:after, .hlist dd dt:last-child:after, .hlist dd li:last-child:after,
.initialPage--mainContainer{
.hlist dt dd:last-child:after, .hlist dt dt:last-child:after, .hlist dt li:last-child:after,
display: flex;
.hlist li dd:last-child:after, .hlist li dt:last-child:after, .hlist li li:last-child:after {
align-items: flex-start;
content: " )";
font-weight: normal;
}
}


/* Put ordinals in front of ordered list items */
.initialPage--menuContainer{
.hlist ol {
width: 75%;
counter-reset: listitem;
margin-right: 1.5em;
}
}


.hlist ol > li {
.initialPage--sideMenuContainer{
counter-increment: listitem;
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;
}
}


.hlist ol > li:before {
.initialPage--menu{
content: " " counter(listitem) " ";
display: flex;
white-space: nowrap;
flex-wrap: wrap;
}
}


.hlist dd ol > li:first-child:before,
.initialPage--menuItemContainer{
.hlist dt ol > li:first-child:before,
display: flex;
.hlist li ol > li:first-child:before {
justify-content: center;
content: " (" counter(listitem) " ";
flex-wrap: wrap;
padding: 1em 0;
}
}


/* Unbulleted lists */
.initialPage--menuItem{
.plainlist ol,
width: 22.5%;
.plainlist ul {
line-height: inherit;
list-style: none none;
margin: 0;
}
}
.plainlist ol li,
 
.plainlist ul li {
.initialPage--menuItem a img {
margin-bottom: 0;
width: 100%;
}
}


/* Estilo padrão para caixas de navegação (navbox) */
.initialPage--socialMediaContainer{
.navbox {                     /* Navbox container style */
box-sizing: border-box;
box-sizing: border-box;
border: 1px solid #a2a9b1;
width: 100%;
width: 100%;
clear: both;
margin-top: 8em;
font-size: 88%;
padding: 0 1.5em;
text-align: center;
padding: 1px;
margin: 1em auto 0;       /* Prevent preceding content from clinging to navboxes */
}
}


.navbox .navbox {
.initialPage--socialMedia{
margin-top: 0;           /* No top margin for nested navboxes */
position: relative;
border-top: 2px solid #689cc0;
margin-top: 1em;
}
}


.navbox + .navbox {
.initialPage--socialMedia:before{
margin-top: -1px;         /* Single pixel border between adjacent navboxes */
content: '';
position: absolute;
top: -2px;
display: block;
width: 0;
height: 2px;
z-index: 1;
transition: width .25s ease;
}
}


.navbox-inner,
.initialPage--socialMedia:hover::before{
.navbox-subgroup {
width: 100%;
width: 100%;
}
}


.navbox-group,
.initialPage--socialMediaLink{
.navbox-title,
display: flex;
.navbox-abovebelow {
justify-content: space-between;
padding: 0.25em 1em;     /* Title, group and above/below styles */
align-items: center;
line-height: 1.5em;
text-align: 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);
}
}


th.navbox-group {            /* Group style */
/*
white-space: nowrap;
Facebook
/* @noflip */
*/
text-align: right;
 
.initialPage--socialMedia.facebook > .initialPage--socialMediaLink:hover{
color: #4267B2!important;
}
}


.navbox,
.initialPage--socialMedia.facebook:before{
.navbox-subgroup {
background: #4267B2;
background-color: #fdfdfd; /* Background color */
}
.initialPage--socialMedia.facebook > .initialPage--socialMediaLink:hover > .socialMedia--svg svg{
fill: #4267B2!important;
}
}


.navbox-list {
/*--------------------------------------------------
line-height: 1.5em;
Ocultação de componentes
border-color: #fdfdfd;   /* Must match background color */
--------------------------------------------------*/
 
#p-navigation { background-color: transparent; }
#mw-head-base { background-color: transparent; width: auto!important; }
#p-logo { background-color: transparent; }
#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;
}
}


/* cell spacing for navbox cells */
.table-pacients img{
tr + tr > .navbox-abovebelow,
width: 15.715em;
tr + tr > .navbox-group,
height: auto;
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 {
PERSONAGENS
background-color: #ccccff;     /* Level 1 color */
*/
 
.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;
}
}


.navbox-abovebelow,
.filter{
th.navbox-group,
width: fit-content;
.navbox-subgroup .navbox-title {
    display: flex;
background-color: #ddddff;     /* Level 2 color */
    justify-content: center;
    border: 3px solid #b0cff1;
    border-collapse: collapse;
    border-radius: 8px;
}
}


.navbox-subgroup .navbox-group,
.filter--title{
.navbox-subgroup .navbox-abovebelow {
display: flex;
background-color: #e6e6ff;     /* Level 3 color */
    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;
}
}


.navbox-even {
.filter--icon,
background-color: #f7f7f7;     /* Even row striping */
.calcXp--tierIcon {
padding: .35em .95em;
    background: transparent;
    cursor: pointer;
}
}


.navbox-odd {
.filter--icon.tier img{
background-color: transparent; /* Odd row striping */
filter: grayscale(.0);
}
}


.navbox .hlist td dl,
.filter--icon.tier.active img{
.navbox .hlist td ol,
box-shadow: none;
.navbox .hlist td ul,
.navbox td.hlist dl,
.navbox td.hlist ol,
.navbox td.hlist ul {
padding: 0.125em 0;       /* Adjust hlist padding in navboxes */
}
}


/* Default styling for Navbar template */
.filter--icon img{
.navbar {
    filter: grayscale(.8);
display: inline;
    border-radius: 10px;
font-size: 88%;
   
font-weight: normal;
    transition: all .25s ease;
}
}


.navbar ul {
.calcXp--tierIcon img {
display: inline;
filter: drop-shadow(0px 1px 8px #4c91c900);
white-space: nowrap;
    border-radius: 10px;
   
    transition: all .25s ease;
}
}


.mw-body-content .navbar ul {
.filter--icon.active img{
line-height: inherit;
box-shadow: rgb(0 0 0 / 24%) 0px 2px 7px;
    filter: grayscale(0);
}
}


.navbar li {
.filter--icon.tier.active img,
word-spacing: -0.125em;
.calcXp--tierIcon.active img{
transform: scale(.85);
}
}


.navbar.mini li abbr[title] {
.filter--icon.tier#bronze.active img,
font-variant: small-caps;
.calcXp--tierIcon#bronze.active img{
border-bottom: none;
filter: drop-shadow(0px 1px 8px #f18a05);
text-decoration: none;
}
cursor: inherit;


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


/* Navbar styling when nested in infobox and navbox */
.filter--icon.tier#gold.active img,
.infobox .navbar {
.calcXp--tierIcon#gold.active img{
font-size: 100%;
filter: drop-shadow(0px 1px 8px #fbc300);
}
}


.navbox .navbar {
.filter--icon.tier#diamond.active img,
display: block;
.calcXp--tierIcon#diamond.active img{
font-size: 100%;
filter: drop-shadow(0px 1px 8px #0391c5);
}
}


.navbox-title .navbar {
.filter--input{
/* @noflip */
box-sizing: border-box;
float: left;
padding: .45em;
/* @noflip */
    padding-right: 2.5em;
text-align: left;
    border: 3px solid #b0cff1;
/* @noflip */
    font-size: 1.2em;
margin-right: 0.5em;
    border-radius: 8px;
    width: 23em;
}
}


/* Styling for JQuery makeCollapsible, matching that of collapseButton */
.filter--inputContainer{
.mw-parser-output .mw-collapsible-toggle {
box-sizing: border-box;
font-weight: normal;
    position: relative;
/* @noflip */
text-align: right;
padding-right: 0.2em;
padding-left: 0.2em;
}
}
.mw-collapsible-leftside-toggle .mw-collapsible-toggle {
 
/* @noflip */
.filter--searchButton{
float: left;
cursor: pointer;
/* @noflip */
    display: inline-block;
text-align: left;
    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;
   
}
}


/* Hatnotes and disambiguation notices */
.filter--searchButton img{
.hatnote {
filter: invert(1);
font-style: italic;
}
}


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


div.hatnote {
.calcXp--resultTitle{
/* @noflip */
text-align: center;
padding-left: 1.6em;
    color: #4f7ca0;
margin-bottom: 0.5em;
    margin: 0;
    margin-top: -.5em!important;
    letter-spacing: .05em;
}
}


div.hatnote + div.hatnote {
.calcXp--formItem{
margin-top: -0.5em;
display: flex;
align-items: center;
}
}


/* Redirect em verde
.calcXp--formItem input{
* Faz com que os redirects apareçam em itálico e verde em [[Special:Allpages]] e [[Special:Watchlist]]
box-sizing: border-box;
*/
padding: .35em;
.allpagesredirect a,
    border: 2px solid #b0cff1;
.redirect-in-category a,
    border-radius: 8px;
.unusedtemplatesredirect a,
    text-align: center;
.watchlistredir a {
    font-size: 1em;
font-style: italic;
    font-weight: bold;
color:green;
    letter-spacing: .05em;
    width: 4em;
}
}


/* Íconpara predefinições medialist [[Template:Ouça]], [[Template:Multi-listen_start]], [[Template:Video]], [[Template:Multi-video_start]] */
.calcXp--formItem span{
div.listenlist {
font-size: 1.225em;
background: url( "//upload.wikimedia.org/wikipedia/commons/thumb/a/a6/Gnome-speakernotes.png/30px-Gnome-speakernotes.png" );
    font-weight: 500;
padding-left: 40px;
    letter-spacing: .05em;
    margin-right: .5em;
    color: #386a93;
}
}


div.videolist,
#calculate-btn{
div.multivideolist {
    box-sizing: border-box;
background: url( "//upload.wikimedia.org/wikipedia/en/thumb/2/20/Tango-video-x-generic.png/40px-Tango-video-x-generic.png" );
    cursor: pointer;
padding-left: 50px;
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;
}
}


/* Style rules for media list templates */
#calculate-btn:hover {
div.medialist {
    color: #ffffff;
min-height: 50px;
    box-shadow: rgb(0 0 0 / 8%) 0px 3px 8px;
margin: 1em;
    transform: scale(.95);
background-position: top left;
    background: #4685b8;
background-repeat: no-repeat;
}
}


div.medialist ul {
#calc-result{
list-style-type: none;
margin-top: 1em;
list-style-image: none;
display: flex;
margin: 0;
    justify-content: center;
}
}


div.medialist ul li {
#calc-result .badge{
padding-bottom: 0.5em;
    display: flex;
    align-items: center;
    justify-content: center;
max-height: 5em;
    width: 5em;
}
}


div.medialist ul li li {
.calcXp--xpIcon{
font-size: 91%;
margin-left: -.2em;
padding-bottom: 0;
}
}


/* Change the external link icon to an Adobe icon for all PDF files
.calcXp--numberOfPots{
* in browsers that support these CSS selectors, like Mozilla and Opera
padding-top: .2em;
*/
font-size: 1.15em;
#content a[href$=".pdf"].external,
#content a[href*=".pdf?"].external,
#content a[href*=".pdf#"].external,
#content a[href$=".PDF"].external,
#content a[href*=".PDF?"].external,
#content a[href*=".PDF#"].external,
#mw_content a[href$=".pdf"].external,
#mw_content a[href*=".pdf?"].external,
#mw_content a[href*=".pdf#"].external,
#mw_content a[href$=".PDF"].external,
#mw_content a[href*=".PDF?"].external,
#mw_content a[href*=".PDF#"].external {
background: url( "//upload.wikimedia.org/wikipedia/commons/2/23/Icons-mini-file_acrobat.gif" ) center right no-repeat;
padding-right: 16px;
}
}


/* Change the external link icon to an Adobe icon anywhere the PDFlink class
#characters-container{
* is used (notably Template:PDFlink). This works in IE, unlike the above.
display: flex;
*/
flex-wrap: wrap;
#content span.PDFlink a,
padding: 1em;
#mw_content span.PDFlink a {
background: url( "//upload.wikimedia.org/wikipedia/commons/2/23/Icons-mini-file_acrobat.gif" ) center right no-repeat;
padding-right: 17px;
}
}


/* Messagebox templates */
#characters-container > div{
.messagebox {
box-sizing: border-box;
border: 1px solid #aaa;
display: none;
background-color: #f9f9f9;
padding: 1em;
width: 80%;
width: 19%;
margin: 0 auto 1em auto;
margin-right: 1%;
padding: .2em;
}
}


.messagebox.merge {
#characters-container > div.show{
border: 1px solid #c0b8cc;
display: block;
background-color: #f0e5ff;
text-align: center;
}
}


.messagebox.cleanup {
#characters-container > div > a > img{
border: 1px solid #9f9fff;
width: 100%;
background-color: #efefff;
border-radius: 8px;
text-align: center;
filter: grayscale(.3);
transition: all .25s ease;
}
}


.messagebox.standard-talk {
#characters-container > div:hover > a > img{
border: 1px solid #c0c090;
box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
background-color: #f8eaba;
filter: grayscale(0);
transform: scale(1.06);
}


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


.messagebox.nested-talk {
.characterPage--table{
border: 1px solid #c0c090;
margin-top: -4em;
background-color: #f8eaba;
width: 100%;
width: 100%;
margin: 2px 4px 2px 4px;
}
}


.messagebox.small {
.characterPage--table > tbody{
width: 238px;
position: relative;
font-size: 85%;
display: flex;
float: right;
justify-content: space-between;
clear: both;
align-items: flex-end;
margin: 0 0 1em 1em;
line-height: 1.25em;
}
}


/**
.characterPage--table > tbody > .characterPage--mainSection {
* Infobox V2 - em fase de teste
display: flex;
* Ver [[fr:Projet:Infobox/V2]]
flex-wrap: wrap;
**/
justify-content: space-between;
.infobox_v2 {
width: 65%;
background: #f9f9f9;
color: #000;
font-size: 90%;
line-height: 1.1em;
float:right;
clear:right;
margin: 0.5em 0 0.5em 1em;
width: 23em;
border: 1px solid #aaa;
padding: 2px;
}
}


.infobox_v2 th {
.characterPage--table > tbody > .characterPage--sideSection {
vertical-align:top;
box-sizing: border-box;
text-align:left;
display: flex;
justify-content: center;
width: 33%;
padding: 0 1em;
}
}


.infobox_v2 .topo{
.characterPage--characterInfoContainer{
height:45px;
width: 43%;
vertical-align:middle;
}
text-align:center;
 
font-size:120%;
.characterPage--statsInfoContainer{
font-weight:bolder;
width: 55%;
line-height:1.2em;
color:#000;
}
}


.infobox_v2 .midia {
.stats--container{
height:35px;
display: flex;
vertical-align:middle;
justify-content:center;
text-align:center;
flex-wrap: wrap;
font-weight:bolder;
padding: 1.25em;
color:#000;
}
}


/* Imagens transparentes dos topos da infobox V2 */
.stats--container > div{
/*.topo.padrao      {}*/
width: 45%;
.topo.animangá    { background: url( "//upload.wikimedia.org/wikipedia/commons/6/63/Picto_infobox_anime_and_manga.png" ) no-repeat top right; }
display: flex;
.topo.astronomia  { background: url( "//upload.wikimedia.org/wikipedia/commons/e/ee/Picto_infobox_rocket.png" )          no-repeat top right; }
align-items: center;
.topo.bd          { background: url( "//upload.wikimedia.org/wikipedia/commons/2/2c/Picto_infobox_comicballoon.png" )  no-repeat top right; }
justify-content: center;
.topo.castelo    { background: url( "//upload.wikimedia.org/wikipedia/commons/5/5c/Picto_infobox_chateau.png" )      no-repeat top right; }
margin: .5em;
.topo.cerveja    { background: url( "//upload.wikimedia.org/wikipedia/commons/0/04/Picto_infobox_beer.png" )          no-repeat top right; }
}
.topo.cinema      { background: url( "//upload.wikimedia.org/wikipedia/commons/e/ea/Picto_infobox_cinema.png" )        no-repeat top right; }
.topo.computador  { background: url( "//upload.wikimedia.org/wikipedia/commons/c/ce/Arduino_ftdi_chip-1.png" )        no-repeat top right; }
.topo.comunicacao { background: url( "//upload.wikimedia.org/wikipedia/commons/a/a2/Picto_infobox_antenna.png" ) no-repeat top right; }
.topo.desporto   { background: url( "//upload.wikimedia.org/wikipedia/commons/8/8e/Picto_infobox_Olympic.png" ) no-repeat top right; }
.topo.edificioreligioso  { background: url( "//upload.wikimedia.org/wikipedia/commons/3/30/Pictogram-infobox-religious.png" ) no-repeat top right; }
.topo.europa      { background: url( "//upload.wikimedia.org/wikipedia/commons/c/c0/Picto_Infobox_Europe.png" )        no-repeat top right; }
.topo.fisica      { background: url( "//upload.wikimedia.org/wikipedia/commons/3/37/Fourier_infobox.png" )            no-repeat bottom right; }
.topo.internet    { background: url( "//upload.wikimedia.org/wikipedia/commons/a/aa/Picto_infobox_internet_PD.svg" )  no-repeat center right; }
.topo.humano      { background: url( "//upload.wikimedia.org/wikipedia/commons/8/82/Picto_infobox_manwoman.png" )      no-repeat top right; }
.topo.jogo        { background: url( "//upload.wikimedia.org/wikipedia/commons/2/2d/Picto_infobox_gamepad.png" )      no-repeat bottom right; }
.topo.jornal      { background: url( "//upload.wikimedia.org/wikipedia/commons/2/23/Picto_infobox_journal.png" )      no-repeat bottom right; }
.topo.mapa        { background: url( "//upload.wikimedia.org/wikipedia/commons/7/7a/Picto_infobox_map.png" )          no-repeat top right; }
.topo.musica      { background: url( "//upload.wikimedia.org/wikipedia/commons/6/60/Picto_infobox_music.png" )        no-repeat bottom right; }
.topo.televisao  { background: url( "//upload.wikimedia.org/wikipedia/commons/a/a6/Picto_infobox_TV-T%26PC.png" )    no-repeat top right; }
.topo.novela, .topo.televisao2  { background: url( "//upload.wikimedia.org/wikipedia/commons/a/a6/Picto_infobox_TV-T%26PC.png" )    no-repeat bottom right; }
.topo.palacio    { background: url( "//upload.wikimedia.org/wikipedia/commons/5/5e/Pictogram_infobox_palace.png" )    no-repeat top right; }
.topo.quimica    { background: url( "//upload.wikimedia.org/wikipedia/commons/9/95/Picto_infobox_chemistry.png" )    no-repeat bottom right; }
.topo.teatro      { background: url( "//upload.wikimedia.org/wikipedia/commons/3/37/Picto_infobox_masks.png" )        no-repeat top right; }
.topo.autor      { background: url( "//upload.wikimedia.org/wikipedia/commons/1/1e/Picto_infobox_auteur.png" )        no-repeat top right; }
.topo.wiki        { background: url( "//upload.wikimedia.org/wikipedia/commons/2/24/Picto_infobox_default.png" )      no-repeat top right; }
.topo.filme      { background: url( "//upload.wikimedia.org/wikipedia/commons/4/4d/Picto_infobox_film.png" )          no-repeat center right; }
.topo.ferramentas { background: url( "//upload.wikimedia.org/wikipedia/commons/c/cb/Picto_infobox_tools.png" )        no-repeat top right; }
.topo.livro      { background: url( "//upload.wikimedia.org/wikipedia/commons/4/42/Picto_infobox_book.png" )          no-repeat center right; }
.topo.espacial    { background: url( "//upload.wikimedia.org/wikipedia/commons/9/94/Picto_infobox_shuttle.png" )      no-repeat top right; }
.topo.rka        { background: url( "//upload.wikimedia.org/wikipedia/commons/1/1b/Picto_infobox_RKA.png" )          no-repeat top right; }
.topo.ginastica  { background: url( "//upload.wikimedia.org/wikipedia/commons/9/92/Picto_infobox_gymnastic.png" )    no-repeat top right; }
.topo.raio        { background: url( "//upload.wikimedia.org/wikipedia/commons/2/27/Picto_infobox_raio.png" )          no-repeat top right; }
.topo.robo        { background: url( "//upload.wikimedia.org/wikipedia/commons/5/5f/Picto_infobox_robot.png" )        no-repeat top right; }
.midia.audio { background: url( "//upload.wikimedia.org/wikipedia/commons/thumb/8/87/Gnome-mime-sound-openclipart.svg/35px-Gnome-mime-sound-openclipart.svg.png" ) no-repeat top left; }
.midia.video { background: url( "//upload.wikimedia.org/wikipedia/commons/thumb/e/e7/Video-x-generic.svg/35px-Video-x-generic.svg.png" ) no-repeat top left; }


/* Fim da fase de teste da Infobox V2 */
.stats--container div img{
width: 2.25em;
}


/* Fundo logo Wikipédia */
.stats--bar{
.fundologo {
display: flex;
background: url( "//upload.wikimedia.org/wikipedia/commons/1/10/Wikipedia-logo-v2-200px-transparent.png" );
    width: -webkit-fill-available;
    justify-content: space-between;
    padding: 0 1.25em;
}
}


/* Barra de navegação */
.bar-filled:first-child, .bar-notFilled:first-child{
div.Boxmerge,
border-radius: 6px 0 0 6px;  
div.NavFrame {
margin: 0;
padding: 2px;
border: 1px solid #aaa;
text-align: center;
border-collapse: collapse;
font-size: 95%;
}
}


div.Boxmerge div.NavFrame {
.bar-filled:last-child, .bar-notFilled:last-child{
border-style: none;
border-radius: 0 6px 6px 0;
border-style: hidden;
}
}


div.NavFrame + div.NavFrame {
.bar-filled, .bar-notFilled{
border-top-style: none;
display: block;
border-top-style: hidden;
width: 18%;
    height: 6px;
}
}


div.NavPic {
.bar-filled{
background-color: #fff;
background: var(--blue);
margin: 0;
padding: 2px;
float: left;
}
}


div.NavFrame div.NavHead {
.bar-notFilled{
height: 1.6em;
background: var(--transparent-blue);
font-weight: bold;
font-size: 100%;
background-color: #efefef;
position:relative;
}
}


div.NavFrame p {
.characterInfo--name{
font-size: 100%;
margin: 0!important;
}
}


div.NavFrame div.NavContent {
.characterInfo--badgeContainer{
font-size: 100%;
display: flex;
justify-content: center;
flex-wrap: wrap;
width: fit-content;
    margin:0 auto;
}
}


div.NavFrame div.NavContent p {
.characterInfo--contentContainer{
font-size: 100%;
display: flex;
justify-content: space-between;
padding: .6em 1.3em;
}
}


div.NavEnd {
.characterInfo--imageContainer{
margin: 0;
width: 25%;
padding: 0;
line-height: 1px;
clear: both;
}
}


a.NavToggle {
.characterInfo--medal{
position:absolute;
margin-top:-1.5em;
top:0;
right:3px;
font-weight:normal;
font-size:smaller;
}
}


/* Geographical coordinates defaults. See [[Template:Coord/link]]
  for how these are used. The classes "geo", "longitude", and
  "latitude" are used by the [[Geo microformat]]. */
.geo-default, .geo-dms, .geo-dec  { display: inline; }
.geo-nondefault, .geo-multi-punct { display: none; }
.longitude, .latitude            { white-space: nowrap; }


/* Permite limitar a quantidade de níveis num índice;
.characterInfo--infoContainer{
* <div class="toclimit-3">, por exemplo, limitará somente
width: 75%;
* a ==nível 2== e ===nível 3=== e nada inferior, contanto
text-align: center;
* que não exista =nível 1= na pagina.
}
*/
 
.toclimit-2 .toclevel-2,
.characterInfo--infoContainer #toc{
.toclimit-3 .toclevel-3,
.toclimit-4 .toclevel-4,
.toclimit-5 .toclevel-5,
.toclimit-6 .toclevel-6,
.toclimit-7 .toclevel-7 {
display: none;
display: none;
}
}


/* Remove bordas brancas de miniaturas */
.characterPage--skins{
div.thumb {
width: 100%;
border: none;
}
 
.characterPage--characterSkills{
width: 100%;
}
/*
Card de Skins
*/
 
.skins--container{
display: flex;
justify-content: flex-start;
flex-wrap: wrap;
padding: .25em .75em;
}
 
.skins--container span {
width: 33.3%;
display: flex;
justify-content: center;
}
 
/*
Seção das skills do personagem
*/
 
.tabsContainer{
width: 95%;
margin: 0 auto;
padding-bottom: .5em;
}
 
.tabsContainer table {
width: 100%;
border-collapse: collapse;
}
}


div.tright {
.tabsContainer table > tbody> tr > td{
border: none;
border-bottom: 2px solid rgb(225, 225, 225);
margin: 0.5em 0 0.8em 1.4em;
}
}


div.tleft {
.tabSkill--container{
border: none;
padding-bottom: .85em;
margin: 0.5em 1.4em 0.8em 0;
display: flex;
max-width: 72em;
overflow-x: auto;
}
}


/* Suporte para [[Predefinição:AFI]], [[Predefinição:Unicode]] e [[Predefinição:politônico]] */
.skillInfo--description::-webkit-scrollbar,
.AFI {
.tabSkill--container::-webkit-scrollbar {
font-family: "Charis SIL", "Doulos SIL", Gentium, GentiumAlt,
  width: 8px;
"DejaVu Sans", Code2000, "TITUS Cyberbit Basic",
  height: 8px;
"Arial Unicode MS", "Lucida Sans Unicode",
"Chrysanthi Unicode";
}
}


.Unicode {
.skillInfo--description::-webkit-scrollbar-track,
font-family: Code2000, Code2001, "Free Serif", "TITUS Cyberbit Basic",
.tabSkill--container::-webkit-scrollbar-track {
"Doulos SIL", "Chrysanthi Unicode", "Bitstream Cyberbit",
  background-color: #4799c954;
"Bitstream CyberBase", Thryomanes, Gentium, GentiumAlt,
  border-radius: 10px;
"Lucida Grande", "Free Sans", "Arial Unicode MS",
"Microsoft Sans Serif", "Lucida Sans Unicode";
}
}


.politonico {
.skillInfo--description::-webkit-scrollbar-thumb,
font-family: "Athena Unicode", Gentium, "Palatino Linotype",
.tabSkill--container::-webkit-scrollbar-thumb {
"Arial Unicode MS", "Lucida Sans Unicode",
  background-color: rgb(85 135 200 / 74%);
"Lucida Grande", Code2000;
  border-radius: 10px;
}
}


/* Prevent line breaks in silly places:
.tab-skill{
  1) Where desired
transition: all .25s ease;
  2) Links when we don't want them to
width: 100%;
  3) Bold "links" to the page itself
min-width: 5em;
  4) Ref tags with group names <ref group="Note"> --> "[Note 1]" */
}
.nowrap,
 
.nowraplinks a,
.tab-skill.active{
.nowraplinks .selflink,
border-color: #459cca;
sup.reference a {
white-space: nowrap;
}
}


/* But allow wrapping where desired: */
.tab-skill > div{
.wrap,
cursor: pointer;
.wraplinks a {
box-sizing: border-box;
white-space: normal;
width: 100%;
display: flex;
justify-content: center;
align-items: center;
padding: .25em;
}
}


/* Para a documentação das predefinições */
.tab-skill > div > img{
.template-documentation {
width: 100%;
clear: both;
max-width: 40px;
margin: 1em 0 0 0;
height: auto;
border: 1px solid #C0C0C0;
background-color: #ECFCF4;
padding: 1em;
}
}


/* Ícone do [[MediaWiki:WikiLove.js]] */
.skillInfo--container{
#ca-wikilove.icon a {
width: 100%;
background-image: url( //upload.wikimedia.org/wikipedia/commons/thumb/8/87/Symbol_thumbs_up.svg/16px-Symbol_thumbs_up.svg.png );
}
}


#ca-wikilove.icon a:hover,
.skillInfo--container > td{
#ca-wikilove.icon a:focus {
border: none!important;
background-position: 5px 60%;
background-image: url( //upload.wikimedia.org/wikipedia/commons/thumb/a/ad/Symbol_thumbs_up_color.svg/16px-Symbol_thumbs_up_color.svg.png );
}
}


/* Oculta qualquer conteúdo que só é de interesse para grupos específicos de usuários.
.skillInfo{
* Torna-se visível novamente por meio de
* - [[MediaWiki:Group-user.css]]
* - [[MediaWiki:Group-autoreviewer.css]]
* - [[MediaWiki:Group-eliminator.css]]
* - [[MediaWiki:Group-rollbacker.css]]
* - [[MediaWiki:Group-sysop.css]]
* - [[MediaWiki:Group-bureaucrat.css]]
*/
.bureaucrat-show,
.sysop-show,
.eliminator-show,
.rollbacker-show,
.autoreviewer-show,
.autoconfirmed-show,
.user-show {
display: none;
display: none;
}
}


/* Make <math display="block"> be left aligned with one space indent for compatibility with style conventions */
.skillInfo.active{
.mwe-math-fallback-image-display,
display: table-cell;
.mwe-math-mathml-display {
margin-left: 1.6em !important;
margin-top: 0.6em;
margin-bottom: 0.6em;
}
}
.mwe-math-mathml-display math {
 
display: inline;
.skillInfo.active{
display: table-cell;
}
}


/* hidden sortkey for tablesorter */
.skillInfo--videoContainer{
td .sortkey,
th .sortkey {
align-self: center;
width: 45%;
}
 
.skillInfo--skillVideo2 {
display: none;
display: none;
speak: none;
border-radius: 8px;
}
}


/* Aspas retas para <q> */
.skillInfo--skillVideo2.active {
q {
display: flex;
quotes: '"' '"' "'" "'";
}
}


/* Evitar colisão de blockquote com elementos flutuantes ao trocar margem com padding */
.skillInfo--videoSelector{
blockquote {
display: inline-block;
overflow: hidden;
width: 1.1em;
margin: 1em 0;
height: 1.1em;
padding: 0 40px;
border-radius: 50%;
background: var(--transparent-blue);
cursor: pointer;
margin-right: .85em;
transition: all .25s ease;
}
}


pre, .mw-code {
.skillInfo--videoSelector.active{
overflow-x: hidden;
background: var(--blue);
overflow-wrap: break-word;
transform: scale(.8);
}
}


/* Mesmo espaçamento para parágrafos indentados e não-indentados em páginas de discussões */
.skillInfo--infoContainer{
.ns-talk .mw-body-content dd {
width: 50%;
margin-top: 0.4em;
margin-bottom: 0.4em;
}
}


/* Reajustar estilização em itálico definido pelo agente de utilizador */
.skillInfo > div > .skillInfo--infoContainer b{
cite, dfn {
color: #2a87c4 !important;
font-style: inherit;
}


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


/* Classes genéricas para serifa baseada em Times, classe texhtml para matemática em linha */
.skillInfo--name{
.times-serif,
font-size: 1.85em;
span.texhtml {
letter-spacing: 1px;
font-family: "Nimbus Roman No9 L", "Times New Roman", Times, serif;
text-align: center;
font-size: 118%;
line-height: 1;
}
}


span.texhtml {
.skillInfo--description{
white-space: nowrap;
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;
}
}


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


span.mwe-math-mathml-inline {
/* card attributes */
font-size: 118%;
.attribute--cardsContainer{
display: flex;
align-items: flex-start;
width: fit-content;
margin:0 auto;
background: var(--lightGray);
border: 2px solid var(--gray);
}
}


/* Forçar exibição tabular e de revestimento para dígitos e texhtml */
.cardAttribute{
.digits,
box-sizing: border-box;
.texhtml {
display: flex;
-moz-font-feature-settings: "lnum", "tnum", "kern" 0;
flex-direction: column;
-webkit-font-feature-settings: "lnum", "tnum", "kern" 0;
justify-content: center;
font-feature-settings: "lnum", "tnum", "kern" 0;
align-items: center;
font-variant-numeric: lining-nums tabular-nums;
width: 8em;
font-kerning: none;
}
}


ol.references,
.cardAttribute--icon{
div.reflist {
margin: .6em 0;
font-size: 90%;           /* font-size padrão */
height: 2em;
margin-bottom: 0.5em;
}
}
div.reflist ol.references {
 
font-size: 100%;           /* Resetar font-size quando aninhado em div.reflist */
.cardAttribute--value{
margin-bottom: 0;         /* Evitar margem dupla quando aninhado em div.reflist */
margin: 0!important;
list-style-type: inherit; /* Habilitar tipos de estilo de lista personalizadoss */
font-size: .9em!important;
font-weight: bold;
line-height: 1.65em!important;
letter-spacing: 2px;
text-align: center;
text-transform: uppercase;
}
}
/*------------------------------------
WANTED
-----------------------------------*/


/* Resetar margem de topo para listas embutidas em colunas */
.selectWanted--container{
div.columns {
display: flex;
margin-top: 0.3em;
justify-content: center;
}
}
div.columns dl,
 
div.columns ol,
#selectbox-wanted {
div.columns ul {
padding: .35em .5em;
margin-top: 0;
    font-family: sans-serif;
    letter-spacing: .04em;
    font-size: 1.25em;
    width: 21em;
    border: 2px solid #5684c8;
    border-radius: 6px;
}
}


/* Make it possible to hide checkboxes in <inputbox> */
.wantedPortrait--container{
.inputbox-hidecheckboxes form .inputbox-element,
width: 100%;
.inputbox-hidecheckboxes .mw-ui-checkbox {
display: none !important;
}
}


/* Ajuste na cor do símbolo de não-patrulhado nas [[WP:Mudanças recentes]], em conformidade com o [[WP:Padrão visual]] */
.wantedPortrait--title{
abbr.unpatrolled {
width: 100%;
     color: #B60000
    color: #292929;
    font-size: 1.5em;
    font-weight: bold;
     letter-spacing: .035em;
}
}


/* Confetes do [[Mediawiki:Sitenotice]] dos 20 anos */
.wantedPortraits{
.top-banner-20 {
display: flex;
  background: url( "//upload.wikimedia.org/wikipedia/donate/0/08/Wikipedia20_banner_backgroundtop2.svg" );
flex-wrap: wrap;
  background-size: auto 36px;
  background-repeat: repeat-x;
  position: absolute;
  width: 100%;
  height: 36px;
  overflow: hidden;
  z-index: 0;
  margin-right: 149px;
}
}
.bottom-banner-20 {
 
    background: url( "//upload.wikimedia.org/wikipedia/donate/c/c9/Wikipedia20_banner_backgroundbottom2.svg" );
.wantedPortrait{
    background-size: auto 36px;
box-sizing: border-box;
    background-repeat: repeat-x;
width: 18em;
    position: absolute;
padding: .35em;
    width: 100%;
    height: 36px;
    overflow: hidden;
    transform: translateY(-36px);
    margin-right: 149px;
}
}


.summon_template a,
.wantedPortrait img{
.summon_template a.extiw,
width: 100%;
.summon_template a.extiw:visited {
  color: white;
  display: inline-block;
  border-bottom: 1px dotted;
}
}
.summon_template a:hover, .summon_template a:active {
 
  text-decoration: none;
@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;
}
}
}
.summon_template span.image_link a:nth-child(1) {
 
  border-bottom: 0; !important;
@media screen and (max-width: 1220px) {
.tabSkill--container{
max-width: 48em;
}
}
}
table.summon_template {
 
    color: white;
 
    border-spacing: 0;
@media screen and (max-width: 1024px) {
    border-collapse: separate;
    border-width: 0 5px 0 5px;
.flex-wrap-md{
    border-style: solid;
flex-wrap: wrap;
    position: relative;
}
    width: 627px;
.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; }
}
}
table.summon_template .caption {
/*******************************************************************************
     background-color: rgba(0, 0, 0, 0.1);
PRESET: ABAS
*******************************************************************************/
.tabela-abas {
     width: 100%;
    border-collapse: collapse;
     text-align: center;
     text-align: center;
     font-size: 16pt;
     margin-bottom: 20px;
}
}
table.summon_template .subcaption {
 
     background-color: rgba(0, 0, 0, 0.05);
.mostrar-aba {
    cursor: pointer;
    padding: 0;
     background-color: transparent;
     text-align: center;
     text-align: center;
     font-size: 12pt;
     border: none;
    position: relative;
    transition: all 0.2s ease-in-out;
}
}
table.summon_template tr > th .tooltiptext {
 
     font-size: 14px;  
.imagem-botao {
     font-weight: normal;
     display: inline-block;
    width: auto;
     height: auto;
}
}
table.summon_template tr > th {
 
     background: rgba(0, 0, 0, 0.5);
.sec-aba-cem {
     border-style: solid;
     padding: 5px;
    border-width: 5px;
     font-weight: bold;
     text-align: center;
     text-align: center;
    color: #333;
}
}
table.summon_template tr > td {
 
     background: rgba(0, 0, 0, 0.3);
.mostrar-aba img {
     border-style: solid;
    border: none;
     border-width: 5px;
     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;
}
 
.aba {
    display: none;
    margin-top: 20px;
}
 
.aba.atual {
     display: block;
}
 
.container-coliseu {
    display: block;
     text-align: center;
     text-align: center;
}
}
.summon_template.fire {
 
     background: #fc9084;
.coluna-abas {
     border-color: #fc9084;
     flex: 0 0 200px;
     margin-right: 20px;
}
/*******************************************************************************
TOC: ÍNDICE
*******************************************************************************/
.toc .tocnumber {
    display: none;  
}
}
.summon_template.fire td, .summon_template.fire th {
 
     border-color: #fc9084;
.toc ul li:before {
     content: "• "; /* Adiciona um ponto antes de cada item */
    color: #000;
    font-weight: bold;
}
}
.summon_template.water {
/*******************************************************************************
     background: #84c6fc;
PRESET: DIÁLOGOS
     border-color: #84c6fc;
*******************************************************************************/
.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 */
}
}
.summon_template.water td, .summon_template.water th {
 
     border-color: #84c6fc;
.transcrições b,
.transcrições strong {
     color: #000 !important; /* Garante que o texto negrito também será preto */
}
}
.summon_template.earth {
 
     background: #ba9072;
.transcrições::before {
     border-color: #ba9072;
     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;
}
}
.summon_template.earth td, .summon_template.earth th {
 
     border-color: #ba9072;
.me {
     float: left;
    margin: 5px 45px 5px 20px;
    color: #000; /* Garante que o texto dentro da classe .me será preto */
}
}
.summon_template.wind {
 
     background: #b4f090;
.me::before {
     border-color: #b4f090;
     box-shadow: -2px 2px 2px 0 rgba(178, 178, 178, .4);
     left: -9px;
}
}
.summon_template.wind td, .summon_template.wind th {
/*******************************************************************************
     border-color: #b4f090;
BUZINAS
*******************************************************************************/
.horn-audio {
     cursor: pointer;
    transition: transform 0.2s ease;  
}
}
.summon_template.light {
 
     background: #f0f08a;
/* Efeito visual ao passar o mouse */
     border-color: #f0f08a
.horn-audio:hover {
     transform: scale(1.1);  
     filter: brightness(1.2);
}
}
.summon_template.light td, .summon_template.light th {
/*******************************************************************************
    border-color: #f0f08a
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%;
}
}
.summon_template.dark {
 
     background: #8472c0;
@media (max-width: 1024px) {
     border-color: #8472c0
  .item-grid > * {
     flex: 1 1 calc(25% - 10px);
     max-width: calc(25% - 10px);
  }
}
}
.summon_template.dark td, .summon_template.dark th {
 
     border-color: #8472c0
@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;
}
}

Edição atual tal como às 17h36min de 21 de novembro de 2024

/*--------------------------------------------------
				ESTILIZAÇÃO PADRÃO
--------------------------------------------------*/

html{
	scroll-behavior: smooth;
}

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

.mw-body h1, .mw-body-content h1, .mw-body-content h2{
	font-family: sans-serif!important;
}

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

body {
	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;
}

#content {
	overflow-x: clip;
	
    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 {
    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%);
}

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

.event-image{
	aspect-ratio: 32 / 10;
	width: -webkit-fill-available;
	max-width: 350px;
	height: auto;
	object-fit: fill;
	
	position: relative;
}

#event-time{
	position: absolute;
	bottom: 3%;
	right: 15%;
	
	letter-spacing: 2px;
	
	font-size: 1.15em;
	font-weight: bold;
	color: #fff;
}

.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; }
#p-logo { background-color: transparent; }
#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: .25em .75em;
}

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

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

.aba {
    display: none;
    margin-top: 20px;
}

.aba.atual {
    display: block;
}

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

.coluna-abas {
    flex: 0 0 200px;
    margin-right: 20px;
}
/*******************************************************************************
TOC: ÍNDICE
*******************************************************************************/
.toc .tocnumber {
    display: none; 
}

.toc ul li:before {
    content: "• "; /* Adiciona um ponto antes de cada item */
    color: #000;
    font-weight: bold;
}
/*******************************************************************************
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;
}
/*******************************************************************************
 BUZINAS
*******************************************************************************/
.horn-audio {
    cursor: pointer; 
    transition: transform 0.2s ease; 
}

/* Efeito visual ao passar o mouse */
.horn-audio:hover {
    transform: scale(1.1); 
    filter: brightness(1.2); 
}
/*******************************************************************************
 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;
}
Disponível em “http://wiki.gla.com.br/index.php?title=MediaWiki:Common.css&oldid=23411”