$secondary-basis: layout-width(secondary, min);
$primary-basis: layout-width(primary, min);
$relative-size: $primary-basis / $secondary-basis;

.p_g2 {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-start;
  margin-top: -1 * spacing(loose);
  margin-left: -1 * spacing(loose);
}

.p_vt {
  flex: $relative-size $relative-size $primary-basis;
  min-width: 51%;
}

.p_oz {
  flex: 1 1 $secondary-basis;
  min-width: 0;
}

.p_jc {
  flex: 1 1 100%;
}

.p_ao {
  min-width: 0;
  flex: 1 1 100%;
}

.p_vt,
.p_ao {
  max-width: calc(100% - #{spacing(loose)});
  margin-top: spacing(loose);
  margin-left: spacing(loose);

  + .p_ao {
    @include page-content-when-not-fully-condensed {
      padding-top: spacing(loose);
      border-top: border();
    }
  }
}

.p_u6 {
  display: flex;
  flex-wrap: wrap;
  margin-top: -1 * spacing(loose);
  margin-left: -1 * spacing(loose);
}

.p_fu {
  flex: $relative-size $relative-size $primary-basis;
}

.p_gi {
  flex: 1 1 $secondary-basis;
  padding: spacing(loose) spacing(loose) 0;

  @include page-content-when-layout-not-stacked {
    padding: spacing(loose) spacing(loose) spacing(loose) 0;
  }
}

.p_gi,
.p_fu {
  min-width: 0;
  max-width: calc(100% - #{spacing(loose)});
  margin-top: spacing(loose);
  margin-left: spacing(loose);
}