<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Purus, donec nunc eros, ullamcorper id feugiat quisque aliquam sagittis. Sem turpis sed viverra massa gravida pharetra. Non dui dolor potenti eu dignissim fusce. Ultrices amet, in curabitur a arcu a lectus morbi id. Iaculis sed interdum lacus. Lorem quis viverra ullamcorper sed</p>

                                

<h3 class="font-primary">Proxima Nova</h3>

                                

<article class="card blogs-item border-0">
    <a href="#">
        <img src="./" alt="..." class="card-img-top rounded-0">
    </a>
    <div class="card-body d-flex flex-column align-items-start bg-light">
        <h2 class="card-title text-primary font-w-700">
            <a class="d-inline-block" href="#">Blog Title</a>
        </h2>
        <p class="card-text">Blog text Lorem ipsum dolor sit amet.</p>
        <a class="btn btn-transparent mt-auto pl-0 text-gray" href="#">
            <i class="fas fa-chevron-right text-primary"></i>
            <span>Read More</span>
        </a>
    </div>
</article>

                                

<!-- Primary Button - Default -->
<a class="btn btn-primary" href="#">
    <i class="fas fa-chevron-right"></i>
    Read more
</a>

<!-- Primary Button -->
<a class="btn btn-primary" href="#">
    Submit CV
</a>

<!-- Blog Button -->
<a class="btn btn-transparent mt-auto pl-0 text-gray" href="#">
    <i class="fas fa-chevron-right text-primary"></i>
    <span>Read More</span>
</a>

                                

<!-- Circle Type Pagination -->
<nav aria-label="Page navigation">
    <ul class="pagination pagination--circle justify-content-center text-center">
        <li class="page-item mx-1 active">
            <a class="page-link rounded-circle text-primary p-0" href="#">1</a>
        </li>
        <li class="page-item mx-1">
            <a class="page-link rounded-circle text-primary p-0" href="#">2</a>
        </li>
        <li class="page-item mx-1">
            <a class="page-link rounded-circle text-primary p-0" href="#">3</a>
        </li>
    </ul>
</nav>

<!-- Arrow Type Pagination -->
<nav aria-label="Page navigation">
    <ul class="pagination justify-content-between text-center">
        <li class="page-item">
            <a class="page-link btn btn-transparent p-0 border-0 bg-transparent" href="#">
                <i class="fas fa-chevron-left text-primary"></i>
                <span class="text-gray">Prev blog title goes here</span>
            </a>
        </li>
        <li class="page-item">
            <a class="page-link btn btn-transparent p-0 border-0 bg-transparent" href="#">
                <span class="text-gray">Next blog title goes here</span>
                <i class="fas fa-chevron-right text-primary ml-2 mr-0"></i>
            </a>
        </li>
    </ul>
</nav>

                                

<!-- Circle Type Social Icon -->
<ul class="list-inline text-center">
    <li class="list-inline-item">
        <a class="d-inline-block text-white bg-primary rounded-circle footer-social text-center" href="#">
            <i class="fab fa-facebook-f social-icon"></i>
        </a>
    </li>
    <li class="list-inline-item">
        <a class="d-inline-block text-white bg-primary rounded-circle footer-social text-center" href="#">
            <i class="fab fa-linkedin-in social-icon"></i>
        </a>
    </li>
</ul>

<!-- Square Type Social Icon -->
<ul class="list-inline text-center">
    <li class="list-inline-item">
        <a class="d-inline-block text-primary text-center blogs-social" href="#">
            <i class="fab fa-facebook-f social-icon"></i>
        </a>
    </li>
    <li class="list-inline-item">
        <a class="d-inline-block text-primary text-center blogs-social" href="#">
            <i class="fab fa-linkedin-in social-icon"></i>
        </a>
    </li>
    <li class="list-inline-item">
        <a class="d-inline-block text-primary text-center blogs-social" href="#">
            <i class="fab fa-twitter social-icon"></i>
        </a>
    </li>
</ul>