.blur-header header {
    filter: blur(1.5px);
}

/** Tooltip */

.tooltip {
    position: relative;
}

.tooltip::after {
    background: rgba(48, 55, 66, 0.95);
    border-radius: 0.1rem;
    bottom: 100%;
    color: #fff;
    content: attr(data-tooltip);
    display: block;
    font-size: 0.7rem;
    left: 50%;
    max-width: 320px;
    opacity: 0;
    overflow: hidden;
    padding: 0.2rem 0.4rem;
    pointer-events: none;
    position: absolute;
    text-overflow: ellipsis;
    transform: translate(-50%, 0.4rem);
    transition: opacity 0.2s, transform 0.2s;
    white-space: pre;
    z-index: 300;
}

/* .tooltip.tooltip-title::after {
    content: attr(title);
} */

.tooltip:focus::after,
.tooltip:hover::after {
    opacity: 1;
    transform: translate(-50%, -0.2rem);
}

.tooltip[disabled],
.tooltip.disabled {
    pointer-events: auto;
}

.tooltip.tooltip-right::after {
    bottom: 50%;
    left: 100%;
    transform: translate(-0.2rem, 50%);
}

.tooltip.tooltip-right:focus::after,
.tooltip.tooltip-right:hover::after {
    transform: translate(0.2rem, 50%);
}

.tooltip.tooltip-bottom::after {
    bottom: auto;
    top: 100%;
    transform: translate(-50%, -0.4rem);
}

.tooltip.tooltip-bottom:focus::after,
.tooltip.tooltip-bottom:hover::after {
    transform: translate(-50%, 0.2rem);
}

.tooltip.tooltip-left::after {
    bottom: 50%;
    left: auto;
    right: 100%;
    transform: translate(0.4rem, 50%);
}

.tooltip.tooltip-left:focus::after,
.tooltip.tooltip-left:hover::after {
    transform: translate(-0.2rem, 50%);
}

/** Adjustment for tooltip - Footer License */

.footer-line span.license .tooltip::after {
    max-width: calc(100vw - 27px);
}

@media only screen and (min-width: 277px) and (max-width: 475px) {
    .footer-line span.license .tooltip::after {
        left: calc(50% - 475px / 2 + 100vw / 2);
    }
}

@media only screen and (min-width: 277px) and (max-width: 308px) {
    .footer-line span.license .tooltip::after {
        left: calc(50% - (475px / 2 - 100vw / 2) + (308px / 2 - 100vw / 2));
    }
}

@media only screen and (min-width: 253px) and (max-width: 276px) {
    .footer-line span.license .tooltip::after {
        left: calc(50% - (475px / 2 - 100vw / 2) + (308px / 2 - 100vw / 2) + 45px);
    }
}

@media only screen and (max-width: 252px) {
    .footer-line span.license .tooltip::after {
        content: none;
    }
}