.bg-rect {
    fill: #efefef;
}

.non-matches {
    fill: #81c784;
}

/* .non-matches:hover {
    fill: #81c784;
    opacity: 0.8;
} */

.dataset {
    position: relative;
}

.overlap {
    z-index: -1;
    fill: #78909c;
}

.matches {
    fill: #e57373;
}

.matches-hovered {
    fill: #e57373;
    opacity: 0.8;
}

.hovered {
    fill: #97aeba;
}

.title {
    font-size: 22px;
    font-family: "Roboto", "Helvetica", Arial, sans-serif;
    -moz-osx-font-smoothing: grayscale;
    font-weight: normal;
    fill: #303030;
    text-align: center;

}

.xAxis path {
    display: none;
}

.xAxis line {
    display: none;
}

.xAxis text {
    font-size: 12px;
    font-family: "Roboto", "Helvetica", Arial, sans-serif;
    -moz-osx-font-smoothing: grayscale;
    fill: #777;
}

.ytitle {
    font-family: "Roboto", "Helvetica", Arial, sans-serif;
    -moz-osx-font-smoothing: grayscale;
    overflow: hidden;
    fill: #777;
}

.legend {
    font-size: 12px;
    font-family: "Roboto", "Helvetica", Arial, sans-serif;
    -moz-osx-font-smoothing: grayscale;
    fill: #777;
}