main { padding: 2em; gap: 2em; width: 100%; display: flex; flex-direction: column; align-items: center; } .overview { width: 100%; padding: 20px; font-size: x-large; text-align: center; } .screenshot { padding: 20px; } #jumbo { padding: 3em 0 0; } .longDescription { font-size: 1.5rem; padding: 20px; text-align: justify; max-width: 700px; } .image img { max-height: 450px; } .longDescription h2 { display: flex; justify-content: center; } .title { font-size: 2.6em; margin: 0.2em; text-align: center; } .row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-evenly; flex-direction: row; gap: 4rem; } main > section { flex-direction: column; display: flex; border-radius: 1rem; background: rgba(0 0 0 / 0.3); padding: 2rem; width: 90%; transition: scale 0.2s; } main > section:hover { scale: 1.03; } @media (max-width: 1300px) { .row { flex-direction: column; } } .buttonRow { display: flex; align-items: center; justify-content: space-evenly; gap: 1rem; flex-wrap: wrap; } .buttonRow > * { flex: 1; }