@charset "UTF-8";
/* CSS Document */

body {
    font-size: 14px;
    background-color: black;
    color: white;
}

body.front {
    background-color: white;
    color: black;
}


.data { font-weight: bold; }

.col { white-space: nowrap; }

.number { text-align: right; }

.duration { color: #C4D600; }
.distance { color: #0085CA; }
.laptime { color: #008500; }
.pace { color: #f28c00; }


.distance { color: #0085CA; }
.runs { color: #883333; }

.header {
    font-weight: bold;
    background: #222222;
    color: #888888;
}

/* .foobar { color: #FF8800; font-size: 8px; } */

.data { border-bottom: solid 1px #333333; }

@media (min-width: 256px) {
    body { font-size: 12px; }
    .foobar { font-size: 12px ; color: #000088; }
    .header { letter-spacing: 1px; font-size: 16px; }
}
@media (min-width: 768px) {
    body { font-size: 12px; }
    .foobar { font-size: 20px; color: #008800; }
    .header { letter-spacing: 1px; font-size: 16px; }
}

@media (min-width: 902px) {
    body { font-size: 48px; }
    .foobar { font-size: 36px; color: #FF8800; }
    .header { letter-spacing: 3px; font-size: 24px; }
}

@media (min-width: 1600px) {
    body { font-size: 72px; }
    .foobar { font-size: 48px; color: #CCCCCC; }
    .header { letter-spacing: 4px; font-size: 32px; }
}


/*
.rank-1 { background: #CFB53B; color: black; }
.rank-2 { background: #E6E8FA; color: black; }
.rank-3 { background: #8C7853; color: black; }
*/