﻿.flow-chart .clickable {
    cursor: pointer;
}

.flow-chart .red {
    color: #AB1A00;
}

.flow-chart .green {
    color: #257B01;
}

.flow-chart .blue {
    color: #114080;
}

.flow-chart {
    width: 100%;
}

    .flow-chart .chart-wrapper {
        width: 100%;
        min-height: 500px;
    }

    .flow-chart .chart-header {
        display: table;
        width: 760px;
        margin: 0 auto;
        margin-top: 40px;
        margin-bottom: 30px;
    }

    .flow-chart .chart-empty-title {
        color: #CCC;
        font-size: 20px;
        font-weight: bold;
        text-align: center;
        margin: 100px 0 100px;
        display: none;
    }

    .flow-chart .chart-header .title {
        position: relative;
        display: table-cell;
        width: 33.3%;
        font-weight: bold;
        font-size: 12pt;
    }

    .flow-chart .chart-header div {
        font-weight: normal;
        font-size: 8pt;
    }

    .flow-chart .chart-header .c1 {
        left: -40px;
        text-align: left;
    }

    .flow-chart .chart-header .c2 {
        text-align: center;
    }

    .flow-chart .chart-header .c3 {
        text-align: right;
        right: -90px;
    }

    .flow-chart .btn-zoom-out {
        position: fixed;
        left: 80%;
        display: none;
        -ms-opacity: 0.4;
        opacity: 0.4;
    }

        .flow-chart .btn-zoom-out:hover {
            -ms-opacity: 1.0;
            opacity: 1.0;
        }

    .flow-chart .chart {
        width: 700px;
        min-height: 500px;
        margin: 0 auto;
        height: auto;
        overflow: visible;
    }

    .flow-chart svg {
        margin: 0 auto;
        display: block;
        float: none;
    }

        .flow-chart svg .link {
            fill: none;
            stroke: #aaa;
            stroke-opacity: 0.2;
            overflow: visible !important;
        }

        .flow-chart svg:not(:root) {
            overflow: visible !important;
        }

        .flow-chart svg .node text,
        .flow-chart svg .node tspan {
            font-size: 9pt;
            pointer-events: none;
            text-shadow: 0 1px 0 #fff;
        }

        .flow-chart svg .node rect {
            -webkit-shape-rendering: crispEdges;
            -moz-shape-rendering: crispEdges;
            -ms-shape-rendering: crispEdges;
            -o-shape-rendering: crispEdges;
            shape-rendering: crispEdges;
            stroke: 0;
        }

        .flow-chart svg .hidden {
            stroke-opacity: 0.0 !important;
            display: none;
        }

        .flow-chart svg .clickable {
            cursor: pointer;
        }
