.button-tooltip {
    position: relative;
    display: block;
    z-index: 1;
    cursor: pointer
}

.button-tooltip .tooltipContainer:focus, .button-tooltip .tooltipContainer:hover, .button-tooltip:focus .tooltipContainer, .button-tooltip:hover .tooltipContainer {
    clip: auto;
    height: auto;
    width: auto;
    opacity: 1
}
.button-tooltip.win .form-abbreviation {
    background: #00db74
}
.button-tooltip.draw .form-abbreviation {
    background: #c3b3c5
}

.button-tooltip.lose .form-abbreviation {
    background: #e0005e
}

.tooltipContainer {
    position: absolute;
    bottom: 2.4rem;
    left: 50%;
    transform: translateX(-50%);
    z-index: 90;
    padding: 0 0 1rem;
    text-align: center;
    text-decoration: none;
    white-space: nowrap;
    overflow: visible;
    color: #37003c;
    opacity: 0;
    transition: .2s
}

.tooltipContainer.tooltip-left {
    left: -1.15rem;
    transform: translateX(0)
}

.tooltipContainer.tooltip-left .tooltip-content:after {
    left: .8rem
}

.tooltipContainer.tooltip-right {
    right: .1rem;
    left: auto;
    transform: translateX(0)
}

.tooltipContainer.tooltip-right .tooltip-content:after {
    right: .8rem;
    left: auto
}

.tooltipContainer .tooltip-content {
    background: #fff;
    border-radius: .3rem;
    border: .1rem solid #ebe5eb;
    position: relative;
    display: block;
    padding: .8rem
}

.tooltipContainer .tooltip-content:after {
    content: "";
    display: block;
    position: absolute;
    width: 1rem;
    height: 1rem;
    transform: rotate(45deg);
    border-right: .1rem solid #ebe5eb;
    border-bottom: .1rem solid #ebe5eb;
    background: #fff;
    bottom: -.6rem;
    left: 50%
}

.tooltipContainer .match-fixture {
    background-color: transparent;
    padding: .8rem 1rem;
    border-radius: .3rem;
    min-width: 17.8rem;
    border: none !important
}

.tooltipContainer .match-fixture:hover .icn {
    transform: none
}

.tooltipContainer .match-fixture--small:hover.match-fixture {
    background: none
}

.tooltipContainer .match-fixture [class*=arrow-right] {
    bottom: 1.8rem;
    right: 1.1rem;
    margin-bottom: 0;
    transition: transform .2s
}

.tooltipContainer .match-fixture__end-icon {
    display: none
}

.tooltipContainer.tooltip-link:focus .tooltip-content, .tooltipContainer.tooltip-link:hover .tooltip-content {
    background: linear-gradient(113.4deg, #05f0ff -5.51%, #7367ff 52.68%, #963cff 70.81%)
}

.tooltipContainer.tooltip-link:focus .tooltip-content:after, .tooltipContainer.tooltip-link:hover .tooltip-content:after {
    background: #963cff
}

.tooltipContainer.tooltip-link:focus .match-fixture, .tooltipContainer.tooltip-link:focus .match-fixture__match-info, .tooltipContainer.tooltip-link:hover .match-fixture, .tooltipContainer.tooltip-link:hover .match-fixture__match-info {
    color: #fff
}

.tooltipContainer.tooltip-link:focus .match-fixture [class*=arrow-right], .tooltipContainer.tooltip-link:hover .match-fixture [class*=arrow-right] {
    transform: scale(.7) translateX(5px);
    right: .9rem
}

.tooltipContainer.tooltip-link:focus .match-fixture__team-name, .tooltipContainer.tooltip-link:focus .match-fixture time, .tooltipContainer.tooltip-link:hover .match-fixture__team-name, .tooltipContainer.tooltip-link:hover .match-fixture time {
    color: #fff
}

.tooltipContainer.tooltip-link .tooltip-content {
    padding: 0
}

.tooltipContainer.tooltip-link .tooltip-content:focus, .tooltipContainer.tooltip-link .tooltip-content:hover {
    background: linear-gradient(113.4deg, #05f0ff -5.51%, #7367ff 52.68%, #963cff 70.81%)
}

.tooltipContainer.tooltip-link .tooltip-content:focus:after, .tooltipContainer.tooltip-link .tooltip-content:hover:after {
    background: #963cff
}

.nextMatchCol .tooltipContainer.tooltip-right {
    right: 1rem
}