<div class="card border-0 mb-md-0 mb-3 box-hover">
    <img class="card-img-top" src="assets/img/cards/1a.jpg" alt="card image" />
    <div class="card-body py-4">
        <h5 class="mb-4">Idea Generator</h5>
        <div class="mb-4">
            <p>Lorem ipsum dolor sit amet, consect adipiscing elit sed do eiusmod Lorem ipsum dolor sit amet ben consect.</p>
        </div>
    </div>
    <div class="card-footer">
        <div class="d-flex align-items-center justify-content-between">
            <a href="#">Discover</a>
            <span class="card-arrow-icon"></span>
        </div>
    </div>
</div>

<div class="card border-0 mb-md-0 mb-3 box-hover">
    <div class="card-body py-4">
        <h5 class="mb-4">Idea Generator</h5>
        <div class="mb-4">
            <p>Lorem ipsum dolor sit amet, consect adipiscing elit sed do eiusmod Lorem ipsum dolor sit amet ben consect.</p>
        </div>
    </div>
    <div class="card-footer">
        <div class="d-flex align-items-center justify-content-between">
            <a href="#">Learn More</a>
            <span class="card-arrow-icon"></span>
        </div>
    </div>
</div> 

<div class="card border-0 mb-md-0 mb-3 box-hover">
    <div class="card-body py-4">
        <span class="mt-3 mb-3 text-muted font-size-12 d-block text-uppercase">today’s story</span>
        <h5 class="mb-4">It is better to fail in originality than to succeed in imitation</h5>
    </div>
    <div class="card-footer">
        <div class="d-flex align-items-center justify-content-between">
            <a href="#">Explore More</a>
            <span class="card-arrow-icon"></span>
        </div>
    </div>
</div> 

<div class="card border-0 mb-md-0 mb-3 box-hover">
    <div class="card-body py-4">
        <h6 class="mb-4">Success isn't just about what you accomplish in your life; it's about what you inspire others to do</h6>
        <div class="mb-3">
            <p>Lorem ipsum dolor sit amet, consect adipiscing elit sed do eiusmod.</p>
        </div>
    </div>
    <div class="card-footer">
        <div class="d-flex align-items-center justify-content-between">
            <a href="#">More Information</a>
            <span class="card-arrow-icon"></span>
        </div>
    </div>
</div> 

<div class="card border-0 mb-md-0 mb-3 box-hover">
    <a href="#"><img class="card-img-top" src="assets/img/cards/3a.jpg" alt="card image" /></a>
    <div class="card-body py-4">
        <a href="#" class="mb-2 d-block">Travel</a>
        <h5 class="mb-4"><a href="#">Summer mountain hike</a></h5>
        <div class="mb-4">
            <p>Best suite for your small startup business
                lorem ipsum dolor sit amet consiquest.</p>
        </div>
    </div>
    <div class="card-footer">
        <div class="d-flex align-items-center">
            <img class="avatar-sm rounded-circle mr-3" src="assets/img/avatar1.jpg" alt="Jonathan Smith" />
            <span>Jonathan Smith</span>
        </div>
    </div>
</div>

<div class="card border-0 mb-md-0 mb-3 box-hover">
    <img class="card-img-top" src="assets/img/cards/4a.jpg" alt="card image" />
    <div class="card-footer">
        <div class="d-flex align-items-center justify-content-between">
            <a href="#">Wall Street Journal</a>
            <span class="card-arrow-icon"></span>
        </div>
    </div>
</div>

<div class="card border-0 mb-md-0 mb-3 box-hover">
    <img class="card-img-top" src="assets/img/cards/5a.jpg" alt="card image" />
    <div class="card-body py-4">
        <h6 class="mb-2">Buddhist monk photography</h6>
        <div>
            <p>Best suite for your small startup business</p>
            <a href="#">Learn More</a>
        </div>
    </div>
</div>

<div class="card border-0 row no-gutters flex-column flex-md-row box-hover">
    <div  class="flex-column col-md-5">
        <img class="card-img flex-grow-1 h-100" src="assets/img/cards/6a.jpg" alt="" />
    </div>
    <div class="card-body d-flex align-items-center col-md-7 p-5">
        <div>
            <h6 class="mb-3">Success is not final, Failure is not fatal</h6>
            <p class="text-muted">Best suite for your small startup business success is not final; failure is not fatal</p>
            <a href="#">Learn More</a>
        </div>
    </div>
</div>

<div class="card border-0 mb-md-0 mb-3 box-hover">
    <div class="card-body p-md-5 p-4">
        <h5 class="text-primary">Devops Engineer</h5>
        <p class="text-muted mb-4">$ 3000 - 4500 + VAT</p>
        <p class="text-muted">New York</p>
        <a href="#" class="btn btn-sm btn-pill btn-outline">Apply Now</a>
    </div>
</div> 

<div class="card border-0 mb-md-0 mb-3 box-hover">
    <div class="card-body row align-items-center">
        <div class="col-md-5 mb-md-0 mb-3">
            <a href="#"><img class="card-img" src="assets/img/cards/8a.jpg" alt=""></a>
        </div>
        <div class="col-md-7">
            <a href="#">Accessories</a>
            <h6 class="my-2"><a href="#">We started a new trend withthe
                kids and mom</a></h6>
            <span class="font-size-14 text-muted">03 Mar 2018</span>
        </div>
    </div>
</div>

<div class="card border-0 mb-md-0 mb-3 box-hover">
    <div class="card-body row align-items-center">
        <div class="col-md-4 mb-md-0 mb-3">
            <a href="#"><img class="card-img" src="assets/img/cards/9a.jpg" alt=""></a>
        </div>
        <div class="col-md-8">
            <h6 class="my-2 font-weight-normal"><a href="#">Denim men’s winter shoe Rucksack
            </a></h6>
            <span class="font-size-14 h6">$29.00</span>
            <div class="mt-3">
                <a href="#" class="btn btn-sm btn-pill btn-solid-dark">Add to cart</a>
            </div>
        </div>
    </div>
</div>

<a href="#" class="card border-0 bg-dark box-hover">
    <img class="card-img rounded opacity-90" src="assets/img/cards/10a.jpg" alt="card image" />
    <div class="card-img-overlay">
        <h6 class="mb-0 text-white">Avila, Spain</h6>
        <span class="font-size-14 mb-0 text-white">5 Days City Tour</span>
    </div>
</a>