/* colors */
/* logo icon colors */
/* color shades */
/* heatmap display */
/* categorical display */
/* colors */
/* logo icon colors */
/* color shades */
/* heatmap display */
/* categorical display */
/* colors */
/* logo icon colors */
/* color shades */
/* heatmap display */
/* categorical display */
/* colors */
/* logo icon colors */
/* color shades */
/* heatmap display */
/* categorical display */
/* /styles/mixins.scss */
.gio-kpi-card {
  position: relative;
  width: 100%; }
  .gio-kpi-card__title, .gio-kpi-card__single-value, .gio-kpi-card__values, .gio-kpi-card__triple-values {
    margin-left: 15px; }
  .gio-kpi-card__title {
    align-items: center;
    color: #a3a3a3;
    display: flex;
    margin-top: 10px;
    width: calc(100% - 70px); }
    .gio-kpi-card__title__label {
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap; }
    .gio-kpi-card__title__icon {
      margin-left: 5px; }
      .gio-kpi-card__title__icon svg {
        max-height: 12px;
        max-width: 12px;
        width: 12px;
        margin-bottom: 2px;
        vertical-align: middle; }
  .gio-kpi-card__single-value, .gio-kpi-card__values, .gio-kpi-card__triple-values {
    align-items: center;
    display: flex;
    width: calc(100% - 65px); }
  .gio-kpi-card__single-value__value, .gio-kpi-card__values__value-one__value, .gio-kpi-card__values__value-two__value, .gio-kpi-card__triple-values__value-one__value, .gio-kpi-card__triple-values__value-two__value, .gio-kpi-card__triple-values__value-three__value {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap; }
  .gio-kpi-card__values__value-one, .gio-kpi-card__values__value-two {
    align-items: center;
    display: flex;
    width: 50%; }
  .gio-kpi-card__values__value-two {
    margin-left: 10px; }
  .gio-kpi-card__triple-values__value-one, .gio-kpi-card__triple-values__value-two, .gio-kpi-card__triple-values__value-three {
    align-items: center;
    display: flex;
    width: 33%; }
  .gio-kpi-card__triple-values__value-two, .gio-kpi-card__triple-values__value-three {
    margin-left: 10px; }
  .gio-kpi-card__triple-values__value-one__icon, .gio-kpi-card__triple-values__value-two__icon, .gio-kpi-card__triple-values__value-three__icon, .gio-kpi-card__values__value-one__icon, .gio-kpi-card__values__value-two__icon, .gio-kpi-card__single-value__icon {
    margin-right: 5px; }
    .gio-kpi-card__triple-values__value-one__icon svg, .gio-kpi-card__triple-values__value-two__icon svg, .gio-kpi-card__triple-values__value-three__icon svg, .gio-kpi-card__values__value-one__icon svg, .gio-kpi-card__values__value-two__icon svg, .gio-kpi-card__single-value__icon svg {
      vertical-align: middle; }
  .gio-kpi-card__main-icon {
    position: absolute;
    right: 20px; }
    .gio-kpi-card__main-icon svg {
      max-height: 24px;
      max-width: 24px;
      width: 24px;
      height: 24px; }
  .gio-kpi-card--align-center .gio-kpi-card__title,
  .gio-kpi-card--align-center .gio-kpi-card__single-value,
  .gio-kpi-card--align-center .gio-kpi-card__values,
  .gio-kpi-card--align-center .gio-kpi-card__triple-values {
    justify-content: center; }
  .gio-kpi-card--align-center .gio-kpi-card__triple-values__value-one, .gio-kpi-card--align-center .gio-kpi-card__triple-values__value-two, .gio-kpi-card--align-center .gio-kpi-card__triple-values__value-three {
    justify-content: center; }
  .gio-kpi-card--sm {
    height: 75px; }
    .gio-kpi-card--sm .gio-kpi-card__title__label {
      font-family: "Barlow", "Roboto", "Lato", sans-serif;
      font-size: 13px;
      line-height: 20px; }
    .gio-kpi-card--sm .gio-kpi-card__triple-values__value-one__icon,
    .gio-kpi-card--sm .gio-kpi-card__triple-values__value-two__icon,
    .gio-kpi-card--sm .gio-kpi-card__triple-values__value-three__icon,
    .gio-kpi-card--sm .gio-kpi-card__values__value-one,
    .gio-kpi-card--sm .gio-kpi-card__values__value-two,
    .gio-kpi-card--sm .gio-kpi-card__single-value__value {
      font-family: "Barlow", "Roboto", "Lato", sans-serif;
      font-size: 23px;
      line-height: 35px; }
    .gio-kpi-card--sm .gio-kpi-card__triple-values__value-one__icon svg,
    .gio-kpi-card--sm .gio-kpi-card__triple-values__value-two__icon svg,
    .gio-kpi-card--sm .gio-kpi-card__triple-values__value-three__icon svg,
    .gio-kpi-card--sm .gio-kpi-card__values__value-one__icon svg,
    .gio-kpi-card--sm .gio-kpi-card__values__value-two__icon svg,
    .gio-kpi-card--sm .gio-kpi-card__single-value__icon svg {
      max-height: 12px;
      max-width: 12px;
      width: 12px; }
    .gio-kpi-card--sm .gio-kpi-card__main-icon {
      top: 25px; }
  .gio-kpi-card--md {
    height: 92px; }
    .gio-kpi-card--md .gio-kpi-card__triple-values__value-one,
    .gio-kpi-card--md .gio-kpi-card__triple-values__value-two,
    .gio-kpi-card--md .gio-kpi-card__triple-values__value-three,
    .gio-kpi-card--md .gio-kpi-card__values__value-one,
    .gio-kpi-card--md .gio-kpi-card__values__value-two,
    .gio-kpi-card--md .gio-kpi-card__single-value__value {
      font-family: "Barlow", "Roboto", "Lato", sans-serif;
      font-size: 34px;
      line-height: 51px; }
    .gio-kpi-card--md .gio-kpi-card__triple-values__value-one__icon svg,
    .gio-kpi-card--md .gio-kpi-card__triple-values__value-two__icon svg,
    .gio-kpi-card--md .gio-kpi-card__triple-values__value-three__icon svg,
    .gio-kpi-card--md .gio-kpi-card__values__value-one__icon svg,
    .gio-kpi-card--md .gio-kpi-card__values__value-two__icon svg,
    .gio-kpi-card--md .gio-kpi-card__single-value__icon svg {
      max-height: 16px;
      max-width: 16px;
      width: 16px; }
    .gio-kpi-card--md .gio-kpi-card__main-icon {
      top: 33px; }
  .gio-kpi-card--no-main-icon .gio-kpi-card__title {
    width: calc(100% - 30px); }
  .gio-kpi-card--no-main-icon .gio-kpi-card__triple-values,
  .gio-kpi-card--no-main-icon .gio-kpi-card__single-value,
  .gio-kpi-card--no-main-icon .gio-kpi-card__values {
    align-items: center;
    display: flex;
    width: calc(100% - 30px); }
  .gio-kpi-card--lg {
    height: 100px; }
    .gio-kpi-card--lg .gio-kpi-card__triple-values__value-one,
    .gio-kpi-card--lg .gio-kpi-card__triple-values__value-two,
    .gio-kpi-card--lg .gio-kpi-card__triple-values__value-three,
    .gio-kpi-card--lg .gio-kpi-card__values__value-one,
    .gio-kpi-card--lg .gio-kpi-card__values__value-two,
    .gio-kpi-card--lg .gio-kpi-card__single-value__value {
      font-size: 45px;
      line-height: 51px; }
    .gio-kpi-card--lg .gio-kpi-card__triple-values__value-one__icon svg,
    .gio-kpi-card--lg .gio-kpi-card__triple-values__value-two__icon svg,
    .gio-kpi-card--lg .gio-kpi-card__triple-values__value-three__icon svg,
    .gio-kpi-card--lg .gio-kpi-card__values__value-one__icon svg,
    .gio-kpi-card--lg .gio-kpi-card__values__value-two__icon svg,
    .gio-kpi-card--lg .gio-kpi-card__single-value__icon svg {
      max-height: 16px;
      max-width: 16px;
      width: 16px; }
    .gio-kpi-card--lg .gio-kpi-card__main-icon {
      top: 38px; }
  .gio-kpi-card--clickable {
    background-color: #ffffff;
    border-radius: 5px;
    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 2px 1px -1px rgba(0, 0, 0, 0.12), 0 1px 3px 0 rgba(0, 0, 0, 0.2); }
    .gio-kpi-card--clickable:hover {
      box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12);
      cursor: pointer;
      transition: box-shadow .09s; }
    .gio-kpi-card--clickable:active {
      background-color: #f4f4f4;
      transition: background-color .09s; }
  .gio-kpi-card--bar-tag-primary {
    border-left: 5px solid #58bfb8; }
  .gio-kpi-card--bar-tag-secondary {
    border-left: 5px solid #007a87; }