/* Hide element visually, keeping it focusable (with keyboard) and available for screen-readers */
/* stylelint-disable */
.FormGroup {
  /* stylelint-enable */
  /* Set color on root of component. It can be overridden after the @include */
  color: var(--colorsTextDefault, #141414);
  /* Make sure font-family goes across entire component */
  font-family: "Nunito Sans", sans-serif;
  display: flex;
  flex-flow: row wrap;
  margin: 0 -16px 32px;
}
.FormGroup:last-child {
  margin-bottom: 0;
}
.FormGroup > .FormField {
  clear: both;
  flex: 0 1 auto;
  margin: 0;
  padding-left: 16px;
  padding-right: 16px;
}
@media (max-width: 480px) {
  .FormGroup {
    margin: 0 -8px 16px;
  }
  .FormGroup > .FormField {
    padding-left: 8px;
    padding-right: 8px;
  }
}

/* Grouped Vertically */
.FormGroup--grouped {
  display: block;
  margin: 0 0 32px;
}
.FormGroup--grouped:last-child {
  margin-bottom: 0;
}
.FormGroup--grouped > label {
  display: block;
  margin-bottom: 8px;
}
.FormGroup--grouped .FormField {
  display: block;
  margin: 8px 0;
  padding: 0;
}
.FormGroup--grouped .FormField:last-child {
  margin-bottom: 0;
}

/* Equal Width */
.FormGroup--equal-width {
  flex-wrap: nowrap;
}
.FormGroup--equal-width > .FormField {
  flex: 1 1 auto;
  min-width: 0;
  margin-bottom: 0;
}

.FormGroup--widths-1 > .FormField {
  width: 100%;
}

.FormGroup--widths-2 > .FormField {
  width: 50%;
}

.FormGroup--widths-3 > .FormField {
  width: 33.3333333333%;
}

.FormGroup--widths-4 > .FormField {
  width: 25%;
}

.FormGroup--widths-5 > .FormField {
  width: 20%;
}

.FormGroup--widths-6 > .FormField {
  width: 16.6666666667%;
}

.FormGroup--widths-7 > .FormField {
  width: 14.2857142857%;
}

.FormGroup--widths-8 > .FormField {
  width: 12.5%;
}

.FormGroup--widths-9 > .FormField {
  width: 11.1111111111%;
}

.FormGroup--widths-10 > .FormField {
  width: 10%;
}

.FormGroup--widths-11 > .FormField {
  width: 9.0909090909%;
}

.FormGroup--widths-12 > .FormField {
  width: 8.3333333333%;
}

/* Inline Group */
.FormGroup--inline {
  align-items: flex-end;
  display: inline-flex;
}
.FormGroup--inline > label, .FormGroup--inline > .FormField > label {
  display: inline-block;
  width: auto;
  margin-top: 0;
  margin-bottom: 0;
  margin-right: 16px;
  vertical-align: baseline;
}
.FormGroup--inline .FormField .ui.input {
  width: auto;
  vertical-align: middle;
}
.FormGroup--inline .FormField > input, .FormGroup--inline .FormField > select, .FormGroup--inline > input, .FormGroup--inline > select {
  display: inline-block;
  width: auto;
  margin-top: 0;
  margin-bottom: 0;
  vertical-align: middle;
  font-size: 1em;
}

/*# sourceMappingURL=FormGroup.css.map */