Style 1:

HTML Example:

<!-- START: page nav -->
<div class="nk-page-nav">
    <div class="nk-page-nav-prev disabled">
        <div class="icon">
            <span class="ion-ios-arrow-left"></span>
        </div>
    </div>
    <a href="#" class="nk-page-nav-next">
        <div class="icon">
            <span class="ion-ios-arrow-right"></span>
        </div>
        <div class="nk-page-nav-title">Foggy Forest</div>
        <div class="nk-page-nav-img">
            <div style="background-image: url('assets/images/portfolio-2-default.jpg');"></div>
        </div>
    </a>
</div>
<!-- END: page nav -->

Style 2:

HTML Example:

<!-- START: page nav -->
<div class="nk-page-nav-2">
    <div class="nk-page-nav-prev disabled">
        <div class="icon">
            <span class="ion-ios-arrow-left"></span>
        </div>
    </div>
    <div class="nk-page-nav-next">
        <div class="icon">
            <span class="ion-ios-arrow-right"></span>
        </div>
        <div class="nk-page-nav-img">
            <img src="assets/images/product-1-1-sm.jpg" alt="Motorola Moto 360 Sport">
        </div>
        <div class="nk-page-nav-title">
            <div class="nk-product-category mt-0">
                In Smart Watches
            </div>
            <h5 class="nk-product-title mb-0">
                <a href="store-product.html?i=3">Motorola Moto 360 Sport</a>
            </h5>
        </div>
    </div>
</div>
<!-- END: page nav -->