.checkbox-extra-content {
  .content {
    display: none;
    border-style: solid;
    border-width: 0 (2em / 16) (2em / 16) (2em / 16);
    border-color: $mint;
    padding: (12em / 16) (18em / 16) (3em / 16);
    border-radius: 0 0 (4em / 16) (4em / 16);

    h6 {
      margin-bottom: (4px);
    }

    input {
      padding-top: (17em / 14) !important;
      padding-bottom: (16em / 14) !important;
      line-height: 1em !important;
    }
  }

  &.open {
    box-shadow: 0 0 (12em / 16) 0 rgba(0, 0, 0, 0.1);
    margin-bottom: (24em / 16);
    .content {
      display: block;
    }
    label {
      border-bottom-left-radius: 0 !important;
      border-bottom-right-radius: 0 !important;
    }
    input.dynamic-label-input {
      display: inline-block !important;
      margin-bottom: 0;
      margin-left: 8px;
      margin-right: 8px;
      background-color: $mint;
      color: white;
      border-bottom: 2px solid white;
      width: 58px;
      font-size: 12px;
      font-weight: bold;
      text-align: left;
      padding-left: 7px;
      padding-top: 0;
      padding-bottom: 4px;
    }
    .checkbox-mark {
      margin-bottom: 2px;
    }
  }
}