.rankingitem {
    display: block;
    box-shadow: var(--shadow);
    padding: var(--padding) var(--padding-double);
    margin-bottom: var(--padding);
    transition: var(--transition-shadow);
    color: var(--black);
    position: relative;
}


.rankingitem:hover {
    background-color: var(--white-grey)
}

.rankingnumber {
    border-right: 1px solid var(--grey);
    font-size: 4rem;
    padding-right: var(--padding);
    font-weight: bold;
    color: var(--grey);
    height: 100%;
}

.rankingitem.first {
    background-color: var(--grey-dark)
}

.rankingitem.second {
    background-color: var(--grey)
}

.rankingitem.third {
    background-color: var(--grey-light)
}

.rankingitem.toprankingitem,
.rankingitem.ownranking {
    color: var(--white)
}

.rankingitem.toprankingitem,
.rankingitem.ownranking,
.rankingitem.toprankingitem .rankingnumber,
.rankingitem.ownranking .rankingnumber {
    color: var(--white);
}

.rankingitem.toprankingitem .rankingnumber,
.rankingitem.ownranking .rankingnumber {
    border-right-color: var(--white)
}

.rankingitem.ownranking {
    background: var(--blue);
}

.rankingitem.ownranking:hover {
    background-color: var(--blue-hover)
}

.rankingitem .points {
    font-size: clamp(3rem, 5vw, 6rem);
    color: var(--grey);
    font-weight: bold;
    line-height: 1;
}

.rankingitem.toprankingitem .points,
.rankingitem.ownranking .points {
    color: var(--white)
}

/** ORDEN **/
.orden svg {
    filter: drop-shadow(0 0 2px rgba(0, 0, 0, .5))
}

.orden svg .orden-blue {
    transition: transform ease .25s
}

.orden:hover svg .orden-blue {
    transform: translateY(-5%)
}

.orden-outline {
    fill: var(--grey-light);
}

.orden-grey {
    fill: var(--grey-medium);
}

.orden-blue {
    fill: url(#SVGID_1_);
}

.orden svg {
    opacity: .3
}

.orden.active svg {
    opacity: 1
}

.rankingitem.checking:before { content:''; position: absolute; inset:0px; background: rgba(255,255,255,.5)}

.rankinglabel {
    position: absolute;
    right: 15px;
    top: 0;
    background: var(--grey-dark);
    font-size: 12px;
    padding: 5px 10px;
    box-shadow: 0 0 5px black;
}
