.adventurer-figure:hover .adventurer-learn-more,
.adventurer-figure:focus .adventurer-learn-more {
    opacity: 1;
    bottom: 0;
}

.adventurer-learn-more {
    position: absolute;
    bottom: -1rem;
    left: 0;
    width: 100%;
    background-color: #000000;
    color: #ffffff;
    text-align: center;
    padding: .5em;
    opacity: 0;
    transition: opacity .3s, bottom .3s;
}