section { border-top: 1px solid var(--light-green); & > div:last-child { border-top: 1px solid var(--light-green); margin-top: 7rem; margin-bottom: 7rem; } h1 { font-weight: 800; font-size: 80px; text-transform: uppercase; margin-bottom: 0; line-height: 4rem; span { font-weight: 300; font-size: 60px; } } a { color: var(--text-black); &:hover { text-decoration: underline; } } h3 { padding-top: 1rem; margin: 0; font-weight: 600; } strong { font-size: 20px; color: var(--light-green) } span { font-size: 12px; } .row { display: flex; flex-direction: row; } .map { margin-top: 5rem; width: 100%; height: 40vh; filter: grayscale(1); transition: 300ms; &:hover { filter: grayscale(0); } } .info-wrapper { margin-top: 5rem; > div { flex: 1; img { width: 80%; } } .info { flex: 2; .row { gap: 1.5rem; .green { color: var(--light-green); font-weight: bold; } h4 { flex: 1; text-align: right; margin-top: 0; margin-bottom: 0; font-weight: normal; font-size: 20px; } p { flex: 2; margin-top: 5px; margin-bottom: 5px; } } } }}@media screen and (max-width: 1200px) { section { h1 { font-size: 56px; span { font-size: 42px; } } }}@media screen and (max-width: 900px) { section { h1 { font-size: 48px; span { font-size: 36px; } } }}@media screen and (max-width: 520px) { section { .info-wrapper { flex-direction: column; } }}