@import url('https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@400;700;900&display=swap');

html {
    -webkit-text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased;
}

body {
    font-family: 'Source Sans Pro', sans-serif;
}

.bg-prussian {
    background-color: #013369
}

.bg-palatinate {
    background-color: #1B48E0
}

.bg-redsurrection {
    background-color: #d50a0a
}

.btn {
    font-weight: 700
}

.btn-lg {
    padding: 10px 16px;
}

.btn-palatinate {
    background-color: #004fff;
    border-color: #1B48E0;
    color: #fff;
}
    .btn-palatinate:hover {
        background-color: #1B48E0;
        border-color: #1B48E0;
        color: #fff;
    }

.btn-redsurrection {
    background-color: #d50a0a;
    border-color: #d50a0a;
    color: #fff;
}
    .btn-redsurrection:hover {
        background-color: #980000;
        border-color: #980000;
        color: #fff;
    }
.team {
    padding: 10px;
}
    .team .team-name {
        line-height: 1.1;
    }
    .team-state {
        color: #212529;
        opacity: .5
    }

.card-picked .team-selected {
    background-color: #004fff;
    border-radius: .5rem;
    color: #fff;
}

.team-disabled {
    background-color: #cfcfcf;
    border-radius: .5rem;
    color: #fff;
}

    .card-picked .team-selected .team-state {
        color: white;
        opacity: .5
    }

.selectteam label {
    border-radius: 0.5rem;
    margin: 0;
    cursor: pointer;
    line-height: 1.1;
}
.selectteam input:checked + label {
    background-color: #004fff;
    color: #fff;
}
    .selectteam input:checked + label .team-state {
        color: white;
        opacity: .5
    }

.svg-prussian {
    filter: invert(15%) sepia(29%) saturate(4365%) hue-rotate(194deg) brightness(99%) contrast(104%);
}
.svg-palatinate {
    filter: invert(19%) sepia(70%) saturate(4275%) hue-rotate(227deg) brightness(92%) contrast(91%);
}

.svg-redsurrection {
    filter: invert(12%) sepia(96%) saturate(4610%) hue-rotate(356deg) brightness(91%) contrast(101%);
}
.svg-success {
    filter: invert(67%) sepia(57%) saturate(7403%) hue-rotate(90deg) brightness(112%) contrast(112%);
}

.text-prussian {
    color: #013369
}

.text-palatinate {
    color: #1B48E0
}

.text-redsurrection {
    color: #d50a0a
}