:root {
    --bs-body-bg: #00000044;
}

a,.nav-link {
    color: #83b1e1;
}
body2 {
    background-image: url(https://cdn.tlidb.com/image/ss12_bg.webp);
    /*height: 100%;
    width: 100%;*/
    background-size: contain;
    z-index: -1;
}
.background-image {
    position: fixed;
    left: 0;
    right: 0;
    background-image: url(https://cdn.tlidb.com/image/ss12_bg.webp);
    height: 100%;
    /*width: 100%;*/
    filter: brightness(20%);
    z-index: -1;
    background-size: cover;
    background-position: center center;
}

#toTop {
    display: none;
    position: fixed;
    bottom: 5px;
    right: 5px;
    opacity: 0.4;
    filter: alpha(opacity=40); /* For IE8 and earlier */
}
#toTop:hover {
    opacity: 0.8;
    filter: alpha(opacity=80); /* For IE8 and earlier */
}
.card {
    /*--bs-bg-opacity: 1;*/
    background-color: var(--bs-body-bg) !important;
}
e, .hyperlink {
    color: #00ffff;
}
.card-body img:hover {
    background-color: #121212;
}
.card-body img {
    max-width: 100%;
}
.card-header {
    background: transparent;
    border-bottom: 0;
}

.item_rarity2 {
    color: lightskyblue;
}
.item_rarity3 {
    color: #9810d5;
}
.item_rarity100,.item_rarity4 {
    color: #ffc130;
}
small.description {
    color: darkgrey;
    display: none;
}
.text-mod {
    color: #84ff16;
}
.corroded-mod,.t0 {
    color: #6986ff;
}
.ui_item {
    border-bottom-left-radius: 20px;
    border-top-right-radius: 20px;
}
img.ui_char_base {
    width: 128px;
    height: 128px;
    border-bottom-left-radius: 15%;
    border-top-right-radius: 15%;
}
img.ui_item_base {
    width: 90px;
    height: 128px;
    border-bottom-left-radius: 15%;
    border-top-right-radius: 15%;
}
img.ui_item_base {
    width: 90px;
    height: 128px;
    border-bottom-left-radius: 15%;
    border-top-right-radius: 15%;
}
img.ui_item_quality1 {
    background: linear-gradient(rgb(48, 48, 48) 0%, rgb(184, 184, 184) 100%);
    padding: 4px;
    border-bottom: 3px solid white;
}
img.ui_item_quality2 {
    background: linear-gradient(rgb(48, 48, 48) 0%, rgb(34, 170, 221) 100%);
    padding: 4px;
    border-bottom: 3px solid #80e7ff;
}
img.ui_item_quality3 {
    background: linear-gradient(rgb(48, 48, 48) 0%, rgb(145, 25, 179) 100%);
    padding: 4px;
    border-bottom: 3px solid #df8ffe;
}
img.ui_item_quality110 {
    background: linear-gradient(rgb(48, 48, 48) 0%, rgb(113, 33, 36) 100%);
    padding: 4px;
    border-bottom: 3px solid #f44336;
}
img.ui_item_quality100,img.ui_item_quality4 {
    background: linear-gradient(rgb(48, 48, 48) 0%, rgb(221, 110, 37) 100%);
    padding: 4px;
    border-bottom: 3px solid #f5be75;
}
img.ui_item_quality5 {
    background: linear-gradient(rgb(48, 48, 48) 0%, rgb(255, 0, 0) 100%);
    padding: 4px;
    border-bottom: 3px solid #f5be75;
}
img.size32.ui_item_quality1, img.size32.ui_item_quality2, img.size32.ui_item_quality3, img.size32.ui_item_quality4, img.size32.ui_item_quality100 {
    width: 32px;
    height: 32px;
    padding: 0;
    border-bottom: 0;
}
.rarityMagic {
    background: linear-gradient(to right, #292f7c 0%, #273d91 60%, #3664b8 100%);
}
.rarityRare {
    background: linear-gradient(to right, #591895 0%, #6a18aa 60%, #ad20de 100%);
}
.rarityLegendary {
    background: linear-gradient(to right, #b66916 0%, #e9ba19 60%, #f1d21e 100%);
}
.rarityRainbow {
    background: linear-gradient(to right, #0d8add 0%, #db4cbd 50%, #fddd97 100%);
}
.list-group-item {
    background: transparent;
}
li.t1,li.t0 {
    list-style-image: url(https://cdn.tlidb.com/image/item/t1.webp);
}
ul.affix {
    margin: 0;
    padding-left: 1rem;
}

.card.popupItem {
    margin-top: 64px;
}
.card.popupItem div.icon {
    margin-top: -64px;
    z-index: 2;
}
.card.popupItem div.pactspirit {
    width: 128px;
    height: 128px;
    background-repeat: no-repeat;
    background-position: top center;
    /*background-position-y: -10px;*/
    background-size: cover;
}
.pactspirit_bg {
    background-repeat: no-repeat;
    background-position: right bottom;
    position: absolute;
    height: 100%;
    width: 100%;
    z-index: -1;
    filter: brightness(20%);
}
.card.popupItem div.banner {
    margin-top: -64px;
    padding-top: 67px;
    border-top-right-radius: 20px;
}
.card.popupItem div.banner1 {
    background: linear-gradient(180deg, rgb(54 54 54) 20%, rgba(0 0 0 / 0%) 100%);
}
.card.popupItem div.banner2 {
    background: linear-gradient(180deg, rgb(36 60 76) 20%, rgba(0 0 0 / 0%) 100%);
}
.card.popupItem div.banner3 {
    background: linear-gradient(180deg, rgb(68 36 68) 20%, rgba(0 0 0 / 0%) 100%);
}
.card.popupItem div.banner100 {
    background: linear-gradient(180deg, rgb(100 53 28) 20%, rgba(0 0 0 / 0%) 100%);
}
.card.popupItem div.banner110 {
    background: linear-gradient(180deg, rgb(113 33 36) 20%, rgba(0 0 0 / 0%) 100%);
}
.card.popupItem div.bannerskill {
    background: linear-gradient(180deg, rgb(36 62 181) 20%, rgba(0 0 0 / 0%) 100%);
}
span.tag {
    color: #bfc1c3;
    border-bottom-left-radius: 15%;
    border-top-right-radius: 15%;
}
.tlborder {
    border-bottom-left-radius: 15%;
    border-top-right-radius: 15%;
}
.card.popupItem div.circle-icon {
    border-radius: 50%;
    width: 128px;
    height: 128px;
    background: black;
}
img.size24 {
    width: 24px;
    height: 24px;
}
img.item_mini_icon, img.size32 {
    width: 32px;
    height: 32px;
}
img.size48 {
    width: 48px;
    height: 48px;
}
img.size64 {
    width: 64px;
    height: 64px;
}
img.pactspirit_smallicon {
    width: 128px;
    height: 206px;
}
img.size96,div.size96 {
    width: 96px;
    height: 96px;
}
img.size128 {
    width: 128px;
    height: 128px;
}
img.preview {
    max-height: 128px;
}
img.width64 {
    width: 64px;
}

div.tooltip-inner span.text-mod
{
    /*color: darkblue;*/
}
.tooltip-inner {
    width: 450px;
    max-width: 450px !important;
    background-color: #222;
    box-shadow: 0px 0px 4px black;
    opacity: 1 !important;
    color: white;
}
.tooltip.show {
    opacity: 1 !important;
}
.tippy-box {
    font-size: initial;
    max-width: 450px !important;
    background-color: transparent;
}
.tippy-box .popupItem {
    background-color: #222 !important;
}

.dropdown-item {
    background-color: #222;
}
.btn-primary {
  --bs-btn-bg: #375a82;
  --bs-btn-border-color: #375a82;
}
.flavorText {
    color: #dbb97c;
    font-style: italic;
}
.tierParent {
  padding-left: 1em !important;
  text-indent: -1em;
  display: inline-block;
}
span.tier {
    border-radius: 0.15em 0 0.15em 0;
    display: inline-block;
    width: 0.5em;
    height: 0.5em;
    line-height: 0.5em;
    margin-right: 0.5em;
    vertical-align: 1px;
}
span.tier.tier0 {
  background-color: #e51717;
}
span.tier.tier1 {
    background-color: #d86a23;
}
span.tier.tier2,
span.tier.tier3,
span.tier.tier4 {
  background-color: #a259ff;
}
span.tier.tier5,
span.tier.tier6,
span.tier.tier7 {
  background-color: #257ded;
}
.star {
    color: #ff3;
    /*text-shadow: 0 2px 2px rgba(0, 0, 0, 0.9), 0 -2px 2px rgba(0, 0, 0, 0.9), -2px 0 2px rgba(0, 0, 0, 0.9), 2px 0 2px rgba(0, 0, 0, 0.9);*/
}

.card.popupItem.previousItem2 .banner100 {
    background: linear-gradient(180deg, #9E9E9E 20%, rgba(0 0 0 / 0%) 100%);
}
.item_ver {
    position: absolute;
    font-size: large;
    border: 1px solid;
    padding: 2px;
}
.explicitMod {
    margin-top: 2px;
    padding-top: 2px;
    border-top: 1px solid #3e3e3e;
}
.detailsNote, .tierLevel {
    display: inline-block;
    color: #5861d4;
    padding: 0.25em 0.5em;
    border-radius: 0 0.5em 0 0.5em;
    background: linear-gradient(to bottom, #f7f7fc 0%, #c7c3ea 4.5em);
}
.popupItem .icon .level {
    position: absolute;
    top: -17px;
    left: 47%;
    color: #fff;
    font-size: 1.6em;
    text-shadow: 0 2px 2px rgba(0, 0, 0, 0.9), 0 -2px 2px rgba(0, 0, 0, 0.9), -2px 0 2px rgba(0, 0, 0, 0.9), 2px 0 2px rgba(0, 0, 0, 0.9);
}
.modifier:nth-child(even) {
    background: linear-gradient(to right, rgba(18, 18, 18, 0) 0%, rgba(18, 18, 18, 255) 49%, rgba(18, 18, 18, 0) 100%);
}
.Hyperlink {
    text-decoration: underline dotted;
    -webkit-text-decoration: underline dotted;
    text-underline-offset: 0.2em;
}
a.figure {
    text-align: center;
}
a.figure figcaption,a.figure .figcaption {
    width: 96px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}
circle.talent_bg.talent_type3 {
    stroke: #3939ed;
    stroke-width: 3px;
    fill: #9393e0;
}
circle.talent_bg.talent_type4 {
    stroke: gold;
    stroke-width: 3px;
    fill: #e6d371;
}
[data-skilltagid="Cold"] { color: #93d8ff; }
[data-skilltagid="Fire"] { color: #ff9a77; }
[data-skilltagid="Lightning"] { color: #f8cb76; }
[data-skilltagid="Attack"] { color: #da814d; }
[data-skilltagid="Defensive"] { color: #a88f67; }
[data-skilltagid="Strength"] { color: #c8676e; }
[data-skilltagid="Dexterity"] { color: #86bda3; }
[data-skilltagid="Intelligence"] { color: #a2cffb; }
[data-skilltagid="Spell"] { color: #b3f8fe; }
[data-skilltagid="Mobility"] { color: #cfeea5; }
[data-skilltagid="Erosion"] { color: #d8a7d3; }
[data-skilltagid="Physical"] { color: #c79d93; }
.card {
    border-radius: 0 20px;
}
@media only screen and (max-width: 768px) {
    .flex-shrink-0 img.ui_item_base {
        width: 80px;
        height: 80px;
    }
}
.itemQuantity::before {
    content: "x";
}
img.white-shadow {
    filter: drop-shadow(1px 1px 2px rgba(255, 255, 255, 0.7));
}
img.white-shadow:hover {
    filter: drop-shadow(1px 1px 2px rgba(0,0,0, 0.7));
}
a:hover {
    color: revert;
    text-shadow: #ffcc00 2px 0px 5px;
}
.herbList {
    padding-top: 1rem;
}
.DevicePartsAffix {
    width: 19px;
    height: 19px;
    clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
    display: inline-block;
}
.DevicePartsAffix.Tier1 {
    background-color: #616db3;
}
.DevicePartsAffix.Tier2 {
    background-color: #9351a9;
}
.DevicePartsAffix.Tier3 {
    background-color: #bf8543;
}
.character-tree {
    width: 600px;
    max-width: 100%;
}