/* ===== quote-members-flat =====
   The cover-type choice and the member selectors used to sit inside a grey
   bordered wrapper. The wrapper said nothing the fields did not already say,
   so the selectors now sit straight on the form. */
#quote-form .family-row.family-overview.sub-container,
#quote-form #individualFamilyDetails .family-overview.sub-container,
#quote-form #individualFamilyDetails .family-overview.sub-container.children-only-layout,
#quote-form .quote-step-cover .family-row.sub-container,
#quote-form .quote-step-cover .cover-type-card{
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  border-radius:0!important;
  padding:0!important;
  margin-left:0!important;
  margin-right:0!important;
}
/* The fields keep their own white fill, so they still read as inputs. */
#quote-form .family-row.family-overview.sub-container .family-item,
#quote-form .family-row.family-overview.sub-container .children-count-item,
#quote-form .family-row.family-overview.sub-container select{
  background:#fff!important;
}
/* ===== members to the edges =====
   The member selectors now fill their columns, so the row's outer edges line up
   with the cover-type selectors above them instead of stopping short. */
#quote-form #individualFamilyDetails .family-overview.sub-container .family-item,
#quote-form #individualFamilyDetails .family-overview.sub-container .children-count-item,
#quote-form #individualFamilyDetails .family-overview.sub-container .family-age-pair,
#quote-form #individualFamilyDetails .family-overview.sub-container .family-item.extra-spouse-item{
  padding:0!important;
  margin:0!important;
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
}
#quote-form #individualFamilyDetails .family-overview.sub-container .family-item select,
#quote-form #individualFamilyDetails .family-overview.sub-container .children-count-item select,
#quote-form #individualFamilyDetails .family-overview.sub-container select{
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
  flex:1 1 auto!important;
  box-sizing:border-box!important;
}
/* Equal columns, so the four member selectors read as one row of four. */
@media (min-width:701px){
  #quote-form #individualFamilyDetails .family-overview:not(.children-only-layout){
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    column-gap:.6rem!important;
  }
}
@media (max-width:700px){
  #quote-form #individualFamilyDetails .family-overview:not(.children-only-layout){
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    column-gap:.5rem!important;
    row-gap:.5rem!important;
  }
}
