<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<section class="main-content py-5">
<div class="container">
<div class="row title">
<div class="col-md-12">
<h4>Title of the Page goes here</h4>
<p>Find the updates on Latest News in this area</p>
</div>
</div>
<div class="row">
<div class="col-md-9 pr-1">
<div class="row mb-2">
<div class="col-md-12">
<div class="card ">
<div class="card-body">
Insert Rows after rows here in this box
</div>
</div>
</div>
</div>
<div class="row mb-2">
<div class="col-md-12">
<nav aria-label="Page navigation example">
<ul class="pagination">
<li class="page-item">
<a class="page-link" href="#" aria-label="Previous">
<span aria-hidden="true">«</span>
<span class="sr-only">Previous</span>
</a>
</li>
<li class="page-item"><a class="page-link" href="#">1</a></li>
<li class="page-item"><a class="page-link" href="#">2</a></li>
<li class="page-item"><a class="page-link" href="#">3</a></li>
