in-c4/static/c4.css

body {
    color: #f0f0f0;
    background-color: #333;
}

h1, h1 a  {
    color: #dfaa37; /* C4 Yellow */
}

.result {
    background-color: #202020;
    border-color: #4d4d4d;
}

.result:focus {
    background-color: #202020;
    border-color: #dfaa37;
    outline-color: #dfaa37;
}

.result a {
    color: #dfaa37;
}

.note {
    background-color: #333;
    font-size: smaller;
}

.btn {
  box-shadow: 0 3px 6px -1px rgba(0,0,0,0.3);
}

.btn.primary {
    color: #220;
    background-color: #dfaa37;
}

.btn.primary:hover,.btn.primary:focus {
    background-color: #f5c251;
}

.btn.grn {
    color: #020;
    background-color: #9f6;
}

.btn.grn:hover ,.btn.grn:focus {
    background-color: #3f0;
}


.btn.red {
    color: #200;
    background-color: #ec6d5f;
}

.btn.red:hover, .btn.red:focus {
    background-color: #ff7667;
}

@keyframes blinker {
    0% { opacity: 1; }
    40% { opacity: 1; }
    90% { opacity: 0; }
    100% { opacity: 1; }
}

#mapgrid {
    outline: 2px solid #dfaa37;
    background: #dfaa3780;
    animation: blinker 1s infinite;
}