.total-line { fill: none; stroke: orangered; stroke-width: 2px; z-index: -1; } .total-circle { fill: orangered; } .total-circle:hover { -webkit-filter: brightness(2.0); -moz-filter: brightness(2.0); filter: brightness(2.0); } .total-tooltip { border: orangered; } .horizontalY { /*fill : none;*/ shape-rendering: crispEdges; stroke: lightgrey; stroke-width: 1px; } .horizontalY0 { stroke-width: 0px; } #charge_table, .charge_chart{ width: 95%; } #charge_table, #charge_table th, #charge_table td { margin-top: 5em; margin-bottom: 5em; border: solid 1px lightsteelblue; } #charge_table td, #charge_table th { padding: 0.8em; } .charge_chart { background-color: #fAfAfA; border: 1pt solid black; display: inline-block; } text.legend { font-size: 12px; } rect.legend { stroke: white; stroke-width: 0.5pt; } rect.bar { stroke: lightgrey; stroke-width: 0.5pt; } rect.bar:hover { -webkit-filter: brightness(0.5); -moz-filter: brightness(0.5); filter: brightness(0.8); } .tooltip { position: absolute; opacity: 1.0; z-index: 1000; text-align: left; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; padding: 10px; border: 1px solid; background-color: white; color: black; /*font: 12px sans-serif;*/ max-width: 300px; pointer-events: none; }