.chart {
  width: 100%;
  min-width: 250px;
  margin: 0;
  padding: 0 0 40px 0; }
  .chart .chart-title {
    text-align: center; }
  .chart .chart-main {
    width: 100%;
    clear: both; }
  .chart .chart-content {
    width: 100%;
    height: 400px;
    margin: 0;
    padding: 0;
    position: relative; }
    .chart .chart-content .chart-viz {
      width: 100%;
      height: 100%;
      margin: 0;
      padding: 0;
      position: relative; }
      .chart .chart-content .chart-viz .chart-viz-group {
        width: 100%;
        height: 100%;
        margin: 0;
        padding: 0;
        position: relative; }
        .chart .chart-content .chart-viz .chart-viz-group canvas {
          width: 100%;
          height: 100%;
          position: absolute; }
        .chart .chart-content .chart-viz .chart-viz-group svg {
          width: 100%;
          height: 100%;
          position: absolute; }

.chart-reponsive .chart-viz {
  overflow-x: auto; }
  .chart-reponsive .chart-viz .chart-viz-group {
    min-width: 410px; }

.chart-small .chart-legends .chart-legend-structure .chart-legend-container .chart-legend ul li.legend-item {
  width: 33.3%; }

.chart-medium .chart-legends .chart-legend-structure .chart-legend-container .chart-legend ul li.legend-item {
  width: 25%; }

.chart-large .chart-legends .chart-legend-structure .chart-legend-container .chart-legend ul li.legend-item {
  width: 20%; }

.chart-wide .chart-main .content-legend {
  width: 80%;
  float: left; }

.chart-wide .chart-main .chart-legends {
  width: 20%;
  height: 400px;
  float: right; }
  .chart-wide .chart-main .chart-legends .chart-legend-structure {
    width: 100%;
    margin: 0; }
    .chart-wide .chart-main .chart-legends .chart-legend-structure .chart-legend-container {
      margin: 0;
      width: 100%; }
      .chart-wide .chart-main .chart-legends .chart-legend-structure .chart-legend-container .chart-legend ul li.legend-item {
        float: none;
        clear: both;
        width: 100%; }

.chart-legends {
  display: none;
  width: 100%; }
  .chart-legends .chart-legend-structure {
    display: table;
    margin: 0 auto;
    width: 100%; }
    .chart-legends .chart-legend-structure .chart-legend-container {
      display: table-cell;
      vertical-align: middle; }
      .chart-legends .chart-legend-structure .chart-legend-container .chart-legend {
        clear: both; }
        .chart-legends .chart-legend-structure .chart-legend-container .chart-legend .legend-title {
          font-weight: 900;
          margin: 20px 0 0 0; }
        .chart-legends .chart-legend-structure .chart-legend-container .chart-legend ul {
          list-style: none;
          margin: 0;
          padding: 0;
          display: flex;
          flex-wrap: wrap; }
          .chart-legends .chart-legend-structure .chart-legend-container .chart-legend ul li.legend-item {
            width: 50%;
            margin: 20px 0 0 0;
            position: relative; }
            .chart-legends .chart-legend-structure .chart-legend-container .chart-legend ul li.legend-item .key {
              margin: 0 0 0 25px;
              display: block;
              font-size: 12px; }
            .chart-legends .chart-legend-structure .chart-legend-container .chart-legend ul li.legend-item svg {
              position: absolute; }
          .chart-legends .chart-legend-structure .chart-legend-container .chart-legend ul li.item-togglable {
            cursor: pointer; }
          .chart-legends .chart-legend-structure .chart-legend-container .chart-legend ul li.legend-item-off {
            opacity: 0.5; }

.legends-open {
  display: block; }

.chart-wide .chart-legends .chart-legend-structure {
  width: 80%;
  height: 100%; }

.chart .chart-details {
  visibility: hidden;
  position: absolute;
  pointer-events: none;
  z-index: 1000; }

.viz-fill-dark-0 {
  fill: #002F6C; }

.viz-fill-dark-1 {
  fill: #FF671F; }

.viz-fill-dark-2 {
  fill: #43B02A; }

.viz-fill-dark-3 {
  fill: #F6BE00; }

.viz-fill-dark-4 {
  fill: #8658A3; }

.viz-fill-dark-5 {
  fill: #6AA7AD; }

.viz-fill-dark-6 {
  fill: #EE2737; }

.viz-fill-dark-7 {
  fill: #009CDE; }

.viz-fill-light-0 {
  fill: #4C6D98; }

.viz-fill-light-1 {
  fill: #F69460; }

.viz-fill-light-2 {
  fill: #78C580; }

.viz-fill-light-3 {
  fill: #FAD15B; }

.viz-fill-light-4 {
  fill: #AA8ABE; }

.viz-fill-light-5 {
  fill: #94C0C5; }

.viz-fill-light-6 {
  fill: #F86F77; }

.viz-fill-light-7 {
  fill: #5FB7E2; }

.chart h1, .chart h2, .chart h3, .chart h4 {
  font-family: "FreightText", Georgia, "Times New Roman", Times, serif; }

.chart p {
  font-family: "BrandonText", Helvetica, Arial, sans-serif; }

.chart .chart-legends {
  font-family: "BrandonText", Helvetica, Arial, sans-serif; }

.chart .chart-content svg text {
  font-family: "BrandonText", Helvetica, Arial, sans-serif; }
  .chart .chart-content svg text.axis-label {
    font-size: 18px; }

.chart .chart-content svg g.axis-label text {
  font-size: 14px;
  font-weight: bold; }

.chart .chart-content svg g.axis path {
  display: none; }

.chart .chart-content svg g.axis g.tick text {
  font-size: 14px; }

.chart .chart-content svg g.axis g.tick line {
  stroke: #D9D9D6; }

.chart .chart-content.histogram-content svg .axis-bottom g.tick line, .chart .chart-content.bar-vertical svg .axis-bottom g.tick line, .chart .chart-content.waterfall-content svg .axis-bottom g.tick line {
  display: none; }

.chart .chart-content.bar-horizontal svg .axis-left g.tick line {
  display: none; }

.chart .chart-details {
  opacity: 0.9; }
  .chart .chart-details svg.details-point {
    position: relative;
    top: -3px;
    left: 50%;
    margin: 0 0 0 -12.5px; }
    .chart .chart-details svg.details-point polygon {
      fill: #ffffff; }
  .chart .chart-details .chart-details-content {
    opacity: 1;
    color: #757778;
    font-size: 12px;
    line-height: 1.6;
    padding: 16px;
    background-color: #ffffff;
    min-width: 100px;
    max-width: 200px; }
  .chart .chart-details.details-above .chart-details-content {
    box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.05), 0 3px 6px 0 rgba(0, 0, 0, 0.13); }
  .chart .chart-details.details-low-left .chart-details-content {
    border-radius: 10px 0 10px 10px; }
  .chart .chart-details.details-low-right .chart-details-content {
    border-radius: 0 10px 10px 10px; }
  .chart .chart-details.details-high-left .chart-details-content {
    border-radius: 10px 10px 0 10px; }
  .chart .chart-details.details-high-right .chart-details-content {
    border-radius: 10px 10px 10px 0; }

.chart .chart-content svg .map path.feature {
  stroke-width: 1;
  stroke: #FFF; }

.chart .chart-content svg .annotation-handle {
  fill: #FFFFFF;
  stroke: black;
  stroke-width: 1; }

.chart .chart-content svg .annotation-line-value-container {
  fill: white;
  stroke-width: 1;
  stroke: black;
  opacity: 0.9; }

.chart .chart-content svg .annotation-line-draggable-x, .chart .chart-content svg .annotation-handle-draggable-x {
  cursor: col-resize; }

.chart .chart-content svg .annotation-line-draggable-y, .chart .chart-content svg .annotation-handle-draggable-y {
  cursor: row-resize; }

.chart-panel {
  min-width: 330px;
  margin: 0 0 30px 0;
  padding: 40px 40px 40px 40px;
  box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.05), 0 3px 6px 0 rgba(0, 0, 0, 0.13);
  background-color: #FFFFFF; }
  .chart-panel h3 {
    margin: 0 0 20px 0;
    padding: 0 0 20px 0;
    text-transform: uppercase;
    font-size: 18px;
    letter-spacing: 1px;
    border-bottom: 1px solid #B1B3B3; }
  .chart-panel .chart-panel-body {
    position: relative;
    min-height: 300px; }
  .chart-panel .chart-panel-body-overflow {
    overflow: auto; }
  .chart-panel .chart {
    padding: 0; }
  .chart-panel .chart-legends {
    margin: 20px 0 0 0;
    border-top: 1px solid #B1B3B3; }
  .chart-panel .chart-panel-inner {
    border-left: 1px solid #B1B3B3; }
  .chart-panel .chart-panel-inner:first-child {
    border-left: none; }

.chart-loading-window {
  width: 100%;
  height: 100%;
  min-height: 80px;
  position: absolute;
  left: 0px;
  top: 0px;
  background-color: #FFFFFF;
  opacity: 0.8; }
  .chart-loading-window .empty-indicator, .chart-loading-window .error-indicator, .chart-loading-window .loading-indicator {
    position: absolute;
    width: 100px;
    height: 100px;
    margin: -50px 0 0 -50px;
    left: 50%;
    top: 50%; }
    .chart-loading-window .empty-indicator img, .chart-loading-window .error-indicator img, .chart-loading-window .loading-indicator img {
      width: 100%;
      height: auto; }
    .chart-loading-window .empty-indicator i.fa, .chart-loading-window .error-indicator i.fa, .chart-loading-window .loading-indicator i.fa {
      font-size: 100px;
      position: relative;
      top: 50%;
      left: 50%; }
  .chart-loading-window .empty-indicator i.fa {
    margin: -60px 0 0 -34.29px; }
  .chart-loading-window .error-indicator i.fa {
    margin: -60px 0 0 -34.29px; }

.chart .clear:after {
  content: "";
  display: table;
  clear: both; }