<link href='https://fonts.googleapis.com/css?family=Assistant' rel='stylesheet'>

.header-table {
  background: black;
  color: white;
  font-size: 20px;
}

.header-list-exercises {
  color: #EA219A;
}

.number-list-exercises {
  background: #EA219A;
}

.day-header-training {
  font-family: 'Assistant';
  font-style: normal;
  font-weight: 600;
  font-size: 36px;
  line-height: 65px;
  text-align: center;
  color: #EA219A;
}

.notes, .note-header-training {
  font-family: 'Assistant';
  font-style: normal;
  font-weight: 600;
  font-size: 24px;
  text-align: center;
  line-height: 60px;
}

.exercise-name {
  background: #C8C8C8;
}

.full-width-row {
  background: #C8C8C8;
  color: #EA219A;
}


@media screen and (max-width: 600px) {
  table {
    border: 0;
  }

    table caption {
      font-size: 1.3em;
    }

  .header-table, table thead {
    border: none;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
  }

    table tr {
      border-bottom: 3px solid #ddd;
      display: block;
      margin-bottom: .625em;
    }

    table td {
      border-bottom: 1px solid #ddd;
      display: block;
      font-size: .8em;
      text-align: right;
    }

      table td::before {
     
        content: attr(data-label);
        float: left;
        font-weight: bold;
        text-transform: uppercase;
      }

      table td:last-child {
        border-bottom: 0;
      }
}