﻿.segchart * {cursor: pointer;}
.segchart {
    padding: 25px; 
    height: 200px; 
    width: 750px;
    overflow: visible;
}
.segchartOH {padding: 25px; height: 750px; width: 200px; overflow: visible;}
.segchart line {stroke-linecap: square;}
.segchart text {fill: #333; font-weight: bold; text-anchor: middle; text-shadow: 0 0 6px #eee;}
.segchart text:hover {fill: #fff; text-shadow: 0 0 6px #222;}
.segment {fill: #aaa; opacity: .8;}
.segment.opaque { opacity: 1; }
.segment.low {fill: #9cf078;}
.segment.medium {fill: #fce77e;}
.segment.high {fill: #cc6666;}
.segment.active, .segment:hover {stroke: #fff; stroke-width: 4; opacity: .9;}
.segment.selected {fill: #04f1fa;}
.platform {fill: #aaa; opacity: .8;}
.platform.opaque{opacity: 1;}
.platform.low {fill: #9cf078;}
.platform.medium {fill: #fce77e;}
.platform.high {fill: #cc6666;}
.platform.active, .parallel:hover {stroke: #fff; stroke-width: 4; opacity: .9;}
.siding {fill: #aaa; opacity: .8;}
.siding.opaque{opacity: 1;}
.siding.low {fill: #9cf078;}
.siding.medium {fill: #fce77e;}
.siding.high {fill: #cc6666;}
.siding.active, .parallel:hover {stroke: #fff; stroke-width: 4; opacity: .9;}
.tunnel {fill: #aaa; opacity: .8;}
.tunnel.opaque{opacity: 1;}
.tunnel.low {fill: #9cf078;}
.tunnel.medium {fill: #fce77e;}
.tunnel.high {fill: #cc6666;}
.tunnel.active, .tunnel:hover {stroke: #fff; stroke-width: 4; opacity: .9;}
.access {fill: #aaa; opacity: .8;}
.access.opaque{opacity: 1;}
.access.low {fill: #9cf078;}
.access.medium {fill: #fce77e;}
.access.high {fill: #cc6666;}
.access.active, .access:hover {stroke: #fff; stroke-width: 4; opacity: .9;}
.walkway {fill: #aaa; opacity: .8;}
.walkway.opaque{opacity: 1;}
.walkway.low {fill: #9cf078;}
.walkway.medium {fill: #fce77e;}
.walkway.high {fill: #cc6666;}
.walkway.active, .walkway:hover {stroke: #fff; stroke-width: 4; opacity: .9;}
.other {fill: #aaa; opacity: .8;}
.other.opaque{opacity: 1;}
.other.low {fill: #9cf078;}
.other.medium {fill: #fce77e;}
.other.high {fill: #cc6666;}
.other.active, .other:hover {stroke: #fff; stroke-width: 4; opacity: .9;}
.substructure {fill: #777; stroke: #888; stroke-width: 1;}
.substructure.selected {fill: #04f1fa;}
.substructure.opaque {opacity: 1;}
.substructure.active, .substructure:hover {stroke: #333; stroke-width: 4; opacity: .9;}
.abutment {fill: #666; stroke: #888; stroke-width: 1;}
.abutment.selected {fill: #04f1fa;}
.abutment.opaque{opacity: 1;}
.abutment.active, .abutment:hover {stroke: #333; stroke-width: 4; opacity: .9;}
.gct {fill: #666; stroke: #888; stroke-width: 1;}
.gct.selected {fill: #04f1fa;}
.gct.opaque{opacity: 1;}
.gct.active, .gct:hover {stroke: #333; stroke-width: 4; opacity: .9;}
.trackline {stroke: #333; stroke-width: 1.5; opacity: 1;}
/*.trackoutline {stroke-width: 3; stroke: black; opacity: 0.5;}*/
.twtext{fill: #333; font-weight: bold; text-anchor: middle; text-shadow: 0 0 6px #eee;}