
.actionGroups {
  display: flex;
  flex-flow: column nowrap;
}

@media (min-width: 768px) {  .actionGroups {
    flex-flow: row-reverse nowrap;
  }
}

.actionGroups .groupPrimary, .actionGroups .groupSecondary {
  display: inherit;
  align-items: center;
}

.actionGroups .groupPrimary > *, .actionGroups .groupSecondary > * {
  margin: auto;
}

@media (max-width: 767px) {  .actionGroups .groupPrimary > *, .actionGroups .groupSecondary > * {
    margin-bottom: 0.625rem;
  }
}

@media (min-width: 768px) {  .actionGroups .groupPrimary > *, .actionGroups .groupSecondary > * {
    width: auto;
  }
}

.actionGroups .groupPrimary {
  flex-flow: column nowrap;
}

@media (min-width: 768px) {  .actionGroups .groupPrimary {
    flex: 1;
    flex-direction: row-reverse;
  }

  .actionGroups .groupPrimary > * {
    margin: auto 0 auto 0.625rem !important;
  }
}