.wrap-patient-info.show {
  .patient-info { display: table; }
}
.patient-info-caption {
  color: $text-on-base-color;
  display: block;
  font-size: 18px;
  font-weight: 700;
  height: 34px;
  line-height: 34px;
  overflow: hidden;
  position: relative;
  .patient-info-caption-btn {
    cursor: pointer;
    float: right;
    height: 34px;
    padding-right: 30px;
    &:after { font-size: 14px; }
  }
}
.patient-info {
  display: none;
  margin-bottom: -5px;
  overflow: hidden;
  padding-top: 10px;
  width: 100%;
  .patient-info-group-1 {
    display: table-header-group;
    overflow: hidden; 
  }
  .patient-info-group-2 {
    display: table-footer-group;
    margin-left: 5px;
    .patient-info-item { white-space: nowrap; }
  }
  
}
@include respond-from(sm) {
  .wrap-patient-info { overflow: hidden; }
  .patient-info-caption { display: none; }
  .patient-info {
    display: block;
    padding-top: 0;
    .patient-info-group-1 {
      display: block;
      overflow: hidden; 
    }
    .patient-info-group-2 {
      display: block;
      float: right;
      margin-left: 5px;
    }
    .column-1 {
      float: left;
      margin-right: 34px;
    }
    .column-2 {
      float: right;
      padding-right: 3px;
      text-align: right;
    }
  }
}
.patient-info-item {
  font-weight: 600;
  margin-bottom: 10px;
  .key {
    display: block;
    font-size: 13px;
    font-weight: 400;
  }
  &.significant {
    font-size: 18px;
    font-weight: 400;
    margin-bottom: 3px;
  }
}
@include respond-from(sm) {
  .patient-info-item {
    margin-bottom: 2px;
    .key { display: inline; }
  }
}