.main-footer { --padding-vertical: var(--space-m); background-color: var(--color-brown); display: grid; grid-template-columns: 0.9fr 1fr 1fr 0.9fr; column-gap: calc(var(--space-m)); border-top: var(--border); margin-top: -1px; font-size: 1rem; } .main-footer .first-column { display: flex; flex-direction: column; justify-content: space-between; } .main-footer p { margin-bottom: 1rem; } .main-footer .social-icons { margin-bottom: 2rem; } .main-footer form input { width: 100%; border-bottom: var(--border); padding-bottom: 0.5rem; } .main-footer form input::after { content: "→"; } @media screen and (max-width: 800px) { .main-footer { grid-template-columns: 1fr; row-gap: 1rem; } }