/* Scatterplot style */

.name {
    float: right;
    color: #27aae1;
}

.axis {
    fill: none;
    stroke: #AAA;
    stroke-width: 1px;
}

text {
    stroke: none;
    fill: black;
    font-size: 11px;
}

.label {
    fill: #414241;
}

circle.dot:hover {
    fill: #2C3E50 !important;
}

div.tooltip {
    position: absolute;
    text-align: center;
    padding: 2px;
    background: #2C3E50;
    border: 0px;
    border-radius: 6px;
    font-size: 11px;
    color: white;
    font-family: "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif;
    pointer-events: none;
}

path {
    stroke: #2C3E50;
    stroke-width: 2;
    fill: none;
}

.axis path,
.axis line {
    fill: none;
    stroke: grey;
    stroke-width: 1;
    shape-rendering: crispEdges;
}

.lineChartMonth rect:hover {
    fill: #ffdddd;
}

.helpLine:hover {
    opacity: 0.1 !important;
}

.tooltip {
    font-weight: bold;
    background: white;
    border: 0px;
    border-radius: 4px;
}

.y.label {
    font-size: 11px;
    font-weight: normal;
}

.listLegend {
    background: linear-gradient(to right, #ffffff, #217dbb);
    height: 20px;
    border: 1px solid grey;
}

/*.mapLegend {
    background: linear-gradient(to right, #afc8e0, #2c3e50);
    height: 20px;
    border: 1px solid grey;
}*/
.mapLegend {
    background: linear-gradient(to right, #edf8b1, #2c7fb8);
    height: 20px;
    border: 1px solid grey;
}
.pathLegend {
    background: linear-gradient(to right, #afc8e0, #000000);
    height: 20px;
    border: 1px solid grey;
}

label.ng-binding {
    color: #000;
}

.verticalBarAxis line,
.verticalBarAxis path {
    fill: none;
    stroke: white;
    shape-rendering: crispEdges;
}

.verticalBar:hover {
    fill: #f39c12;
}

.d3-tip {
    line-height: 1;
    padding: 8px;
    font-family: "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 11px;
    line-height: 1.42857143;
    background: rgba(0, 0, 0, 0.8);
    color: #fff;
    border-radius: 8px;
}


/* Creates a small triangle extender for the tooltip */
}
svg.e {
    margin-left: 200px;
}
.d3-tip:after {
    box-sizing: border-box;
    display: inline;
    font-size: 10px;
    width: 100%;
    line-height: 1;
    color: #2C3E50;
    opacity: 0.8;
    position: absolute;
}

/* Eastward tooltips */
.d3-tip.e:after {
    content: "\25C0";
    margin: -4px 0 0 0;
    top: 50%;
    left: -8px;
}

/* Nrthward tooltips */
.d3-tip.n:after {
    content: "\25BC";
    margin: -1px 0 0 0;
    top: 100%;
    left: 0;
    text-align: center;
}

.btn-distanceModule {
    color: #000;
    border-color: rgba(0, 0, 0, 0.5);
    background-color: #fff;
}

.btn-distanceModule:focus,
.btn-distanceModule:hover {
    color: #000;
    border-color: rgba(0, 0, 0, 0.8);
    background-color: rgba(255, 255, 255, 0.8);
}

.btn-distanceModule-selected {
    color: #fff;
    border-color: rgba(0, 0, 0, 0.5);
    background-color: #000;
}

.btn-distanceModule-selected:focus,
.btn-distanceModule-selected:hover {
    color: #fff;
    border-color: rgba(0, 0, 0, 0.8);
    background-color: rgba(0, 0, 0, 0.8);
}