.discourse-patrons-section-columns { display: flex; justify-content: space-between; @include breakpoint(medium) { flex-direction: column; } .section-column { min-width: calc(50% - 0.5em); max-width: 100%; &:last-child { margin-left: 0.5em; } &:first-child { margin-right: 0.5em; } @include breakpoint(medium) { min-width: 100%; &:last-child { order: 2; } &:first-child { order: 1; } } } } .desc { color: dark-light-choose($primary-medium, $secondary-medium); font-size: 0.8em; } #stripe-elements { border: 1px $primary-low-mid solid; padding: 10px; background-color: $primary-very-low; } #card-element { padding: 20px 0; } .discourse-patrons-payment-details { border: 1px $primary-low-mid solid; background-color: $primary-low; } .discourse-patrons-section-columns { margin: 20px; padding: 20px; .discourse-patrons-billing { .ember-text-field { margin-bottom: 0; } .field { margin-bottom: 10px; } } } .discourse-patrons-fields { .field { width: 25%; } } #card-action { margin: 20px 0; } .discourse-patrons-confirmation { width: 100%; td { padding: 10px; } } .btn-discourse-patrons { white-space: nowrap; }