Card Txt OVerlay

<div class="card-container sm-gutter sm-brr">
    <div class="card__media">
        <img class="img__card-2 img-full sm-brr" src="https://cdn.wallpapersafari.com/52/47/VKjh5B.jpg" alt="" />
        <div class="card__content--card_2">
            <div class="card__heading card_2 xs-gutter para-md semibold-weight">
                Black Panther
            </div>
            <div class="card__author card_2 xs-gutter para-sm">
                by Kurt Wagner
            </div>
        </div>
    </div>

    <div class="card__info sm-gutter para-sm-xs">
        Visit ten places on our planet that are undergoing the biggest
        changes today.Lorem Ipsum is simply dummy text of the printing
        and typesetting industry.
    </div>
    <div class="card__actions sm-gutter">
        <div class="card__read para-sm-xs semibold-weight">
            <a href="">READ</a>
        </div>
        <div class="card__bookmark para-sm-xs semibold-weight">
            <a href="">BOOKMARK</a>
        </div>
        <div class="card__like">
            <a href=""><i class="fas fa-share-alt para-sm"></i></a>
        </div>
        <div class="card__share">
            <a href=""><i class="far fa-heart para-sm"></i></a>
        </div>
        <div class="card__vert">
            <a href=""><i class="fas fa-ellipsis-v para-sm"></i></a>
        </div>
    </div>
</div>