Dead by Daylight Wiki
Don't have an account?
Register
Register
Dead by Daylight Wiki
Dead by Daylight Wiki
1,999
pages

Fandomdesktop.css

MediaWiki page
Back to page
Sign in to edit
mNo edit summary
mNo edit summary
 
(282 intermediate revisions by 2 users not shown)
Line 1: Line 1:
 
/* CSS placed here will affect users of the Hydradark skin */
  
/* CSS placed here will affect users of the Hydradark skin */
−  
 
@font-face {
  
@font-face {
 
font-family: 'Roboto';
  
font-family: 'Roboto';
Line 13: Line 12:
 
src: local('Roboto Bold'), local('Roboto-Bold'), url("/media/hydra/fonts/Roboto-Bold.ttf") format('truetype');
  
src: local('Roboto Bold'), local('Roboto-Bold'), url("/media/hydra/fonts/Roboto-Bold.ttf") format('truetype');
 
}
  
}
  +
/*Light Mode*/
−  
  +
body.theme-fandomdesktop-light a{
  +
color: #b9a05a;
  +
text-shadow: 0 2px #dad5c8, 0 2px 2px #bb9c56;
  +
}
  +
/*Light Mode END*/
  +
/*Link Hover*/
  +
a:hover{
  +
color: #fff0ca !important;
  +
}
  +
/*Right Side panel*/
  +
/*increased z-index so the perk icons in SoS counter in archive won't glitch through the side panel if rolled out (and page shrinked)*/
  +
.page__right-rail {
  +
z-index: 5;
  +
}
  +
/*Recent Changes Page*/
  +
/*"Admin" Highlight (in fact auto-review, but this state/right should have only admins)*/
  +
/*table.mw-changeslist-user-experienced.mw-changeslist-reviewstatus-auto .mw-changeslist-line-inner-userLink a,*/
  +
a[title="User:DocOctober"],
  +
a[title="User:Jouki"],
  +
a[title="User:FichteHiro"],
  +
a[title="User:Curly Bill Cipher"],
  +
a[title="User:MrGrrimes"],
  +
a[title="User:TheRealLuBu"],
  +
a[title="User:Masusder"]
  +
{
  +
color: #ebbb34;
  +
font-weight: 500;
  +
}
  +
/*Trusted contributors*/
  +
a[title="User:R34l R1ch4rd N1x0n"],
  +
a[title="User:ReverseVelocity"]
  +
{
  +
color: #5ac6bb;
  +
}
  +
/*Recognised contributors*/
  +
a[title="User:Legusvevo"],
  +
a[title="User:Pokedude1110"],
  +
a[title="User:Fan of Murder"],
  +
a[title="User:Kyrope"],
  +
a[title="User:MathUnsolver"]
  +
{
  +
color: #408d85;
  +
}
  +
/*Recent Changes Page END*/
  +
/*Page Header background*/
  +
.fandom-community-header__background.cover {
  +
background-position: 50% 7%;
  +
background-size: 120%;
  +
}
  +
/*Page Header background END*/
  +
/*Reverting strange fandom settings for paragraphs*/
  +
.page-content{
  +
overflow: initial !important;
  +
}
  +
.page-content p{
  +
margin: 0 0 5px;
  +
}
  +
/*Unsetting underline for certain links*/
  +
.mw-parser-output > p a {
  +
text-decoration: unset !important;
  +
}
  +
/*end*/
 
.mobileView{
  
.mobileView{
 
display: none;
  
display: none;
 
}
  
}
   
  +
.pcWikitable, .pcView{
  +
display: revert !important;
  +
}
  +
  +
/* Shrinked page */
  +
.resizable-container{
  +
max-width: 1350px;
  +
}
  +
  +
/* Tweaks for fandom sticky header */
  +
.fandom-sticky-header{
  +
background: linear-gradient(90deg, rgba(83,76,60,1) 0%, rgb(116 108 86) 50%, rgba(83,76,60,1) 100%) !important;
  +
box-shadow: 0 2px 6px 1px rgb(0 0 0 / 55%) !important;
  +
}
 
/**********************
  
/**********************
 
/* Site notice styles *
  
/* Site notice styles *
Line 33: Line 108:
 
border-radius: 5px;
  
border-radius: 5px;
 
border: 2px solid #1f1f1f;
  
border: 2px solid #1f1f1f;
−
background: #000000 url("https://gamepedia.cursecdn.com/deadbydaylight_gamepedia_en/0/05/Tbl-bg.jpg") left;
 +
background: #000000 url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/0/05/Tbl-bg.jpg/revision/latest?cb=20230414192023/revision/latest?cb=20230414192023") left;
−
background-size: cover;
 +
background-size: contain;
 
box-shadow: inset 0px 0px 45px 5px rgba(0,0,0,0.7), 0 0 5px 0 #000000;
  
box-shadow: inset 0px 0px 45px 5px rgba(0,0,0,0.7), 0 0 5px 0 #000000;
 
color: #aaa9a9;
  
color: #aaa9a9;
Line 51: Line 126:
 
position: relative;
  
position: relative;
 
display: inline-block;
  
display: inline-block;
−
border-bottom:1px dotted; border-color: #656565;
 +
border-bottom: 2px dotted;
−
height: 17px;
 +
border-color: #656565;
  +
height: 24px; /*questionable? - it will be proabably nullified by height from ".pcView.pcIconLink .tooltip" */
  +
cursor: help;
  +
}
  +
.disableTooltip .tooltiptext {
  +
display: none;
  +
}
  +
  +
.tooltip.borderless{
  +
border-bottom: revert;
  +
border-color: revert;
 
}
  
}
   
 
/* Tooltip text */
  
/* Tooltip text */
 
.tooltip .tooltiptext {
  
.tooltip .tooltiptext {
  +
width: 240px;
−
visibility: hidden;
  
−
width: 200px;
 +
max-height: 0px;
  +
min-width: min-content;
−
background-color: #151515;
  
−
color: #fff;
 +
overflow: hidden;
  +
background-color: #151515;
−
text-align: center;
  
  +
color: #fff;
−
padding: 5px 0;
  
  +
box-shadow: 0px 1px 13px 5px #000000a8, 0px 0px 5px 2px #00000066;
−
border-radius: 6px;
  
  +
font-family: "rubik";
  +
text-align: center;
  +
border-radius: 6px;
  +
position: absolute;
  +
z-index: 1;
  +
bottom: 125%;
  +
opacity: 0;
  +
border: solid 0px #e2ce9791;
  +
  +
transition: /*Fade OUT - Hover version overwrite the settings, so this applies only when mouse exit the pseudo element hover*/
  +
padding 0s 0.2s, /*no animation, 0.3s delay*/
  +
max-height 0s 0.2s,
  +
border-width 0s 0.2s,
  +
opacity 0.2s 0s; /*no delay, 0.2 duration*/
  +
}
  +
/*linkless tooltips doesn't need pointer event which makes a tooltip to disappear when we hover it*/
  +
.tooltip:not(.linkIncluded) .tooltiptext {
  +
pointer-events: none;
  +
}
   
  +
.tooltipBaseText::after {
−
/* Position the tooltip text */
  
−
position: absolute;
 +
content: " ⓘ";
−
z-index: 1;
 +
font-size: 12px;
−
bottom: 125%;
 +
font-weight: 600;
  +
vertical-align: middle;
−
left: 50%;
  
  +
}
−
margin-left: -60px;
  
  +
.iconless::after {
−  
  +
content: unset;
−
/* Fade in tooltip */
  
−
opacity: 0;
  
−
transition: opacity 0.3s;
  
 
}
  
}
   
Line 85: Line 187:
 
margin-left: -5px;
  
margin-left: -5px;
 
border-width: 5px;
  
border-width: 5px;
−
border-style: solid;
 +
/*border-style: solid;*/ /*DISABLED - To enable uncomment the row */
 
border-color: #151515 transparent transparent transparent;
  
border-color: #151515 transparent transparent transparent;
 
}
  
}
   
 
/* Show the tooltip text when you mouse over the tooltip container */
  
/* Show the tooltip text when you mouse over the tooltip container */
−
.tooltip:hover .tooltiptext {
 +
.tooltipBaseText:hover ~ .tooltiptext, .tooltip.linkIncluded .tooltiptext:hover {
  +
opacity: 1;
−
visibility: visible;
  
  +
z-index: 1000; /*setting over value 800 to get before Fandom left sidebar*/
−
opacity: 1;
  
  +
max-height: 1000px;
  +
overflow: auto;
  +
padding: 8px 10px;
  +
border: solid 1.4px #e2ce9791;
  +
transition: /*Fade IN values (hover applies just when you hover the element and overwrite the settings)*/
  +
padding 0s 0s,
  +
max-height 0s 0s,
  +
border-width 0s 0s,
  +
opacity 0.2s;
  +
 
}
  
}
−
/**********************/
 +
/*********** TOOLTIP PC SPECIFIC ***********/
   
  +
.pcView.pcIconLink {
−
/* Other */
  
  +
display: inline-flex !important;
  +
}
   
  +
.pcView.pcIconLink .tooltip {
  +
width: 100%;
  +
height: 100%;
  +
}
  +
  +
.pcView.pcIconLink .tooltipBaseText a img {
  +
width: 100%;
  +
height: 100%;
  +
}
  +
  +
/********** TOOLTIP PERK SPECIFIC **********/
  +
.tooltiptext .perkWrapper {
  +
text-align: left;
  +
}
  +
  +
/******************************************/
  +
/* TOOLTIP CSS ENDS */
  +
/******************************************/
  +
  +
/* Other */
  +
.floatRight{
  +
float: right;
  +
}
  +
.floatLeft{
  +
float: left;
  +
}
  +
.relative{
  +
position: relative;
  +
}
  +
.absolute{
  +
position: absolute;
  +
}
  +
.inline-flex{
  +
display: inline-flex;
  +
}
  +
.flex{
  +
display: flex;
  +
}
 
.center{
  
.center{
 
text-align: center;
  
text-align: center;
 
vertical-align: middle;
  
vertical-align: middle;
  +
}
  +
.margin-auto{
  +
margin: auto;
  +
}
  +
.left{
  +
text-align: left;
 
}
  
}
 
.page-content .center{
  
.page-content .center{
 
width: revert;
  
width: revert;
 
}
  
}
  +
.display-none, .dnone{
−  
  +
display: none
  +
}
 
.bold{
  
.bold{
 
font-weight: 600;
  
font-weight: 600;
Line 112: Line 272:
 
.italic{
  
.italic{
 
font-style: italic;
  
font-style: italic;
  +
}
  +
  +
.smallerText{
  +
font-size: smaller !important;
  +
}
  +
  +
.pre{ /*Simulating <pre> tag but in div so other CSS rules can be applied*/
  +
display: inline-block;
  +
white-space: pre-line;
  +
font-family: monospace;
  +
background: #323232;
  +
padding: 7px 15px;
  +
}
  +
.pre.inline{
  +
padding: 1px 5px;
  +
display: inline;
 
}
  
}
   
 
hr {
  
hr {
 
border: none;
  
border: none;
−
border-bottom: 1px solid #1f1f1f;
 +
border-bottom: 1px solid #343434c7;
  +
margin: 13pt 0;
  +
}
  +
  +
/****************** Other END ************************/
  +
/********************* Cargo **************************/
  +
#queryform, div.specialCargoQuery-extraPane{
  +
background: #323232;
  +
color: var(--theme-page-text-color);
  +
}
  +
/****************** Cargo END ************************/
  +
/*disabling the option to swotch to visual editor*/
  +
.ve-ui-modeSwitchPopupButtonWidget-visualSwitch { /*greying out*/
  +
opacity: 0.5;
  +
pointer-events: none;
  +
}
  +
.ve-ui-modeSwitchPopupButtonWidget-visualSwitch::after { /*creating new text*/
  +
content: "Visual Editing is disabled on DBD Wiki";
  +
}
  +
.ve-ui-modeSwitchPopupButtonWidget-visualSwitch .oo-ui-labelElement-label { /*hiding original text*/
  +
display: none;
 
}
  
}
  +
/*Visual Editor switch disabler END*/
   
 
.wikitable{ /* and that's the reason why this all css system is utmost bullsh#t! */
  
.wikitable{ /* and that's the reason why this all css system is utmost bullsh#t! */
Line 138: Line 335:
 
table.wikitable > tr > th,
  
table.wikitable > tr > th,
 
table.wikitable > * > tr > th,
  
table.wikitable > * > tr > th,
  +
div.dbdDiv { /*These should be Tables on pages, header cells with background*/
−
div.dbdDiv {
  
 
border: 1px solid #1f1f1f;
  
border: 1px solid #1f1f1f;
−
background: #000000 url("https://gamepedia.cursecdn.com/deadbydaylight_gamepedia_en/0/05/Tbl-bg.jpg") left;
 +
background: #000000 url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/0/05/Tbl-bg.jpg/revision/latest?cb=20230414192023");
−
background-size: cover;
 +
background-position: left center;
  +
background-size: cover; /*Contain creates patterns on smaller header cells*/
 
box-shadow: inset 0 0 45px 5px rgba(0,0,0,0.7), 0 0 5px 0 #000000;
  
box-shadow: inset 0 0 45px 5px rgba(0,0,0,0.7), 0 0 5px 0 #000000;
 
color: #ffffff;
  
color: #ffffff;
Line 166: Line 364:
 
}
  
}
   
  +
/*Table header*/
−
table.jquery-tablesorter th.headerSort {
  
  +
table.jquery-tablesorter th.headerSort, table.jquery-tablesorter th.headerSortDown, table.jquery-tablesorter th.headerSortUp {
−
background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAALAQMAAACqBVQ+AAAABlBMVEVvcnSw/2O5S7OkAAAAAXRSTlMAQObYZgAAAAFiS0dEAIgFHUgAAAAJcEhZcwAACxMAAAsTAQCanBgAAAAHdElNRQfgBhcIDDOFaFQGAAAAH0lEQVQI12NgAAEFIC4A4h8MDIx/wCIQ+gdUXAEsBABvCgULsLYrXQAAAABJRU5ErkJggg==") no-repeat right center,
  
−
#000000 url("https://gamepedia.cursecdn.com/deadbydaylight_gamepedia_en/0/05/Tbl-bg.jpg") left !important; /*TODO - Remove !important if possible*/
 +
background: #000000 url(https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/0/05/Tbl-bg.jpg/revision/latest?cb=20230414192023) left !important;
−
background-size: cover;
  
−
box-shadow: inset 0 0 45px 5px rgba(0,0,0,0.7), 0 0 5px 0 #000000;
  
−
padding: 0 15px 1px 3px;
  
 
}
  
}
  +
/*Sortable table headers*/
−  
−
table.jquery-tablesorter th.headerSortDown {
 +
.ooui-theme-fandomooui .WikiaTable.jquery-tablesorter .headerSort:after,
  +
.ooui-theme-fandomooui .WikiaTable.jquery-tablesorter .headerSort:before,
−
background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAGAQMAAAAWm0fgAAAABlBMVEVvcnSw/2O5S7OkAAAAAXRSTlMAQObYZgAAAAFiS0dEAIgFHUgAAAAJcEhZcwAACxMAAAsTAQCanBgAAAAHdElNRQfgBhcIDBwuuWlfAAAAFklEQVQI12NgAAEBILYA4hog/gcWAQAPFAHDmeMz/QAAAABJRU5ErkJggg==") no-repeat right center no-repeat right center,
  
  +
.ooui-theme-fandomooui .article-table.jquery-tablesorter .headerSort:after,
−
#000000 url("https://gamepedia.cursecdn.com/deadbydaylight_gamepedia_en/0/05/Tbl-bg.jpg") left !important; /*TODO - Remove !important if possible*/
  
  +
.ooui-theme-fandomooui .article-table.jquery-tablesorter .headerSort:before,
−
background-size: cover;
  
  +
.ooui-theme-fandomooui .wikitable.jquery-tablesorter .headerSort:after,
−
box-shadow: inset 0 0 45px 5px rgba(0,0,0,0.7), 0 0 5px 0 #000000;
  
  +
.ooui-theme-fandomooui .wikitable.jquery-tablesorter .headerSort:before {
−
padding: 0 15px 1px 3px;
  
  +
background-color: #e2ce97 !important; /*overrding the color of sorting arrows in table header*/
 
}
  
}
−  
−
table.jquery-tablesorter th.headerSortUp {
  
−
background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAGAQMAAAAWm0fgAAAABlBMVEVvcnSw/2O5S7OkAAAAAXRSTlMAQObYZgAAAAFiS0dEAIgFHUgAAAAJcEhZcwAACxMAAAsTAQCanBgAAAAHdElNRQfgBhcIDArabdwOAAAAGElEQVQI12NgAALGP0DiBxAXALECSIQBACSTAob8rZfiAAAAAElFTkSuQmCC") no-repeat right center no-repeat right center,
  
−
#000000 url("https://gamepedia.cursecdn.com/deadbydaylight_gamepedia_en/0/05/Tbl-bg.jpg") left !important; /*TODO - Remove !important if possible*/
  
−
background-size: cover;
  
−
box-shadow: inset 0 0 45px 5px rgba(0,0,0,0.7), 0 0 5px 0 #000000;
  
−
padding: 0 15px 1px 3px;
  
−
}
  
−  
   
 
table.smwtable {
  
table.smwtable {
Line 203: Line 390:
 
table.smwtable th {
  
table.smwtable th {
 
border: 1px solid #1f1f1f;
  
border: 1px solid #1f1f1f;
−
background: #000000 url("https://gamepedia.cursecdn.com/deadbydaylight_gamepedia_en/0/05/Tbl-bg.jpg") left;
 +
background: #000000 url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/0/05/Tbl-bg.jpg/revision/latest?cb=20230414192023") left;
−
background-size: cover;
 +
background-size: contain;
 
box-shadow: inset 0 0 45px 5px rgba(0,0,0,0.7);
  
box-shadow: inset 0 0 45px 5px rgba(0,0,0,0.7);
 
color: #aaa9a9;
  
color: #aaa9a9;
Line 233: Line 420:
 
border-radius: 5px;
  
border-radius: 5px;
 
border: 2px solid #1f1f1f;
  
border: 2px solid #1f1f1f;
−
background: #000000 url("https://gamepedia.cursecdn.com/deadbydaylight_gamepedia_en/0/05/Tbl-bg.jpg") left;
 +
background: #000000 url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/0/05/Tbl-bg.jpg/revision/latest?cb=20230414192023") left;
−
background-size: cover;
 +
background-size: contain;
 
box-shadow: inset 0 0 45px 5px rgba(0,0,0,0.7);
  
box-shadow: inset 0 0 45px 5px rgba(0,0,0,0.7);
 
color: #aaa9a9;
  
color: #aaa9a9;
Line 331: Line 518:
 
border-radius: 5px;
  
border-radius: 5px;
 
border: 2px solid #1f1f1f;
  
border: 2px solid #1f1f1f;
−
background: #000000 url("https://gamepedia.cursecdn.com/deadbydaylight_gamepedia_en/0/05/Tbl-bg.jpg") left;
 +
background: #000000 url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/0/05/Tbl-bg.jpg/revision/latest?cb=20230414192023") left;
−
background-size: cover;
 +
background-size: 100% !important; /*need to overwrite fandom's CSS rules*/
 
box-shadow: inset 0 0 45px 5px rgba(0,0,0,0.7), 0 0 5px 0 #000000;
  
box-shadow: inset 0 0 45px 5px rgba(0,0,0,0.7), 0 0 5px 0 #000000;
 
color: #aaa9a9;
  
color: #aaa9a9;
Line 379: Line 566:
 
.fplinks {
  
.fplinks {
 
/*margin: -5px;*/
  
/*margin: -5px;*/
  +
}
  +
  +
.fplinks.charSection{
  +
display: flex;
  +
flex-wrap: wrap;
  +
justify-content: center;
 
}
  
}
   
Line 409: Line 602:
 
display: table-cell;
  
display: table-cell;
 
position: relative;
  
position: relative;
−
font-family: 'Roboto', sans-serif;border-radius: 5px;
 +
font-family: 'Roboto', sans-serif;
  +
border-radius: 5px;
 
border: none;
  
border: none;
 
background: #232323;
  
background: #232323;
Line 417: Line 611:
 
text-transform: uppercase;
  
text-transform: uppercase;
 
text-align: center;
  
text-align: center;
  +
transition: 0.1s;
−
vertical-align: middle;
  
 
}
  
}
   
Line 424: Line 618:
 
}
  
}
   
  +
/*Main page help box*/
−
.charMainPageBox{
  
  +
.helpBox tr td:nth-child(2) {
  +
padding-right: 50px;
  +
}
  +
  +
.charMainPageBox {
 
margin: 5px 4.5px;
  
margin: 5px 4.5px;
 
min-width: 150px;
  
min-width: 150px;
Line 430: Line 629:
 
width: 150px;
  
width: 150px;
 
height: 150px;
  
height: 150px;
  +
transition: 0.2s;
  +
transition-delay: 0.25s;
  +
}
  +
  +
.charMainPageBox:hover{
  +
height: 200px;
  +
transition-delay: 0s;
  +
}
  +
  +
.charPerkBox {
  +
position: absolute; /*inherit;*/
  +
height: 50px;
  +
width: 100%;
  +
top: 150px;
  +
padding-top: 5px;
  +
z-index: 3;
  +
background-color: #232323;
  +
-webkit-box-shadow: inset 0px 4px 10px 0px #00000087;
  +
}
  +
  +
.charMainPageBox:hover .charPerkBox {
  +
bottom: 0;
  +
transition: 0.2s;
  +
}
  +
  +
.cell .charPerkBox > a {
  +
/*top: -46px;*/
  +
display: inline;
  +
padding: 3px;
  +
}
  +
  +
.charMainPageBox:hover .cell .charPerkBox > a /*TODO remove the first selector as it should be legacy*/
  +
{
  +
filter: saturate(0.9) brightness(0.8) drop-shadow(1px 2px 2px black);
  +
}
  +
.charMainPageBox .row .cell .charPerkBox > a:hover /*TODO remove the first selector as it should be legacy*/
  +
{
  +
filter: saturate(1) brightness(1) drop-shadow(1px 4px 6px black);
  +
}
  +
  +
.charMainPageBox .cell .charPerkBox .game-element-container .teachable-perk-element{ /*drop shadow for perk frame*/
  +
filter: saturate(0.9) brightness(0.8) drop-shadow(1px 2px 2px black);
  +
}
  +
.charMainPageBox .cell .charPerkBox .game-element-container .game-element-imgObject{ /*setting brightness and saturation for imageperk image only (without dropping shadow)*/
  +
filter: saturate(0.9) brightness(0.8)
  +
}
  +
.charMainPageBox .row .cell .charPerkBox .game-element-container:hover .teachable-perk-element{
  +
filter: saturate(1) brightness(1) drop-shadow(1px 4px 6px black);
  +
}
  +
.charMainPageBox .row .cell .charPerkBox .game-element-container:hover .game-element-imgObject{
  +
filter: saturate(1) brightness(1);
 
}
  
}
   
 
.fplink.image .box .row .cell {
  
.fplink.image .box .row .cell {
−
width: 150px;
 +
width: 150px;
−
height: 150px;
 +
height: 150px;
−
vertical-align: bottom;
 +
vertical-align: bottom;
−
overflow: hidden;
 +
overflow: hidden;
  +
background-image: url(https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/2/2d/Empty_Preview.png);
  +
background-size: contain;
  +
background-repeat: no-repeat;
  +
}
  +
  +
.fplink.image .box .row .mapCell.cell {
  +
background-size: 100% 100%;
  +
background-position: center;
  +
}
  +
  +
.fplink.image .box .row .mapCell.cell{
  +
background-image: url(https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/0/0a/EmptyWide.png);
 
}
  
}
   
Line 448: Line 710:
 
width: auto;
  
width: auto;
 
height: auto;
  
height: auto;
  +
/*float: left;*/ /*not usre why is that set to left? I keep it for time being until I decide I didn't find the reason in reasonable time*/
  +
-webkit-filter: drop-shadow(0px 0px 13px rgba(0,0,0,1));
 
}
  
}
   
Line 476: Line 740:
 
 
 
#fptopsection .fpbox, #fpbottomsection .fpbox {
 
#fptopsection .fpbox, #fpbottomsection .fpbox {
−
background: #000000 url("https://gamepedia.cursecdn.com/deadbydaylight_gamepedia_en/0/05/Tbl-bg.jpg") left;
 +
background: #000000 url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/0/05/Tbl-bg.jpg/revision/latest?cb=20230414192023") left;
 
/*background-size: cover;*/ /*Background fit style*/
 
/*background-size: cover;*/ /*Background fit style*/
 
box-shadow: inset 0 0 45px 5px rgba(0,0,0,0.7);
  
box-shadow: inset 0 0 45px 5px rgba(0,0,0,0.7);
Line 512: Line 776:
 
}
  
}
   
−
.fplink.dlcMainPageBox {
  
−
width: 269px;
  
−
margin: 7px 10px;
  
−
}
  
 
@media (min-width: 2200px) { /* 4k resolution at 150% scale */
  
@media (min-width: 2200px) { /* 4k resolution at 150% scale */
 
.wikiEditor-ui-text div.ui-resizable{ /* Code Editor */
  
.wikiEditor-ui-text div.ui-resizable{ /* Code Editor */
Line 555: Line 815:
 
padding: 0;
  
padding: 0;
 
height: 100%;
  
height: 100%;
  +
}
  +
.fplinks.unlockables .fplink.image .image a,
  +
.fplinks.game .fplink.image .image a,
  +
.fplinks.currencies .fplink.image .image a,
  +
.fplinks.charProgress .fplink.image .image a,
  +
.fplinks.stores .fplink.image .image a,
  +
.fplinks.interactables .fplink.image .image a{ /*Adjusting images in boxes on main page to be in center with a certain padding*/
  +
padding: 15px;
  +
height: 100%;
  +
display: flex;
  +
justify-content: center;
  +
align-items: center;
 
}
  
}
   
Line 592: Line 864:
 
background: #0b0b0b;
  
background: #0b0b0b;
 
color: #aaa9a9;
  
color: #aaa9a9;
−
margin: 0 0 10px 0;
 +
margin: 0 5px 10px 0;
 
padding: 3px 6px;
  
padding: 3px 6px;
 
/*width: 300px;*/
  
/*width: 300px;*/
Line 620: Line 892:
 
.infoboxdetails {
  
.infoboxdetails {
 
padding: 0;
  
padding: 0;
  +
}
  +
  +
.hiddenInfobox {
  +
float: right;
 
}
  
}
   
Line 638: Line 914:
 
table.nav th, table.nav tr th, table.nav > tr > th, table.nav > * > tr > th {
  
table.nav th, table.nav tr th, table.nav > tr > th, table.nav > * > tr > th {
 
border: 1px solid #1f1f1f;
  
border: 1px solid #1f1f1f;
−
background: #000000 url("https://gamepedia.cursecdn.com/deadbydaylight_gamepedia_en/0/05/Tbl-bg.jpg") left;
 +
background: #000000 url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/0/05/Tbl-bg.jpg/revision/latest?cb=20230414192023") left;
 
background-size: cover;
  
background-size: cover;
 
box-shadow: inset 0 0 45px 5px rgba(0,0,0,0.7);
  
box-shadow: inset 0 0 45px 5px rgba(0,0,0,0.7);
Line 679: Line 955:
 
border-radius: 5px;
  
border-radius: 5px;
 
border: 2px solid #1f1f1f;
  
border: 2px solid #1f1f1f;
−
background: #000000 url("https://gamepedia.cursecdn.com/deadbydaylight_gamepedia_en/0/05/Tbl-bg.jpg") left;
 +
background: #000000 url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/0/05/Tbl-bg.jpg/revision/latest?cb=20230414192023") left;
−
background-size: cover;
 +
background-size: contain;
 
box-shadow: inset 0 0 45px 5px rgba(0,0,0,0.7), 0 0 5px 0 #000000; color: #aaa9a9;
  
box-shadow: inset 0 0 45px 5px rgba(0,0,0,0.7), 0 0 5px 0 #000000; color: #aaa9a9;
 
margin: 0 0 10px 0;
  
margin: 0 0 10px 0;
Line 730: Line 1,006:
   
 
/* Custom CSS */
  
/* Custom CSS */
  +
  +
/*Language Box generated from Module:Language function resolveLanguageTable*/
  +
.langBox {
  +
float: right;
  +
position: relative;
  +
top: -10px;
  +
right: 7px;
  +
font-size: small;
  +
font-weight: 500;
  +
color: #aaa9a9;
  +
padding: 4px 7px;
  +
border: 1px solid var(--theme-border-color);
  +
}
   
 
.language-table td{
  
.language-table td{
Line 801: Line 1,090:
 
/*END History Diff changes on page*/
  
/*END History Diff changes on page*/
 
/*Syntax Highlight*/
  
/*Syntax Highlight*/
  +
/*Classic editor - syntax highlight*/
  +
.cm-mw-matchingbracket {
  +
background-color: #4b4b4b;
  +
box-shadow: inset 0 0 1px 1px #999;
  +
font-weight: bold !important;
  +
/*padding: 1px 2px 2px 2px;*/
  +
}
  +
/*END Classic editor - syntax highlight*/
  +
/*boldening the text that is wrapped in <syntaxhighlight> tag (e.g. Documentation pieces)*/
  +
b code span, b code.mw-highlight {
  +
font-weight: 600 !important;
  +
}
 
pre{
  
pre{
 
white-space: pre-wrap;
  
white-space: pre-wrap;
Line 862: Line 1,163:
 
font-weight: bold;
  
font-weight: bold;
 
}
  
}
−
/*number*/
 +
/*number - integer*/
 
.mw-highlight .mi {
  
.mw-highlight .mi {
 
color: #ff6262;
  
color: #ff6262;
  +
}
  +
/*number - float*/
  +
.mw-highlight .mf {
  +
color: #ff9456;
 
}
  
}
 
/*hexa numbers*/
  
/*hexa numbers*/
Line 919: Line 1,224:
 
background-repeat: no-repeat !important;
  
background-repeat: no-repeat !important;
 
background-position: center center !important;
  
background-position: center center !important;
−
min-width: 80px;
 +
min-width: 128px;
  +
min-height: 128px;
  +
width: 128px;
  +
height: 128px;
 
text-shadow: 1px 1px 3px rgba(0,0,0,0.7);
  
text-shadow: 1px 1px 3px rgba(0,0,0,0.7);
 
 
Line 930: Line 1,238:
 
.BPBG-All, .CosmeticsBG-All{
  
.BPBG-All, .CosmeticsBG-All{
 
padding-top: 8px !important;
  
padding-top: 8px !important;
  +
}
  +
.CosmeticsBG-All {
  +
min-width: 256px;
  +
min-height: 256px;
  +
}
  +
td.CosmeticsBG-All { /* this is rather a legacy compatibility style with cosmetics actual tables, using the styles for automatic cosmetic div-tables */
  +
height: 256px;
 
}
  
}
   
−
.ISACBG-All{
 +
.ISACBG-All, td.ISACBG-All{
 
min-width: 100px;
  
min-width: 100px;
  +
max-width: 140px;
 
}
  
}
   
 
.CosmeticsBG-All img{
  
.CosmeticsBG-All img{
 
-webkit-filter: drop-shadow(0px 0px 4px rgba(0,0,0,0.7));
  
-webkit-filter: drop-shadow(0px 0px 4px rgba(0,0,0,0.7));
  +
}
  +
  +
.CosmeticsBG-Visceral{
  +
position: relative;
  +
}
  +
.CosmeticsBG-Visceral::before {
  +
content: "";
  +
background: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/b/b0/VisceralBG.png") content-box !important;
  +
background-size: inherit !important;
  +
position: absolute;
  +
width: 100%;
  +
height: 100%;
  +
top: 0;
  +
left: 0;
  +
scale: 91%;
 
}
  
}
   
Line 944: Line 1,275:
 
}
  
}
   
  +
.mw-collapsed:not(.mw-changeslist-line) { /* When collapsible is collapsed, :not(.mw-changeslist-line) as this class is used for Special:RecentChanges*/
−
.cosmeticsTable, .cosmeticsTable-Contents {
  
−
min-width: 250px;
 +
width: 250px;
  +
/*height: 130px;
  +
display: block;*/
 
}
  
}
  +
  +
/*.mw-collapsed tr {
  +
display: table-row !important;
  +
max-height: 100px;
  +
-webkit-mask-image: linear-gradient(rgb(0, 0, 0), rgba(0, 0, 0, 0));
  +
-webkit-mask-size: 100% 100px;
  +
-webkit-mask-repeat: no-repeat;
  +
-webkit-mask-position: center top, center bottom;
  +
}*/
  +
.cosmeticsTable:not(.mw-collapsed) {
  +
width: 100%;
  +
}
  +
   
 
.SoS-IS{
  
.SoS-IS{
Line 952: Line 1,298:
 
}
  
}
   
  +
.PerkCostsBG{
−
.BPBG { background-image: url("https://gamepedia.cursecdn.com/deadbydaylight_gamepedia_en/4/4a/BP_BG.png") !important;}
  
  +
width: 140px;
−
.BPBG-0{ background-image: url("https://gamepedia.cursecdn.com/deadbydaylight_gamepedia_en/c/c7/BP_BG_Uncommon.png") !important; filter: grayscale(1) brightness(1.3);}
  
  +
}
−
.BPBG-1{ background-image: url("https://gamepedia.cursecdn.com/deadbydaylight_gamepedia_en/3/3c/BP_BG_Common.png") !important;}
  
  +
−
.BPBG-2{ background-image: url("https://gamepedia.cursecdn.com/deadbydaylight_gamepedia_en/c/c7/BP_BG_Uncommon.png") !important;}
  
−
.BPBG-3{ background-image: url("https://gamepedia.cursecdn.com/deadbydaylight_gamepedia_en/2/25/BP_BG_Rare.png") !important;}
 +
.BPBG { background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/4/4a/BP_BG.png") !important;}
−
.BPBG-4{ background-image: url("https://gamepedia.cursecdn.com/deadbydaylight_gamepedia_en/1/13/BP_BG_Very_Rare.png") !important;}
 +
.BPBG-0{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/c/c7/BP_BG_Uncommon.png") !important; filter: grayscale(1) brightness(1.3);}
−
.BPBG-5{ background-image: url("https://gamepedia.cursecdn.com/deadbydaylight_gamepedia_en/f/fd/BP_BG_Ultra_Rare.png") !important;}
 +
.BPBG-1{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/3/3c/BP_BG_Common.png") !important;}
−
.BPBG-6{ background-image: url("https://gamepedia.cursecdn.com/deadbydaylight_gamepedia_en/7/74/BP_BG_Legendary.png") !important;}
 +
.BPBG-2{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/c/c7/BP_BG_Uncommon.png") !important;}
−
.BPBG-7{ background-image: url("https://gamepedia.cursecdn.com/deadbydaylight_gamepedia_en/3/32/BP_BG_Event.png") !important;}
 +
.BPBG-3{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/2/25/BP_BG_Rare.png") !important;}
  +
.BPBG-4{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/1/13/BP_BG_Very_Rare.png") !important;}
  +
.BPBG-5{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/f/fd/BP_BG_Ultra_Rare.png") !important;}
  +
.BPBG-6{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/7/74/BP_BG_Legendary.png") !important;}
  +
.BPBG-7{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/3/32/BP_BG_Event.png") !important;}
 
.BPBG-Buff{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/2/28/Buff_BG.png") !important;}
  
.BPBG-Buff{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/2/28/Buff_BG.png") !important;}
   
  +
.SquareBG-ISAC-enh,
−
.ISACBG{ background-image: url("https://gamepedia.cursecdn.com/deadbydaylight_gamepedia_en/5/53/Dbd-dual.png") !important;} /*discarded*/
  
−
.ACBG{ background-image: url("https://gamepedia.cursecdn.com/deadbydaylight_gamepedia_en/b/ba/Dbd-auriccells.png") !important; text-shadow: 0px 0px 3px rgba(0,0,0,0.7), 1px 1px 3px rgba(0,0,0,0.7), 1px 1px 5px rgba(0,0,0,0.4)}
 +
.ISACBG{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/5/53/Dbd-dual.png") !important;} /*discarded*/
  +
.SquareBG-AC-enh,
−
.ISBG{ background-image: url("https://gamepedia.cursecdn.com/deadbydaylight_gamepedia_en/e/e1/Dbd-iridescentshards.png") !important;}
  
  +
.ACBG{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/c/cd/Dbd-auric-cells.png") !important; text-shadow: 0px 0px 3px rgba(0,0,0,0.7), 1px 1px 3px rgba(0,0,0,0.7), 1px 1px 5px rgba(0,0,0,0.4)}
  +
.SquareBG-IS-enh,
  +
.ISBG{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/e/e1/Dbd-iridescentshards.png") !important;}
  +
.BPTBG{background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/a/ad/Dbd-teachable.png") !important;} /*Bloodpoints - teachable*/
   
 
/*Square version is using Item Node background*/
  
/*Square version is using Item Node background*/
−
.SquareBG-1{ background-image: url("https://gamepedia.cursecdn.com/deadbydaylight_gamepedia_en/a/a8/Dbd-addons-common.png") !important;}
 +
.SquareBG-1{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/a/a8/Dbd-addons-common.png") !important;}
−
.SquareBG-2{ background-image: url("https://gamepedia.cursecdn.com/deadbydaylight_gamepedia_en/d/dc/Dbd-addons-uncommon.png") !important;}
 +
.SquareBG-2{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/d/dc/Dbd-addons-uncommon.png") !important;}
−
.SquareBG-3{ background-image: url("https://gamepedia.cursecdn.com/deadbydaylight_gamepedia_en/1/19/Dbd-addons-rare.png") !important;}
 +
.SquareBG-3{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/1/19/Dbd-addons-rare.png") !important;}
−
.SquareBG-4{ background-image: url("https://gamepedia.cursecdn.com/deadbydaylight_gamepedia_en/f/f2/Dbd-addons-veryrare.png") !important;}
 +
.SquareBG-4{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/f/f2/Dbd-addons-veryrare.png") !important;}
−
.SquareBG-5{ background-image: url("https://gamepedia.cursecdn.com/deadbydaylight_gamepedia_en/b/be/Dbd-addons-ultrarare.png") !important;}
 +
.SquareBG-5{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/b/be/Dbd-addons-ultrarare.png") !important;}
−
.SquareBG-6{ background-image: url("https://gamepedia.cursecdn.com/deadbydaylight_gamepedia_en/6/63/Dbd-legendary.png") !important;}
 +
.SquareBG-6{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/6/63/Dbd-legendary.png") !important;}
−
.SquareBG-7{ background-image: url("https://gamepedia.cursecdn.com/deadbydaylight_gamepedia_en/a/a1/Dbd-events.png") !important;}
 +
.SquareBG-7{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/a/a1/Dbd-events.png") !important;}
−
.SquareBG-8{ background-image: url("https://gamepedia.cursecdn.com/deadbydaylight_gamepedia_en/4/45/Dbd-artefact.png") !important;}
 +
.SquareBG-8{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/4/45/Dbd-artefact.png") !important;}
−
.SquareBG-9{ background-image: url("https://gamepedia.cursecdn.com/deadbydaylight_gamepedia_en/4/4c/Dbd-spectral.png") !important;}
 +
.SquareBG-9{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/4/4c/Dbd-spectral.png") !important;}
 
.SquareBG-buff{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/c/c1/Dbd-buff-square.png") !important;}
  
.SquareBG-buff{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/c/c1/Dbd-buff-square.png") !important;}
 
.SquareBG-debuff{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/3/39/Dbd-debuff-square.png") !important;}
  
.SquareBG-debuff{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/3/39/Dbd-debuff-square.png") !important;}
  +
.SquareBG-1-enh{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/4/47/Dbd-common-enhanced.png") !important;}
  +
.SquareBG-2-enh{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/1/1c/Dbd-uncommon-enhanced.png") !important;}
  +
.SquareBG-3-enh{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/2/25/Dbd-rare-enhanced.png") !important;}
  +
.SquareBG-4-enh{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/7/75/Dbd-veryrare-enhanced.png") !important;}
  +
.SquareBG-5-enh{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/5/59/Dbd-ultrarare-enhanced.png") !important;}
  +
.SquareBG-7-enh{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/8/85/Dbd-legendary-enhanced.png") !important;}
  +
.SquareBG-8-enh{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/3/39/Dbd-events-enhanced_legacy.png") !important;} /*Event*/
  +
.SquareBG-9-enh{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/b/ba/Dbd-artefact-enhanced.png") !important;} /*Artefact*/
  +
.SquareBG-DT-enh,
  +
.SquareBG-10-enh,
  +
.SquareBG-21-enh{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/b/b3/Dbd-dark-trinkets-enhanced.png") !important;}
  +
.SquareBG-RF-enh,
  +
.SquareBG-13-enh{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/1/1f/Dbd-rift-fragments-enhanced.png") !important;}
  +
.SquareBG-FT-enh{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/3/3a/Dbd-frosty-trinkets-enhanced.png") !important;}
  +
.SquareBG-28-enh,
  +
.SquareBG-TT-enh{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/e/e1/Dbd-thrombotic-trinkets-enhanced.png") !important;}
  +
.SquareBG-BP-enh{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/e/e9/Dbd-bloodpoints-enhanced.png") !important;}
  +
.SquareBG-RP-enh{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/b/b8/Dbd-rift-pass.png") !important;}
   
  +
  +
.game-element-bg-settings{
  +
background-size: contain;
  +
background-repeat: no-repeat;
  +
}
  +
  +
.game-element-container{
  +
justify-content: center;
  +
}
  +
  +
.addon-container {
  +
scale: 86.5%;
  +
}
  +
  +
.charMainPageBox .game-element-container{
  +
margin: 0 3px;
  +
}
  +
  +
.game-element-container a {
  +
width: 100%;
  +
height: 100%;
  +
padding: 0;
  +
}
  +
  +
.game-element-container img {
  +
width: 100%;
  +
height: 100%;
  +
/*margin-left: 1px;*/
  +
}
  +
  +
.game-element-bg-settings-size-general{
  +
min-height: 96px;
  +
min-width: 96px;
  +
}
  +
.game-element-bg-settings-size-perk, .game-element-bg-settings-size-sos{
  +
height: 128px;
  +
width: 128px;
  +
}
  +
  +
.addon-marker{
  +
background-image: var(--addon-marker);
  +
width: 76px;
  +
height: 90px;
  +
scale: 50%;
  +
top: -35px;
  +
right: -31px;
  +
}
  +
/*assembly addon*/
  +
.addon-marker-il { /*quite nastry code*/
  +
scale: 25%;
  +
top: -40px;
  +
right: -34px;
  +
}
  +
.addon-size{ /*ditto*/
  +
max-width: 32px;
  +
max-height: 32px;
  +
}
  +
/*assembly addon END*/
  +
.common-addon-element{ background-image: var(--common-addon-bg);}
  +
.uncommon-addon-element{ background-image: var(--uncommon-addon-bg);}
  +
.rare-addon-element{ background-image: var(--rare-addon-bg);}
  +
.very-rare-addon-element{ background-image: var(--very-rare-addon-bg);}
  +
.ultra-rare-addon-element{ background-image: var(--ultra-rare-addon-bg);}
  +
  +
.unused-item-element{ background-image: var(--unused-item-bg);}
  +
.common-item-element{ background-image: var(--common-item-bg);}
  +
.uncommon-item-element{ background-image: var(--uncommon-item-bg);}
  +
.rare-item-element{ background-image: var(--rare-item-bg);}
  +
.very-rare-item-element{ background-image: var(--very-rare-item-bg);}
  +
.ultra-rare-item-element{ background-image: var(--ultra-rare-item-bg);}
  +
.event-item-element{ background-image: var(--event-item-bg);}
  +
.limited-item-element,
  +
.craft-able-and-limited-item-element{ background-image: var(--limited-item-bg);}
  +
  +
.common-perk-element{ background-image: var(--common-perk-bg);}
  +
.uncommon-perk-element{ background-image: var(--uncommon-perk-bg);}
  +
.rare-perk-element{ background-image: var(--rare-perk-bg);}
  +
.very-rare-perk-element{ background-image: var(--very-rare-perk-bg);}
  +
.ultra-rare-perk-element{ background-image: var(--ultra-rare-perk-bg);}
  +
.teachable-perk-element{ background-image: var(--teachable-perk-bg);}
  +
.teachable-indicator-perk-element{ background-image: var(--teachable-indicator-perk-bg); pointer-events: none;}
  +
.perk-level-1-indicator{ background-image: var(--perk-level-1);}
  +
.perk-level-2-indicator{ background-image: var(--perk-level-2);}
  +
.perk-level-3-indicator{ background-image: var(--perk-level-3);}
  +
  +
.common-offering-element{ background-image: var(--common-offering-bg);}
  +
.uncommon-offering-element{ background-image: var(--uncommon-offering-bg);}
  +
.rare-offering-element{ background-image: var(--rare-offering-bg);}
  +
.very-rare-offering-element{ background-image: var(--very-rare-offering-bg);}
  +
.ultra-rare-offering-element{ background-image: var(--ultra-rare-offering-bg);}
  +
.event-offering-element{ background-image: var(--event-offering-bg);}
  +
  +
/*mystery box*/
  +
.common-mb-element{ background-image: var(--common-mb-bg);}
  +
.uncommon-mb-element{ background-image: var(--uncommon-mb-bg);}
  +
.rare-mb-element{ background-image: var(--rare-mb-bg);}
  +
.very-rare-mb-element{ background-image: var(--very-rare-mb-bg);}
  +
.ultra-rare-mb-element{ background-image: var(--ultra-rare-mb-bg);}
  +
  +
/******************************* Assembling images END ***********************************/
  +
.animate-perk-settings{
  +
animation-duration: var(--perk-switch-animation-durtation);
  +
animation-iteration-count: infinite;
  +
  +
}
  +
  +
.animate-perk-bg {
  +
animation-name: animate-switch;
  +
}
  +
.animate-perk-level {
  +
animation-name: animate-level-switch;
  +
}
  +
  +
@keyframes animate-switch {
  +
0% {
  +
background-image: var(--uncommon-perk-bg);
  +
}
  +
32%{
  +
background-image: var(--uncommon-perk-bg);
  +
}
  +
33% {
  +
background-image: var(--rare-perk-bg);
  +
}
  +
66% {
  +
background-image: var(--rare-perk-bg);
  +
}
  +
67% {
  +
background-image: var(--very-rare-perk-bg);
  +
}
  +
100% {
  +
background-image: var(--very-rare-perk-bg);
  +
}
  +
}
  +
  +
@keyframes animate-level-switch {
  +
0% {
  +
background-image: var(--perk-level-1);
  +
}
  +
32%{
  +
background-image: var(--perk-level-1);
  +
}
  +
33% {
  +
background-image: var(--perk-level-2);
  +
}
  +
66% {
  +
background-image: var(--perk-level-2);
  +
}
  +
67% {
  +
background-image: var(--perk-level-3);
  +
}
  +
100% {
  +
background-image: var(--perk-level-3);
  +
}
  +
}
  +
  +
/******************************* Assembling images END ***********************************/
  +
  +
  +
.boldLeft{
  +
border-left-width: 4px !important;
  +
}
  +
  +
.bordelessRight, .borderless{
  +
border-right-style: none !important;
  +
}
  +
  +
.bordelessLeft, .borderless{
  +
border-left-style: none !important;
  +
}
   
 
/* Status HUD bg styles */
  
/* Status HUD bg styles */
Line 985: Line 1,526:
 
.HUD-Square-All{height:84px; width:80px;}
  
.HUD-Square-All{height:84px; width:80px;}
   
−
/******************************* SoS Styles ***********************************/
 +
/******************************* SoS / Shrine of secrets Styles ***********************************/
 
table.sosTable td, table.sosTable tbody, table.sosTable tr {
  
table.sosTable td, table.sosTable tbody, table.sosTable tr {
 
border: solid 2px #191919;
  
border: solid 2px #191919;
Line 1,008: Line 1,549:
 
}
  
}
   
  +
/*SoS Calendar Week number cells*/
  +
td.week-cell {
  +
padding: 5px 0px !important;
  +
text-align: center !important;
  +
width: 30px;
  +
}
  +
  +
/****** sos2 *******/
  +
  +
.sos2 {
  +
width: 487px;
  +
height: 350px;
  +
background: url(https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/a/a0/ShrineBG.png);
  +
background-size: contain;
  +
position: relative; /*in order to have identical starting coords (0,0) for all 4 perks the parent needs to be relative, while perks themselves absolute*/
  +
}
  +
  +
.sosPerk{
  +
filter: saturate(1) brightness(1) drop-shadow(0px 0px 4px rgba(0,0,0,0.7)); /*saturation and brightness must be present as these values are modified with hover effect in order to make work transition*/
  +
position: absolute; /*parent needs to be relative when perks are absolute - this makes perks having starting position to their parents*/
  +
display: inline-block;
  +
transition: filter 0.1s linear;
  +
}
  +
.sosPerk:hover .teachable-perk-element{
  +
filter: saturate(1.1) brightness(1.15) drop-shadow(0px 0px 4px rgba(0,0,0,0.7));
  +
}
  +
  +
.sosPerk1 {
  +
left: 179px;
  +
top: 10px;
  +
z-index: 2;
  +
}
  +
.sosPerk2 {
  +
left: 74px;
  +
top: 109px;
  +
z-index: 2;
  +
}
  +
.sosPerk3 {
  +
left: 272px;
  +
top: 109px;
  +
z-index: 2;
  +
}
  +
.sosPerk4 {
  +
left: 179px;
  +
top: 213px;
  +
z-index: 2;
  +
}
  +
  +
.sosPerkHovered{
  +
  +
}
  +
.sosPerkNotHovered{
  +
opacity: 0.5;
  +
}
  +
  +
div.sosPerk1:hover, div.sosPerk2:hover, div.sosPerk3:hover, div.sosPerk4:hover
  +
{
  +
z-index: 4;
  +
}
  +
  +
.sosPerk1:hover .sosPerkDesc1, .sosPerk2:hover .sosPerkDesc2, .sosPerk3:hover .sosPerkDesc3, .sosPerk4:hover .sosPerkDesc4,
  +
.sosPerkDesc1:hover, .sosPerkDesc2:hover, .sosPerkDesc3:hover, .sosPerkDesc4:hover{
  +
width: 230px;
  +
}
  +
  +
.sosPerkDesc {
  +
position: absolute;
  +
width: 0;
  +
height: 122px;
  +
/*padding: 12px 0;*/
  +
background: #131313db;
  +
overflow: hidden;
  +
transition: all 0.15s linear;
  +
top: 3px;
  +
left: 64px;
  +
z-index: -1;
  +
}
  +
  +
.sosPerkOwner{
  +
font-size: 15px;
  +
}
  +
  +
.sosPerkDescName, .sosPerkOwner{
  +
height: 50%;
  +
padding: 0 10px 0 30px;
  +
display: flex;
  +
align-items: center;
  +
justify-content: center;
  +
text-align: center;
  +
font-weight: 500;
  +
}
  +
.sosPerkDesc .sosPerkOwner{
  +
padding: 0 10px 0 45px;
  +
}
  +
.sosPerkDesc3 .sosPerkDescName { /*mirrored*/
  +
padding: 0 30px 0 10px;
  +
}
  +
.sosPerkDesc3 .sosPerkOwner{
  +
padding: 0 15px 0 10px;
  +
}
  +
  +
.sosPerkDesc:before{
  +
content: "";
  +
position: absolute;
  +
width: 230px;
  +
height: 122px;
  +
background:
  +
linear-gradient(to left, white 4px, transparent 4px) 100% 0,
  +
linear-gradient(to left, white 4px, transparent 4px) 100% 100%,
  +
linear-gradient(to bottom, white 4px, transparent 4px) 100% 0,
  +
linear-gradient(to top, white 4px, transparent 4px) 100% 100%;
  +
background-repeat: no-repeat;
  +
background-size: 20px 20px;
  +
pointer-events: none;
  +
}
  +
.sosPerkDesc.sosPerkDesc3:before{
  +
background:
  +
linear-gradient(to right,white 4px,transparent 4px) 0 0,
  +
linear-gradient(to right,white 4px,transparent 5px) 0 100%,
  +
linear-gradient(to bottom,white 4px,transparent 4px) 0 0,
  +
linear-gradient(to top,white 4px,transparent 4px) 0 100%;
  +
background-size: 20px 20px;
  +
background-repeat: no-repeat;
  +
}
  +
  +
.sosPerk3:hover .sosPerkDesc3 { /*we need to move element itself in order to make illusion rolling to to the left*/
  +
left: -166px;
  +
}
  +
  +
.sosPerkDescDivider {
  +
position: absolute;
  +
top: 50%;
  +
width: 230px;
  +
}
 
/*SoS Archive*/
  
/*SoS Archive*/
 
/*Last date occurrence*/
  
/*Last date occurrence*/
Line 1,047: Line 1,722:
 
/*Entry Table is used on page Perks, specificly [Perks/entry] page */
  
/*Entry Table is used on page Perks, specificly [Perks/entry] page */
 
.entryTable{
  
.entryTable{
−
max-width: 360px;
 +
width: 330px;
  +
max-width: 330px;
 
flex: 1;
  
flex: 1;
 
flex-basis: auto;
  
flex-basis: auto;
−
padding: 0 15px;
 +
margin: 10px 25px;
  +
}
  +
  +
.entryTable table{
  +
width: 100%;
 
}
  
}
   
Line 1,063: Line 1,743:
   
 
/* Tabbers */
  
/* Tabbers */
  +
.wds-tab__content_shown{ /*temporary class that is used in JS for temporary show all the tabbers so the mouse tracker in tooltip can be calculated correctly*/
  +
display: initial !important;
  +
}
  +
.wds-tabber { /*To prevent hiding a tooltip inside tabber that would reach out of tabber div*/
  +
overflow: initial !important;
  +
}
 
.page-content ul.wds-tabs{
  
.page-content ul.wds-tabs{
 
background: #00000033;
  
background: #00000033;
  +
flex-wrap: wrap;
 
}
  
}
 
.wds-tabs__tab.wds-is-current {
  
.wds-tabs__tab.wds-is-current {
 
background-color: #74653c26;
  
background-color: #74653c26;
 
}
  
}
−  
 
.wds-tabs__tab:hover {
  
.wds-tabs__tab:hover {
 
color: var(--theme-link-color--hover);
  
color: var(--theme-link-color--hover);
  +
}
  +
/*as long as the tabber won't scroll but wrap, these settings hide the right arrow and gradient*/
  +
.wds-tabs__wrapper.right-arrow-visible .wds-tabs{
  +
/*-webkit-mask-image: revert;*/
  +
-webkit-mask-image: -webkit-gradient(linear,left top,right top,color-stop(98%,#000),to(transparent));
  +
}
  +
.wds-tabs__wrapper.right-arrow-visible .wds-tabs__arrow-right{
  +
visibility: hidden;
 
}
  
}
 
/* END Tabbers */
  
/* END Tabbers */
Line 1,095: Line 1,789:
 
vertical-align: middle;
  
vertical-align: middle;
 
font-size: 10.5pt;
  
font-size: 10.5pt;
  +
}
  +
  +
.metadata, tr.metadata td {
  +
font-size: smaller;
 
}
  
}
 
/*END Infobox*/
  
/*END Infobox*/
Line 1,125: Line 1,823:
   
 
/* MAIN PAGE */
  
/* MAIN PAGE */
  +
/*DLC section(s)*/
−
.charLink, .dlcLink{
  
  +
.dlcCategorySection {
  +
padding: 20px 0;
  +
}
  +
.categoryLabel {
  +
font-family: 'Roboto',sans-serif;
  +
color: #ffffff;
  +
font-variant: small-caps;
  +
margin: 0;
  +
font-weight: 800;
  +
font-size: 18pt;
  +
}
  +
.categoryDlcs {
  +
margin: 0 60px;
  +
padding: 15px 20px;
  +
max-width: 100%;
  +
width: auto;
  +
display: inline-flex;
  +
justify-content: center;
  +
flex-wrap: wrap;
  +
border: 3px solid #1f1f1f;
  +
}
  +
  +
.dlcCapsule{
  +
max-width: 262px;
  +
flex-direction: column;
  +
overflow: hidden;
  +
margin: 7px 10px;
  +
border-radius: 6px;
  +
box-shadow: 0 0 5px 0 #000000;
  +
background-image: url(https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/0/0a/EmptyWide.png);
  +
background-size: contain;
  +
}
  +
  +
.dlcCapsule, .dlcCapsuleImageContainer {
  +
min-height: 150px; /*calculated height according to width*/
  +
}
  +
  +
.dlcBorder {
  +
width: 100%;
  +
height: 100%;
  +
background: url(https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/f/fa/BorderEffect.png);
  +
background-size: contain;
  +
z-index: 3;
  +
pointer-events: none
  +
}
  +
  +
.dlcLightEffect {
  +
width: 100%;
  +
height: 100%;
  +
background: url(https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/1/1a/LightEffect.png);
  +
background-size: contain;
  +
mix-blend-mode: overlay;
  +
position: absolute;
  +
z-index: 2;
  +
pointer-events: none
  +
}
  +
  +
.dlcCpasuleImg {
  +
z-index: 1;
  +
transition: 0.1s;
  +
}
  +
.dlcCpasuleImg img {
  +
max-width: 100%;
  +
max-height: 100%;
  +
width: auto;
  +
height: auto;
  +
}
  +
  +
.dlcLink{
  +
position: absolute;
  +
width: 100%;
  +
text-align: center;
  +
bottom: -47px;
  +
transition: 0.2s;
  +
z-index: 2;
  +
}
  +
  +
.dlcLink a {
  +
width: 100%;
  +
background: rgba(62,54,25,0.5);
  +
font-family: 'Roboto',sans-serif;
  +
font-size: 80%;
  +
font-weight: 600;
  +
text-transform: uppercase;
  +
}
  +
.dlcCapsule:hover .dlcLink {
  +
bottom: 0;
  +
}
  +
.dlcCapsule:hover .dlcCpasuleImg {
  +
filter: saturate(1.3) brightness(1.1);
  +
}
  +
  +
.dlcLink a:hover {
  +
background: rgba(0,0,0,0.65);
  +
color: #ffffff;
  +
}
  +
  +
/*END DLC section(s)*/
  +
.charLink{
 
position: inherit;
  
position: inherit;
−
top: 46px;
 +
top: 48px;
 
transition: 0.2s;
  
transition: 0.2s;
  +
z-index: 2;
 
}
  
}
   
Line 1,139: Line 1,937:
 
top: 177px;
  
top: 177px;
 
}
  
}
  +
−
.cell:hover .charLink,.cell:hover .dlcLink,.cell:hover .realmLink{
  
  +
.cell:hover .image{
−
top: 0;
  
  +
filter: saturate(1.3) brightness(1.2);
 
}
  
}
  +
  +
.cell:hover .charLink{
  +
top: -50px;
  +
}
  +
  +
.cell:hover .realmLink{
  +
top: 0
  +
}
  +
 
.fplink.image .killerLink > a {
  
.fplink.image .killerLink > a {
 
background: #3c0a0a94;
  
background: #3c0a0a94;
Line 1,156: Line 1,964:
 
box-shadow: 0 0px 5px 3px #00000066;
  
box-shadow: 0 0px 5px 3px #00000066;
 
}
  
}
−
.realmLink .mapLinks a{
 +
.realmLink.link > .mapLinks a{
 
background: transparent;
  
background: transparent;
−
padding: 6px 0px;
 +
padding: 6.7px 0px;
  +
transition: 0.08s;
  +
/*
  +
transition: 0.2s;
  +
background-image: linear-gradient(to right, rgb(62 54 25 / 50%) 50%, #0000006e
  +
50%);
  +
background-size: 200% 100%;
  +
*/
 
}
  
}
   
−
.realmLink .mapLinks a:hover{
 +
.realmLink.link > .mapLinks a:hover{
−
background: #0000004d;
 +
background: #0000005e;
 
text-decoration: none;
  
text-decoration: none;
 
}
  
}
  +
.pastEvents {
−  
  +
text-align: left;
  +
}
 
/* END MAIN PAGE */
  
/* END MAIN PAGE */
  +
  +
/* Classic editor Syntax highlight */
  +
.page-content pre{
  +
border: none;/*2px dashed #2e2e2e;*/
  +
}
  +
[class*="cm-mw-"]{
  +
color: #e6e6e6 !important;
  +
text-decoration: none;
  +
font-size: revert !important;
  +
font-weight: normal;
  +
}
  +
/* END Classic editor Syntax highlight */
  +
  +
/*SwitchBox For Perk Desc*/
  +
.switchArea{
  +
/*background-color: #332500;*/
  +
width: 10px;
  +
height: 10px;
  +
position: relative;
  +
float: right;
  +
top: -4pt; /*Based on inner padding of td in table*/
  +
left: 8pt;
  +
}
  +
  +
.switchBox{
  +
margin: 0;
  +
background-color: red;
  +
width: 10px;
  +
height: 10px;
  +
position: relative;
  +
float: right;
  +
top: -4pt; /*Based on inner padding of td in table*/
  +
left: -10000px;
  +
transition: 0s;
  +
transition-delay: 2s;
  +
}
  +
  +
.switchArea:hover ~ .switchBox {
  +
transition-delay: 1s;
  +
left: 8pt;
  +
}
  +
.switchBox:checked{
  +
left: 8pt; /*Based on inner padding of td in table*/
  +
}
  +
  +
.switchBox:checked ~ .rawPerkDesc{
  +
display: unset !important; /* as soon as there will be Mobile.css, remove the !important and get rid of element styling (display: none;)*/
  +
}
  +
  +
.rawPerkDesc{
  +
display: none;
  +
}
  +
  +
.switchBox:checked ~ .formattedPerkDesc{
  +
display: none;
  +
}
  +
/*END SwitchBox For Perk Desc*/
  +
/*Tooltip styles*/
  +
.tooltip-value{
  +
cursor: help;
  +
border-bottom: 2px dotted;
  +
border-color: #535353;
  +
}
  +
.tooltip-value > .mobileView{
  +
font-size: 7pt;
  +
}
  +
/*END Tooltip styles*/
  +
/*Checkmark Yes/No - in table*/
  +
td .yesNo {
  +
display: flex;
  +
justify-content: center;
  +
padding-bottom: 5px;
  +
}
  +
/*END Checkmark Yes/No*/
  +
  +
.clr{
  +
text-shadow: 0 2px #000000cc;
  +
}
  +
  +
/*Character Pages (Killers, Survivors)*/
  +
.charInfoboxTable .charInfoboxImage img{
  +
/*width: 215px;*/ /*Width and height shouldn't be needed as the dimensions are set via image parameter itself in Module:Killers -> resolveKillerCharTable() and Module:Survivrs -> resolveSurvivorCharTable() */
  +
/*height: 215px;*/
  +
-webkit-filter: drop-shadow(5px 5px 5px #000);
  +
}
  +
  +
/*************************/
  +
/* EXTENSION CSS EDITS */
  +
/*************************/
  +
/* Forms page */
  +
.fieldBox {
  +
background: #323232 !important; /*changing the light background to dark one so the text inside is readable*/
  +
}
  +
/* END - Forms page - END */
  +
  +
/*Decom Loadout*/
  +
tr.decom th, tr.decom td,
  +
tr.unused th, tr.unused td{ /*parent's CSS needs to be se to relative in order to make work position absolute in ::before element*/
  +
position: relative;
  +
}
  +
  +
tr.decom th::before, tr.decom td::before,
  +
tr.unused th::before, tr.unused td::before{
  +
content: "";
  +
height: 100%;
  +
width: 100%;
  +
position: absolute;
  +
background: #18181882;
  +
z-index: 1;
  +
top: 0;
  +
left: 0;
  +
pointer-events: none;
  +
}
  +
  +
.decom .game-element-container {
  +
position: relative;
  +
z-index: 0;
  +
}
  +
  +
/* not sure if we want this - it will exempt the Decom note from greying out but iconlink (icon iteself) with tooltip as well
  +
.decom span.tooltip {
  +
z-index: 1;
  +
}
  +
*/
  +
/* END - Decom Loadout - END */

Latest revision as of 05:28, 17 April 2024

/* CSS placed here will affect users of the Hydradark skin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: local('Roboto Regular'), local('Roboto-Regular'), url("/media/hydra/fonts/Roboto-Regular.ttf") format('truetype');
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  src: local('Roboto Bold'), local('Roboto-Bold'), url("/media/hydra/fonts/Roboto-Bold.ttf") format('truetype');
}
/*Light Mode*/
body.theme-fandomdesktop-light a{
    color: #b9a05a;
    text-shadow: 0 2px #dad5c8, 0 2px 2px #bb9c56;
}
/*Light Mode END*/
/*Link Hover*/
a:hover{
	color: #fff0ca !important;
}
/*Right Side panel*/
/*increased z-index so the perk icons in SoS counter in archive won't glitch through the side panel if rolled out (and page shrinked)*/
.page__right-rail {
    z-index: 5;
}
/*Recent Changes Page*/
/*"Admin" Highlight (in fact auto-review, but this state/right should have only admins)*/
/*table.mw-changeslist-user-experienced.mw-changeslist-reviewstatus-auto .mw-changeslist-line-inner-userLink a,*/
a[title="User:DocOctober"],
a[title="User:Jouki"],
a[title="User:FichteHiro"],
a[title="User:Curly Bill Cipher"],
a[title="User:MrGrrimes"],
a[title="User:TheRealLuBu"],
a[title="User:Masusder"]
{
    color: #ebbb34;
    font-weight: 500;
}
/*Trusted contributors*/
a[title="User:R34l R1ch4rd N1x0n"],
a[title="User:ReverseVelocity"]
{
    color: #5ac6bb;
}
/*Recognised contributors*/
a[title="User:Legusvevo"],
a[title="User:Pokedude1110"],
a[title="User:Fan of Murder"],
a[title="User:Kyrope"],
a[title="User:MathUnsolver"]
{
    color: #408d85;
}
/*Recent Changes Page END*/
/*Page Header background*/
.fandom-community-header__background.cover {
    background-position: 50% 7%;
    background-size: 120%;
}
/*Page Header background END*/
/*Reverting strange fandom settings for paragraphs*/
.page-content{
	overflow: initial !important;
}
.page-content p{
	margin: 0 0 5px;
}
/*Unsetting underline for certain links*/
.mw-parser-output > p a {
	text-decoration: unset !important;
}
/*end*/
.mobileView{
	display: none;
}

.pcWikitable, .pcView{
	display: revert !important;
}

/* Shrinked page */
.resizable-container{
	max-width: 1350px;
}

/* Tweaks for fandom sticky header */
.fandom-sticky-header{
	background: linear-gradient(90deg, rgba(83,76,60,1) 0%, rgb(116 108 86) 50%, rgba(83,76,60,1) 100%) !important;
	box-shadow: 0 2px 6px 1px rgb(0 0 0 / 55%) !important;
}
/**********************
/* Site notice styles *
/**********************/
#mw-dismissable-notice {
}

#mw-dismissable-notice td > a {
}

#mw-dismissable-notice td > a:hover {
}

#localNotice {
	border-radius: 5px;
	border: 2px solid #1f1f1f;
	background: #000000 url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/0/05/Tbl-bg.jpg/revision/latest?cb=20230414192023/revision/latest?cb=20230414192023") left;
	background-size: contain;
	box-shadow: inset 0px 0px 45px 5px rgba(0,0,0,0.7), 0 0 5px 0 #000000;
	color: #aaa9a9;
	margin: 0 0 10px 0;
	padding: 3px 6px;
}

/*Width of Site notice*/
.sitedir-ltr .mw-dismissable-notice-body{
	margin: 0.5em;
}


/****** TOOLTIP *******/
.tooltip {
  position: relative;
  display: inline-block;
  border-bottom: 2px dotted;
  border-color: #656565;
  height: 24px; /*questionable? - it will be proabably nullified by height from ".pcView.pcIconLink .tooltip" */
  cursor: help;
}
.disableTooltip .tooltiptext {
    display: none;
}

.tooltip.borderless{
	border-bottom: revert;
	border-color: revert;
}

/* Tooltip text */
.tooltip .tooltiptext {
	width: 240px;
    max-height: 0px;
    min-width: min-content;
    overflow: hidden;
    background-color: #151515;
    color: #fff;
    box-shadow: 0px 1px 13px 5px #000000a8, 0px 0px 5px 2px #00000066;
    font-family: "rubik";
    text-align: center;
    border-radius: 6px;
    position: absolute;
    z-index: 1;
    bottom: 125%;
    opacity: 0;
    border: solid 0px #e2ce9791;
    
    transition: /*Fade OUT - Hover version overwrite the settings, so this applies only when mouse exit the pseudo element hover*/
    			padding 0s 0.2s, /*no animation, 0.3s delay*/
    			max-height 0s 0.2s,
				border-width 0s 0.2s,
				opacity 0.2s 0s; /*no delay, 0.2 duration*/
}
/*linkless tooltips doesn't need pointer event which makes a tooltip to disappear when we hover it*/
.tooltip:not(.linkIncluded) .tooltiptext {
    pointer-events: none;
}

.tooltipBaseText::after {
    content: " ⓘ";
    font-size: 12px;
    font-weight: 600;
    vertical-align: middle;
}
.iconless::after {
    content: unset;
}

/* Tooltip arrow */
.tooltip .tooltiptext::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  /*border-style: solid;*/ /*DISABLED - To enable uncomment the row */
  border-color: #151515 transparent transparent transparent;
}

/* Show the tooltip text when you mouse over the tooltip container */
.tooltipBaseText:hover ~ .tooltiptext, .tooltip.linkIncluded .tooltiptext:hover {
	opacity: 1;
	z-index: 1000; /*setting over value 800 to get before Fandom left sidebar*/
	max-height: 1000px;
    overflow: auto;
    padding: 8px 10px;
    border: solid 1.4px #e2ce9791;
    transition: /*Fade IN values (hover applies just when you hover the element and overwrite the settings)*/
    			padding 0s 0s,
    			max-height 0s 0s,
    			border-width 0s 0s,
    			opacity 0.2s;
	
}
/*********** TOOLTIP PC SPECIFIC ***********/

.pcView.pcIconLink {
    display: inline-flex !important;
}

.pcView.pcIconLink .tooltip {
    width: 100%;
    height: 100%;
}

.pcView.pcIconLink .tooltipBaseText a img {
    width: 100%;
    height: 100%;
}

/********** TOOLTIP PERK SPECIFIC **********/
.tooltiptext .perkWrapper {
    text-align: left;
}

/******************************************/
/*            TOOLTIP CSS ENDS            */
/******************************************/

/* Other */
.floatRight{
	float: right;
}
.floatLeft{
	float: left;
}
.relative{
	position: relative;
}
.absolute{
	position: absolute;
}
.inline-flex{
	display: inline-flex;
}
.flex{
	display: flex;
}
.center{
	text-align: center;
	vertical-align: middle;
}
.margin-auto{
	margin: auto;
}
.left{
	text-align: left;
}
.page-content .center{
	width: revert;
}
.display-none, .dnone{
	display: none
}
.bold{
	font-weight: 600;
}

.italic{
	font-style: italic;
}

.smallerText{
	font-size: smaller !important;
}

.pre{ /*Simulating <pre> tag but in div so other CSS rules can be applied*/
	display: inline-block;
	white-space: pre-line;
	font-family: monospace;
    background: #323232;
    padding: 7px 15px;
}
.pre.inline{
	padding: 1px 5px;
    display: inline;
}

hr {
  border: none;
  border-bottom: 1px solid #343434c7;
  margin: 13pt 0;
}

/****************** Other  END ************************/
/********************* Cargo **************************/
#queryform, div.specialCargoQuery-extraPane{
	background: #323232;
	color: var(--theme-page-text-color);
}
/****************** Cargo  END ************************/
/*disabling the option to swotch to visual editor*/
.ve-ui-modeSwitchPopupButtonWidget-visualSwitch { /*greying out*/
    opacity: 0.5;
    pointer-events: none;
}
.ve-ui-modeSwitchPopupButtonWidget-visualSwitch::after { /*creating new text*/
    content: "Visual Editing is disabled on DBD Wiki";
}
.ve-ui-modeSwitchPopupButtonWidget-visualSwitch .oo-ui-labelElement-label { /*hiding original text*/
    display: none;
}
/*Visual Editor switch disabler END*/

.wikitable{ /* and that's the reason why this all css system is utmost bullsh#t! */
	border-color: #1f1f1f !important;
}

table.wikitable {
	font-size: 10pt;
	border-radius: 2px;
	/*border: 2px solid #1f1f1f;*/
	box-shadow: 0 0 5px 0 #000000;
	background: #0b0b0b !important;
	color: #aaa9a9;
	margin: 0 0 10px 0;
	padding: 0;
}

table.wikitable th,
table.wikitable tr th,
table.wikitable > tr > th,
table.wikitable > * > tr > th,
div.dbdDiv { /*These should be Tables on pages, header cells with background*/
	border: 1px solid #1f1f1f;
	background: #000000 url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/0/05/Tbl-bg.jpg/revision/latest?cb=20230414192023");
	background-position: left center;
	background-size: cover; /*Contain creates patterns on smaller header cells*/
	box-shadow: inset 0 0 45px 5px rgba(0,0,0,0.7), 0 0 5px 0 #000000;
	color: #ffffff;
	font-weight: bold;
	padding: 0 3px 1px 3px;
}

table.wikitable td,
table.wikitable tr td,
table.wikitable > tr > td,
table.wikitable > * > tr > td,
.ooui-theme-fandomooui .wikitable>*>tr>td /* What the hell is this selector (class: ooui-theme-fandomooui)?!...*/
{
  border: 1px solid #1f1f1f;
  background: transparent;
  color: #aaa9a9;
  padding: 4pt 8pt;
}

.ooui-theme-fandomooui .wikitable>*>tr>th{
	border: 1px solid #1f1f1f;
	padding: 4pt 8pt;
	text-align: center;
}

/*Table header*/
table.jquery-tablesorter th.headerSort, table.jquery-tablesorter th.headerSortDown, table.jquery-tablesorter th.headerSortUp {
	background: #000000 url(https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/0/05/Tbl-bg.jpg/revision/latest?cb=20230414192023) left !important;
}
/*Sortable table headers*/
.ooui-theme-fandomooui .WikiaTable.jquery-tablesorter .headerSort:after,
.ooui-theme-fandomooui .WikiaTable.jquery-tablesorter .headerSort:before,
.ooui-theme-fandomooui .article-table.jquery-tablesorter .headerSort:after,
.ooui-theme-fandomooui .article-table.jquery-tablesorter .headerSort:before,
.ooui-theme-fandomooui .wikitable.jquery-tablesorter .headerSort:after,
.ooui-theme-fandomooui .wikitable.jquery-tablesorter .headerSort:before {
    background-color: #e2ce97 !important; /*overrding the color of sorting arrows in table header*/
}

table.smwtable {
  border-radius: 2px;
  border: 2px solid #1f1f1f;
  box-shadow: 0 0 5px 0 #000000;
  background: #0b0b0b;
  color: #aaa9a9;
  margin: 0 0 10px 0;
  padding: 0;
}

table.smwtable th {
	border: 1px solid #1f1f1f;
	background: #000000 url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/0/05/Tbl-bg.jpg/revision/latest?cb=20230414192023") left;
	background-size: contain;
	box-shadow: inset 0 0 45px 5px rgba(0,0,0,0.7);
	color: #aaa9a9;
	font-weight: bold;
	padding: 0 3px 1px 3px;
}

table.smwtable td {
  border: 1px solid #1f1f1f;
  background: transparent;
  color: #aaa9a9;
  padding: 0 3px 1px 3px;
}

.smwrdflink {
  color: #e2c99e;
}

div.smwfact {
  border: none;
  background: transparent;
  margin: 0;
  padding: 0;
}


.ambox {
	border-radius: 5px;
	border: 2px solid #1f1f1f;
	background: #000000 url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/0/05/Tbl-bg.jpg/revision/latest?cb=20230414192023") left;
	background-size: contain;
	box-shadow: inset 0 0 45px 5px rgba(0,0,0,0.7);
	color: #aaa9a9;
	border-collapse: collapse;
	font-size: 95%;
	margin: 0 auto 10px auto;
	padding: 3px 6px;
	width: 80%;
}

.ambox-gray {
  border-left-color: #383838;
}

.ambox.ambox-tiny {
  font-size: 90%;
  margin: 2px 0;
  width: auto;
}

.ambox + .ambox {
  margin-top: -10px;
}

.ambox-text {
  padding: 0.25em 0.5em;
}

.ambox-image {
  padding: 2px 0px 2px 0.5em;
  text-align: center;
  width: 60px;
}

.ambox-tiny .ambox-image {
  padding: 2px 0.5em;
  text-align: left;
  width: auto;
}

/* Ambox colors */
.ambox-blue {
  border-left: 10px solid #1e90ff;
}

.ambox-red {
  border-left: 10px solid #b22222;
}

.ambox-orange {
  border-left: 10px solid #f28500;
}

.ambox-yellow {
  border-left: 10px solid #f4c430;
}

.ambox-purple {
  border-left: 10px solid #9932cc;
}

.ambox-gray {
  border-left: 10px solid #bba;
}

.ambox-green {
  border-left: 10px solid #228b22;
}

/* Ambox small text */
.amsmalltext {
  font-size: smaller;
  margin-left: 0.8em;
  margin-top: 0.5em;
}

/*********************
/* Front page styles *
/*********************/
.fpcontent {
  width: 100%;
  overflow: hidden;
  z-index: 1;
}

.fpmaybecols {
  overflow: hidden;
  margin: -5px 0 -5px 0;
}

.fpmaybecols + .fpmaybecols {
  margin: 0 0 -5px 0;
}

.fpbox {
	border-radius: 5px;
	border: 2px solid #1f1f1f;
	background: #000000 url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/0/05/Tbl-bg.jpg/revision/latest?cb=20230414192023") left;
	background-size: 100% !important; /*need to overwrite fandom's CSS rules*/
	box-shadow: inset 0 0 45px 5px rgba(0,0,0,0.7), 0 0 5px 0 #000000;
	color: #aaa9a9;
	margin: 5px 5px 5px 5px;
	padding: 5px 5px 5px 5px;
}

.fpplainbox {
  padding: 5px 8px 10px 8px;
  margin: 0 5px 10px 5px;
  vertical-align: top;
}

.fpbox .welcome {
  border-bottom: 1px solid #1f1f1f;
  font-family: 'Roboto', sans-serif;
  color: #ffffff;
  text-transform: uppercase;
  font-size: 150%;
  text-align: center;
  margin: 0 0 10px 0;
  padding: 0 0 5px 0;
}

.fpbox .heading {
  border-bottom: 1px solid #1f1f1f;
  font-family: 'Roboto', sans-serif;
  color: #ffffff;
  font-variant: small-caps;
  font-size: 132%;
  margin: 0 0 10px 0;
  padding: 0 0 5px 0;
}

.fpbox .heading .smalllink {
  color: #aaa9a9;
  font-weight: bold;
  font-size: 75%;
}

.fpbox hr {
  border: none;
  border-bottom: 2px solid #1f1f1f;
}

.fplinks {
  /*margin: -5px;*/
}

.fplinks.charSection{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.fplinks .linkslabel {
  border-bottom: 2px solid #1f1f1f;
  background: transparent;
  margin: 15px 5px 5px 5px;
  padding: 0 0 5px 0;
}

.fplink {
  display: inline-block;
  vertical-align: middle;
  margin: 5px 4.5px;
}

/* Yeah, using display: table makes for a lot of extra markup, but it makes proportionate sizing and vertical centering a lot easier, so going with it */
.fplink .box {
  display: table;
  width: 100%;
  height: 100%;
  border-collapse: separate;
}

.fplink .box .row {
  display: table-row;
}

.fplink .box .row .cell {
  display: table-cell;
  position: relative;
  font-family: 'Roboto', sans-serif;
  border-radius: 5px;
  border: none;
  background: #232323;
  box-shadow: 0 0 5px 0 #000000;
  color: #ffffff;
  font-weight: bold;
  text-transform: uppercase;
  text-align: center;
  transition: 0.1s;
}

.fplink.wide .box .row .cell {
  padding: 0 5px;
}

/*Main page help box*/
.helpBox tr td:nth-child(2) {
    padding-right: 50px;
}

.charMainPageBox {
	margin: 5px 4.5px;
	min-width: 150px;
	min-height: 150px;
	width: 150px;
	height: 150px;
	transition: 0.2s;
	transition-delay: 0.25s;
}

.charMainPageBox:hover{
	height: 200px;
	transition-delay: 0s;
}

.charPerkBox {
    position: absolute; /*inherit;*/
    height: 50px;
    width: 100%;
    top: 150px;
    padding-top: 5px;
    z-index: 3;
    background-color: #232323;
    -webkit-box-shadow: inset 0px 4px 10px 0px #00000087;
}

.charMainPageBox:hover .charPerkBox {
    bottom: 0;
    transition: 0.2s;
}

.cell .charPerkBox > a {
	/*top: -46px;*/
    display: inline;
    padding: 3px;
}

.charMainPageBox:hover .cell .charPerkBox > a /*TODO remove the first selector as it should be legacy*/
{
	filter: saturate(0.9) brightness(0.8) drop-shadow(1px 2px 2px black);
}
.charMainPageBox .row .cell .charPerkBox > a:hover /*TODO remove the first selector as it should be legacy*/
{
    filter: saturate(1) brightness(1) drop-shadow(1px 4px 6px black);
}

.charMainPageBox .cell .charPerkBox .game-element-container .teachable-perk-element{ /*drop shadow for perk frame*/
	filter: saturate(0.9) brightness(0.8) drop-shadow(1px 2px 2px black);
}
.charMainPageBox .cell .charPerkBox .game-element-container .game-element-imgObject{ /*setting brightness and saturation for imageperk image only (without dropping shadow)*/
	filter: saturate(0.9) brightness(0.8)
}
.charMainPageBox .row .cell .charPerkBox .game-element-container:hover .teachable-perk-element{
	filter: saturate(1) brightness(1) drop-shadow(1px 4px 6px black);
}
.charMainPageBox .row .cell .charPerkBox .game-element-container:hover .game-element-imgObject{
	filter: saturate(1) brightness(1);
}

.fplink.image .box .row .cell {
	width: 150px;
	height: 150px;
	vertical-align: bottom;
	overflow: hidden;
	background-image: url(https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/2/2d/Empty_Preview.png);
	background-size: contain;
	background-repeat: no-repeat;
}

.fplink.image .box .row .mapCell.cell {
	background-size: 100% 100%;
	background-position: center;
}

.fplink.image .box .row .mapCell.cell{
	background-image: url(https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/0/0a/EmptyWide.png);
}

.fplink.realmMainPageBox.image .box .row .cell {
	height: 200px;
}

.fplink.image .box .row .cell .image img {
	max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    /*float: left;*/ /*not usre why is that set to left? I keep it for time being until I decide I didn't find the reason in reasonable time*/
    -webkit-filter: drop-shadow(0px 0px 13px rgba(0,0,0,1));
}



@media (min-width: 990px) {
  .fpcontent { 
    padding-right: 520px; 
    width: auto; 
  }

  #fptopsection { 
    float: left; 
    width: 100%; 
  }

  #fpflexsection { 
    float: right;
    width: 520px;
    margin-right: -520px 
  }

  #fpbottomsection { 
    float: left; 
    width: 100%; 
    margin-top: -5px; 
  }
  
  #fptopsection .fpbox, #fpbottomsection .fpbox { 
	background: #000000 url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/0/05/Tbl-bg.jpg/revision/latest?cb=20230414192023") left;
	/*background-size: cover;*/ /*Background fit style*/ 
	box-shadow: inset 0 0 45px 5px rgba(0,0,0,0.7);
  }
  #fpflexsection .fpbox { 
    background: #0b0b0b;
  }
}

@media (min-width: 1430px) {
  .fplink a {
    padding: 3px 5px;
  }
}

@media (min-width: 1540px) {

  #fptopsection .fpmaybercol .fpbox, #fpbottomsection .fpmaybercol .fpbox {
    background-image: none;
  }

  .fpmaybelcol {
    float: left;
    width: 70.886%;
  }
  .fpmaybercol {
    float: right;
    width: 29.113%;
  }
}

.fplink.realmMainPageBox{
	width: 301px;
	margin: 7px 10px;
}

@media (min-width: 2200px) { /* 4k resolution at 150% scale */
	.wikiEditor-ui-text div.ui-resizable{ /* Code Editor */
		height: 1000px !important;
	}
}

@media (min-width: 2420px) {
  .fplink a {
    padding: 5px 5px;
  }
}

.fplink.image .image {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  font-size: 75%;
  z-index: 1;
}

.fplink.image a {
  z-index: 2;
}

.fplink a {
  display: block;
  position: relative;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  padding: 1px 5px;
}

.fplink.image .image a {
  padding: 0;
  height: 100%;
}
.fplinks.unlockables .fplink.image .image a,
.fplinks.game .fplink.image .image a,
.fplinks.currencies .fplink.image .image a,
.fplinks.charProgress .fplink.image .image a,
.fplinks.stores .fplink.image .image a,
.fplinks.interactables .fplink.image .image a{ /*Adjusting images in boxes on main page to be in center with a certain padding*/
    padding: 15px;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.fplink.image .link a {
  background: #19263e;
  background: rgba(62, 54, 25, 0.5);
  font-size: 80%;
}

.fplink.image .link a:hover {
  background: rgba(0, 0, 0, 0.65);
}

.fplink.wide a {
  margin: 0 -5px;
}

.fpvideos {
  margin: 0 auto;
  overflow: hidden;
  text-align: center;
}

.fpvideo {
  display: inline-block;
  margin: 0 5px;
}

/******************
/* Infobox styles *
/******************/
.infoboxtable {
  float: right;
  border-radius: 5px;
  border: 2px solid #1f1f1f;
  box-shadow: 0 0 5px 0 #000000;
  background: #0b0b0b;
  color: #aaa9a9;
  margin: 0 5px 10px 0;
  padding: 3px 6px;
  /*width: 300px;*/
}

.infoboxtable td {
  vertical-align: top;
}

.infoboxtable td > div {
  border: none;
  background: #292929;
  color: #ffffff;
  font-weight: bold;
  padding: 0.5px 7px;
  text-align: right;
}

.infoboxname {
  border-bottom: 1px solid #1f1f1f;
  font-family: 'Roboto', sans-serif;
  color: #ffffff;
  text-transform: uppercase;
  padding: 8px; 
}

.infoboxdetails {
  padding: 0;
}

.hiddenInfobox {
    float: right;
}

/*********************
/* Navigation tables *
/*********************/
table.nav {
  border-radius: 2px;
  border: 2px solid #1f1f1f;
  box-shadow: 0 0 5px 0 #000000;
  background: #0b0b0b;
  color: #aaa9a9;
  margin: 0 auto 10px auto;
  padding: 0;
  clear: both;
}

table.nav th, table.nav tr th, table.nav > tr > th, table.nav > * > tr > th {
	border: 1px solid #1f1f1f;
	background: #000000 url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/0/05/Tbl-bg.jpg/revision/latest?cb=20230414192023") left;
	background-size: cover;
	box-shadow: inset 0 0 45px 5px rgba(0,0,0,0.7);
	color: #ffffff;
	font-weight: bold;
	text-align: center;
	vertical-align: top;
	margin: 0;
	padding: 0 5px 5px 5px;
}

table.nav td, table.nav tr td, table.nav > tr > td, table.nav > * > tr > td {
  border: 1px solid #1f1f1f;
  background: transparent;
  color: #aaa9a9;
  margin: 0;
  padding: 3px 11px 8px 11px;
}

table.nav td.list, table.nav tr td.list, table.nav > tr > td.list, table.nav > * > tr > td.list {
  padding: 0;
}

table.nav td .item {
  display: inline-block;
  border-left: 1px solid #1f1f1f;
  margin: 3px 0 6px 0;
  padding: 0 11px 2px 11px;
  vertical-align: top;
}

table.nav td .item:first-child {
  border: none;
}

/******************
/* General styles *
/******************/
.contentbox {
	border-radius: 5px;
	border: 2px solid #1f1f1f;
	background: #000000 url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/0/05/Tbl-bg.jpg/revision/latest?cb=20230414192023") left;
	background-size: contain;
	box-shadow: inset 0 0 45px 5px rgba(0,0,0,0.7), 0 0 5px 0 #000000;  color: #aaa9a9;
	margin: 0 0 10px 0;
	padding: 3px 6px;
	overflow: auto;
}

span.bullet {
  background: transparent url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAANAQMAAABb8jbLAAAABlBMVEVvcnSw/2O5S7OkAAAAAXRSTlMAQObYZgAAAAFiS0dEAIgFHUgAAAAJcEhZcwAACxMAAAsTAQCanBgAAAAHdElNRQfgBhgHBTp+SQCAAAAAE0lEQVQI12NgQAEFDD/AsICBAQAakgPJO2sGpQAAAABJRU5ErkJggg==") no-repeat center 60%;
  width: 9px;
  font-size: 11px;
  vertical-align: baseline;
}

.dablink {
  padding: 2px 36px 10px 36px;
  font-style: italic;
}

span.ghost {
  color: #7c8a83; /* For any text that appear fainter for some reason */
}

.columns {
  padding: 0;
  margin: 10px 0 0 0;
  overflow: hidden;
}

.columns .leftcol {
  float: left;
  width: 50%;
  margin: 0;
  padding: 0;
}

.columns .centercol {
  float: left;
  margin: 0;
  padding: 0;
}

.columns .rightcol {
  float: right;
  width: 50%;
  margin: 0;
  padding: 0;
}

/* Custom CSS */

/*Language Box generated from Module:Language function resolveLanguageTable*/
.langBox {
    float: right;
    position: relative;
    top: -10px;
    right: 7px;
    font-size: small;
    font-weight: 500;
    color: #aaa9a9;
    padding: 4px 7px;
    border: 1px solid var(--theme-border-color);
}

.language-table td{
    padding: 0 10px;
    border: 0;
}

.mobile-inline-languages{
	display: none;
}

							/*Diff changes on page*/
.diff{
	border-collapse: collapse;
	font-size: 11pt;
}
.diff td.diff-addedline, .diff td.diff-deletedline, .diff td.diff-context{
	border: solid;
	border-width: 0 0 0 4px;
	border-radius: 0;
	vertical-align: middle;
}
.diff td.diff-addedline{
	border-color: #1dbd5e;
	background-color: #0e80348f;
}
.diff td.diff-deletedline{
	border-color: #ff4343;
	background-color: #b41c2d99;
}
.diff td.diff-context{
	border-color: #505050;
}
/*Diff highlight background*/
.diff-addedline .diffchange, .diff-deletedline .diffchange {
    border-radius: 0.13em;
    padding: 2px 2px;
}
.diff-context{
    background: #383838;
    color: revert;
}
.diff-addedline .diffchange{
	background: #867109;
}
.diff-deletedline .diffchange{
	background: #9e3a3a;
}
						/*END Diff changes on page*/
						/*History Diff changes on page*/

#pagehistory li.selected{
    background-color: #3e3e3e;
    color: #d6d6d6;
    border: 1px dashed #a2a9b1;
    text-shadow: 1.5px 1.5px 0 #0000008a;
}
#pagehistory li{
	font-size: 14px;
	border-color: #5f5f5f;
	padding: 5px;
}

.mw-plusminus-pos{
	color: #2b882b;
}
.mw-plusminus-neg{
	color: #ff4343;
}

						/*END History Diff changes on page*/
						/*Syntax Highlight*/
/*Classic editor - syntax highlight*/
.cm-mw-matchingbracket {
    background-color: #4b4b4b;
    box-shadow: inset 0 0 1px 1px #999;
    font-weight: bold !important;
    /*padding: 1px 2px 2px 2px;*/
}
/*END Classic editor - syntax highlight*/
/*boldening the text that is wrapped in <syntaxhighlight> tag (e.g. Documentation pieces)*/
b code span, b code.mw-highlight {
    font-weight: 600 !important;
}
pre{
	white-space: pre-wrap;
}
/*code tag*/
code.mw-highlight {
    background: #474747;
    font-size: 15px;
    font-weight: 400;
    padding: 1px 2px;
    border: dashed 1px #454545;
}
.page-content pre {
	border: 2px dashed #2e2e2e;
	background: #323232;
}
/*text editor*/
.mw-editform #wpTextbox1{
	background: #303030;
    color: #ececec;
}
/*editor - first bar*/
.wikiEditor-ui-toolbar {
    background-color: #3f4346;
    background-image: -webkit-linear-gradient(top,#4f5858 0,#3b3f44 32px);
    background-image: -moz-linear-gradient(top,#fdfefe 0,#e8f2f8 32px);
    background-image: linear-gradient(#4f5258 0,#3b3f44 32px);
}
/*editor - second bar*/
.wikiEditor-ui-toolbar .sections .section {
    border-top: 1px solid #696969;
    background-color: #3a3d42;
}
/*links in editor (first bar)*/
.wikiEditor-ui-toolbar .tabs span.tab a, .wikiEditor-ui-toolbar .tabs span.tab a:visited{
	color: #ddc994;
}
/*opened links in editor (first bar)*/
.wikiEditor-ui-toolbar .tabs span.tab a.current, .wikiEditor-ui-toolbar .tabs span.tab a.current:visited{
	color: #b4b6b6;
}
/*links in editor - second bar*/
.wikiEditor-ui-toolbar .group .label{
	color: #b6b6b6;
}
/*char - apostrof*/
.mw-highlight .s1 {
    color: #dedb73;
}
/*string - quotes*/
.mw-highlight .s2 {
    color: #dedb73;
}
/*comment*/
.mw-highlight .c1 {
    color: #717171;
}
/*boolean*/
.mw-highlight .kc {
    color: #59abd2;
    font-weight: bold;
}
/*number - integer*/
.mw-highlight .mi {
    color: #ff6262;
}
/*number - float*/
.mw-highlight .mf {
    color: #ff9456;
}
/*hexa numbers*/
.mw-highlight .mh {
    color: #e2e2e2;
}
/*css styles and functions name*/
.mw-highlight .k{
    color: #4aabab;
}
.mw-highlight .nf{
	color: #4dbdff;
}
.mw-highlight .kd {
    color: #bb7340;
}
/* values/units */
.mw-highlight .kt {
    color: #ce4f7d;
}
/*highlighted area*/
.mw-highlight .hll {
    background-color: #636363;
}
.mw-highlight .hll span {
	text-shadow: 1px 0.8px 0.5px #00000080;
}
/*selectors*/
.mw-highlight .nt, .mw-highlight .nb {
    color: #67b567
}
.mw-highlight .nn, .mw-highlight .nc {
    color: #5e73da;
}
.mw-highlight .nd {
    color: #c567ff;
}
/*no special*/
.mw-highlight .n, .mw-highlight .nx {
    color: #e5e5e5;
}

						/*END Syntax Highlight*/
.wikitable tr th,
.wikitable tr td{
	text-align: revert;
}

/* Article special features styles */

/* Mapping Class to BP Background */
.BG-All{ /*DELETE class CosmeticsBG-All*/
	background-size: 104% 102% !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    min-width: 128px;
    min-height: 128px;
    width: 128px;
    height: 128px;
    text-shadow: 1px 1px 3px rgba(0,0,0,0.7);
    
    color: white !important;
    text-align: center !important;
    font-size: larger;
    font-weight: bold;
}

.BPBG-All, .CosmeticsBG-All{
    padding-top: 8px !important;
}
.CosmeticsBG-All {
    min-width: 256px;
    min-height: 256px;
}
td.CosmeticsBG-All { /* this is rather a legacy compatibility style with cosmetics actual tables, using the styles for automatic cosmetic div-tables */
    height: 256px;
}

.ISACBG-All, td.ISACBG-All{
	min-width: 100px;
	max-width: 140px;
}

.CosmeticsBG-All img{
	-webkit-filter: drop-shadow(0px 0px 4px rgba(0,0,0,0.7));
}

.CosmeticsBG-Visceral{
	position: relative;
}
.CosmeticsBG-Visceral::before {
    content: "";
    background: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/b/b0/VisceralBG.png") content-box !important;
    background-size: inherit !important;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    scale: 91%;
}

.ISBG img{
	-webkit-filter: drop-shadow(1px 1px 2px rgba(0,0,0,0.4));
}

.mw-collapsed:not(.mw-changeslist-line) { /* When collapsible is collapsed, :not(.mw-changeslist-line) as this class is used for Special:RecentChanges*/
    width: 250px;
    /*height: 130px;
    display: block;*/
}

/*.mw-collapsed tr {
    display: table-row !important;
    max-height: 100px;
    -webkit-mask-image: linear-gradient(rgb(0, 0, 0), rgba(0, 0, 0, 0));
    -webkit-mask-size: 100% 100px;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center top, center bottom;
}*/
.cosmeticsTable:not(.mw-collapsed) {
	width: 100%;
}


.SoS-IS{
	height: 105px;
}

.PerkCostsBG{
	width: 140px;
}

.BPBG  { background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/4/4a/BP_BG.png") !important;}
.BPBG-0{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/c/c7/BP_BG_Uncommon.png") !important; filter: grayscale(1) brightness(1.3);}
.BPBG-1{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/3/3c/BP_BG_Common.png") !important;}
.BPBG-2{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/c/c7/BP_BG_Uncommon.png") !important;}
.BPBG-3{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/2/25/BP_BG_Rare.png") !important;}
.BPBG-4{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/1/13/BP_BG_Very_Rare.png") !important;}
.BPBG-5{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/f/fd/BP_BG_Ultra_Rare.png") !important;}
.BPBG-6{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/7/74/BP_BG_Legendary.png") !important;}
.BPBG-7{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/3/32/BP_BG_Event.png") !important;}
.BPBG-Buff{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/2/28/Buff_BG.png") !important;}

.SquareBG-ISAC-enh,
.ISACBG{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/5/53/Dbd-dual.png") !important;} /*discarded*/
.SquareBG-AC-enh,
.ACBG{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/c/cd/Dbd-auric-cells.png") !important; text-shadow: 0px 0px 3px rgba(0,0,0,0.7), 1px 1px 3px rgba(0,0,0,0.7), 1px 1px 5px rgba(0,0,0,0.4)}
.SquareBG-IS-enh,
.ISBG{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/e/e1/Dbd-iridescentshards.png") !important;}
.BPTBG{background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/a/ad/Dbd-teachable.png") !important;} /*Bloodpoints - teachable*/

/*Square version is using Item Node background*/
.SquareBG-1{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/a/a8/Dbd-addons-common.png") !important;}
.SquareBG-2{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/d/dc/Dbd-addons-uncommon.png") !important;}
.SquareBG-3{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/1/19/Dbd-addons-rare.png") !important;}
.SquareBG-4{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/f/f2/Dbd-addons-veryrare.png") !important;}
.SquareBG-5{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/b/be/Dbd-addons-ultrarare.png") !important;}
.SquareBG-6{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/6/63/Dbd-legendary.png") !important;}
.SquareBG-7{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/a/a1/Dbd-events.png") !important;}
.SquareBG-8{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/4/45/Dbd-artefact.png") !important;}
.SquareBG-9{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/4/4c/Dbd-spectral.png") !important;}
.SquareBG-buff{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/c/c1/Dbd-buff-square.png") !important;}
.SquareBG-debuff{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/3/39/Dbd-debuff-square.png") !important;}
.SquareBG-1-enh{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/4/47/Dbd-common-enhanced.png") !important;}
.SquareBG-2-enh{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/1/1c/Dbd-uncommon-enhanced.png") !important;}
.SquareBG-3-enh{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/2/25/Dbd-rare-enhanced.png") !important;}
.SquareBG-4-enh{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/7/75/Dbd-veryrare-enhanced.png") !important;}
.SquareBG-5-enh{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/5/59/Dbd-ultrarare-enhanced.png") !important;}
.SquareBG-7-enh{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/8/85/Dbd-legendary-enhanced.png") !important;}
.SquareBG-8-enh{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/3/39/Dbd-events-enhanced_legacy.png") !important;} /*Event*/
.SquareBG-9-enh{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/b/ba/Dbd-artefact-enhanced.png") !important;} /*Artefact*/
.SquareBG-DT-enh,
.SquareBG-10-enh,
.SquareBG-21-enh{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/b/b3/Dbd-dark-trinkets-enhanced.png") !important;}
.SquareBG-RF-enh,
.SquareBG-13-enh{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/1/1f/Dbd-rift-fragments-enhanced.png") !important;}
.SquareBG-FT-enh{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/3/3a/Dbd-frosty-trinkets-enhanced.png") !important;}
.SquareBG-28-enh,
.SquareBG-TT-enh{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/e/e1/Dbd-thrombotic-trinkets-enhanced.png") !important;}
.SquareBG-BP-enh{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/e/e9/Dbd-bloodpoints-enhanced.png") !important;}
.SquareBG-RP-enh{ background-image: url("https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/b/b8/Dbd-rift-pass.png") !important;}


.game-element-bg-settings{
	background-size: contain;
    background-repeat: no-repeat;
}

.game-element-container{
    justify-content: center;
}

.addon-container {
    scale: 86.5%;
}

.charMainPageBox .game-element-container{
	margin: 0 3px;
}

.game-element-container a {
	width: 100%;
    height: 100%;
    padding: 0;
}

.game-element-container img {
    width: 100%;
    height: 100%;
    /*margin-left: 1px;*/
}

.game-element-bg-settings-size-general{
	min-height: 96px;
    min-width: 96px;
}
.game-element-bg-settings-size-perk, .game-element-bg-settings-size-sos{
	height: 128px;
    width: 128px;
}

.addon-marker{
	background-image: var(--addon-marker);
	width: 76px;
    height: 90px;
    scale: 50%;
    top: -35px;
    right: -31px;
}
/*assembly addon*/
.addon-marker-il { /*quite nastry code*/
    scale: 25%;
    top: -40px;
    right: -34px;
}
.addon-size{ /*ditto*/
	max-width: 32px;
    max-height: 32px;
}
/*assembly addon END*/
.common-addon-element{ background-image: var(--common-addon-bg);}
.uncommon-addon-element{ background-image: var(--uncommon-addon-bg);}
.rare-addon-element{ background-image: var(--rare-addon-bg);}
.very-rare-addon-element{ background-image: var(--very-rare-addon-bg);}
.ultra-rare-addon-element{ background-image: var(--ultra-rare-addon-bg);}

.unused-item-element{ background-image: var(--unused-item-bg);}
.common-item-element{ background-image: var(--common-item-bg);}
.uncommon-item-element{ background-image: var(--uncommon-item-bg);}
.rare-item-element{ background-image: var(--rare-item-bg);}
.very-rare-item-element{ background-image: var(--very-rare-item-bg);}
.ultra-rare-item-element{ background-image: var(--ultra-rare-item-bg);}
.event-item-element{ background-image: var(--event-item-bg);}
.limited-item-element,
.craft-able-and-limited-item-element{ background-image: var(--limited-item-bg);}

.common-perk-element{ background-image: var(--common-perk-bg);}
.uncommon-perk-element{ background-image: var(--uncommon-perk-bg);}
.rare-perk-element{ background-image: var(--rare-perk-bg);}
.very-rare-perk-element{ background-image: var(--very-rare-perk-bg);}
.ultra-rare-perk-element{ background-image: var(--ultra-rare-perk-bg);}
.teachable-perk-element{ background-image: var(--teachable-perk-bg);}
.teachable-indicator-perk-element{ background-image: var(--teachable-indicator-perk-bg); pointer-events: none;}
.perk-level-1-indicator{ background-image: var(--perk-level-1);}
.perk-level-2-indicator{ background-image: var(--perk-level-2);}
.perk-level-3-indicator{ background-image: var(--perk-level-3);}

.common-offering-element{ background-image: var(--common-offering-bg);}
.uncommon-offering-element{ background-image: var(--uncommon-offering-bg);}
.rare-offering-element{ background-image: var(--rare-offering-bg);}
.very-rare-offering-element{ background-image: var(--very-rare-offering-bg);}
.ultra-rare-offering-element{ background-image: var(--ultra-rare-offering-bg);}
.event-offering-element{ background-image: var(--event-offering-bg);}

/*mystery box*/
.common-mb-element{ background-image: var(--common-mb-bg);}
.uncommon-mb-element{ background-image: var(--uncommon-mb-bg);}
.rare-mb-element{ background-image: var(--rare-mb-bg);}
.very-rare-mb-element{ background-image: var(--very-rare-mb-bg);}
.ultra-rare-mb-element{ background-image: var(--ultra-rare-mb-bg);}

/******************************* Assembling images END ***********************************/
.animate-perk-settings{
	animation-duration: var(--perk-switch-animation-durtation);
	animation-iteration-count: infinite;

}

.animate-perk-bg {
	animation-name: animate-switch;
}
.animate-perk-level {
	animation-name: animate-level-switch;
}

@keyframes animate-switch {
    0% {
        background-image: var(--uncommon-perk-bg);
    }
    32%{
        background-image: var(--uncommon-perk-bg);
    }
    33% {
        background-image: var(--rare-perk-bg);
    }
    66% {
        background-image: var(--rare-perk-bg);
    }
    67% {
        background-image: var(--very-rare-perk-bg);
    }
    100% {
        background-image: var(--very-rare-perk-bg);
    }
}

@keyframes animate-level-switch {
    0% {
        background-image: var(--perk-level-1);
    }
    32%{
        background-image: var(--perk-level-1);
    }
    33% {
		background-image: var(--perk-level-2);
    }
    66% {
        background-image: var(--perk-level-2);
    }
    67% {
        background-image: var(--perk-level-3);
    }
    100% {
        background-image: var(--perk-level-3);
    }
}

/******************************* Assembling images END ***********************************/


.boldLeft{
	border-left-width: 4px !important;
}

.bordelessRight, .borderless{
	border-right-style: none !important;
}

.bordelessLeft, .borderless{
	border-left-style: none !important;
}

/* Status HUD bg styles */
/*box-shadow: inset 0px 0px 19px 3px rgba(0,0,0,0.87); */
.HUD-Square-All{height:84px; width:80px;}

/******************************* SoS / Shrine of secrets Styles ***********************************/
table.sosTable td, table.sosTable tbody, table.sosTable tr {
    border: solid 2px #191919;
}
table.sosTable {
    background: black;
    border-collapse: collapse;
}
.sosHeader{
	font-size:17px;
	font-variant: small-caps;
	text-align: center;
	color: white;
}

.sosText{
	text-align: center;
	font-size: 11pt;
}
.sosText > a{
	font-weight: revert !important;
}

/*SoS Calendar Week number cells*/
td.week-cell {
    padding: 5px 0px !important;
    text-align: center !important;
    width: 30px;
}

/****** sos2 *******/

.sos2 {
    width: 487px;
    height: 350px;
    background: url(https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/a/a0/ShrineBG.png);
    background-size: contain;
    position: relative; /*in order to have identical starting coords (0,0) for all 4 perks the parent needs to be relative, while perks themselves absolute*/
}

.sosPerk{
	filter: saturate(1) brightness(1) drop-shadow(0px 0px 4px rgba(0,0,0,0.7)); /*saturation and brightness must be present as these values are modified with hover effect in order to make work transition*/
	position: absolute; /*parent needs to be relative when perks are absolute - this makes perks having starting position to their parents*/
	display: inline-block;
	transition: filter 0.1s linear;
}
.sosPerk:hover .teachable-perk-element{
    filter: saturate(1.1) brightness(1.15) drop-shadow(0px 0px 4px rgba(0,0,0,0.7));
}

.sosPerk1 {
    left: 179px;
    top: 10px;
    z-index: 2;
}
.sosPerk2 {
	left: 74px;
    top: 109px;
    z-index: 2;
}
.sosPerk3 {
	left: 272px;
    top: 109px;
    z-index: 2;
}
.sosPerk4 {
	left: 179px;
    top: 213px;
    z-index: 2;
}

.sosPerkHovered{
	
}
.sosPerkNotHovered{
	opacity: 0.5;
}

div.sosPerk1:hover, div.sosPerk2:hover, div.sosPerk3:hover, div.sosPerk4:hover
{
	z-index: 4;
}

.sosPerk1:hover .sosPerkDesc1, .sosPerk2:hover .sosPerkDesc2, .sosPerk3:hover .sosPerkDesc3, .sosPerk4:hover .sosPerkDesc4,
.sosPerkDesc1:hover, .sosPerkDesc2:hover, .sosPerkDesc3:hover, .sosPerkDesc4:hover{
	width: 230px;
}

.sosPerkDesc {
    position: absolute;
	width: 0;
    height: 122px;
    /*padding: 12px 0;*/
    background: #131313db;
    overflow: hidden;
    transition: all 0.15s linear;
    top: 3px;
    left: 64px;
    z-index: -1;
}

.sosPerkOwner{
	font-size: 15px;
}

.sosPerkDescName, .sosPerkOwner{
	height: 50%;
    padding: 0 10px 0 30px;
	display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-weight: 500;
}
.sosPerkDesc .sosPerkOwner{
	padding: 0 10px 0 45px;
}
.sosPerkDesc3 .sosPerkDescName { /*mirrored*/
    padding: 0 30px 0 10px;
}
.sosPerkDesc3 .sosPerkOwner{
	padding: 0 15px 0 10px;
}

.sosPerkDesc:before{
	content: "";
	position: absolute;
	width: 230px;
	height: 122px;
	background:
		linear-gradient(to left, white 4px, transparent 4px) 100% 0,
		linear-gradient(to left, white 4px, transparent 4px) 100% 100%,
		linear-gradient(to bottom, white 4px, transparent 4px) 100% 0,
		linear-gradient(to top, white 4px, transparent 4px) 100% 100%;
	background-repeat: no-repeat;
	background-size: 20px 20px;
	pointer-events: none;
}
.sosPerkDesc.sosPerkDesc3:before{
	background:
		linear-gradient(to right,white 4px,transparent 4px) 0 0,
		linear-gradient(to right,white 4px,transparent 5px) 0 100%,
		linear-gradient(to bottom,white 4px,transparent 4px) 0 0,
		linear-gradient(to top,white 4px,transparent 4px) 0 100%;
	background-size: 20px 20px;
    background-repeat: no-repeat;
}

.sosPerk3:hover .sosPerkDesc3 { /*we need to move element itself in order to make illusion rolling to to the left*/
    left: -166px;
}

.sosPerkDescDivider {
    position: absolute;
    top: 50%;
    width: 230px;
}
/*SoS Archive*/
/*Last date occurrence*/
.noticeText{
	font-size: 7.5pt;
    font-weight: 400;
    color: grey;
}
/*Hovers*/
.mwe-popups{
	background: #222222;
}
.mwe-popups .mwe-popups-extract{
  color: #b6b6b6;
}
.mwe-popups .mwe-popups-extract[dir='ltr']:after{
  background-image: linear-gradient(to right,#fff0,#fff0 50%);
}
/*END Hovers*/
/*Table of Content*/
.page-content #toc{
	font-size: 9pt;
}
/*END Table of Content*/

.page-content td p{
	margin: 0 0 0 0;
}

td.multipleOccurenceSoSCalendar {
    font-size: 18pt;
    font-weight: 600;
    text-shadow: 0.5px 0.5px 4px black;
    color: white !important;
    text-align: center !important;
    vertical-align: middle !important;
    padding: 0px !important;
}
/*Entry Table is used on page Perks, specificly [Perks/entry] page */
.entryTable{
	width: 330px;
	max-width: 330px;
	flex: 1;
	flex-basis: auto;
	margin: 10px 25px;
}

.entryTable table{
	width: 100%;
}

.sitenotice {
    box-shadow: 0 3px 15px 1px #000000d1;
    max-height: 450px;
    width: 500px;
}
.sitenotice:before{
	background-color: #ccaa4a;
}

/* Tabbers */
.wds-tab__content_shown{ /*temporary class that is used in JS for temporary show all the tabbers so the mouse tracker in tooltip can be calculated correctly*/
	display: initial !important;
}
.wds-tabber { /*To prevent hiding a tooltip inside tabber that would reach out of tabber div*/
    overflow: initial !important;
}
.page-content ul.wds-tabs{
	background: #00000033;
	flex-wrap: wrap;
}
.wds-tabs__tab.wds-is-current {
    background-color: #74653c26;
}
.wds-tabs__tab:hover {
    color: var(--theme-link-color--hover);
}
/*as long as the tabber won't scroll but wrap, these settings hide the right arrow and gradient*/
.wds-tabs__wrapper.right-arrow-visible .wds-tabs{
	/*-webkit-mask-image: revert;*/
	-webkit-mask-image: -webkit-gradient(linear,left top,right top,color-stop(98%,#000),to(transparent));
}
.wds-tabs__wrapper.right-arrow-visible .wds-tabs__arrow-right{
	visibility: hidden;
}
/* END Tabbers */

/*Infobox*/
.infoboxTitle{
	font-size: 18pt;
}

td.titleColumn{
	background: #292929;
	color: #fff;
	font-weight: bold;
	text-align: right;
	padding: 1px 10px;
	min-width: 120px;
	vertical-align: middle;
	font-size: 11pt;
}
td.valueColumn{
	min-width: 200px;
	max-width: 230px;
	vertical-align: middle;
	font-size: 10.5pt;
}

.metadata, tr.metadata td {
    font-size: smaller;
}
/*END Infobox*/
/*Value Tooltip*/
.valueTooltip{
    border-bottom: 1px dotted;
    border-color: #3c3c3c;
}
/*END Value Tooltip*/

.page-content h3{
	font-weight: 800;
	border-bottom: 1px solid;
    border-color: #343434c7;
}

.page-content h4{
	font-weight: 800;
	border-bottom: 1px solid;
    border-color: #343434c7;
}

/* Bullet top padding*/
.page-content ol, .page-content ul{
	margin-bottom: 8px;
}
.page-content p+ol, .page-content p+ul, .page-content section+ol, .page-content section+ul{
	margin-top: 0px;
}

/* MAIN PAGE */
/*DLC section(s)*/
.dlcCategorySection {
    padding: 20px 0;
}
.categoryLabel {
    font-family: 'Roboto',sans-serif;
    color: #ffffff;
    font-variant: small-caps;
    margin: 0;
    font-weight: 800;
    font-size: 18pt;
}
.categoryDlcs {
    margin: 0 60px;
    padding: 15px 20px;
    max-width: 100%;
    width: auto;
    display: inline-flex;
    justify-content: center;
    flex-wrap: wrap;
    border: 3px solid #1f1f1f;
}

.dlcCapsule{
	max-width: 262px;
    flex-direction: column;
    overflow: hidden;
    margin: 7px 10px;
    border-radius: 6px;
    box-shadow: 0 0 5px 0 #000000;
    background-image: url(https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/0/0a/EmptyWide.png);
    background-size: contain;
}

.dlcCapsule, .dlcCapsuleImageContainer {
    min-height: 150px; /*calculated height according to width*/
}

.dlcBorder {
    width: 100%;
    height: 100%;
    background: url(https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/f/fa/BorderEffect.png);
    background-size: contain;
    z-index: 3;
    pointer-events: none
}

.dlcLightEffect {
    width: 100%;
    height: 100%;
    background: url(https://static.wikia.nocookie.net/deadbydaylight_gamepedia_en/images/1/1a/LightEffect.png);
    background-size: contain;
    mix-blend-mode: overlay;
    position: absolute;
    z-index: 2;
    pointer-events: none
}

.dlcCpasuleImg {
    z-index: 1;
    transition: 0.1s;
}
.dlcCpasuleImg img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
}

.dlcLink{
    position: absolute;
    width: 100%;
    text-align: center;
    bottom: -47px;
    transition: 0.2s;
    z-index: 2;
}

.dlcLink a {
    width: 100%;
    background: rgba(62,54,25,0.5);
    font-family: 'Roboto',sans-serif;
    font-size: 80%;
    font-weight: 600;
    text-transform: uppercase;
}
.dlcCapsule:hover .dlcLink {
    bottom: 0;
}
.dlcCapsule:hover .dlcCpasuleImg {
    filter: saturate(1.3) brightness(1.1);
}

.dlcLink a:hover {
    background: rgba(0,0,0,0.65);
    color: #ffffff;
}

/*END DLC section(s)*/
.charLink{
	position: inherit;
	top: 48px;
	transition: 0.2s;
	z-index: 2;
}

.realmLink{
	position: relative;
	height: 200px;
	z-index: 2;
    background: rgba(62, 54, 25, 0.6);
    transition: 0.2s;
    top: 177px;
}

.cell:hover .image{
	filter: saturate(1.3) brightness(1.2);
}

.cell:hover .charLink{
	top: -50px;
}

.cell:hover .realmLink{
	top: 0
}

.fplink.image .killerLink > a {
	background: #3c0a0a94;
	color: #f13333;
} 

.fplink.image .killerLink > a, .fplink.image .survivorLink > a{
	text-shadow: 0 0 3px black;
}

hr.shadow{
	border-bottom: 0px solid #6c652c;
    margin: 0px;
    box-shadow: 0 0px 5px 3px #00000066;
}
.realmLink.link > .mapLinks a{
	background: transparent;
	padding: 6.7px 0px;
	transition: 0.08s;
	/*
	transition: 0.2s;
	background-image: linear-gradient(to right, rgb(62 54 25 / 50%) 50%, #0000006e
	50%);
    background-size: 200% 100%;
    */
}

.realmLink.link > .mapLinks a:hover{
	background: #0000005e;
	text-decoration: none;
}
.pastEvents {
    text-align: left;
}
/* END MAIN PAGE */

/* Classic editor Syntax highlight */
.page-content pre{
	border: none;/*2px dashed #2e2e2e;*/
}
[class*="cm-mw-"]{
	color: #e6e6e6 !important;
	text-decoration: none;
	font-size: revert !important;
    font-weight: normal;
}
/* END Classic editor Syntax highlight */

/*SwitchBox For Perk Desc*/
.switchArea{
	/*background-color: #332500;*/
    width: 10px;
    height: 10px;
    position: relative;
    float: right;
    top: -4pt; /*Based on inner padding of td in table*/
    left: 8pt;
}

.switchBox{
	margin: 0;
	background-color: red;
    width: 10px;
    height: 10px;
    position: relative;
    float: right;
    top: -4pt; /*Based on inner padding of td in table*/
    left: -10000px;
    transition: 0s;
    transition-delay: 2s;
}

.switchArea:hover ~ .switchBox {
    transition-delay: 1s;
    left: 8pt;
}
.switchBox:checked{
	left: 8pt; /*Based on inner padding of td in table*/
}

.switchBox:checked ~ .rawPerkDesc{
  display: unset !important; /* as soon as there will be Mobile.css, remove the !important and get rid of element styling (display: none;)*/
}

.rawPerkDesc{
	display: none;
}

.switchBox:checked ~ .formattedPerkDesc{
	display: none;
}
/*END SwitchBox For Perk Desc*/
/*Tooltip styles*/
.tooltip-value{
	cursor: help;
	border-bottom: 2px dotted;
	border-color: #535353;
}
.tooltip-value > .mobileView{
	font-size: 7pt;
}
/*END Tooltip styles*/
/*Checkmark Yes/No - in table*/
td .yesNo {
    display: flex;
    justify-content: center;
    padding-bottom: 5px;
}
/*END Checkmark Yes/No*/

.clr{
	text-shadow: 0 2px #000000cc;
}

/*Character Pages (Killers, Survivors)*/
.charInfoboxTable .charInfoboxImage img{
    /*width: 215px;*/ /*Width and height shouldn't be needed as the dimensions are set via image parameter itself in Module:Killers -> resolveKillerCharTable() and Module:Survivrs -> resolveSurvivorCharTable() */
    /*height: 215px;*/
    -webkit-filter: drop-shadow(5px 5px 5px #000);
}

		/*************************/
		/*  EXTENSION CSS EDITS  */
		/*************************/
/* Forms page */
.fieldBox { 
    background: #323232 !important; /*changing the light background to dark one so the text inside is readable*/
}
/* END - Forms page - END */

/*Decom Loadout*/
tr.decom th, tr.decom td,
tr.unused th, tr.unused td{ /*parent's CSS needs to be se to relative in order to make work position absolute in ::before element*/
    position: relative;
}

tr.decom th::before, tr.decom td::before,
tr.unused th::before, tr.unused td::before{
    content: "";
    height: 100%;
    width: 100%;
    position: absolute;
    background: #18181882;
    z-index: 1;
    top: 0;
    left: 0;
    pointer-events: none;
}

.decom .game-element-container {
    position: relative;
    z-index: 0;
}

/* not sure if we want this - it will exempt the Decom note from greying out but iconlink (icon iteself) with tooltip as well
.decom span.tooltip {
    z-index: 1;
}
*/
/* END - Decom Loadout - END */
Community content is available under CC BY-NC-SA unless otherwise noted.
More Fandoms