.table {
  display: table;
  border-collapse: collapse;

  .thead {
    display: table-header-group;

    .tr .th {
      vertical-align: bottom;
      border-bottom: 2px solid #ddd;
    }

    &:first-child > .tr:first-child > .th {
      border-top: 0;
    }
  }

  .tbody {
    display: table-row-group;
  }

  .thead > .tr > .th, .tbody > .tr > .td {
    padding: 8px;
    line-height: 1.428571429;
    vertical-align: top;
    border-top: 1px solid #ddd;
  }

  .tr {
    display: table-row;
  }

  .th {
    font-weight: bold;
  }

  .th, .td {
    display: table-cell;
  }
}

.table > .tbody > .tr {
  &.danger > .td {
    background-color: #f2dede;
  }

  &.success > .td {
    background-color: #dff0d8;
  }

  &.warning > .td {
    background-color: #fcf8e3;
  }

  &.active > .td {
    background-color: #f5f5f5;
  }

  & > .td {
  }
}

.table-striped > .tbody > .tr:nth-child(odd) {
  & > .td, & > .th {
    background-color: #f9f9f9;
  }
}

.table {
  display: table;
  border-collapse: collapse;

  .thead {
    display: table-header-group;

    .tr .th {
      vertical-align: bottom;
      border-bottom: 2px solid #ddd;
    }

    &:first-child > .tr:first-child > .th {
      border-top: 0;
    }
  }

  .tbody {
    display: table-row-group;
  }

  .thead > .tr > .th, .tbody > .tr > .td {
    padding: 8px;
    line-height: 1.428571429;
    vertical-align: top;
    border-top: 1px solid #ddd;
  }

  .tr {
    display: table-row;
  }

  .th {
    font-weight: bold;
  }

  .th, .td {
    display: table-cell;
  }
}

.table-striped > .tbody > .tr:nth-child(odd) {
  & > .td, & > .th {
    background-color: #f9f9f9;
  }
}

.table > .tbody > .tr {
  &.danger > .td {
    background-color: #f2dede;
  }

  &.success > .td {
    background-color: #dff0d8;
  }

  &.warning > .td {
    background-color: #fcf8e3;
  }

  &.active > .td {
    background-color: #f5f5f5;
  }

  & > .td {
  }
}

Move css rules so specific classes aren't overwritten
Move css rules so specific classes aren't overwritten
