.match-summary {
    padding: 1rem;
    flex: 1 100%;
    width: 100%;
    border: 1px solid #C5C5C5;
    margin-bottom: 1rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.round-info {
    font-size: .875rem;
    text-align: center;
    margin-bottom: .5rem;
}

.round-info a:not(:hover) {
    color: var(--font-color);
}

.match-scores {
    display: grid;
    grid-gap: 2rem;
    grid-template-columns: minmax(0, 1fr) 5.625rem  minmax(0, 1fr);
    justify-content: center;
    width: 100%;
    font-weight: 600;
}

.match-scores__match-cell__team {
    flex-direction: column;
    justify-content: center;
    min-width: 0;
    flex: 1 0 0;
    display: flex;
    align-items: center;
    font-weight: 600;
}

.match-scores__match-cell__team__name {
    text-align: center;
    margin: .5rem 0;
}

.match-scores__match-cell__score {
    display: flex;
    justify-content: center;
    font-weight: 600;
    flex-direction: column;
}

.score-board {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}

.score-board--total {
    background:
        linear-gradient(27deg, #151515 5px, transparent 5px) 0 5px,
        linear-gradient(207deg, #151515 5px, transparent 5px) 10px 0px,
        linear-gradient(27deg, #222 5px, transparent 5px) 0px 10px,
        linear-gradient(207deg, #222 5px, transparent 5px) 10px 5px,
        linear-gradient(90deg, #1b1b1b 10px, transparent 10px),
        linear-gradient(#1d1d1d 25%, #1a1a1a 25%, #1a1a1a 50%, transparent 50%, transparent 75%, #242424 75%, #242424);
    background-color: #131313;
    background-size: 20px 20px;
    font-size: 1.4em;
    padding: .75rem;
    border-top-left-radius: .12em;
    border-top-right-radius: .12em;
    font-variant-numeric: lining-nums;
    color: #C9D900;
}

.score-board--subscore {
    color: var(--font-color--light);
    padding: .5rem
}

.score-board--subscore::after {
    content: '';
    display: block;
    position: absolute;
    bottom: 0;
    width: 50%;
    left: 25%;
    border-bottom: 2px solid var(--font-color--light);
}

.score-board .score-board__score {
    text-align: right;
}

.score-board .score-board__divider {
    padding: 0 .25em;
}

.match-events {
    width: 100%;
}

.match-event {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, max-content)  minmax(0, 1fr);
    grid-template-areas: "detail-home score detail-away";
    grid-gap: .5rem;
    justify-content: center;
    width: 100%;
    text-align: center;
    margin: .5rem 0;
}

.match-event__score {
    grid-area: score;
}

.match-event__detail {
    display: flex;
    column-gap: .5rem;
    justify-content: flex-end;
    align-items: center;
}

.match-event--home .match-event__detail{
    grid-area: detail-home;
}

.match-event--away .match-event__detail{
    grid-area: detail-away;
    flex-direction: row-reverse;
}

.match-event__minute {
    color: var(--primary-color);
    font-weight: 600;
    font-size: 0.875rem;
}

.match-event__minute::after {
    content: "'";
}

.match-event__score {
    font-weight: 600;
    letter-spacing: .2rem;
}

.match-lineup__team {
    padding: 1rem;
}

.match-lineup__team__headline {
    display: flex;
    align-items: center;
    column-gap: 1rem;
    margin-bottom: 1rem;

}

.match-lineup__team__headline__teamname {
    font-weight: 600;
}

.match-lineup__players__position {
    display: inline;
}
.match-lineup__players__position+.match-lineup__players__position::before {
    content: ' - '
}

.match-lineup__players__position__player {
    display: inline;
}

.match-lineup__players__position__player+.match-lineup__players__position__player::before {
    content: ', '
}

.match-ticker {
    width: 100%;
}

