.related-posts { display: flex; align-items: stretch; border-bottom: 1px solid var(--text-color); border-top: 1px solid var(--text-color); } .related-post-wrapper { width: 50%; } .related-post-line { width: 1px; min-width: 1px; background-color: var(--text-color); } .related-post-wrapper .horizontal-card { gap: 22px; height: 100%; border-top: none; } .next-article-horizontal-card .horizontal-card-inner { align-items: flex-end; text-align: right; padding-left: 38px; } .previous-article-horizontal-card .horizontal-card { flex-direction: row-reverse; } .previous-article-horizontal-card .horizontal-card-inner { padding-right: 38px; } /* Styles for large desktop */ @media (min-width: 1439px) { .related-post-wrapper .horizontal-card { gap: calc(1.53vw * var(--scale)); } .next-article-horizontal-card .horizontal-card-inner { padding-left: calc(2.64vw * var(--scale)); } .previous-article-horizontal-card .horizontal-card-inner { padding-right: calc(2.64vw * var(--scale)); } } /* Styles for tablet */ @media (max-width: 991px) { .related-posts { flex-direction: column-reverse; border-top: none; } .related-post-line { display: none; } .related-post-wrapper { width: 100%; } .related-post-wrapper .horizontal-card { border-top: 1px solid var(--text-color); } .next-article-horizontal-card .horizontal-card-inner { padding-left: 0px; } .previous-article-horizontal-card .horizontal-card-inner { padding-right: 0px; } .related-posts .small-card-image-link { margin-bottom: 0px !important; } } /* Styles for mobile */ @media (max-width: 479px) { .related-post-wrapper .horizontal-card { gap: 17px; } }