.text-truncate-3-lines { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis } .card-vertical { display: flex; flex-direction: column; height: 100% } .card.poll-item, .card.post-item { border: none; box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1); transition: all 0.3s ease; background-color: #fefefe; position: relative; cursor: pointer; } .card.poll-item:hover, .card.post-item:hover { transform: translateY(-5px); box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15); border-color: #007bff; } .card-vertical .card-img-top { width: 100%; height: 230px; border-top-left-radius: inherit; border-top-right-radius: inherit } .card-vertical .placeholder-image { height: 180px; background-color: #f8f9fa; color: #6c757d; display: flex; align-items: center; justify-content: center; font-size: 3rem; border-top-left-radius: inherit; border-top-right-radius: inherit } .card-vertical .card-body { flex-grow: 1; display: flex; flex-direction: column } .card-vertical .mt-auto { margin-top: auto !important } .card-vertical .meta-info small { display: block; margin-bottom: .25rem } @media (min-width:576px) { .card-vertical .meta-info small { display: inline-block; margin-bottom: 0 } .card-vertical .meta-info small:not(:last-child):after { content: "|"; margin: 0 .5rem; color: #6c757d } }