body {
    background-color: #fff;
}

canvas {
    max-height: 80vh;
}

a {
    font-family: sans-serif;
    color: white;
    font-size: 18px;
}

h1 {
    font-family: sans-serif;
    color: white;
    font-size: 36px;
}

path {
    fill: none;
    stroke: #000;
    stroke-linejoin: round;
    stroke-linecap: round;
}

div {
    border: 1px solid #333333;
}

.county {
    fill: purple
}

.highlighted {
    stroke-width: 3px;
}

.dem-selected {
    fill-opacity: 1;
    fill: #00f;
}

.rep-selected {
    fill-opacity: 1;
    fill: #f00;
}

.dem-stable {
    fill-opacity: 1;
    fill: #2c7bb6;
}

.rep-stable {
    fill-opacity: 1;
    fill: #d7191c;
}

.dem-swing {
    fill-opacity: 1;
    fill: #abd9e9;
}

.rep-swing {
    fill-opacity: 1;
    fill: #fdae61;
}