table.details {
    float: left;
    width: 100%;
}

    table.details a {
        text-decoration: underline;
    }

    table.details .date {
        width: 14%;
    }

    table.details .event-location {
        width: 47%;
    }

        table.details .event-location .note,
        table.details .event-location .location {
            font-style: italic;
        }

    table.details .distance,
    table.details .time,
    table.details .pace {
        width: 12%;
    }

    table.details .links {
        width: 3%;
    }

    table.details .note {
        font-size: smaller;
    }
        table.details .note:before {
            content: '(';
        }
        table.details .note:after {
            content: ')';
        }

img.aside {
    display: none;
}

.legend,
.comparison-bar {
    color: #f0f0f0;
}

.run-race-road {
    color: #ff0000;
}

.run-race-trail {
    color: #8c6f12;
}

.run-parkrun {
    color: #298C11;
}

.run-training {
    color: #488abc;
}

.run-social {
    color: #551a8b;
}

.run-hashing {
    color: #7a431a;
}

.run-orienteering {
    color: #f76d22;
}

.run-general {
    color: #cd56ce;
}

.comparison .type-run-race-road {
    background-color: #ff0000 !important;
}

.comparison .type-run-race-trail {
    background-color: #8c6f12 !important;
}

.comparison .type-run-parkrun {
    background-color: #298C11 !important;
}

.comparison .type-run-training {
    background-color: #488abc !important;
}

.comparison .type-run-social {
    background-color: #551a8b !important;
}

.comparison .type-run-hashing {
    background-color: #7a431a !important;
}

.comparison .type-run-orienteering {
    background-color: #f76d22 !important;
}

.comparison .type-run-general {
    background-color: #cd56ce !important
}

@media screen and (min-width: 790px) {
    table.details .event-location .location {
        font-style: initial;
    }
}

@media screen and (min-width: 1200px) {
    table.details {
        float: left;
        width: 71%;
    }

        table.details .date {
            width: 16%;
        }

        table.details .event-location {
            width: 57%;
        }

        table.details .distance,
        table.details .time,
        table.details .pace {
            width: 8%;
        }

        table.details .links {
            width: 3%;
        }

    img.aside {
        float: right;
        display: initial;
        width: 28%;
    }
}