style.css

.map-div {
    width: 29%;
}

.eriador {
    fill: #CDD53C;
}

.eriador:hover {
    filter: brightness(0.85);
    cursor: pointer;
}

.arnor {
    fill: #9E4126;
}

.arnor:hover {
    filter: brightness(0.85);
    cursor: pointer;
}

.rhun {
    fill: #725F49;
}

.rhun:hover {
    filter: brightness(0.85);
    cursor: pointer;
}

.mirkwood {
    fill: #A3D065;
}

.mirkwood:hover {
    filter: brightness(0.85);
    cursor: pointer;
}

.rohan {
    fill: #6cb69d;
}

.rohan:hover {
    filter: brightness(0.85);
    cursor: pointer;
}

.rhovanion {
    fill: #D2992E;
}

.rhovanion:hover {
    filter: brightness(0.85);
    cursor: pointer;
}

.gondor {
    fill: #A95011;
}

.gondor:hover {
    filter: brightness(0.85);
    cursor: pointer;
}

.mordor {
    fill: #6A702E;
}

.mordor:hover {
    filter: brightness(0.85);
    cursor: pointer;
}

.haradwaith {
    fill: #CFAA13;
}

.haradwaith:hover {
    filter: brightness(0.85);
    cursor: pointer;
}

#find {
    fill: blue;
    z-index: 99;
}