.base-chart {
}

.chart-legend {
    border: 1px solid #dcdcdc;
    background-color: #ffffff;
}

.visualization .visualization-title {
    font-family: sans-serif;
    font-size: 14px;
    font-weight: bold;
}

text {
    font-family: Arial;
    font-size: 9pt;
}
.base-chart path,
.base-chart line {
    fill: none;
    stroke: #565656;
    shape-rendering: crispEdges;
    stroke-width: 1px;
}

.base-chart text {
    font-family: sans-serif;
    font-size: 11px;
}

/* Sunburst */

.unselectable-text {
    -moz-user-select: -moz-none;
    -khtml-user-select: none;
    -webkit-user-select: none;

    /*
      Introduced in IE 10.
      See http://ie.microsoft.com/testdrive/HTML5/msUserSelect/
    */
    -ms-user-select: none;
    user-select: none;
    cursor: context-menu;
}

.node-label {
    font-family: Verdana, Geneva, sans-serif;
    font-size: 11px;
    text-anchor: middle;
}

.node-arc {
    stroke: #fff;
    fill-rule: evenodd;
}

/* Scatter plot */

.scatter-plot {}
.scatter-plot .items {}
.scatter-plot .selected { fill: #1a6d00; stroke: #ffc600; stroke-width: 2; stroke-opacity: 1.0; opacity: 1; }
.scatter-plot .hovered { fill: #1a6d00; stroke: #ffc600; stroke-width: 2; stroke-opacity: 1.0; opacity: 1; }

/* Genes Track */

.genes-track {}
.genes-track .items { shape-rendering: auto; stroke: #555555; fill-opacity: 0.6; }
.genes-track .exons { stroke: none; }
.genes-track .gene-name { font-weight: bold; font-size: 12; fill: #000000; stroke: none; fill-opacity: 0; }
.genes-track .gene-name-show { font-weight: bold; font-size: 12; fill: #000000; stroke: none; }

.genes-track .selected { fill-opacity: 1; stroke: #555555; }
.genes-track .selected .gene-body { stroke: #555555; stroke-width: 3; stroke-opacity: 0.7; }
.genes-track .hovered { fill-opacity: 1; stroke: #555555; }
.genes-track .hovered .gene-body { stroke: #555555; stroke-width: 3; stroke-opacity: 0.7; }
.genes-track .hovered .gene-name { fill-opacity: 1; }
.genes-track .selected .gene-name { fill-opacity: 1; }


/* Transcript Track */

.transcript-track {}
.transcript-track .items { shape-rendering: auto; stroke: #555555; fill-opacity: 0.6; stroke-width: 0.1; }
.transcript-track .transcript-name { font-weight: bold; font-size: 12; fill: #000000; stroke: none; fill-opacity: 0; }
.transcript-track .transcript-name-show { font-weight: bold; font-size: 12; fill: #000000; stroke: none; }

.transcript-track .selected { fill-opacity: 1; stroke: #555555; }
.transcript-track .selected .transcript-body { stroke: #555555; stroke-width: 3; stroke-opacity: 0.7; }
.transcript-track .hovered { fill-opacity: 1; stroke: #555555; }
.transcript-track .hovered .transcript-body { stroke: #555555; stroke-width: 3; stroke-opacity: 0.7; }
.transcript-track .hovered .transcript-name { fill-opacity: 1; }
.transcript-track .selected .transcript-name { fill-opacity: 1; }

/* Guide Track */

.guide-track {}
.guide-track .items { shape-rendering: auto; stroke: #555555; fill-opacity: 0.6; stroke-width: 0.1; }
.guide-track .guide-name { font-weight: bold; font-size: 12; fill: #000000; stroke: none; fill-opacity: 0; }
.guide-track .guide-name-show { font-weight: bold; font-size: 12; fill: #000000; stroke: none; }

.guide-track .selected { fill-opacity: 1; stroke: #555555; }
.guide-track .selected .guide-body { stroke: #555555; stroke-width: 3; stroke-opacity: 0.7; }
.guide-track .hovered { fill-opacity: 1; stroke: #555555; }
.guide-track .hovered .guide-body { stroke: #555555; stroke-width: 3; stroke-opacity: 0.7; }
.guide-track .hovered .guide-name { fill-opacity: 1; }
.guide-track .selected .guide-name { fill-opacity: 1; }

/* Repeat Track */

.repeat-track {}
.repeat-track .items { shape-rendering: auto; stroke: #555555; fill-opacity: 0.6; stroke-width: 0.1; }
.repeat-track .repeat-name { font-weight: bold; font-size: 12; fill: #000000; stroke: none; fill-opacity: 0; }
.repeat-track .repeat-name-show { font-weight: bold; font-size: 12; fill: #000000; stroke: none; }

.repeat-track .selected { fill-opacity: 1; stroke: #555555; }
.repeat-track .selected .repeat-body { stroke: #555555; stroke-width: 3; stroke-opacity: 0.7; }
.repeat-track .hovered { fill-opacity: 1; stroke: #555555; }
.repeat-track .hovered .repeat-body { stroke: #555555; stroke-width: 3; stroke-opacity: 0.7; }
.repeat-track .hovered .repeat-name { fill-opacity: 1; }
.repeat-track .selected .repeat-name { fill-opacity: 1; }

/* Blocks Track */

.blocks-track {}
.blocks-track .items { shape-rendering: crispEdges; fill-opacity: 0.6; stroke: #555555; stroke-opacity: 0.5; stroke-width: 1; }
.blocks-track .selected { stroke: #ffc600; stroke-width: 5; stroke-opacity: 0.7; fill-opacity: 1; }
.blocks-track .hovered { 
    stroke: #ffc600 !important; 
    stroke-width: 5 !important; 
    stroke-opacity: 0.7 !important; 
    fill-opacity: 1 !important; 
}
.blocks-track .hovered .arcs { 
    stroke: #ffc600 !important; 
    stroke-width: 5 !important; 
    stroke-opacity: 0.7 !important; 
    fill-opacity: 1 !important; 
}
.blocks-track .items .arcs-group .arcs {
    fill: none;
    stroke: grey;
    stroke-width: 2px;
    shape-rendering: auto;
    stroke-opacity: 0.4;
}

/* .blocks-track .items .arcs-group {
    fill: none;
    stroke: grey;
    stroke-width: 8;
    shape-rendering: auto;
    stroke-opacity: 0;
} */

.blocks-track .items .arcs-group .arcs-padding {
    fill: none;
    stroke: transparent;
    stroke-width: 20px;
    shape-rendering: auto;
    stroke-opacity: 0;
}

/* Heatmap */

.heatmap-plot .row-legend { font-weight: bold; font-size: 11px; text-anchor: end; }
.heatmap-plot .items { stroke: #efefef; stroke-opacity: 0.3; shape-rendering: 'crispEdges'; }
.heatmap-plot .selected { stroke: #ffc600; stroke-width: 2; stroke-opacity: 1.0; fill-opacity: 1; }
.heatmap-plot .hovered { stroke: #ffc600; stroke-width: 2; stroke-opacity: 1.0; fill-opacity: 1; }
.heatmap-plot .col-text { font-weight: bold; text-anchor: start; font-size: 11px; }
.heatmap-plot .row-text { font-weight: bold; text-anchor: end; font-size: 11px; }
.heatmap-plot .selected .col-text { font-weight: bold; fill-opacity: 1; font-size: 10px; }
.heatmap-plot .hovered .col-text { font-weight: bold; fill-opacity: 1; font-size: 10px; }
.heatmap-plot .selected .row-text { font-weight: bold; fill-opacity: 1; font-size: 10px; }
.heatmap-plot .hovered .row-text { font-weight: bold; fill-opacity: 1; font-size: 10px; }

/* Line Plot */

.line-plot .items .bg-line { stroke: #dddddd; stroke-opacity: 0.1; }
.line-plot .hovered .bg-line { stroke-opacity: 1!important; opacity: 1!important; }

/* Line Track */

.line-track {}

/* Stacked Line Plot */

.stacked-line-plot {}
.stacked-line-plot .item { stroke-width: 0; }
.stacked-line-plot .selected .item { fill: #1a6d00; stroke: #ffc600; stroke-width: 2; stroke-opacity: 1.0; opacity: 1!important; }
.stacked-line-plot .hovered .item { fill: #1a6d00; stroke: #ffc600; stroke-width: 2px!important; stroke-opacity: 1.0; opacity: 1!important; }

/* sashimi track */

/**/

.sashimi-track .coverage-fill {
    stroke-width: 0;
    shape-rendering: auto;
    stroke-opacity: 1;
}

.sashimi-track .coverage-line {
    shape-rendering: auto;
    stroke-opacity: 0.8;
}

/**/

.sashimi-track .items .arcs-sashimi {
    stroke-width: 2px;
    shape-rendering: auto;
    stroke-opacity: 0.4;
    fill-opacity: 0.4;
}

.sashimi-track .hovered .arcs-sashimi { 
    stroke: #ffc600 !important; 
    stroke-width: 5 !important; 
    stroke-opacity: 0.7 !important; 
    fill-opacity: 1 !important; 
}

.sashimi-track .arcs-rect{ 
    shape-rendering: optimizeSpeed;
    fill: white;
    stroke: grey;
    stroke-width: 0;
    stroke-opacity: 0.4;
    fill-opacity: 1;
}

.sashimi-track .hovered .arcs-rect{ 
    stroke: #ffc600 !important; 
    stroke-width: 5 !important; 
    stroke-opacity: 0.7 !important; 
    fill-opacity: 1 !important; 
}

.sashimi-track .arcs-text { 
    shape-rendering: optimizeSpeed;
    stroke: black;
    font-size: 20px;
    font-family: sans-serif;
    stroke-width: 2px;
    stroke-opacity: 0.4;
}

.sashimi-track .hovered .arcs-text {}

.sashimi-track .arcs-padding {
    fill: none;
    stroke: transparent;
    stroke-width: 20px;
    shape-rendering: auto;
    stroke-opacity: 0;
}


/* icicle */

.icicle .item rect { stroke: #fff; stroke-width: 0; fill-rule: evenodd; }

.icicle .icon {
    font-family: 'epiviz-icons';
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;

    /* For SVG text */
    /* text-anchor: end; */
    /* alignment-baseline: before-edge; */

    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-size: 16px;
    color: #000000;
}

.icicle .large-icon {
    font-weight: bold!important;
    font-size: 24px!important;
}

.icicle .none-select .icon::before {
    content: "\f379";
}

.icicle .node-select .icon::before {
    content: "\f3b3";
}

.icicle .leaves-select .icon::before {
    content: "\f3b2";
    /*content: '\e900';*/
}

.icicle .custom-select .icon::before {
    content: "\f3b4";
}

.icicle .none-select rect {
    opacity: 0.35;
    fill: #bfbfbf;
}

.icicle .node-select rect {
    opacity: 1;
}

.icicle .custom-select rect {
    opacity: 0.9;
}

.icicle .leaves-select rect {
    opacity: 1;
}

.icicle .selected rect { stroke: #ffc600; stroke-width: 2; stroke-opacity: 1.0; fill-opacity: 1!important; }

.icicle .hovered rect { stroke: #ffc600; stroke-width: 2; stroke-opacity: 1.0; fill-opacity: 1!important; }

.icicle .unhovered rect { fill-opacity: 0.5; }

.icicle .unselected rect { fill-opacity: 0.5; }

.icicle .dragstart rect { fill-opacity: 0.5; }

.icicle .selected { cursor: w-resize; }

.icicle .item text {
   text-anchor: middle;
   font-family: sans-serif;
   font-size: 14px;
   font-weight: bold;
}