.filterContainer { display: flex; justify-content: flex-end; margin-bottom: 10px; } .filterText { margin-left: 5px; } .footer { composes: modalFooter from '~Components/Modal/ModalFooter.css'; justify-content: space-between; padding: 15px; } .leftButtons, .rightButtons { display: flex; flex: 1 0 50%; flex-wrap: wrap; } .rightButtons { justify-content: flex-end; } .deleteButton { composes: button from '~Components/Link/Button.css'; margin-right: 10px; } .importMode, .bulkSelect { composes: select from '~Components/Form/SelectInput.css'; margin-right: 10px; width: auto; } .errorMessage { color: var(--dangerColor); } @media only screen and (max-width: $breakpointSmall) { .footer { .leftButtons, .rightButtons { flex-direction: column; } .leftButtons { align-items: flex-start; } .rightButtons { align-items: flex-end; } a, button { margin-left: 0; &:first-child { margin-bottom: 5px; } } } }