.rainfall-0 {
    background-color: #ffffff;
}

.rainfall-1 {
    background-color: rgb(247, 251, 255);
}

.rainfall-2 {
    background-color: rgb(225, 237, 248);
}

.rainfall-3 {
    background-color: rgb(202, 222, 240);
}

.rainfall-4 {
    background-color: rgb(171, 207, 230);
}

.rainfall-5 {
    background-color: rgb(130, 186, 219);
}

.rainfall-6 {
    background-color: rgb(89, 161, 207);
}

.rainfall-7 {
    background-color: rgb(55, 135, 192);
}

.rainfall-8 {
    background-color: rgb(28, 106, 175);
}

.rainfall-9 {
    background-color: rgb(11, 77, 148);
}

.rainfall-10 {
    background-color: rgb(8, 48, 107);
}

.sewage-0 {
    background-color: #ffffff;
}

.sewage-1 {
    background-color: #f7a974;
}

.sewage-2 {
    background-color: #fda863;
}

.sewage-3 {
    background-color: #d44a04;
}

.sewage-4 {
    background-color: #d44a04;
}

.sewage-5 {
    background-color: #842904;
}

.sewage-6 {
    background-color: #842904;
}

.offline-1 {
    background-color: rgba(151, 151, 151, 0.6);
}

.offline-2 {
    background-color: rgba(128, 128, 128, 0.7);
}

.offline-3 {
    background-color: rgba(96, 96, 96, 0.9);
}

.offline-4 {
    background-color: #434343;
}

.offline-5 {
    background-color: #2f2f2f;
}

.offline-6 {
    background-color: #222222;
}

.problem-1 {
    background-color: rgb(122, 90, 231);
}

.problem-2 {
    background-color: rgb(108, 80, 210);
}

.problem-3 {
    background-color: rgb(85, 64, 169);
}

.problem-4 {
    background-color: rgb(68, 51, 132);
}

.problem-5 {
    background-color: rgb(57, 42, 109);
}

.problem-6 {
    background-color: rgb(57, 42, 109);
}