diff --git a/application/views/costListing.php b/application/views/costListing.php
index 20cc131a..8ae8b376 100755
--- a/application/views/costListing.php
+++ b/application/views/costListing.php
@@ -1,14 +1,18 @@
- <script>
- (function(l,q){var e=function(b,c){b.extend(!0,c.defaults,{dom:"<'row'<'col-sm-9'l><'col-sm-3'f>><'row'<'col-sm-12'tr>><'row'<'col-sm-8'i><'col-sm-4'p>>",renderer:"bootstrap"});b.extend(c.ext.classes,{sWrapper:"dataTables_wrapper form-inline dt-bootstrap",sFilterInput:"form-control input-sm",sLengthSelect:"form-control input-sm"});c.ext.renderer.pageButton.bootstrap=function(g,e,r,s,i,m){var t=new c.Api(g),u=g.oClasses,j=g.oLanguage.oPaginate,d,f,n=0,p=function(c,e){var k,h,o,a,l=function(a){a.preventDefault();
-b(a.currentTarget).hasClass("disabled")||t.page(a.data.action).draw(!1)};k=0;for(h=e.length;k<h;k++)if(a=e[k],b.isArray(a))p(c,a);else{f=d="";switch(a){case "ellipsis":d="&hellip;";f="disabled";break;case "first":d=j.sFirst;f=a+(0<i?"":" disabled");break;case "previous":d=j.sPrevious;f=a+(0<i?"":" disabled");break;case "next":d=j.sNext;f=a+(i<m-1?"":" disabled");break;case "last":d=j.sLast;f=a+(i<m-1?"":" disabled");break;default:d=a+1,f=i===a?"active":""}d&&(o=b("<li>",{"class":u.sPageButton+" "+
-f,id:0===r&&"string"===typeof a?g.sTableId+"_"+a:null}).append(b("<a>",{href:"#","aria-controls":g.sTableId,"data-dt-idx":n,tabindex:g.iTabIndex}).html(d)).appendTo(c),g.oApi._fnBindAction(o,{action:a},l),n++)}},h;try{h=b(q.activeElement).data("dt-idx")}catch(l){}p(b(e).empty().html('<ul class="pagination"/>').children("ul"),s);h&&b(e).find("[data-dt-idx="+h+"]").focus()};c.TableTools&&(b.extend(!0,c.TableTools.classes,{container:"DTTT btn-group",buttons:{normal:"btn btn-default",disabled:"disabled"},
-collection:{container:"DTTT_dropdown dropdown-menu",buttons:{normal:"",disabled:"disabled"}},print:{info:"DTTT_print_info"},select:{row:"active"}}),b.extend(!0,c.TableTools.DEFAULTS.oTags,{collection:{container:"ul",button:"li",liner:"a"}}))};"function"===typeof define&&define.amd?define(["jquery","datatables"],e):"object"===typeof exports?e(require("jquery"),require("datatables")):jQuery&&e(jQuery,jQuery.fn.dataTable)})(window,document);
- </script>
+<script>
+$(document).ready(function() {
+
+$('table').tableSort( {
+animation :'slide',
+speed:500
+} );
+});  
+ 
+</script>
 <div class="content-wrapper">
     <!-- Content Header (Page header) -->
     <section class="content-header">
       <h1>
-       <center>Siddharth Industries - Cost Details</center>       
+       <center>COST LIST</center>       
       </h1>
     </section>
     <section class="content">
@@ -16,23 +20,35 @@ collection:{container:"DTTT_dropdown dropdown-menu",buttons:{normal:"",disabled:
             <div class="col-xs-12 text-right">
                 <div class="form-group">
                     <a class="btn btn-primary" href="<?php echo base_url(); ?>CostCenter/addCostCenter">Add New Cost List</a>
-					<a class="btn btn-primary" href="<?php echo base_url(); ?>costcenter/export_cost">Export Cost Details <i class="fa fa-download"aira-hidden="true"></i></a>
+					<a class="btn btn-primary" href="<?php echo base_url(); ?>CostCenter/export_cost">Export Cost Details <i class="fa fa-download"aira-hidden="true"></i></a>
                 </div>
             </div>
         </div>
         <div class="row">
-            <div class="col-xs-12"> 
-                 <table id="datatable" class="table table-bordered table-hover" style="background-color:#fff;font-size:12px;" >
-					<thead>
-						<tr>
-						  <th>Cost Center ID</th>
-						  <th>Cost Name</th>
-						  <th>Description</th>
-						  <th>Create Date</th>
-						  <th>Action</th>                      
-						</tr>
-					</thead>
-					<tbody>
+            <div class="col-xs-12">
+              <div class="box">
+                <div class="box-header">
+                     
+                    <div class="box-tools">
+                        <form action="<?php echo base_url() ?>CostCenter/costListing" method="POST" id="searchList">
+                            <div class="input-group">
+                              <input type="text" name="searchText" value="<?php echo $searchText; ?>" class="form-control input-sm pull-right" style="width: 150px;" placeholder="Search"/>
+                              <div class="input-group-btn">
+                                <button class="btn btn-sm btn-default searchList"><i class="fa fa-search"></i></button>
+                              </div>
+                            </div>
+                        </form>
+                    </div>
+                </div><!-- /.box-header -->
+                 <div class="box-body table-responsive no-padding" >
+                 <table id="datatable" class="table table-hover tableSorter" >
+                       <tr bgcolor="steelblue">
+                      <th>Cost Center ID</th>
+                      <th>Cost Name</th>
+                      <th>Description</th>
+                      <th>Create Date</th>
+                      <th>Action</th>                      
+                    </tr>
                     <?php
                     if(!empty($userRecords))
                     {
@@ -57,28 +73,26 @@ collection:{container:"DTTT_dropdown dropdown-menu",buttons:{normal:"",disabled:
                         }
                     }
                     ?>
-					</tbody>
                   </table>
                   
-                 
+                </div><!-- /.box-body -->
+                <div class="box-footer clearfix">
+                    <?php echo $this->pagination->create_links(); ?>
+                </div>
+              </div><!-- /.box -->
             </div>
         </div>
     </section>
 </div>
 <script type="text/javascript" src="<?php echo base_url(); ?>assets/js/common.js" charset="utf-8"></script>
-  <script type="text/javascript">
-   
-	$(function () {
-   
-    $('#datatable').DataTable({
-      "paging": true,
-      "lengthChange": true,
-      "searching": true,
-      "ordering": true,
-      "info": true,
-      "autoWidth": true
-	   
-    }); 
-  });
-	
+<script type="text/javascript">
+    jQuery(document).ready(function(){
+        jQuery('ul.pagination li a').click(function (e) {
+            e.preventDefault();            
+            var link = jQuery(this).get(0).href;            
+            var value = link.substring(link.lastIndexOf('/') + 1);
+            jQuery("#searchList").attr("action", baseURL + "costListing/" + value);
+            jQuery("#searchList").submit();
+        });
+    });
 </script>