.footer { flex-grow: 0; min-height: 4rem; display: flex; justify-content: space-between; flex-wrap: wrap; margin-top: 1rem; width: 100%; margin-left: auto; margin-right: auto; flex-direction: column-reverse; div { margin-top: 1rem; } .infobox { text-align: center; } } @media (min-width: 640px) { .footer { max-width: 640px; margin-left: auto; margin-right: auto; flex-direction: row; .infobox { text-align: left; } } } @media (min-width: 768px) { .footer { max-width: 768px; margin-left: auto; margin-right: auto; } } @media (min-width: 1024px) { .footer { max-width: 1024px; margin-left: auto; margin-right: auto; } } @media (min-width: 1280px) { .footer { max-width: 1280px; margin-left: auto; margin-right: auto; } } @media (min-width: 1920px) { .footer { max-width: 1920px; margin-left: auto; margin-right: auto; } }