body { overflow: hidden; background: #b6b6b5; font-family: 'Roboto', sans-serif; } h1 { color: blue; } .container { display: flex; flex-direction: row; height: 100%; padding: 10px; } .card { flex-grow: 1; margin: 15px; box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22); height: 95%; overflow: auto; background: #fff; border-radius: 6px; display: flex; flex-direction: column; background: #e2e1e0; width: 30%; position: relative; } .card__title { position: absolute; bottom: 0; right: 0; color: darkslategrey; font-size: 2.5rem; font-weight: bolder; padding: 10px; text-transform: uppercase; } .item { margin: 10px; padding: 5px; padding-left: 12px; padding-right: 12; min-height: 5%; max-height: 5%; border: 1px solid rgba(0, 0, 0, 0.2); border-radius: 6px; background: #fff; display: flex; align-items: center; justify-content: space-between; }