.tui-climate-table {
  th,
  td {
    width: 15%;
    text-align: center;

    &:nth-child(4) {
      display: none;
    }

    &:last-child {
      width: 30%;
      text-align: left;
    }
  }

  th {
    /* stylelint-disable declaration-no-important */
    vertical-align: middle !important; //TODO: Remove Bootstrap and !important
    /* stylelint-enable */

    span {
      display: none;
    }

    .pictogram,
    span {
      vertical-align: middle;
    }
  }

  @include breakpoint(sm) {
    th,
    td {
      width: 20%;

      &:last-child {
        width: 20%;
      }

      &:nth-child(4) {
        display: table-cell;
      }
    }
  }

  @include breakpoint(md) {
    th,
    td {
      span {
        display: inline;
      }
    }
  }

  @include breakpoint(lg) {
    th,
    td {
      width: 15%;

      &:last-child {
        width: 30%;
      }
    }
  }
}