.route-display {
    border-left: 1px solid black;
    border-top: 1px solid black;
    flex-shrink: 0;
    -webkit-flex-shrink: 0;
    position: relative;
    height: 200pt;
    max-height: 35%;
}

.route-display canvas#route-speed {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
}

.overlay-canvas {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
}

.overlay-description {
    position: absolute;
    left: 0px;
    top: 0px;
}

#cursors {
    pointer-events: all;
}

.point-descr {
    font-size: 10pt;
}

ul.point-descr {
    list-style-type: none;
    padding-left: 5px;
    margin: 0px;
}

.ri-speed {
    font-weight: bold;
}

.ri-speed-stop {
    color: blue;
}

.ri-ignition {
    color: green;
    font-weight: bold;
}

.ri-power-restored {
    color: #A63AFA;
    font-weight: bold;
}

.ri-stop-time {
    font-weight: bold;
    color: blue;
}

.ri-no-gps-data {
    color: red;
    font-weight: bold;
}

.ri-validity-low {
    color: red;
}

.ri-from-beginning {
    font-weight: bold;
}

.ri-driver-id {
    font-weight: bold;
    color: #8D4E2B;
}

.ri-trailer-id {
    font-weight: bold;
    color: #8D4E2B;
}

.chart-point-descr-level {
    font-weight: bold;
}

.rt-arrow {
    stroke-width: 1px;
}

.rt-arrow text {
    font-size: 10pt;
    font-weight: bold;
    stroke: none;
}

.stop-arrow {
    stroke: blue;
}

.stop-arrow text {
    fill: blue;
}

.dist-arrow {
    stroke: black;
}

.dist-arrow text {
    fill: black;
}

.fuel-arrow {
    stroke: #005700;
}

.fuel-arrow text {
    fill: #005700;
}

path.line-chart {
    fill: none;
    stroke-width: 1.5px;
}

.close-routes-btn {
    position: absolute;
    right: 0;
    top: 0;
    opacity: 0.5;
}

.close-routes-btn:hover {
    opacity: 1.0;
}