.news-list { list-style-type: none; padding: 0; } .news-item { border-bottom: 1px solid $background; padding: 1rem 0rem; margin-bottom: 1rem; display: grid; grid-template-columns: 33% 1fr; grid-column-gap: 2rem; } .news-item__image { width: 100%; figure { margin: 0; } img { max-height: 12rem; width: 100%; height: 100%; object-fit: cover; } } .news-item__title { margin-top: 0; } .news-item__date { opacity: 0.8; font-style: italic; } .news-item__summary { font-size: .9rem; } @media (max-width: $md-breakpoint) { .news-item { display: flex; flex-direction: column; padding-top: 0; } .news-item__content { margin-top: 1rem; } }