.main { flex: 1; display: flex; flex-flow: column; .home { margin-top: 2rem; display: flex; width: 60rem; max-width: 90vw; align-items: flex-start; align-self: center; article { padding-left: 1rem; } .flyer { width: 20rem; max-width: 30vw; } nav { margin-bottom: 1rem; } p { } h2 { font-family: var(--font-details); margin: -0.5rem 0; font-size: 2rem; font-weight: 400; } h3 { font-size: 0.75rem; color: var(--fg-1); font-weight: 700; text-transform: uppercase; margin: 0; } } } @media only screen and (max-width: 992px) { .main { .home { flex-flow: column; align-items: center; article { padding-left: 0px; } .flyer { width: 50vw; max-width: 50vw; } } } } @media only screen and (max-width: 641px) { .main { .home { article { text-align: justify; } .flyer { width: 90vw; max-width: 90vw; padding-bottom: 2rem; padding-bottom: 2rem; } nav { display: flex; align-items: center; flex-flow: column; } } } }