diff --git a/app/Views/client_basic_info.php b/app/Views/client_basic_info.php
index 335b55eb..0cf659a3 100755
--- a/app/Views/client_basic_info.php
+++ b/app/Views/client_basic_info.php
@@ -64,6 +64,28 @@ input:checked + .slider:before {
     <div class="row">
         <div class="col-12">
             <div class="card-body">
+                    <div class="form-row">
+                        
+                        <div class="form-group">
+                            <label for="">Upload Your Logo</label> <br>
+                            <img 
+                            src="<?=  isset($client['client_logo']) && !empty($client['client_logo']) ? base_url() . "public/uploads/logo/" . $client['client_logo'] : base_url()."public/assets/images/avatar_2x.png" ?>" 
+                            width="75" height="75" 
+                            id="uploadPreview" 
+                            class="avatar img-circle img-thumbnail" 
+                            style="border-radius:25px; border:1px solid #00999E;padding:10px;color:#00999E;" 
+                            alt="avatar"/>
+                          <span style="margin-bottom:5px;">
+                            <input type="file" name="client_logo" id="client_logo" accept="image/*" onchange="PreviewImage();"><br>
+                            <i class="text">( Image dimensions 100 x 100 pixels and size of 200KB. )</i> 
+                          </span>
+                          <br>
+
+                        </div>
+                    </div>
+
+
+
                 <form role="form" class="parsley-examples" method="post" id="general_form" enctype="multipart/form-data">
                 <input type="hidden"  value="<?= csrf_hash() ?>" name="<?= csrf_token() ?>" />    
                 <input type="hidden" name="PrimaryKey" id="general_PrimaryKey" value="<?= isset($client['id']) ? $client['id'] : '' ?>"/>
@@ -125,16 +147,7 @@ input:checked + .slider:before {
                         </div>
                         <hr>
                     </div>
-                    <div class="form-row">
-                        <div class="form-group col-md-6">
-                            <label for="gst">Logo</label>                           
-                            <input type="file" name="client_logo" id="client_logo" accept="image/*" onchange="PreviewImage();"><br>
-                            <i class="text">( Image dimensions 100 x 100 pixels and size of 200KB. )</i> 
-                        </div>                            
-                        <div class="form-group col-md-6 float-right" style="position: relative;top: 20px;">
-                            <img src="<?= isset($client['client_logo']) && !empty($client['client_logo']) ? base_url() . "public/uploads/logo/" . $client['client_logo'] : base_url()."public/assets/images/avatar_2x.png" ?>" width="100" height="100" id="uploadPreview" class="avatar img-circle img-thumbnail" alt="avatar"/>
-                        </div>
-                    </div>
+
 
                     <!-- <div>
                         <label class="switch">
@@ -346,7 +359,7 @@ input:checked + .slider:before {
             if (!allowedExtensions.includes(fileExtension) || file.size > 200 * 1024) {
                 toastr.warning('Maximum file size allowed is 200KB.', 'File size exceeds limit.');
                 fileInput.value = ""; // Clear the file input
-                document.getElementById("uploadPreview").src = "http://ssl.gstatic.com/accounts/ui/avatar_2x.png"; // Remove the preview image
+                document.getElementById("uploadPreview").src = "<?= base_url()?>/public/assets/images/avatar_2x.png"; // Remove the preview image
             } else {
                 var reader = new FileReader();
                 reader.readAsDataURL(file);
diff --git a/app/Views/client_info.php b/app/Views/client_info.php
index b4c286d3..04aad017 100755
--- a/app/Views/client_info.php
+++ b/app/Views/client_info.php
@@ -1,3 +1,11 @@
+<style>
+    #relationship_manager {
+        border-collapse: separate;   /* important */
+        border-spacing: 20px 0;      /* 20px horizontal, 0 vertical */
+    }
+</style>
+
+
 <div id="client_info">
 
     <div class="row">
@@ -34,62 +42,25 @@
                     <div id="collapseOne" class="collapse show" aria-labelledby="headingOne" data-parent="#accordion">
 
                         <div class="card-body" style="position: relative;bottom: 25px;">
-
+                                <h2>Relationship Manager</h2>
+                                <br>
                             <div class="row">
-<!-- 
-                                <div class="col-6">
-
-                                    <table data-custom-table-css="table">
-                                        <tr>
-                                            <td style="font-size: 18px;"></td>
-                                        </tr>
+                                    <table id="relationship_manager">
+                                        <thead>
+                                            <tr style="color:black;">
+                                                <th>Account Manager</th>
+                                                <th>Manager</th>
+                                                <th>Head</th>
+                                            </tr>
+                                        </thead>
+                                        <tbody>
+                                            <tr style="color:black;">
+                                                <td><?= implode(', ', $account_managers) ?></td>
+                                                <td><?= implode(', ', $managers) ?></td>
+                                                <td><?= implode(', ', $heads) ?></td>
+                                            </tr>
+                                        </tbody>
                                     </table>
-                                </div> -->
-
-                                <div class="col-6">
-
-                                    <table data-custom-table-css="table">
-                                        <tr>
-                                            <td style="font-size: 18px;"> <strong> Relationship Manager </strong></td>
-                                        </tr>
-                                    </table>
-
-                                </div>
-
-                            </div>
-
-                            <br>
-
-                            <div class="row">
-
-                                <!-- <div class="col-6">
-                                    <table data-custom-table-css="table">
-                                        <tr>
-                                            <td style="padding: 3px;"></td>
-                                        </tr>
-                                        <tr>
-                                            <td style="padding: 3px;"></td>
-                                        </tr>
-                                    </table>
-                                </div> -->
-
-                                <div class="col-6">
-                                    <table data-custom-table-css="table">
-                                        <tr>
-                                            <td style="padding: 3px;"><label> Account Manager :
-                                                </label> <?= implode(', ', $account_managers) ?></td>
-                                        </tr>
-                                        <tr>
-                                            <td style="padding: 3px;"><label> Manager :
-                                                </label> <?= implode(', ', $managers) ?></td>
-                                        </tr>
-                                        <tr>
-                                            <td style="padding: 3px;"><label> Head : </label>
-                                                <?= implode(', ', $heads) ?>
-                                            </td>
-                                        </tr>
-                                    </table>
-                                </div>
 
                             </div>
 
diff --git a/app/Views/client_kyc.php b/app/Views/client_kyc.php
index aff9953a..0c3e8b40 100755
--- a/app/Views/client_kyc.php
+++ b/app/Views/client_kyc.php
@@ -1,4 +1,35 @@
 <style>
+    #kyc_table #tbody td,
+    #other_docs_table tbody td
+    {
+        background-color: white !important;
+    }
+
+    #kyc_table #tbody tr ,
+    #other_docs_table tbody tr
+    {
+        box-shadow: 0px 2px 4px 0px #00000024;
+        background-color: white;
+        border-radius: 10px;
+    }
+
+    #kyc_table #tbody tr:hover td  ,
+    #other_docs_table tr:hover td
+    {
+        background-color: #e0e0e0 !important;
+    }
+
+    #KYC-DOC-tab .card-body ,
+    #other_docs_table .card-body
+    {
+        background-color: #F5FFFF !important;
+        border-radius: 10px;
+        box-shadow: 0px 4px 4px 0px #00000040;
+    }
+
+    #KYC-DOC-tab thead{
+         padding: 15px !important;
+    }
 
 </style>
 
@@ -12,19 +43,19 @@
                     <table data-custom-table-css="table" id="kyc_table" class="table table-sm mb-0">
                         <thead>
                             <tr>
+                                <th>S.no</th>
                                 <th>Document Name</th>
                                 <th>Status</th>
                                 <th>Action</th>
                             </tr>
                         </thead>
                         <tbody id="tbody">
+                            
                         </tbody>
                     </table>
                 </div> <!-- end table-responsive-->
 
-                <hr>
-
-                <button  class="btn btn-primary waves-effect waves-light btn-sm" id="btn_other_docs">Other Documents</button>                
+                <!-- <button  class="btn btn-primary waves-effect waves-light btn-sm" id="btn_other_docs">Other Documents</button>                 -->
 
             </div>
         </div> <!-- end card -->
@@ -34,6 +65,7 @@
         <div class="col-12">
             <div class="card" style="margin-left: 12px;margin-right: -12px;">
                 <div class="card-body">
+                    <h3>Additional Documents</h3>
                     <form role="form" class="parsley-examples" method="post" id="kyc_form" 
                         enctype="multipart/form-data">
                         <input type="hidden" class="form-control" value="<?= csrf_hash() ?>" name="<?= csrf_token() ?>" />
@@ -44,18 +76,20 @@
 
                             <div class="form-row">
                                 <div class="form-group col-md-4">
-                                    <label for="emp_code">Other Documents<span
+                                    <label for="emp_code">Document Name<span
                                             class="text-danger">*</span></label>
                                     <input type="text" class="form-control" id="other_docs_name" placeholder="Document Name" name="other_docs_name" required>
                                 </div>
                                 <div class="form-group col-md-4">
                                     <label for="kyc_docs">File<span
                                             class="text-danger">*</span></label>
-                                            <input class="form-control" type="file" name="file_name" id="kyc_docs_file" required accept=".pdf, .jpeg, .jpg, .png">
+                                            <input class="form-control" type="file" name="file_name"
+                                            id="kyc_docs_file" 
+                                            required accept=".pdf, .jpeg, .jpg, .png">
                                 </div>
                                 <!-- <div class="form-group col-md-4 align-self-end"> -->
                                 <div class="form-group col-md-4" style="<?= isset($client['id']) ? 'margin-top: 41px;' : 'margin-top: 30px;' ?>">
-                                        <button type="submit" class="btn btn-primary waves-effect waves-light mr-1"id="btnSubmit">Upload</button>
+                                        <button type="submit" class="btn btn-primary waves-effect waves-light mr-1"id="btnSubmit">Save</button>
                                 </div>
                             </div>
 
@@ -412,6 +446,7 @@
 
                 $.each(res.data, function(index, item) {
                     var row = `<tr>
+                                <td>${index+1}</td>
                                 <td>${item.file_name}</td>
                                 <td id="form_${item.id}">
                                     <form class="ajax">
diff --git a/app/Views/client_list.php b/app/Views/client_list.php
index 8275c156..b46846e3 100755
--- a/app/Views/client_list.php
+++ b/app/Views/client_list.php
@@ -48,6 +48,26 @@ table.dataTable thead th {
     color: #16181b !important;
     cursor: pointer !important;
 }   
+
+
+
+.add-from-lead{
+    color:#E26828;
+    border : 0px solid white ;
+    background-color: white;
+    text-decoration: underline ;
+}
+
+.add-from-lead:hover{
+    color:#E26828;
+    border : 0px solid white ;
+    background-color: white;
+    text-decoration: underline ;
+}
+
+
+
+
 </style>
 
 <div class="row" id="client_list">
@@ -69,6 +89,7 @@ table.dataTable thead th {
                     id="tickets-table">
                     <thead class="bg-light">
                         <tr>
+                            <th class="font-weight-medium">S.No</th>
                             <th class="font-weight-medium">Client Name</th>
                             <th class="font-weight-medium">Account Manager</th>
                             <th class="font-weight-medium">Action</th>
@@ -76,8 +97,9 @@ table.dataTable thead th {
                     </thead>
 
                     <tbody>
-                     <?php foreach($clientList as $row){ ?>
+                     <?php foreach($clientList as $index => $row){ ?>
                         <tr >
+                            <td><?=$index+1?></td>
                             <td class="client_info" data-id="<?php echo $row->id; ?>"><?php echo $row->client_name; ?> ( <?php echo $row->short_name; ?> ) </td>
                             <td>
                                 <?php $account_managers = ''; ?>
@@ -278,6 +300,21 @@ $(document).ready(function()
             "<'row'<'col-sm-12'tr>>" + 
             "<'row'<'col-sm-5'i><'col-sm-7'p>>", 
         buttons: [
+ 
+            {
+                text: 'Add From Lead',
+                className: 'btn-filter add-from-lead', // custom class
+                action: function(e, dt, node, config) {
+                    showModal();
+                }
+            },
+            {
+                text: '+ create New Client',
+                className: 'btn-filter buttons-html5', // custom class
+                action: function(e, dt, node, config) {
+                    addClient();
+                }
+            },
             {
                 extend: 'csv',
                 text: 'CSV',
@@ -286,20 +323,6 @@ $(document).ready(function()
                 exportOptions: {
                     columns: ':not(:last-child)'
                 },
-            }, 
-            {
-                text: 'Add From Lead',
-                className: 'btn-filter', // custom class
-                action: function(e, dt, node, config) {
-                    showModal();
-                }
-            },
-            {
-                text: 'Add',
-                className: 'btn-filter', // custom class
-                action: function(e, dt, node, config) {
-                    addClient();
-                }
             }
         ],
 
diff --git a/app/Views/client_onboarding.php b/app/Views/client_onboarding.php
index 059e07fa..5366d1a8 100755
--- a/app/Views/client_onboarding.php
+++ b/app/Views/client_onboarding.php
@@ -258,6 +258,49 @@ body {
         border-radius: 4px;
         border: 1px solid #dee2e6;
     }
+
+    #client_add .nav-pills ,
+    #client_add .nav-link    
+    {
+        background-color: #F5FFFF !important;
+        color : #00999E !important;
+        border-radius:10px;
+        
+    }
+
+    #client_add .nav-pills 
+    {
+        background-color: #F5FFFF !important;
+        color : #00999E !important;
+        box-shadow: 0px 2px 4px 0px #00000040;
+        padding-top: 5px ;
+    }
+
+
+    #client_add .nav-link.active-tab {
+        color: white !important;
+        background-color: #00999E !important;
+        font-size: small !important;
+        padding:8px 16px;
+        border-radius: 10px !important; 
+        box-shadow: 0px 2px 4px 0px #00000040;
+    
+    }
+
+    #hr_activity_history_append_area{
+        padding-top:0; 
+        margin-top:0; 
+        background-color: #F5FFFF !important;
+        border: 2px solid #F5FFFF;
+        border-radius: 10px;
+        box-shadow: 0px 4px 4px 0px #00000040;
+    }
+
+    #hr_activity_history_append_area tbody tr{
+        background-color: white !important;
+    }
+
+
 </style>
 
 
@@ -277,7 +320,7 @@ body {
                 
                 <br>
 
-                <ul class="nav nav-pills navtab-bg">
+                <ul class="nav nav-pills navtab-bg" >
                     <li class="nav-item">
                         <a href="#general-q-tab" data-toggle="tab" aria-expanded="false"
                             class="nav-link px-3 py-2 active" id="general_tab">
@@ -357,7 +400,7 @@ body {
                         <div class="row">
                             <div class="col-12">
                                 <div class="card">
-                                    <div class="card-body" id="hr_activity_history_append_area" style="padding-top:0; margin-top:0;">
+                                    <div class="card-body" id="hr_activity_history_append_area">
                                     </div>
                                 </div>
                             </div> <!-- end col -->
@@ -932,4 +975,16 @@ body {
 
 </script>
 
+<script>
+    $(document).ready(function(){
+    $('#client_add .nav-link').click(function(){
 
+    // change bg color of tab
+        $('#client_add .nav-link').removeClass('active-tab');
+        $(this).addClass('active-tab');
+    
+
+
+    });
+});
+</script>
diff --git a/app/Views/client_policy.php b/app/Views/client_policy.php
index 726deab6..90a5a4bf 100755
--- a/app/Views/client_policy.php
+++ b/app/Views/client_policy.php
@@ -17,6 +17,14 @@
         opacity: 1;
     }
 
+    #lead_modal .modal-dialog{
+        width:600px !important;
+    }
+
+    #lead_modal .modal-body{
+        min-height: 200px !important;
+    }
+
 </style>
 
 <div class="save-indicator" id="saveIndicator">Saved</div>
@@ -231,7 +239,7 @@
 
 <!-- Center modal content -->
 <div class="modal fade" id="lead_modal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="false">
-    <div class="modal-dialog modal-dialog-centered">
+    <div class="modal-dialog modal-dialog-centered modal-lg">
         <div class="modal-content">
             <div class="modal-header">
                 <h4 class="modal-title" id="myCenterModalLabel">Lead List</h4>
diff --git a/app/Views/client_rm.php b/app/Views/client_rm.php
index 7611c2d0..4d3dd823 100755
--- a/app/Views/client_rm.php
+++ b/app/Views/client_rm.php
@@ -1,13 +1,11 @@
-<div class="tab-pane fade" id="RM-tab">
+<div class="tab-pane fade card " id="RM-tab">
     <div class="row">
-        <div class="col-12">
+        <div class="col-12" id="collapseOne">
             <div class="card-body">
 
                 <div class="row float-right" style="position: relative; bottom: 20px; right:13px;">
                         <button class="btn btn-primary btn-sm" id="client_rm_edit" ><span id="rm_icons" class="mdi mdi-lead-pencil"></span> Edit</button>                
                 </div>
-                
-                <hr>
 
                 <form role="form" class="parsley-examples" method="post" id="relation_form" enctype="multipart/form-data">
                     <input type="hidden" class="form-control" value="<?= csrf_hash() ?>" name="<?= csrf_token() ?>" />
diff --git a/app/Views/hr_access_controll.php b/app/Views/hr_access_controll.php
index f3c3a5e4..b7038e53 100644
--- a/app/Views/hr_access_controll.php
+++ b/app/Views/hr_access_controll.php
@@ -16,7 +16,7 @@
                             <input type="hidden" name="<?= 'user' . $key ?>_post_hr_id" value="<?= $value['post_hr_id'] ?>">
                             <input type="hidden" name="<?= 'user' . $key ?>_post_client_id" value="<?= $value['post_client_id'] ?>">
 
-                            <div class="card-header" onclick="toggleAccordion(this)">
+                            <div class="card-header" onclick="toggleAccordion(this)" style="background-color: #F5FFFF;">
                                 <div class="user-info">
                                     <h5 class="mb-0"><?= $value['hr_name'] ?> 
                                         <!-- <i class="mdi mdi-information-outline" aria-hidden="true" data-id="<?= (!empty($value['pre_hr_id']) ? $value['pre_hr_id'] : 0) . '-' . (!empty($value['post_hr_id']) ? $value['post_hr_id'] : 0) ?>"></i> -->
@@ -28,7 +28,7 @@
                                 </div>
                             </div>
                             <div class="card-content">
-                                <div class="content-inner">
+                                <div class="content-inner" style="background-color: #F5FFFF;">
                                     <div class="row">
                                         <div class="col-md-6 col-lg-3">
                                             <div class="section">
diff --git a/app/Views/hr_activity_history.php b/app/Views/hr_activity_history.php
index a6da3ad8..83a6d27b 100644
--- a/app/Views/hr_activity_history.php
+++ b/app/Views/hr_activity_history.php
@@ -25,7 +25,6 @@ table.dataTable tbody td {
 
 <div class="row" style="position: relative;left: 250px;top: 55px;">
     <div class="form-group col-md-3" id="date_div">
-        <!-- <label>ActivityDate<span class="text-danger"></span></label> -->
         <div id="reportrange" class="form-control" style="background: #fff; cursor: pointer; padding: 5px 10px; border: 1px solid #ccc; width: 100%">
             <i class="mdi mdi-calendar-blank"></i>&nbsp;
             <span></span> <i class="mdi mdi-menu-down"></i>
diff --git a/app/Views/layout/header.php b/app/Views/layout/header.php
index 03a3050f..b2ffbf25 100755
--- a/app/Views/layout/header.php
+++ b/app/Views/layout/header.php
@@ -66,6 +66,9 @@
 
     <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;700&display=swap" rel="stylesheet">
 
+    <!-- google icons -->
+    <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0,0&icon_names=image" />
+
 
     <script>
         if ('serviceWorker' in navigator) {
@@ -595,13 +598,16 @@ a.app-badge-secondary:focus, a.app-badge-secondary.focus {
         border-top: 0px solid #fff !important;
         border-bottom: 0px solid #fff !important;
         vertical-align: middle;
+        font-weight: 600 !important;
     }
+    
 
     table[data-custom-table-css="table"] tbody td {
         background: #F5FFFF;   
         padding: 12px;
         border-top: 0px solid #fff !important;
         border-bottom: 2px solid #C3EDEE !important;
+        font-weight: 400 !important;
     }
 
     table[data-custom-table-css="table"] thead th:first-child {
@@ -627,9 +633,13 @@ a.app-badge-secondary:focus, a.app-badge-secondary.focus {
     }
 
     table[data-custom-table-css="table"] {
-    border-collapse: separate !important;
-    border-spacing: 0 8px !important;
-    width: 100% !important;
+        border-collapse: separate !important;
+        border-spacing: 0 8px !important;
+        width: 100% !important;
+    }
+
+    table[data-custom-table-css="table"].dataTable thead th {
+        padding: 15px !important;
     }
 
 
@@ -708,6 +718,9 @@ a.app-badge-secondary:focus, a.app-badge-secondary.focus {
             margin-right:10px !important;
         }
 
+
+
+
     </style>
 
 
@@ -899,31 +912,43 @@ a.app-badge-secondary:focus, a.app-badge-secondary.focus {
         input,
         select,
         textarea {
+            background-color: #F5FFFF !important;
             border-radius: 10px !important;
             box-shadow: 0px 2px 4px 0px #00000024 !important;
-            border-color: #ffff !important;
+            border-color: #F5FFFF !important;
         }
 
-        input[type='file'] {
-            padding:10px !important;
-            background-color: white !important;
+
+
+        /* Chrome, Edge, Safari */
+        input[type="file"]::file-selector-button {
+            background-color: #00999E;   /* button color */
+            color:#000 !important;                /* text color */
+            border: none;                /* remove border */
+            border-radius: 10px;          /* rounded corners */
+            padding: 6px 20px;           /* space inside */
+            cursor: pointer;             /* pointer cursor */
+            font-size: 14px;
         }
 
+
         /* Apply to Select2 (single select) */
         .select2-container .select2-selection--single {
+            background-color: #F5FFFF !important;
             border-radius: 10px !important;
             box-shadow: 0px 2px 4px 0px #00000024 !important;
             height: 38px; /* match bootstrap input height */
             display: flex;
             align-items: center;
-            border-color: #ffff !important;
+            border-color: #F5FFFF !important;
         }
 
         /* Apply to Select2 (multiple select) */
         .select2-container .select2-selection--multiple {
+            background-color: #F5FFFF !important;
             border-radius: 10px !important;
             box-shadow: 0px 2px 4px 0px #00000024 !important;
-            border-color: #ffff !important;
+            border-color: #F5FFFF !important;
         }
 
 
@@ -964,16 +989,68 @@ a.app-badge-secondary:focus, a.app-badge-secondary.focus {
     <!-- accordian -->
     <style>
 
-        .card #collapseOne .card-body  ,
-        .card #collapseTwo .card-body 
+        .card #collapseOne   .card-body  ,
+        .card #collapseTwo   .card-body  ,
+        .card #collapseThree .card-body  
         {
             background-color: #F5FFFF !important;
             border: 2px solid #F5FFFF;
             border-radius: 10px;
-            /* box-shadow: 2px 2px 2px; */
-            box-shadow: 0px 1px 1px 0px #00000040;
-
+            box-shadow: 0px 4px 4px 0px #00000040;
         }
+
+        /* Apply to normal inputs and selects */
+        .card #collapseOne .card-body input,
+        .card #collapseOne .card-body select,
+        .card #collapseOne .card-body textarea ,
+
+        .card #collapseTwo .card-body input,            
+        .card #collapseTwo .card-body select,
+        .card #collapseTwo .card-body textarea ,
+
+        .card #collapseThree .card-body input,
+        .card #collapseThree .card-body select,
+        .card #collapseThree .card-body textarea {
+            background-color: #ffff !important;
+            border-radius: 10px !important;
+            box-shadow: 0px 2px 4px 0px #00000024 !important;
+            border-color: #ffff !important;
+        }
+
+          .card #collapseOne .card-body input[type='file']
+        , .card #collapseTwo .card-body input[type='file']
+        , .card #collapseThree .card-body input[type='file']
+        {
+            padding:10px !important;
+            background-color: white !important;
+            color:black !important;
+        }
+
+                /* Apply to Select2 (single select) */
+        .card #collapseOne .card-body .select2-container .select2-selection--single ,
+        .card #collapseTwo .card-body .select2-container .select2-selection--single ,
+        .card #collapseThree .card-body .select2-container .select2-selection--single 
+        {
+            background-color: #ffff !important;
+            border-radius: 10px !important;
+            box-shadow: 0px 2px 4px 0px #00000024 !important;
+            height: 38px; /* match bootstrap input height */
+            display: flex;
+            align-items: center;
+            border-color: #ffff !important;
+        }
+
+        /* Apply to Select2 (multiple select) */
+        .card #collapseOne .card-body .select2-container .select2-selection--multiple 
+        ,.card #collapseTwo .card-body .select2-container .select2-selection--multiple
+        ,.card #collapseThree .card-body .select2-container .select2-selection--multiple 
+        {
+            background-color: #ffff !important;
+            border-radius: 10px !important;
+            box-shadow: 0px 2px 4px 0px #00000024 !important;
+            border-color: #ffff !important;
+        }
+
     </style>
 
     <!-- legacy styles of random style applied -->
@@ -986,7 +1063,6 @@ a.app-badge-secondary:focus, a.app-badge-secondary.focus {
 
         .content-page{
             background-color: white !important;
-            color:white !important;
             padding: 0px !important;
         }
 
diff --git a/app/Views/notification.php b/app/Views/notification.php
index 7ab83ccb..005a3d56 100755
--- a/app/Views/notification.php
+++ b/app/Views/notification.php
@@ -31,6 +31,12 @@
     margin: 1.75rem auto;
 }
 
+ .mail-section{
+    border: 1px solid #00999E;
+    border-radius:10px;
+    padding:5px !important;
+ }
+
 
 </style>
 <div class="tab-pane fade" id="notification-tab">
@@ -106,8 +112,10 @@
                 </div>
             </div>
 
+            <!-- mail section -->
+
             <div class="form-row">
-                <div class="form-group col-md-6">
+                <div class="form-group col-md-6 mail-section">
                     <label for="branch_name">Member welcome mail</label>
                     <label class="switch">
                         <input id="member_welcome_mail_btn" type="checkbox" name="member_welcome_mail_btn" <?= ($member_welcome_mail == 1) ? 'checked' : '' ?>>
@@ -116,14 +124,7 @@
                     &nbsp; &nbsp;
                     <a href="" data-toggle="modal" id="member_welcome_mail" onclick="getMailTemplateData(this)" data-target="#member_welcome_mail_modal">Edit</a>
                 </div>
-                <div class="form-group col-md-5">
-                    <textarea style="display:none;" name="" id="" class="form-control "></textarea>
-                </div>
-
-            </div>
-
-            <div class="form-row">
-                <div class="form-group col-md-6">
+                <div class="form-group col-md-6 mail-section">
                     <label for="branch_name">Member reminder mail</label>
                     <label class="switch">
                         <input id="member_reminder_mail_btn" type="checkbox" name="member_reminder_mail_btn" <?= $member_reminder_mail == 1 ? 'checked' : '' ?>>
@@ -132,13 +133,10 @@
                     &nbsp; &nbsp;
                     <a href="" data-toggle="modal" id="member_reminder_mail" onclick="getMailTemplateData(this)" data-target="#member_reminder_mail_modal">Edit</a>
                 </div>
-                <div class="form-group col-md-5">
-                    <textarea style="display:none;" name="" id="" class="form-control "></textarea>
-                </div>
             </div>
 
             <div class="form-row">
-                <div class="form-group col-md-6">
+                <div class="form-group col-md-6 mail-section">
                     <label for="branch_name">Member ECard mail</label>
                     <label class="switch">
                         <input id="member_ecard_mail_btn" type="checkbox" name="member_ecard_mail_btn" <?= $member_ecard_mail == 1 ? 'checked' : '' ?>>
@@ -147,13 +145,7 @@
                     &nbsp; &nbsp;
                     <a href="" data-toggle="modal" id="member_ecard_mail" onclick="getMailTemplateData(this)" data-target="#member_ecard_mail_modal">Edit</a>
                 </div>
-                <div class="form-group col-md-5">
-                    <textarea style="display:none;" name="" id="" class="form-control "></textarea>
-                </div>
-            </div>
-
-            <div class="form-row">
-                <div class="form-group col-md-6">
+                <div class="form-group col-md-6 mail-section">
                     <label for="branch_name">Member Review and summary mail</label>
                     <label class="switch">
                         <input id="member_review_and_summary_mail_btn" type="checkbox" name="member_review_and_summary_mail_btn" <?= $member_review_and_summary_mail == 1 ? 'checked' : '' ?>>
@@ -162,13 +154,10 @@
                     &nbsp; &nbsp;
                     <a href="" data-toggle="modal" id="member_review_and_summary_mail" onclick="getMailTemplateData(this)" data-target="#member_review_and_summary_mail_modal">Edit</a>
                 </div>
-                <div class="form-group col-md-5">
-                    <textarea style="display:none;" name="" id="" class="form-control "></textarea>
-                </div>
             </div>
 
             <div class="form-row">
-                <div class="form-group col-md-6">
+                <div class="form-group col-md-6 mail-section">
                     <label for="branch_name">Account Manager summary mail</label>
                     <label class="switch">
                         <input id="account_maneger_summary_mail_btn" type="checkbox" name="account_maneger_summary_mail_btn" <?= $account_maneger_summary_mail ? 'checked' : '' ?>>
@@ -177,13 +166,7 @@
                     &nbsp; &nbsp;
                     <a href="" data-toggle="modal" id="account_maneger_summary_mail" onclick="getMailTemplateData(this)" data-target="#account_maneger_summary_mail_modal">Edit</a>
                 </div>
-                <div class="form-group col-md-5">
-                    <textarea style="display:none;" name="" id="" class="form-control "></textarea>
-                </div>
-            </div>
-
-            <div class="form-row">
-                <div class="form-group col-md-6">
+                <div class="form-group col-md-6 mail-section">
                     <label for="branch_name">Client HR summary mail</label>
                     <label class="switch">
                         <input id="client_hr_summary_mail_btn" type="checkbox" name="client_hr_summary_mail_btn" <?= $client_hr_summary_mail == 1 ? 'checked' : '' ?>>
@@ -192,9 +175,6 @@
                     &nbsp; &nbsp;
                     <a href="" data-toggle="modal" id="client_hr_summary_mail" onclick="getMailTemplateData(this)" data-target="#client_hr_summary_mail_modal">Edit</a>
                 </div>
-                <div class="form-group col-md-5">
-                    <textarea style="display:none;" name="" id="" class="form-control "></textarea>
-                </div>
             </div>
 
             <div class="form-row">
diff --git a/app/Views/policy_gpa_terms.php b/app/Views/policy_gpa_terms.php
index 77168662..2eb565aa 100755
--- a/app/Views/policy_gpa_terms.php
+++ b/app/Views/policy_gpa_terms.php
@@ -96,358 +96,307 @@
 
             <div class="row" style="margin-bottom: 10px;">
 
-                <div class="col-md-6">
-                    <label for="sumInsured">Sum Insured</label>
-                </div>
-                <div class="col-md-4">
-                    <input style="width: 128%;" class="form-control" type="text" name="sumInsured2" id="sumInsured2"
-                        onkeypress="return onlyNumbers(event)" onkeyup="formatNumber(this)"
-                        style="width: 100% !important;">
-                </div>
-                <div class="col-md-2" style="position: relative;left: 88px;">
-                    <button type="button" class="btn btn-primary si-add-more" onclick="appendGPASIAddMore()">+</button>
-                </div>
-                <div class="col-md-6">
-                </div>
-                <div class="col-md-6">
-                    <div id='numberToWordSumInsured' class="text-danger-2"></div>
+                <div class="col">
+                    <div class="d-flex align-items-center gap-2">
+                        <label for="sumInsured" class="form-label" >Sum Insured</label>
+                        <input class="form-control mr-2" type="text" name="sumInsured2" id="sumInsured2" style="max-width:200px;"
+                            onkeypress="return onlyNumbers(event)" onkeyup="formatNumber(this)">
+                        <button type="button" class="btn btn-primary si-add-more mr-2" onclick="appendGPASIAddMore()">+</button>
+                        <div id='numberToWordSumInsured' class="text-danger-2 mr-2"></div>
+                    </div>
+                    
+                    <div id="gpa_si_add_more"></div>
                 </div>
             </div>
 
-            <div id="gpa_si_add_more"></div>
 
             <div class="row" style="margin-bottom: 10px;">
-                <div class="col-md-6">
-                    <label for="totalSumInsured">Total Sum Assured</label>
-                </div>
-                <div class="col-md-6">
-                    <input type="text" style="width: 100% !important;" class="form-control" name="totalSumInsured"
-                        id="totalSumInsured" onkeypress="return onlyNumbers(event)" onkeyup="formatNumber(this)">
-                </div>
-                <div class="col-md-6">
-                </div>
-                <div class="col-md-6">
-                    <div id='numberToWordTotalSumInsured' class="text-danger-2"></div>
+
+                <div class="col">
+                    <div class="d-flex align-items-center gap-2">
+                        <label for="totalSumInsured">Total Sum Assured</label>
+                        <input type="text" style="max-width: 200px !important;" class="form-control mr-2" name="totalSumInsured"
+                               id="totalSumInsured" onkeypress="return onlyNumbers(event)" onkeyup="formatNumber(this)">
+                        <div id='numberToWordTotalSumInsured' class="text-danger-2 mr-2"></div>
+                    </div>
                 </div>
             </div>
 
             <div class="row" style="margin-bottom: 10px;">
-                <div class="col-md-6">
-                    <label for=""></label>
-                </div>
-                <div class="col-md-6">
+                <div class="col">
                     <table data-custom-table-css="table">
                         <tbody>
                             <tr>
-                                <td></td>
-                            </tr>
-                            <tr>
-                                <td></td>
-                            </tr>
-                            <tr>
-                                <td></td>
-                            </tr>
-                            <tr>
-                                <td style="width: 5%;">
-                                    <span style="margin-right: 20px;">Self:</span>
-                                </td>
-                                <td style="width: 11%;">
-                                    <input disabled type="checkbox" style="margin-right: 70px;" name="family_floaters[]"
+                                <td>
+                                    <input disabled type="checkbox" style="color:black;" name="family_floaters[]"
                                         value="self" id="self" checked>
                                 </td>
-                                <td style="width: 20%;">
+                                <td >
+                                    <span style="margin-right: 20px;color:black;">Self</span>
+                                </td>
+                                <td >
                                     <div class="self-age">
-                                        <span style="margin-right: 20px;">Min Age:</span>
+                                        <span style="margin-right: 20px;color:black;">Min Age:</span>
                                         <input class="underline-input min_age"
+                                            style="background-color: white !important;"
                                             value="<?php echo  isset($self_min_age) ? $self_min_age : '18'; ?>"
-                                            style="width: 65%;" type="number" name="self_min_age" id="self_min_age_gpa"
+                                             type="number" name="self_min_age" id="self_min_age_gpa"
                                             onchange="lowerIsEighteen(this)">
                                     </div>
                                 </td>
-                                <td style="width: 20%;">
+                                <td >
                                     <div class="self-age">
-                                        <span style="margin-right: 20px;">Max Age:</span>
+                                        <span style="margin-right: 20px;color:black;">Max Age:</span>
                                         <input class="underline-input max_age"
+                                            style="background-color:white !important"
                                             value="<?php echo  isset($self_max_age) ? $self_max_age : '60'; ?>"
-                                            style="width: 65%;" type="number" name="self_max_age" id="self_max_age_gpa"
+                                             type="number" name="self_max_age" id="self_max_age_gpa"
                                             onchange="lowerIsEighteen(this)">
                                     </div>
                                 </td>
-                                <td></td>
-                            </tr>
-                            <tr>
-                                <td></td>
-                            </tr>
-                            <tr>
-                                <td></td>
-                            </tr>
-                            <tr>
-                                <td></td>
                             </tr>
+
                         </tbody>
                     </table>
                 </div>
-                <div class="col-md-6">
-                </div>
-                <div class="col-md-6">
-                </div>
+
             </div>
 
-            <hr>
-
-            <div class="row" style="margin-bottom: 10px;">
-                <div class="col-md-1">
-                    <input type="checkbox" style="margin-top: 12px" class="unchecked" name="accidentalDeathBenefit_display" id="accidentalDeathBenefit_display"  checked>
+            <div class="row mb-2">
+                <div class="col-md-2">
+                    <div class="form-check d-flex align-items-center">
+                        <input class="form-check-input me-2" type="checkbox" id="accidentalDeathBenefit_display" name="accidentalDeathBenefit_display" checked>
+                        <label class="form-check-label mb-0" for="accidentalDeathBenefit_display">
+                            Accidental Death Benefit
+                        </label>
+                    </div>
                 </div>
                 <div class="col-md-4">
-                    <label for="totalSumInsured">Accidental Death Benefit</label>
-                </div>
-                <div class="col-md-6">
                     <input type="text" name="accidentalDeathBenefit" class="form-control">
                 </div>
-            </div>
 
-            <div class="row" style="margin-bottom: 10px;">
-                <div class="col-md-1">
-                    <input type="checkbox" style="margin-top: 12px" class="unchecked" name="permanentTotalDisablement_display" id="permanentTotalDisablement_display"  checked>
+                <div class="col-md-2">
+                    <div class="form-check d-flex align-items-center">
+                        <input class="form-check-input me-2" type="checkbox" id="permanentTotalDisablement_display" name="permanentTotalDisablement_display" checked>
+                        <label class="form-check-label mb-0" for="permanentTotalDisablement_display">
+                            Permanent Total Disablement
+                        </label>
+                    </div>
                 </div>
                 <div class="col-md-4">
-                    <label for="permanentTotalDisablement">Permanent Total Disablement</label>
-                </div>
-                <div class="col-md-6">
-                    <input type="text" name="permanentTotalDisablement" id="permanentTotalDisablement"
-                        class="form-control">
+                    <input type="text" name="permanentTotalDisablement" id="permanentTotalDisablement" class="form-control">
                 </div>
             </div>
 
-            <div class="row" style="margin-bottom: 10px;">
 
-                <div class="col-md-1">
-                    <input type="checkbox" style="margin-top: 12px" class="unchecked" name="permanentPartialDisablement_display" id="permanentPartialDisablement_display"  checked>
+            <div class="row mb-2">
+
+                <div class="col-md-2">
+                    <div class="form-check d-flex align-items-center">
+                        <input type="checkbox" class="form-check-input me-2" name="permanentPartialDisablement_display" id="permanentPartialDisablement_display"  checked>
+                        <label class="form-check-label mb-0" for="permanentPartialDisablement">Permanent Partial Disablement</label>
+                    </div>
                 </div>
                 <div class="col-md-4">
-                    <label for="permanentPartialDisablement">Permanent Partial Disablement</label>
-                </div>
-                <div class="col-md-6">
                     <input type="text" name="permanentPartialDisablement" id="permanentPartialDisablement"
                         class="form-control">
                 </div>
-            </div>
 
-            <div class="row" style="margin-bottom: 10px;">
-                <div class="col-md-1">
-                    <input type="checkbox" style="margin-top: 12px" class="unchecked" name="temporaryTotalDisablementBenefit_display" id="temporaryTotalDisablementBenefit_display"  checked>
+                <div class="col-md-2">
+                    <div class="form-check d-flex align-items-center">
+                        <input type="checkbox" class="form-check-input me-2" name="temporaryTotalDisablementBenefit_display" id="temporaryTotalDisablementBenefit_display"  checked>
+                        <label class="form-check-label mb-0" for="temporaryTotalDisablementBenefit">Temporary Total Disablement Benefit</label>
+                    </div>
                 </div>
                 <div class="col-md-4">
-                    <label for="temporaryTotalDisablementBenefit">Temporary Total Disablement Benefit</label>
-                </div>
-                <div class="col-md-6">
                     <input type="text" name="temporaryTotalDisablementBenefit" id="temporaryTotalDisablementBenefit"
                         class="form-control">
                 </div>
             </div>
 
-            <div class="row" style="margin-bottom: 10px;">
-                <div class="col-md-1">
-                    <input type="checkbox" style="margin-top: 12px" class="unchecked" name="medical_expenses_medical_extension_display" id="medical_expenses_medical_extension_display"  checked>
+            <div class="row mb-2">
+                <div class="col-md-2">
+                    <div class="form-check d-flex align-items-center">
+                        <input type="checkbox" class="form-check-input me-2" name="medical_expenses_medical_extension_display" id="medical_expenses_medical_extension_display"  checked>
+                        <label class="form-check-label mb-0" for="medical_expenses_medical_extension">Medical Expenses / Medical Extension (IPD)</label>
+                    </div>
                 </div>
                 <div class="col-md-4">
-                    <label for="medical_expenses_medical_extension">Medical Expenses / Medical Extension (IPD)</label>
-                </div>
-                <div class="col-md-6">
                     <input type="text" name="medical_expenses_medical_extension" id="medical_expenses_medical_extension"
                         class="form-control">   
                 </div>
-            </div>
+         
+                <div class="col-md-2">
+                    <div class="form-check d-flex align-items-center">
+                        <input type="checkbox" class="form-check-input me-2" name="opd_treatment_cover_display" id="opd_treatment_cover_display"  checked>
+                        <label class="form-check-label mb-0" for="opd_treatment_cover">OPD Treatment Cover</label>
+                    </div>
 
-            <div class="row" style="margin-bottom: 10px;">
-                <div class="col-md-1">
-                    <input type="checkbox" style="margin-top: 12px" class="unchecked" name="opd_treatment_cover_display" id="opd_treatment_cover_display"  checked>
                 </div>
                 <div class="col-md-4">
-                    <label for="opd_treatment_cover">OPD Treatment Cover</label>
-                </div>
-                <div class="col-md-6">
                     <input type="text" name="opd_treatment_cover" id="opd_treatment_cover" class="form-control">
                 </div>
             </div>
 
-            <div class="row" style="margin-bottom: 10px;">
-                <div class="col-md-1">
-                    <input type="checkbox" style="margin-top: 12px" class="unchecked" name="ambulanceCharges_display" id="ambulanceCharges_display"  checked>
+            <div class="row mb-2">
+                <div class="col-md-2">
+                    <div class="form-check d-flex align-items-center">
+                            <input type="checkbox" class="form-check-input me-2" name="ambulanceCharges_display" id="ambulanceCharges_display"  checked>
+                            <label class="form-check-label mb-0" for="ambulanceCharges"> Ambulance Charges</label>
+                    </div>
                 </div>
                 <div class="col-md-4">
-                    <label for="ambulanceCharges"> Ambulance Charges</label>
-                </div>
-                <div class="col-md-6">
                     <input type="text" name="ambulanceCharges" class="form-control">
                 </div>
-            </div>
 
-            <div class="row" style="margin-bottom: 10px;">
-                <div class="col-md-1">
-                    <input type="checkbox" style="margin-top: 12px" class="unchecked" name="repatriation_of_mortal_remains_display" id="repatriation_of_mortal_remains_display"  checked>
+                <div class="col-md-2">
+                    <div class="form-check d-flex align-items-center">
+                        <input type="checkbox"class="form-check-input me-2" name="repatriation_of_mortal_remains_display" id="repatriation_of_mortal_remains_display"  checked>
+                        <label class="form-check-label mb-0" for="repatriation_of_mortal_remains">Repatriation of Mortal Remains</label>
+                    </div>
                 </div>
                 <div class="col-md-4">
-                    <label for="repatriation_of_mortal_remains">Repatriation of Mortal Remains</label>
-                </div>
-                <div class="col-md-6">
                     <input type="text" name="repatriation_of_mortal_remains" id="repatriation_of_mortal_remains" class="form-control">
                 </div>
             </div>
 
-            <div class="row" style="margin-bottom: 10px;">
-                <div class="col-md-1">
-                    <input type="checkbox" style="margin-top: 12px" class="unchecked" name="childrenEducationWelfareFund_display" id="childrenEducationWelfareFund_display"  checked>
+            <div class="row mb-2">
+                <div class="col-md-2">
+                    <div class="form-check d-flex align-items-center">
+                        <input type="checkbox" class="form-check-input me-2" name="childrenEducationWelfareFund_display" id="childrenEducationWelfareFund_display"  checked>
+                        <label class="form-check-label mb-0" for="childrenEducationWelfareFund">Children Education Welfare Fund</label>
+                    </div>
                 </div>
                 <div class="col-md-4">
-                    <label for="childrenEducationWelfareFund">Children Education Welfare Fund</label>
-                </div>
-                <div class="col-md-6">
                     <input type="text" name="childrenEducationWelfareFund" id="childrenEducationWelfareFund" class="form-control">
                 </div>
-            </div>
 
-            <div class="row" style="margin-bottom: 10px;">
-                <div class="col-md-1">
-                    <input type="checkbox" style="margin-top: 12px" class="unchecked" name="terrorism_display" id="gpa_terrorism_display"  checked>
+                <div class="col-md-2">
+                    <div class="form-check align-items-center">
+                        <input type="checkbox" class="form-check-input me-2" name="terrorism_display" id="gpa_terrorism_display"  checked>
+                        <label class="form-check-label mb-0"for="terrorism">Terrorism</label>
+                    </div>
                 </div>
                 <div class="col-md-4">
-                    <label for="terrorism">Terrorism</label>
-                </div>
-                <div class="col-md-6">
                     <input type="text" name="terrorism" class="form-control"> 
                 </div>
             </div>
 
-            <div class="row" style="margin-bottom: 10px;">
-                <div class="col-md-1">
-                    <input type="checkbox" style="margin-top: 12px" class="unchecked" name="worldwideCover_display" id="worldwideCover_display"  checked>
+            <div class="row mb-2">
+                <div class="col-md-2">
+                    <div class="form-check d-flex align-items-center">
+                        <input type="checkbox" class="form-check-input" name="worldwideCover_display" id="worldwideCover_display"  checked>
+                        <label class="form-check-label" for="worldwideCover">Worldwide Cover</label>
+                    </div>
                 </div>
                 <div class="col-md-4">
-                    <label for="worldwideCover">Worldwide Cover</label>
-                </div>
-                <div class="col-md-6">
                     <input type="text" name="worldwideCover" class="form-control">
                 </div>
-            </div>
 
-            <div class="row" style="margin-bottom: 10px;">
-                <div class="col-md-1">
-                    <input type="checkbox" style="margin-top: 12px" class="unchecked" name="family_transportation_benefits_display" id="family_transportation_benefits_display"  checked>
+                <div class="col-md-2">
+                    <div class="form-check d-flex align-items-center">
+                        <input type="checkbox" class="form-check-input" name="family_transportation_benefits_display" id="family_transportation_benefits_display"  checked>
+                        <label class="form-check-label" for="family_transportation_benefits">Family Transportation Benefits</label>
+                    </div>
                 </div>
                 <div class="col-md-4">
-                    <label for="family_transportation_benefits">Family Transportation Benefits</label>
-                </div>
-                <div class="col-md-6">
                     <input type="text" name="family_transportation_benefits" id="family_transportation_benefits" class="form-control">
                 </div>
             </div>
 
-            <div class="row" style="margin-bottom: 10px;">
-                <div class="col-md-1">
-                    <input type="checkbox" style="margin-top: 12px" class="unchecked" name="fractures_dislocation_burns_display" id="fractures_dislocation_burns_display"  checked>
+            <div class="row mb-2">
+                <div class="col-md-2">
+                    <div class="form-check d-flex align-items-center">
+                        <input type="checkbox" class="form-check-input" name="fractures_dislocation_burns_display" id="fractures_dislocation_burns_display"  checked>
+                        <label class="form-check-label"for="fractures_dislocation_burns">Fractures / Dislocation / Burns</label>
+                    </div>
                 </div>
                 <div class="col-md-4">
-                    <label for="fractures_dislocation_burns">Fractures / Dislocation / Burns</label>
-                </div>
-                <div class="col-md-6">
                     <input type="text" name="fractures_dislocation_burns" id="fractures_dislocation_burns" class="form-control">
                 </div>
-            </div>
-
-            <div class="row" style="margin-bottom: 10px;">
-                <div class="col-md-1">
-                    <input type="checkbox" style="margin-top: 12px" class="unchecked" name="coma_display" id="coma_display"  checked>
+                <div class="col-md-2">
+                    <div class="form-check d-flex align-items-center">
+                        <input type="checkbox" class="form-check-input" name="coma_display" id="coma_display"  checked>
+                         <label class="form-check-label" for="coma">Coma</label>
+                    </div>
                 </div>
                 <div class="col-md-4">
-                    <label for="coma">Coma</label>
-                </div>
-                <div class="col-md-6">
                     <input type="text" name="coma" id="coma" class="form-control"> 
                 </div>
             </div>
 
-            <div class="row" style="margin-bottom: 10px;">
-                <div class="col-md-1">
-                    <input type="checkbox" style="margin-top: 12px" class="unchecked" name="carriageofDeadBody_display" id="carriageofDeadBody_display"  checked>
+            <div class="row mb-2">
+                <div class="col-md-2">
+                    <div class="form-check d-flex-align-items-center">
+                        <input type="checkbox" class="form-check-input" name="carriageofDeadBody_display" id="carriageofDeadBody_display"  checked>
+                        <label class="form-check-label" for="carriageOfDeadBody">Carriage of Dead Body</label>
+                    </div>
                 </div>
                 <div class="col-md-4">
-                    <label for="carriageOfDeadBody">Carriage of Dead Body</label>
-                </div>
-                <div class="col-md-6">
                     <input type="text" name="carriageOfDeadBody" class="form-control">
                 </div>
-            </div>
-
-            <div class="row" style="margin-bottom: 10px;">
-                <div class="col-md-1">
-                    <input type="checkbox" style="margin-top: 12px" class="unchecked" name="compassionateVisitExpenses_display" id="compassionateVisitExpenses_display"  checked>
+                <div class="col-md-2">
+                    <div class="form-check d-flex-align-items-center">
+                        <input type="checkbox" class="form-check-input" name="compassionateVisitExpenses_display" id="compassionateVisitExpenses_display"  checked>
+                        <label class="form-check-label" for="compassionateVisitExpenses">Compassionate Visit Expenses</label>
+                    </div>
                 </div>
                 <div class="col-md-4">
-                    <label for="compassionateVisitExpenses">Compassionate Visit Expenses</label>
-                </div>
-                <div class="col-md-6">
                     <input type="text" name="compassionateVisitExpenses" class="form-control">
                 </div>
             </div>
 
-            <div class="row" style="margin-bottom: 10px;">
-                <div class="col-md-1">
-                    <input type="checkbox" style="margin-top: 12px" class="unchecked" name="travel_expenses_for_medical_treatment_display" id="travel_expenses_for_medical_treatment_display"  checked>
+            <div class="row mb-2">
+                <div class="col-md-2">
+                    <div class="form-check d-flex align-items-center">
+                        <input type="checkbox" class="form-check-input" name="travel_expenses_for_medical_treatment_display" id="travel_expenses_for_medical_treatment_display"  checked>
+                        <label class="form-check-label" for="travel_expenses_for_medical_treatment">Travel expenses for Medical Treatment</label>
+                    </div>
                 </div>
                 <div class="col-md-4">
-                    <label for="travel_expenses_for_medical_treatment">Travel expenses for Medical Treatment</label>
-                </div>
-                <div class="col-md-6">
                     <input type="text" name="travel_expenses_for_medical_treatment" id="travel_expenses_for_medical_treatment" class="form-control">
                 </div>
-            </div>
-
-            <div class="row" style="margin-bottom: 10px;">
-                <div class="col-md-1">
-                    <input type="checkbox" style="margin-top: 12px" class="unchecked" name="daily_cash_allowance_display" id="daily_cash_allowance_display"  checked>
+                <div class="col-md-2">
+                    <div class="form-check d-flex align-items-center">
+                        <input type="checkbox" class="form-check-input" name="daily_cash_allowance_display" id="daily_cash_allowance_display"  checked>
+                        <label class="form-check-label" for="daily_cash_allowance">Daily cash Allowance</label>
+                    </div>
                 </div>
                 <div class="col-md-4">
-                    <label for="daily_cash_allowance">Daily cash Allowance</label>
-                </div>
-                <div class="col-md-6">
                     <input type="text" name="daily_cash_allowance" id="daily_cash_allowance" class="form-control">
                 </div>
             </div>
 
-            <div class="row" style="margin-bottom: 10px;">
-                <div class="col-md-1">
-                    <input type="checkbox" style="margin-top: 12px" class="unchecked" name="artifical_limb_and_prosthesis_display" id="artifical_limb_and_prosthesis_display"  checked>
+            <div class="row mb-2">
+                <div class="col-md-2">
+                    <div class="form-check d-flex align-items-center">
+                        <input type="checkbox" class="form-check-input" name="artifical_limb_and_prosthesis_display" id="artifical_limb_and_prosthesis_display"  checked>
+                        <label class="form-check-label" for="artifical_limb_and_prosthesis">Artifical Limb and Prosthesis</label>
+                    </div>
                 </div>
                 <div class="col-md-4">
-                    <label for="artifical_limb_and_prosthesis">Artifical Limb and Prosthesis</label>
-                </div>
-                <div class="col-md-6">
                     <input type="text" name="artifical_limb_and_prosthesis" id="artifical_limb_and_prosthesis" class="form-control">
                 </div>
-            </div>
-
-            <div class="row" style="margin-bottom: 10px;">
-                <div class="col-md-1">
-                    <input type="checkbox" style="margin-top: 12px" class="unchecked" name="animalSnakeInsectBite_display" id="animalSnakeInsectBite_display"  checked>
+                <div class="col-md-2">
+                    <div class="form-check d-flex align-items-center">
+                         <input type="checkbox" class="form-check-input" name="animalSnakeInsectBite_display" id="animalSnakeInsectBite_display"  checked>
+                         <label class="form-check-label" for="animalSnakeInsectBite">Animal/Snake/Insect bite</label>  
+                    </div>
+                    
                 </div>
                 <div class="col-md-4">
-                    <label for="animalSnakeInsectBite">Animal/Snake/Insect bite</label>
-                </div>
-                <div class="col-md-6">
                     <input type="text" name="animalSnakeInsectBite" id="animalSnakeInsectBite" class="form-control">
                 </div>
             </div>
 
-            <div class="row" style="margin-bottom: 10px;">
-                <div class="col-md-1">
-                    <input type="checkbox" style="margin-top: 12px" class="unchecked" name="air_ambulance_display" id="air_ambulance_display"  checked>
+            <div class="row mb-2">
+                <div class="col-md-2">
+                    <div class="form-check d-flex align-items-center">
+                        <input type="checkbox" class="form-check-input" name="air_ambulance_display" id="air_ambulance_display"  checked>
+                        <label class="form-check-label" for="air_ambulance">Air Ambulance</label>
+                    </div>
                 </div>
                 <div class="col-md-4">
-                    <label for="air_ambulance">Air Ambulance</label>
-                </div>
-                <div class="col-md-6">
                     <input type="text" name="air_ambulance" id="air_ambulance" class="form-control">
                 </div>
             </div>
@@ -937,22 +886,22 @@
 
         var html = `
             <div class="row" style="margin-bottom: 10px;">                        
-                <div class="col-md-6"> 
-                    <label for="sumInsured">Additional Sum Insured</label>                          
-                </div>
-                <div class="col-md-4">
-                    <input style="width: 128%;" value="${data == null || data == undefined || data == "" ? '' : data}" type="text" name="multiple_sum_insured[]" class="form-control multiple_sum_insured" onkeypress="return onlyNumbers(event)" onkeyup="formatNumber(this); numtowordinkeyup(this)">
-                </div>   
-                <div class="col-md-2" style="position: relative;left: 88px;">
-                    <button type="button" class="btn btn-danger si-remove-multi" onclick="removeGMCAdditionalSI(this)">x</button>
-                    <button type="button" class="btn btn-primary si-add-more" onclick="appendGPASIAddMore()">+</button>            
-                </div>
-                <div class="col-md-6">
-                </div>
-                <div class="col-md-6">
-                    <div class="text-danger-2 numberToWordSumInsured"></div>                           
-                </div>    
-            </div>`;
+                <div class="col">
+                    <div class="d-flex align-items-center gap-2">
+                        <label for="sumInsured" class="form-label" >Additional Sum Insured</label>
+                        <input 
+                        style="max-width:200px;" 
+                        value="${data == null || data == undefined || data == "" ? '' : data}" type="text" name="multiple_sum_insured[]" 
+                        class="form-control multiple_sum_insured mr-2" onkeypress="return onlyNumbers(event)" onkeyup="formatNumber(this); numtowordinkeyup(this)">
+                        <button type="button" class="btn btn-danger si-remove-multi mr-2" onclick="removeGMCAdditionalSI(this)">x</button>
+                        <button type="button" class="btn btn-primary si-add-more    mr-2" onclick="appendGPASIAddMore()">+</button>
+                        <div id='numberToWordSumInsured' class="text-danger-2 "></div>
+                    </div>
+                </div> 
+            </div>
+            
+
+            `;
 
         $('#gpa_si_add_more').append(html);
     }
diff --git a/app/Views/policy_grid.php b/app/Views/policy_grid.php
index 546ff2ab..9f4e8436 100755
--- a/app/Views/policy_grid.php
+++ b/app/Views/policy_grid.php
@@ -26,9 +26,10 @@
     border: 2px solid red; /* or any other style you prefer */
 }
 
-/* .unitDiv{
-    display: none;
-} */
+    #bs-example-modal-lg  .modal-dialog{
+        width:1080px !important;
+    }
+
 </style>
 
 <style>
@@ -60,7 +61,7 @@
 <!--  Modal content for the Large example -->
 <div class="modal fade" id="bs-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel"
     aria-hidden="true" aria-modal="true" data-backdrop="static" style="padding-right: 15px">
-    <div class="modal-dialog modal-full-width">
+    <div class="modal-dialog modal-lg">
         <div class="modal-content">
             <div class="modal-header">
                 <div class="col-md-6">
@@ -3391,7 +3392,7 @@ function appendNewTab(tabNameData = null, data = null)
                     <a href="#" id="copyfromexcel_${tabId}" onclick="copyFromExcel(this, '${tabId}')">Copy from excel</a>
                     <hr>
 
-                    <div class="form-row" id="grid_content_input_for_additional_${tabId}" style="display: true;">
+                    <div class="form-row" id="grid_content_input_for_additional_${tabId}" style="display: block;">
                     </div>
 
 
diff --git a/app/Views/ticket_edit_onbording.php b/app/Views/ticket_edit_onbording.php
index e505c714..dab23823 100644
--- a/app/Views/ticket_edit_onbording.php
+++ b/app/Views/ticket_edit_onbording.php
@@ -146,7 +146,7 @@
                 </div>
             </div>
             <div class="modal-footer">
-                <a class="btn btn-primary close" data-dismiss="modal" aria-label="Close">Submit</a>
+                <a class="btn btn-primary" data-dismiss="modal" aria-label="Close">Submit</a>
             </div>
         </div>
     </div>
diff --git a/app/Views/ticket_form_handler.php b/app/Views/ticket_form_handler.php
index e066d030..e2dadcfc 100644
--- a/app/Views/ticket_form_handler.php
+++ b/app/Views/ticket_form_handler.php
@@ -193,7 +193,7 @@
                 </div>
             </div>
             <div class="modal-footer">
-                <a class="btn btn-primary close" data-dismiss="modal" aria-label="Close"
+                <a class="btn btn-primary" data-dismiss="modal" aria-label="Close"
                     onclick="toResetTheModelFields()">Submit</a>
             </div>
         </div>
diff --git a/app/Views/view_deposit.php b/app/Views/view_deposit.php
index f60a5e8a..bf25aeac 100755
--- a/app/Views/view_deposit.php
+++ b/app/Views/view_deposit.php
@@ -1,62 +1,59 @@
+
+<style>
+    .metrics{
+        border:1px solid lightgrey;border-radius:10px;box-shadow: 0px 4px 4px 0px #00000040;
+        min-width: none;
+        max-width: 350px;
+    }
+
+
+</style>
+
 <div class="row">
     <div class="col-12">
         <div class="card">
             <div class="card-body">
 
-                <div class="text-center">
-                    <div class="row">
-                        <div class="col-md-4"></div>
-                        <div class="col-md-4">
-                            <i class="font-24"></i>
-                            <h4>CD Account No :  <?php echo isset($insurerName->cd_master_account_no) && !empty($insurerName->cd_master_account_no) ? $insurerName->cd_master_account_no : 'N/A' ?></h4>
-                        </div>
-                    </div>
+                <div style="display: flex; align-items: center;">
+                    <a href="<?= base_url("client/deposit/$clientData->id"); ?>" style="color:black; font-size: 40px; margin-right: 10px;">
+                        <i class="mdi mdi-chevron-left"></i>
+                    </a>
+                    <h3 style="margin: 0;">Transaction Details - <?php echo $insurerName->name; ?></h3>
                 </div>
 
-                <div class="text-center">
-                    <div class="row">
+                <br>
 
-                        <div class="col-md-6 col-xl-5">
-                            <div class="py-1">
-                                <i class="font-24"></i>
-                                <h4>Deposit Summary Of <?php echo $clientData->short_name?></h4>
-                            </div>
-                        </div> 
-                        <div class="col-md-6 col-xl-5">
-                            <div class="py-1">
-                                <i class=" font-24"></i>
-                                <h4><?php echo $insurerName->name; ?></h4>
-                            </div>
-                        </div>
+                <div class="d-flex justify-content-between">
+                    <div><h4>CD Account No :  <?php echo isset($insurerName->cd_master_account_no) && !empty($insurerName->cd_master_account_no) ? $insurerName->cd_master_account_no : 'N/A' ?></h4></div>
+                    <div> <h4>Deposit Summary Of <?php echo $clientData->short_name?></h4></div>
+                </div>
+                <div>
+                    <div class="row text-center">
 
-                    </div>
-
-                    <div class="row mt-3 text-center">
-
-                        <div class="col-3">
-                            <p class="text-muted font-15 mb-1 text-truncate">Deposits</p>
-                            <h4 style="font-size: 26px;"><i
-                                    class="fe-arrow-up text-success mr-1"></i>₹<?php echo $deposiamount->total_credit?>
+                        <div class="col-3 d-flex justify-content-between align-items-center metrics mr-2 mt-2">
+                            <span class="text-muted font-15 mb-1 text-truncate">Deposits</span>
+                            <h4 style="font-size: 18px;display:inline;"><i
+                                    class="fe-arrow-up text-success mr-1" ></i>₹<?php echo $deposiamount->total_credit?>
                             </h4>
                         </div>
 
-                        <div class="col-3">
-                            <p class="text-muted font-15 mb-1 text-truncate">Consumed</p>
-                            <h4 style="font-size: 26px;"><i
+                        <div class="col-3 d-flex justify-content-between align-items-center metrics mr-2 mt-2">
+                            <span class="text-muted font-15 mb-1 text-truncate">Consumed</span>
+                            <h4 style="font-size: 20px;display:inline;"><i
                                     class="fe-arrow-down text-danger mr-1"></i>₹<?php echo $deposiamount->total_withdraw?>
                             </h4>
                         </div>
 
-                        <div class="col-3">
-                            <p class="text-muted font-15 mb-1 text-truncate">Refund</p>
-                            <h4 style="font-size: 26px;"><i
+                        <div class="col-3 d-flex justify-content-between align-items-center metrics mr-2 mt-2">
+                            <span class="text-muted font-15 mb-1 text-truncate">Refund</span>
+                            <h4 style="font-size: 20px;display:inline;"><i
                                     class="fe-arrow-up text-success mr-1"></i>₹<?php echo $deposiamount->total_refund?>
                             </h4>
                         </div>
 
-                        <div class="col-3">
-                            <p class="text-muted font-15 mb-1 text-truncate">Current Balance</p>
-                            <h4 style="font-size: 26px;"><i
+                        <div class="col-3 d-flex justify-content-between align-items-center metrics mr-2 mt-2">
+                            <span class="text-muted font-15 mb-1 text-truncate">Current Balance</span>
+                            <h4 style="font-size: 20px;display:inline;"><i
                                     class="fe-credit-card text-sucess mr-1"></i>₹<?php echo $deposiamount->balance?>
                             </h4>
                         </div>
@@ -68,39 +65,20 @@
         </div>
     </div>
 </div>
-<!-- start page title -->
-<!-- <div class="row">
-    <div class="col-12">
-        <div class="page-title-box page-title-box-alt">
-            <h4 class="page-title"></h4>
-            <div class="page-title-right">
-            </div>
-        </div>
-    </div>
-</div> -->
-<!-- end page title -->
+
+
+
+
 <div class="row" id="List-page">
     <div class="col-12">
         <div class="card">
             <div class="card-body">
 
-                <div class="row">
-                    <div class="col-12" style="text-align: right;">
-                        <a href="<?= base_url("client/deposit/$clientData->id"); ?>"><i class="mdi mdi-arrow-left"
-                                style="font-size: 17px;"></i></a>
+                <!-- <div class="row" style="margin-bottom:1rem;">
+                    <div class="col-6" style="text-align: right; position: relative;top: 56px; z-index:999">
+                        <button type="button" id="btnAdd" class="btn btn-primary waves-effect waves-light" data-toggle="modal" data-target="#addTransactionModal"> + Add</button>
                     </div>
-                </div>
-
-                <div class="row" style="margin-bottom:1rem;">
-                    <div class="col-6" style="align-self: center;">
-                        <h4 style="position: relative;">Transaction Details</h4>
-                    </div>
-
-                    <div class="col-6" style="text-align: right; position: relative;top: 56px;">
-                        <button type="button" id="btnAdd" class="btn btn-primary waves-effect waves-light"
-                            data-toggle="modal" data-target="#addTransactionModal">New</button>
-                    </div>
-                </div>
+                </div> -->
 
                 <table data-custom-table-css="table" class="table table-sm table-hover m-0 table-centered dt-responsive w-100" cellspacing="0"
                     id="tickets-table">
@@ -172,46 +150,48 @@
                 </button>
             </div>
             <div class="modal-body">
-
+                <h3>Transaction Mode</h3>
                 <div class="row">
                     <div class="col-md-6">
                         <div class="form-group">
-                            <label for="transactionMode" class="control-label">Transaction Mode</label>
-                            <div class="form-check">
+                           
+                            <div class="form-check mt-2">
                                 <input class="form-check-input" type="radio" name="transactionMode" id="addMode"value="1" checked>
                                 <label class="form-check-label" for="addMode">Replenishment by Client</label>
                             </div>
-                            <div class="form-check">
+                            <div class="form-check mt-2">
                                 <input class="form-check-input" type="radio" name="transactionMode" id="refund_by_insurer"value="6">
                                 <label class="form-check-label" for="addMode">Refund by Insurer</label>
                             </div>
-                            <!-- <div class="form-check">
-                                <input class="form-check-input" type="radio" name="transactionMode" id="adjustmentModeadd"value="2">
-                                <label class="form-check-label" for="adjustmentMode">Adjustment Add</label>
-                            </div>
-                            <div class="form-check">
-                                <input class="form-check-input" type="radio" name="transactionMode" id="adjustmentModereduce"value="3">
-                                <label class="form-check-label" for="adjustmentMode">Adjustment Reduce</label>
-                            </div> -->
-                            <div class="form-check">
+                        </div>
+                    </div>
+                    <div class="col-md-6">
+                        <div class="form-group">
+                            <div class="form-check mt-2">
                                 <input class="form-check-input" type="radio" name="transactionMode" id="assetpolicyadd"value="4">
                                 <label class="form-check-label" for="adjustmentMode">Non EB Credit</label>
                             </div> 
-                            <div class="form-check">
+                            <div class="form-check mt-2">
                                 <input class="form-check-input" type="radio" name="transactionMode" id="assetpolicyreduce"value="5">
                                 <label class="form-check-label" for="adjustmentMode">No EB Debit</label>
                             </div>
                         </div>
                     </div>
+                </div>
+                <div class="row">
                     <div class="col-md-6">
                         <div class="form-group">
                             <label for="field-1" class="control-label">Amount<span class="text-danger">*</span></label>
                             <input type="number" class="form-control" id="amount" placeholder="Amount" required>
-                            <br><label for="record_date">Record Date <span class="text-danger"></span></label>
-                            <input type="text" class="form-control policy_start_date" id="record_date" name="record_date" placeholder="Record Date">
                         </div>
                     </div>
 
+                    <div class="col-md-6">
+                        <div class="form-group">
+                            <label for="record_date">Record Date <span class="text-danger"></span></label>
+                            <input type="text" class="form-control policy_start_date" id="record_date" name="record_date" placeholder="Record Date">
+                        </div>
+                    </div>
                 </div>
 
                 <!-- <div class="row" id="transactionTypeRow" style="display:none;">
@@ -275,45 +255,58 @@
 
         });
         $('#tickets-table').DataTable({
-            dom: "<'row'<'col-sm-0'f><'col-sm-7 text-right'B>>" +
-                "<'row'<'col-sm-12'tr>>" +
-                "<'row'<'col-sm-5'i><'col-sm-7'p>>",
-            buttons: [{
-                    extend: 'csv',
-                    text: 'CSV',
-                    title: 'CD TransactionDetails',
-                    exportOptions: {
-                        columns: ''
+                dom: "<'row'<'col-sm-2'f><'col-sm-10 text-right'B>>" + 
+                    "<'row'<'col-sm-12'tr>>" + 
+                    "<'row'<'col-sm-5'i><'col-sm-7'p>>", 
+
+                buttons: [
+                    {
+                        text: '+ add',
+                        className: 'btn btn-primary buttons-html5',
+                        action: function () {
+                            var myModal = new bootstrap.Modal(document.getElementById('addTransactionModal'));
+                            myModal.show();
+                        }
                     }
-                },
-                {
-                    extend: 'pdf',
-                    text: 'PDF',
-                    title: 'TransactionDetails',
-                    exportOptions: {
-                        columns: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10],
-                        format: {
-                            body: function(data, row, column, node) {
-                                return data.replace(/<.*?>/g, '');
-                            }
+                    ,
+                    {
+                        extend: 'csv',
+                        text: 'CSV',
+                        title: 'CD TransactionDetails',
+                        exportOptions: {
+                            columns: ''
                         }
                     },
-                    customize: function(doc) {
-                        doc.pageOrientation = 'landscape';
-                        doc.styles.tableHeader.alignment = 'left';
-                        doc.defaultStyle.alignment = 'left';
-                        doc.content[1].table.widths = ['9%', '9%', '8%', '9%', '10%', '9%', '9%', '9%', '9%', '11%', '8%'];
+                    {
+                        extend: 'pdf',
+                        text: 'PDF',
+                        title: 'TransactionDetails',
+                        exportOptions: {
+                            columns: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10],
+                            format: {
+                                body: function (data, row, column, node) {
+                                    return data.replace(/<.*?>/g, '');
+                                }
+                            }
+                        },
+                        customize: function (doc) {
+                            doc.pageOrientation = 'landscape';
+                            doc.styles.tableHeader.alignment = 'left';
+                            doc.defaultStyle.alignment = 'left';
+                            doc.content[1].table.widths = [
+                                '9%', '9%', '8%', '9%', '10%',
+                                '9%', '9%', '9%', '9%', '11%', '8%'
+                            ];
+                        }
                     }
-                }
-
-            ],
-            language: {
-                search: "_INPUT_",
-                searchPlaceholder: "Search..."
-            },
-            ordering: false,
-            paging: true,
-        });
+                ],
+                language: {
+                    search: "_INPUT_",
+                    searchPlaceholder: "Search..."
+                },
+                ordering: false,
+                paging: true
+            });    
     });
 </script>
 
diff --git a/public/assets/images/avatar_2x.png b/public/assets/images/avatar_2x.png
index 0f498b70..07acf2ee 100755
Binary files a/public/assets/images/avatar_2x.png and b/public/assets/images/avatar_2x.png differ