.new-task { display: flex; overflow: hidden; color: hsl(var(--hue), 30%, 40%); background-color: hsl(var(--hue), 60%, 97%); border: 1px solid hsl(var(--hue), 50%, 93%); border-radius: .25rem; } .new-task-title { margin-bottom: .25rem; font-size: 1rem; font-weight: 700; } .new-task-link { display: flex; align-items: flex-end; justify-content: center; width: 2.5rem; font-size: 1.2rem; background: hsl(var(--hue), 50%, 93%); } .new-task-caption { display: box; margin: 0; overflow: hidden; font-size: .875rem; box-orient: vertical; -webkit-line-clamp: 3; } .new-task-details { flex: 1 0; padding: 1rem; } .new-task * { transition: all .25s ease; } .new-task:hover .new-task-link { background: var(--template-bg-dark); } .new-task-link span { margin-bottom: 10px; color: hsl(var(--hue), 30%, 40%); } .new-task:hover .new-task-link span { color: #fff; } .new-tasks .card-columns { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)) !important; }