has carried this since Mesmerize showed it; this grid never did. */ .rb-boat-grid::before, .rb-boat-grid::after, .rb-boat-grid-item::before, .rb-boat-grid-item::after, .rb-boat-grid-link::before, .rb-boat-grid-link::after, .rb-boat-grid-meta::before, .rb-boat-grid-meta::after, .rb-boat-grid-pagination::before, .rb-boat-grid-pagination::after { content: none; display: none; } .rb-boat-grid { gap: 20px; container-type: inline-size; container-name: rbboatgrid; } .rb-boat-grid-item { background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.12); } .rb-boat-grid-link { display: block; color: inherit; text-decoration: none; } .rb-boat-grid-thumb { overflow: hidden; } .rb-boat-grid-thumb img { display: block; width: 100%; height: auto; } .rb-boat-grid-title { margin: 10px 12px 14px; font-size: 16px; line-height: 1.3; } .rb-boat-grid-meta { display: flex; flex-wrap: wrap; gap: 6px 10px; margin: 0 12px 14px; font-size: 14px; color: #2b3e50; } .rb-boat-grid-data--asking_price { font-weight: 600; } @container rbboatgrid (max-width: 900px) { .rb-boat-grid { --rb-grid-columns: 2; } } @container rbboatgrid (max-width: 540px) { .rb-boat-grid { --rb-grid-columns: 1; } } /* Paging. Only ever on screen when pagination="true". */ .rb-boat-grid-pagination { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 6px; margin-top: 24px; } .rb-boat-grid-pagination .page-numbers { display: inline-block; min-width: 40px; padding: 8px 12px; border: 1px solid rgba(0,0,0,.15); border-radius: 4px; text-align: center; text-decoration: none; color: inherit; line-height: 1.2; } .rb-boat-grid-pagination .page-numbers:hover { background: rgba(0,0,0,.04); } .rb-boat-grid-pagination .page-numbers.current { font-weight: 600; background: rgba(0,0,0,.06); } .rb-boat-grid-pagination .page-numbers.dots { border-color: transparent; min-width: 0; padding: 8px 4px; }