@import '../../src/u-line-chart.vue/module.css';
.layer .elsvg .line {
    stroke: rgb(97,218,198);
}

.layer .elsvg .area {
    fill: rgba(97,218,198,0.3);
}

.layer .elsvg:nth-of-type(1) .line {
    stroke: $theme-chart-color1;
}

.layer .elsvg:nth-of-type(1) .area {
    fill: $theme-chart-rgba-color1;
}

.layer .elsvg:nth-of-type(2) .line {
    stroke: $theme-chart-color2;
}

.layer .elsvg:nth-of-type(2) .area {
    fill: $theme-chart-rgba-color2;
}

.layer .elsvg:nth-of-type(3) .line {
    stroke: $theme-chart-color3;
}

.layer .elsvg:nth-of-type(3) .area {
    fill: $theme-chart-rgba-color3;
}

.layer .elsvg:nth-of-type(4) .line {
    stroke: $theme-chart-color4;
}

.layer .elsvg:nth-of-type(4) .area {
    fill: $theme-chart-rgba-color4;
}

.layer .elsvg:nth-of-type(5) .line {
    stroke: $theme-chart-color5;
}

.layer .elsvg:nth-of-type(5) .area {
    fill: $theme-chart-rgba-color5;
}

.layer .elsvg:nth-of-type(6) .line {
    stroke: $theme-chart-color6;
}

.layer .elsvg:nth-of-type(6) .area {
    fill: $theme-chart-rgba-color6;
}
.layer .elsvg:nth-of-type(7) .line {
    stroke: $theme-chart-color7;
}

.layer .elsvg:nth-of-type(7) .area {
    fill: $theme-chart-rgba-color7;
}

.layer .elsvg:nth-of-type(8) .line {
    stroke: $theme-chart-color8;
}

.layer .elsvg:nth-of-type(8) .area {
    fill: $theme-chart-rgba-color8;
}
.layer .elsvg:nth-of-type(9) .line {
    stroke: $theme-chart-color9;
}

.layer .elsvg:nth-of-type(9) .area {
    fill: $theme-chart-rgba-color9;
}

.layer .elsvg:nth-of-type(10) .line {
    stroke: $theme-chart-color10;
}
.layer .elsvg:nth-of-type(10) .area {
    fill: $theme-chart-rgba-color10;
}

.layer .elsvg:nth-of-type(11) .line {
    stroke: $theme-chart-color11;
}

.layer .elsvg:nth-of-type(11) .area {
    fill: $theme-chart-rgba-color11;
}

.layer .elsvg:nth-of-type(12) .line {
    stroke: $theme-chart-color12;
}

.layer .elsvg:nth-of-type(12) .area {
    fill: $theme-chart-rgba-color12;
}

.layer .elsvg:nth-of-type(13) .line {
    stroke: $theme-chart-color13;
}

.layer .elsvg:nth-of-type(13) .area {
    fill: $theme-chart-rgba-color13;
}

.layer .elsvg:nth-of-type(14) .line {
    stroke: $theme-chart-color14;
}

.layer .elsvg:nth-of-type(14) .area {
    fill: $theme-chart-rgba-color14;
}

.layer .elsvg:nth-of-type(15) .line {
    stroke: $theme-chart-color15;
}

.layer .elsvg:nth-of-type(15) .area {
    fill: $theme-chart-rgba-color15;
}

.layer .elsvg:nth-of-type(16) .line {
    stroke: $theme-chart-color16;
}

.layer .elsvg:nth-of-type(16) .area {
    fill: $theme-chart-rgba-color16;
}

.layer .elsvg:nth-of-type(17) .line {
    stroke: $theme-chart-color17;
}

.layer .elsvg:nth-of-type(17) .area {
    fill: $theme-chart-rgba-color17;
}

.layer .elsvg:nth-of-type(18) .line {
    stroke: $theme-chart-color18;
}

.layer .elsvg:nth-of-type(18) .area {
    fill: $theme-chart-rgba-color18;
}

.layer .elsvg:nth-of-type(19) .line {
    stroke: $theme-chart-color19;
}

.layer .elsvg:nth-of-type(19) .area {
    fill: $theme-chart-rgba-color19;
}

.layer .elsvg:nth-of-type(20) .line {
    stroke: $theme-chart-color20;
}

.layer .elsvg:nth-of-type(20) .area {
    fill: $theme-chart-rgba-color20;
}

.piece .point {
    border-color: rgb(97,218,198);
    background: rgb(97,218,198);
}

.piece .point:nth-of-type(1) {
    border-color: $theme-chart-color1;
    background: $theme-chart-color1;
}

.piece .point:nth-of-type(2) {
    border-color: $theme-chart-color2;
    background: $theme-chart-color2;
}

.piece .point:nth-of-type(3) {
    border-color: $theme-chart-color3;
    background: $theme-chart-color3;
}

.piece .point:nth-of-type(4) {
    border-color: $theme-chart-color4;
    background: $theme-chart-color4;
}

.piece .point:nth-of-type(5) {
    border-color: $theme-chart-color5;
    background: $theme-chart-color5;
}

.piece .point:nth-of-type(6) {
    border-color: $theme-chart-color6;
    background: $theme-chart-color6;
}

.piece .point:nth-of-type(7) {
    border-color: $theme-chart-color7;
    background: $theme-chart-color7;
}

.piece .point:nth-of-type(8) {
    border-color: $theme-chart-color8;
    background: $theme-chart-color8;
}
.piece .point:nth-of-type(9) {
    border-color: $theme-chart-color9;
    background: $theme-chart-color9;
}
.piece .point:nth-of-type(10) {
    border-color: $theme-chart-color10;
    background: $theme-chart-color10;
}

.piece .point:nth-of-type(11) {
    border-color: $theme-chart-color11;
    background: $theme-chart-color11;
}

.piece .point:nth-of-type(12) {
    border-color: $theme-chart-color12;
    background: $theme-chart-color12;
}

.piece .point:nth-of-type(13) {
    border-color: $theme-chart-color13;
    background: $theme-chart-color13;
}

.piece .point:nth-of-type(14) {
    border-color: $theme-chart-color14;
    background: $theme-chart-color14;
}

.piece .point:nth-of-type(15) {
    border-color: $theme-chart-color15;
    background: $theme-chart-color15;
}

.piece .point:nth-of-type(16) {
    border-color: $theme-chart-color16;
    background: $theme-chart-color16;
}

.piece .point:nth-of-type(17) {
    border-color: $theme-chart-color17;
    background: $theme-chart-color17;
}

.piece .point:nth-of-type(18) {
    border-color: $theme-chart-color18;
    background: $theme-chart-color18;
}

.piece .point:nth-of-type(19) {
    border-color: $theme-chart-color19;
    background: $theme-chart-color19;
}

.piece .point:nth-of-type(20) {
    border-color: $theme-chart-color20;
    background: $theme-chart-color20;
}