.profiles {
  background-color: $color-cyan_shade1;
  @include for-size(phone-only) {
    padding: 5%;
  }
  @include for-size(tablet-portrait-up) {
    padding: 5% 15%;
  }
  &__wrapper {
    background-color: #fff;
    padding: 3% 1em;
    @include for-size(tablet-portrait-up) {
      padding: 3% 1em 2em;
    }
  }
  &__description {
    display: inline-block;
    margin: $spacer-small;
    &--label {
      display: inline-block;
      text-transform: capitalize;
      vertical-align: baseline;
    }
  }
  &__caption {
    padding: 0 5%;
    @include for-size(tablet-landscape-up) {
      text-align: right;
      display: inline-block;
      float: right;
      margin: 1em 0;
    }
    .call-to-action__item--text {
      text-transform: inherit;
      padding: 0 .5em;
      @include for-size(tablet-portrait-up) {
        margin: 1em 0;
        padding: 0 1em 0 .5em;
      }
    }
  }
  &__inner {
    padding: 0 1em;
    @include for-size(tablet-portrait-up) {
      padding: 0 10%;
    }
    .error-list__item,
    .errorlist__item,
    .error  {
      @include for-size(tablet-landscape-up) {
        padding: 0 5% 0 25%;
      }
    }
  }
  &__form {
    .call-to-action__item--text  {
      @include for-size(desktop-up) {
        margin: 2em 26% 0;
      }
    }
    ~ .call-to-action__button--previous {
      @include for-size(desktop-up) {
        margin: 1em 1em 0 26%;
      }
    }
    .call-to-action--group {
      @include for-size(desktop-up) {
        margin: 0 26% 1em;
        padding: 0;
      }
    }
    [type="checkbox"],
    [type="radio"] {
      & ~ label {
        @include for-size(desktop-up) {
          padding: 0 0 0 26%;
        }
      }
    }
    .input-hint, .input-group,
    .helptext, .errorlist, .error-list {
      @include for-size(desktop-up) {
        padding: 0 5% 0 25%;
      }
    }
    input[type="text"],
    input[type="number"],
    input[type="password"],
    input[type="email"],
    input[type="tel"],
    input[type="search"],
    input[type="week"],
    input[type="date"],
    input[type="month"],
    input[type="datetime"],
    input[type="datetime-local"],
    input[type="url"],
    select {
      @include for-size(desktop-up) {
        width: 73%;
        display: inline-block;
      }
    }
  }
  &__terms {
    display: block;
    &--link {
      display: inline-block;
      vertical-align: middle;
    }
  }
  .heading__subtitle {
    display: inline-block;
    text-transform: inherit;
    vertical-align: middle;
  }
}
