body {
    font-size: smaller;
}

div.nav-item.races a,
div.nav-item.parkruns a,
div.nav-item.orienteering a {
    padding-left: 0.6em;
}

.highlight {
    color: #05285e;
    font-weight: bold;
}

button + button {
    margin-left: 1em;
}

div.boxes {
    text-align: center;
}

    div.boxes div.box {
        background-color: #f5fcfc;
        border: 1px solid #d3d3d3;
        border-radius: 0.75em;
        display: inline-block;
        margin: 0.5em;
    }

        div.boxes div.box div.header {
            color: #05285e;
            font-size: 1.1em;
            font-weight: bold;
        }

        div.boxes div.box div.body {
            background-color: #ffffff;
            border: 1px solid #d3d3d3;
            border-width: 1px 0;
        }

            div.boxes div.box div.body div.title {
                color: #05285e;
                font-size: 1.5em;
            }

        div.boxes div.box div.footer {
            color: #828080;
        }

    div.boxes.personal-best {
        margin-bottom: 1em;
    }

        div.boxes.personal-best.race div.box {
            min-width: 13em;
        }

        div.boxes.personal-best.parkrun div.box {
            min-width: 15em;
        }

table.activities th, table.activities td {
    padding: 0.25rem;
}

    table.activities th.event, table.activities td.event,
    table.activities th.distance, table.activities td.distance,
    table.activities th.time, table.activities td.time,
    table.activities th.pace, table.activities td.pace,
    table.activities th.age-grade, table.activities td.age-grade,
    table.activities th.score, table.activities td.score {
        text-align: center !important;
    }

    table.activities th.rank, table.activities td.rank {
        min-width: 15em;
    }

    table.activities.races th.event, table.activities.races td.event,
    table.activities th.location, table.activities td.location,
    table.activities th.pace, table.activities td.pace,
    table.activities th.age-grade, table.activities td.age-grade,
    table.activities th.rank, table.activities td.rank,
    table.activities th.score, table.activities td.score {
        display: none;
    }

        table.activities td.rank div.progress {
            background-color: #ffffff;
            border: 1px solid #d3d3d3;
        }

        table.activities td.rank div.progress-bar {
            background-color: #4b75b4;
        }

            table.activities td.rank div.progress-bar.rank-1 {
                background-color: #d4af37;
            }

            table.activities td.rank div.progress-bar.rank-2 {
                background-color: #c0c0c0;
            }

            table.activities td.rank div.progress-bar.rank-3 {
                background-color: #cd7f32;
            }

table.activities th {
    background-color: #000000;
}

table.activities.races th {
    background-color: #e4313180;
}

table.activities.parkruns th {
    background-color: #298c80;
}

table.activities.orienteering th {
    background-color: #f76d2280;
}

table.activities tr.run {
    background-color: #cd56ce20;
}

    table.activities tr.run.race {
        background-color: #e4313120;
    }

        table.activities tr.run.race.trail {
            background-color: #8c6f1220;
        }

    table.activities tr.run.parkrun {
        background-color: #298c1120;
    }

    table.activities tr.run.orienteering {
        background-color: #f76d2220;
    }

    table.activities tr.run.hashing {
        background-color: #7a431a20;
    }

    table.activities tr.run.social {
        background-color: #551a8b20;
    }

    table.activities tr.run.training {
        background-color: #488abc20;
    }

table.activities tr.walk,
table.activities tr.hike {
    background-color: #1fc0cb20;
}

table.activities tr.climb {
    background-color: #cf751320;
}

div.activity.details div.note,
div.activity.details span.pace {
    font-style: italic;
}

div.activity.import {
    max-width: 50em;
}

    div.activity.import nav {
        margin: 1em 0;
    }

div.login {
    max-width: 40em;
}

    div.login div.username,
    div.login div.password {
        margin-bottom: 0.5em;
        font-size: medium;
    }

    div.login button.login {
        margin: 0.5em 0 1em;
    }

div.alert.error {
    max-width: 40em;
}

    div.alert.error p {
        margin: 0;
    }

@media screen and (min-width: 600px) {
    table.activities th.pace, table.activities td.pace {
        display: revert;
    }
}

@media screen and (min-width: 700px) {
    table.activities th.location, table.activities td.location,
    table.activities th.age-grade, table.activities td.age-grade {
        display: revert;
    }
}

@media screen and (min-width: 800px) {
    table.activities.races th.event, table.activities.races td.event,
    table.activities th.rank, table.activities td.rank,
    table.activities th.score, table.activities td.score {
        display: revert;
    }
}