h1 {
	font-size: 1.6em;
}

h2 {
	font-size: 1.4em;
}

h3 {
	font-size: 1.2em;
}

.center {
    text-align: center;
}

.teamName {
    font-size: 1.2em;
    font-weight: bold;
}

.big-badge {
    font-size: 15px;
}

/* bet and result pages: one card per team (crest, name, goal input), separated by a colon */
.match-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    gap: .5rem;
}

.match-head-team {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .5rem;
    text-align: center;
}

.match-head-team .teamName {
    overflow-wrap: anywhere;
}

.match-head-separator {
    align-self: center;
    font-size: 2rem;
    font-weight: bold;
    line-height: 1;
    color: var(--bs-secondary-color);
}

/* same box for every crest, whatever its aspect ratio; the shadow outlines white flags */
img.big-flag {
    width: 5rem;
    height: 4rem;
    object-fit: contain;
    filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .35));
}

@media (max-width: 575.98px) {
    img.big-flag {
        width: 3.5rem;
        height: 2.75rem;
    }

    .match-head .card-body {
        padding: .5rem;
    }
}

.badge-penalty-winner-bet {
    background: -webkit-repeating-linear-gradient(180deg, #5CB85C, black 30%); /* For Safari 5.1 to 6.0 */
    background: -o-repeating-linear-gradient(180deg, #5CB85C, black 30%); /* For Opera 11.1 to 12.0 */
    background: -moz-repeating-linear-gradient(180deg, #5CB85C, black 30%); /* For Firefox 3.6 to 15 */
    background: repeating-linear-gradient(180deg, #5CB85C, black 30%); /* Standard syntax (must be last) */
}

.badge-penalty-winner-match {
    background: -webkit-repeating-linear-gradient(180deg, #5BC0DE, black 30%); /* For Safari 5.1 to 6.0 */
    background: -o-repeating-linear-gradient(180deg, #5BC0DE, black 30%); /* For Opera 11.1 to 12.0 */
    background: -moz-repeating-linear-gradient(180deg, #5BC0DE, black 30%); /* For Firefox 3.6 to 15 */
    background: repeating-linear-gradient(180deg, #5BC0DE, black 30%); /* Standard syntax (must be last) */
}

/* team crests in match lists: same box for every crest, whatever its aspect ratio */
img.crest-small {
    width: 1.5em;
    height: 1.5em;
    object-fit: contain;
    vertical-align: middle;
}

/* points of a bet, coloured by how good the bet was (fragments/points_badge.html) */
.points-badge {
    min-width: 2.5rem;
}

.points-correct-result {
    background-color: var(--bs-success);
}

.points-same-goal-difference {
    background-color: var(--bs-teal);
}

.points-correct-winner {
    background-color: var(--bs-warning);
    color: var(--bs-dark);
}

.points-correct-number-of-goals-one-team {
    background-color: var(--bs-orange);
}

.points-none {
    background-color: var(--bs-secondary);
}

.points-pending {
    background-color: transparent;
    color: var(--bs-secondary-color);
    border: 1px dashed var(--bs-border-color);
}