.event { padding: 4rem 8rem; .hero { h3 { font-size: 2.5rem; padding: 0 0 .5rem 0 } h4 { font-size: 1rem; font-weight: 500; } img { width: 100%; padding: 4rem 0; } } .details { padding: 1rem 0; h2 a { color: var(f-color); } h4 { padding: 1rem 0; a { color: var(f-color); font-size: 1.25rem; font-weight: 600; &:hover { cursor: text } } } p { font-size: 1.05rem; padding: .5rem 0; a:hover { cursor: pointer; text-decoration: underline; } } img { width: 100%; padding: 1rem 0; } } } @media only screen and (max-width: 600px) { .event { padding: 2rem .5rem; .hero h3 { font-size: 2rem; line-height: 2.5rem; margin: 1rem 0; } } }