TIF_NGANJUK_E41220820/public/assets/sass/ready/plugins/_chartist.scss

.ct-label {
  fill: rgba(0, 0, 0, 0.5);
  color: rgba(0, 0, 0, 0.5);
  font-size: 0.8rem;
  line-height: 1;
}

.ct-chart-line .ct-label, .ct-chart-bar .ct-label {
  display: block;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
}

.ct-chart-pie .ct-label, .ct-chart-donut .ct-label {
  dominant-baseline: central;
}

.ct-label {
  &.ct-horizontal {
    &.ct-start {
      -webkit-box-align: flex-end;
      -webkit-align-items: flex-end;
      -ms-flex-align: flex-end;
      align-items: flex-end;
      -webkit-box-pack: flex-start;
      -webkit-justify-content: flex-start;
      -ms-flex-pack: flex-start;
      justify-content: flex-start;
      text-align: left;
      text-anchor: start;
    }
    &.ct-end {
      -webkit-box-align: flex-start;
      -webkit-align-items: flex-start;
      -ms-flex-align: flex-start;
      align-items: flex-start;
      -webkit-box-pack: flex-start;
      -webkit-justify-content: flex-start;
      -ms-flex-pack: flex-start;
      justify-content: flex-start;
      text-align: left;
      text-anchor: start;
    }
  }
  &.ct-vertical {
    &.ct-start {
      -webkit-box-align: flex-end;
      -webkit-align-items: flex-end;
      -ms-flex-align: flex-end;
      align-items: flex-end;
      -webkit-box-pack: flex-end;
      -webkit-justify-content: flex-end;
      -ms-flex-pack: flex-end;
      justify-content: flex-end;
      text-align: right;
      text-anchor: end;
    }
    &.ct-end {
      -webkit-box-align: flex-end;
      -webkit-align-items: flex-end;
      -ms-flex-align: flex-end;
      align-items: flex-end;
      -webkit-box-pack: flex-start;
      -webkit-justify-content: flex-start;
      -ms-flex-pack: flex-start;
      justify-content: flex-start;
      text-align: left;
      text-anchor: start;
    }
  }
}

.ct-chart-bar {
  .ct-label.ct-horizontal {
    &.ct-start {
      -webkit-box-align: flex-end;
      -webkit-align-items: flex-end;
      -ms-flex-align: flex-end;
      align-items: flex-end;
      -webkit-box-pack: center;
      -webkit-justify-content: center;
      -ms-flex-pack: center;
      justify-content: center;
      text-align: center;
      text-anchor: start;
    }
    &.ct-end {
      -webkit-box-align: flex-start;
      -webkit-align-items: flex-start;
      -ms-flex-align: flex-start;
      align-items: flex-start;
      -webkit-box-pack: center;
      -webkit-justify-content: center;
      -ms-flex-pack: center;
      justify-content: center;
      text-align: center;
      text-anchor: start;
    }
  }
  &.ct-horizontal-bars .ct-label {
    &.ct-horizontal {
      &.ct-start {
        -webkit-box-align: flex-end;
        -webkit-align-items: flex-end;
        -ms-flex-align: flex-end;
        align-items: flex-end;
        -webkit-box-pack: flex-start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: flex-start;
        justify-content: flex-start;
        text-align: left;
        text-anchor: start;
      }
      &.ct-end {
        -webkit-box-align: flex-start;
        -webkit-align-items: flex-start;
        -ms-flex-align: flex-start;
        align-items: flex-start;
        -webkit-box-pack: flex-start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: flex-start;
        justify-content: flex-start;
        text-align: left;
        text-anchor: start;
      }
    }
    &.ct-vertical {
      &.ct-start {
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: flex-end;
        -webkit-justify-content: flex-end;
        -ms-flex-pack: flex-end;
        justify-content: flex-end;
        text-align: right;
        text-anchor: end;
      }
      &.ct-end {
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: flex-start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: flex-start;
        justify-content: flex-start;
        text-align: left;
        text-anchor: end;
      }
    }
  }
}

.ct-grid {
  stroke: rgba(0, 0, 0, 0.2);
  stroke-width: 1px;
  stroke-dasharray: 2px;
}

.ct-grid-background {
  fill: none;
}

.ct-point {
  stroke-width: 7px;
  stroke-linecap: round;
}

.ct-line {
  fill: none;
  stroke-width: 3px;
}

.ct-area {
  stroke: none;
  fill-opacity: 0.1;
}

.ct-bar {
  fill: none;
  stroke-width: 10px;
}

.ct-slice-donut {
  fill: none;
  stroke-width: 60px;
}

.ct-series-a {
  .ct-point, .ct-line, .ct-bar, .ct-slice-donut {
    stroke: #1D62F0;
  }
  .ct-slice-pie, .ct-slice-donut-solid, .ct-area {
    fill: #1D62F0;
  }
}

.ct-series-b {
  .ct-point, .ct-line, .ct-bar, .ct-slice-donut {
    stroke: #ff646d;
  }
  .ct-slice-pie, .ct-slice-donut-solid, .ct-area {
    fill: #ff646d;
  }
}

.ct-series-c {
  .ct-point, .ct-line, .ct-bar, .ct-slice-donut {
    stroke: #fbad4c;
  }
  .ct-slice-pie, .ct-slice-donut-solid, .ct-area {
    fill: #fbad4c;
  }
}

.ct-series-d {
  .ct-point, .ct-line, .ct-bar, .ct-slice-donut {
    stroke: #9368E9;
  }
  .ct-slice-pie, .ct-slice-donut-solid, .ct-area {
    fill: #9368E9;
  }
}

.ct-series-e {
  .ct-point, .ct-line, .ct-bar, .ct-slice-donut {
    stroke: #87CB16;
  }
  .ct-slice-pie, .ct-slice-donut-solid, .ct-area {
    fill: #87CB16;
  }
}

.ct-series-f {
  .ct-point, .ct-line, .ct-bar, .ct-slice-donut {
    stroke: #59922b;
  }
  .ct-slice-pie, .ct-slice-donut-solid, .ct-area {
    fill: #59922b;
  }
}

.ct-series-g {
  .ct-point, .ct-line, .ct-bar, .ct-slice-donut {
    stroke: #0544d3;
  }
  .ct-slice-pie, .ct-slice-donut-solid, .ct-area {
    fill: #0544d3;
  }
}

.ct-series-h {
  .ct-point, .ct-line, .ct-bar, .ct-slice-donut {
    stroke: #6b0392;
  }
  .ct-slice-pie, .ct-slice-donut-solid, .ct-area {
    fill: #6b0392;
  }
}

.ct-series-i {
  .ct-point, .ct-line, .ct-bar, .ct-slice-donut {
    stroke: #f05b4f;
  }
  .ct-slice-pie, .ct-slice-donut-solid, .ct-area {
    fill: #f05b4f;
  }
}

.ct-series-j {
  .ct-point, .ct-line, .ct-bar, .ct-slice-donut {
    stroke: #dda458;
  }
  .ct-slice-pie, .ct-slice-donut-solid, .ct-area {
    fill: #dda458;
  }
}

.ct-series-k {
  .ct-point, .ct-line, .ct-bar, .ct-slice-donut {
    stroke: #eacf7d;
  }
  .ct-slice-pie, .ct-slice-donut-solid, .ct-area {
    fill: #eacf7d;
  }
}

.ct-series-l {
  .ct-point, .ct-line, .ct-bar, .ct-slice-donut {
    stroke: #86797d;
  }
  .ct-slice-pie, .ct-slice-donut-solid, .ct-area {
    fill: #86797d;
  }
}

.ct-series-m {
  .ct-point, .ct-line, .ct-bar, .ct-slice-donut {
    stroke: #b2c326;
  }
  .ct-slice-pie, .ct-slice-donut-solid, .ct-area {
    fill: #b2c326;
  }
}

.ct-series-n {
  .ct-point, .ct-line, .ct-bar, .ct-slice-donut {
    stroke: #6188e2;
  }
  .ct-slice-pie, .ct-slice-donut-solid, .ct-area {
    fill: #6188e2;
  }
}

.ct-series-o {
  .ct-point, .ct-line, .ct-bar, .ct-slice-donut {
    stroke: #a748ca;
  }
  .ct-slice-pie, .ct-slice-donut-solid, .ct-area {
    fill: #a748ca;
  }
}

.ct-square {
  display: block;
  position: relative;
  width: 100%;
  &:before {
    display: block;
    float: left;
    content: "";
    width: 0;
    height: 0;
    padding-bottom: 100%;
  }
  &:after {
    content: "";
    display: table;
    clear: both;
  }
  > svg {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
  }
}

.ct-minor-second {
  display: block;
  position: relative;
  width: 100%;
  &:before {
    display: block;
    float: left;
    content: "";
    width: 0;
    height: 0;
    padding-bottom: 93.75%;
  }
  &:after {
    content: "";
    display: table;
    clear: both;
  }
  > svg {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
  }
}

.ct-major-second {
  display: block;
  position: relative;
  width: 100%;
  &:before {
    display: block;
    float: left;
    content: "";
    width: 0;
    height: 0;
    padding-bottom: 88.8888888889%;
  }
  &:after {
    content: "";
    display: table;
    clear: both;
  }
  > svg {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
  }
}

.ct-minor-third {
  display: block;
  position: relative;
  width: 100%;
  &:before {
    display: block;
    float: left;
    content: "";
    width: 0;
    height: 0;
    padding-bottom: 83.3333333333%;
  }
  &:after {
    content: "";
    display: table;
    clear: both;
  }
  > svg {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
  }
}

.ct-major-third {
  display: block;
  position: relative;
  width: 100%;
  &:before {
    display: block;
    float: left;
    content: "";
    width: 0;
    height: 0;
    padding-bottom: 80%;
  }
  &:after {
    content: "";
    display: table;
    clear: both;
  }
  > svg {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
  }
}

.ct-perfect-fourth {
  display: block;
  position: relative;
  width: 100%;
  &:before {
    display: block;
    float: left;
    content: "";
    width: 0;
    height: 0;
    padding-bottom: 75%;
  }
  &:after {
    content: "";
    display: table;
    clear: both;
  }
  > svg {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
  }
}

.ct-perfect-fifth {
  display: block;
  position: relative;
  width: 100%;
  &:before {
    display: block;
    float: left;
    content: "";
    width: 0;
    height: 0;
    padding-bottom: 66.6666666667%;
  }
  &:after {
    content: "";
    display: table;
    clear: both;
  }
  > svg {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
  }
}

.ct-minor-sixth {
  display: block;
  position: relative;
  width: 100%;
  &:before {
    display: block;
    float: left;
    content: "";
    width: 0;
    height: 0;
    padding-bottom: 62.5%;
  }
  &:after {
    content: "";
    display: table;
    clear: both;
  }
  > svg {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
  }
}

.ct-golden-section {
  display: block;
  position: relative;
  width: 100%;
  &:before {
    display: block;
    float: left;
    content: "";
    width: 0;
    height: 0;
    padding-bottom: 61.804697157%;
  }
  &:after {
    content: "";
    display: table;
    clear: both;
  }
  > svg {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
  }
}

.ct-major-sixth {
  display: block;
  position: relative;
  width: 100%;
  &:before {
    display: block;
    float: left;
    content: "";
    width: 0;
    height: 0;
    padding-bottom: 60%;
  }
  &:after {
    content: "";
    display: table;
    clear: both;
  }
  > svg {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
  }
}

.ct-minor-seventh {
  display: block;
  position: relative;
  width: 100%;
  &:before {
    display: block;
    float: left;
    content: "";
    width: 0;
    height: 0;
    padding-bottom: 56.25%;
  }
  &:after {
    content: "";
    display: table;
    clear: both;
  }
  > svg {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
  }
}

.ct-major-seventh {
  display: block;
  position: relative;
  width: 100%;
  &:before {
    display: block;
    float: left;
    content: "";
    width: 0;
    height: 0;
    padding-bottom: 53.3333333333%;
  }
  &:after {
    content: "";
    display: table;
    clear: both;
  }
  > svg {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
  }
}

.ct-octave {
  display: block;
  position: relative;
  width: 100%;
  &:before {
    display: block;
    float: left;
    content: "";
    width: 0;
    height: 0;
    padding-bottom: 50%;
  }
  &:after {
    content: "";
    display: table;
    clear: both;
  }
  > svg {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
  }
}

.ct-major-tenth {
  display: block;
  position: relative;
  width: 100%;
  &:before {
    display: block;
    float: left;
    content: "";
    width: 0;
    height: 0;
    padding-bottom: 40%;
  }
  &:after {
    content: "";
    display: table;
    clear: both;
  }
  > svg {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
  }
}

.ct-major-eleventh {
  display: block;
  position: relative;
  width: 100%;
  &:before {
    display: block;
    float: left;
    content: "";
    width: 0;
    height: 0;
    padding-bottom: 37.5%;
  }
  &:after {
    content: "";
    display: table;
    clear: both;
  }
  > svg {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
  }
}

.ct-major-twelfth {
  display: block;
  position: relative;
  width: 100%;
  &:before {
    display: block;
    float: left;
    content: "";
    width: 0;
    height: 0;
    padding-bottom: 33.3333333333%;
  }
  &:after {
    content: "";
    display: table;
    clear: both;
  }
  > svg {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
  }
}

.ct-double-octave {
  display: block;
  position: relative;
  width: 100%;
  &:before {
    display: block;
    float: left;
    content: "";
    width: 0;
    height: 0;
    padding-bottom: 25%;
  }
  &:after {
    content: "";
    display: table;
    clear: both;
  }
  > svg {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
  }
}

.chartist-tooltip {
  position: absolute;
  display: inline-block;
  opacity: 0;
  min-width: 3em;
  padding: .25em;
  background: rgba(0, 0, 0, 0.77);
  color: #fff;
  font-weight: 600;
  text-align: center;
  pointer-events: none;
  z-index: 1;
  -webkit-transition: opacity .2s linear;
  -moz-transition: opacity .2s linear;
  -o-transition: opacity .2s linear;
  transition: opacity .2s linear;
  &:before {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    width: 0;
    height: 0;
    margin-left: -5px;
    border: 5px solid transparent;
    border-top-color: rgba(0, 0, 0, 0.77);
  }
}

.chartist-tooltip-value {
  font-size: 14px;
}

.chartist-tooltip.tooltip-show {
  opacity: 1;
}

.ct-area, .ct-line {
  pointer-events: none;
}