.search-results__title { display: block; font-size: 2em; line-height: 1; margin-block-end: 1em; } .search-results strong { font-weight: 900; background: var(--primary-accent-transparent); color: var(--ui-text-bold); } #search-results { display: flex; flex-flow: column; max-inline-size: 80ch; } #search-results li:not(:first-child) { border-block-start: 1px solid var(--ui-text-muted); } #search-results li { padding-block: 1em; } .search-result-page-title { font-size: 1.25em; display: block; margin-block-end: 1rem; } .search-result-item p { line-height: 1.5; } #search-form { inline-size: 100%; max-inline-size: 18rem; display: grid; grid-template-columns: 20ch 8ch; gap: 1rem; } #search-input { background: var(--ui-overlay); color: var(--ui-overlay-text); border-radius: 100rem; border: 0; padding: 0.5rem 1rem; box-sizing: border-box; resize: horizontal; inline-size: 100%; grid-column: 1; block-size: 2rem; line-height: 1rem; font-size: 0.75rem; } #search-submit { padding: 0.5rem 1rem; border: 0; background: var(--primary-accent); color: var(--primary-accent-text); border-radius: 4px; grid-column: 2; block-size: 2rem; line-height: 1rem; font-size: 0.75rem; }