diff --git a/app/components/doctrine_modal_form_component/doctrine_modal_form_component.html.erb b/app/components/doctrine_modal_form_component/doctrine_modal_form_component.html.erb
index db3772c..f96aee8 100644
--- a/app/components/doctrine_modal_form_component/doctrine_modal_form_component.html.erb
+++ b/app/components/doctrine_modal_form_component/doctrine_modal_form_component.html.erb
@@ -1,37 +1,30 @@
-<div class="modal fade" id="doctrineModal" tabindex="-1" aria-labelledby="doctrineModal" aria-hidden="true">
+<div class="modal fade modal-doctrine-body" id="doctrineModal" tabindex="-1" aria-labelledby="doctrineModal" aria-hidden="true">
   <%= form_tag(opts[:form_url], method: opts[:form_method]) do %>
     <div class="modal-dialog modal-lg modal-dialog-scrollable">
       <div class="modal-content">
         <div class="modal-header">
           <h5 class="modal-title"> <%= opts[:form_method].eql?(:post) ? "New Doctrine" : "Update Doctrine" %> </h5>
-          <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+          <button type="button" class="btn-close-x" data-bs-dismiss="modal" aria-label="Close">x</button>
         </div>
 
         <div class="modal-body">
-          <div class="row">
-            <div class="col-sm-12 p-2">
-              <strong> <%= label_tag :subjects %> </strong>
-              <%= select_tag "subject_ids[]", options_from_collection_for_select(subjects.sort_by { |sub| sub.lineage_name }, :id, :lineage_name, doctrine.subject_ids), class: "form-select subject-ids-selectize", multiple: true, prompt: "Please select" %>
-            </div>
-          </div>
+            <div class="mb-3">
+              <label for="subject-name" class="col-form-label">Subjects</label>
+              <%= select_tag "subject_ids[]", options_from_collection_for_select(subjects.sort_by { |sub| sub.lineage_name }, :id, :lineage_name, doctrine.subject_ids), class: "form-control subject-ids-selectize  ps-0", multiple: true, prompt: "Please select" %>
+            </div>  
 
           <% if doctrine.new_record? %>
-            <div class="row">
-              <div class="col-sm-12 p-2">
-                <strong> <%= label_tag :doctine_content_suggestions %> </strong>
-                <select id="doctine_content_suggestions" class="form-select"> </select>
-              </div>
+            <div class="mb-3">
+              <label for="subject-name" class="col-form-label">Doctine content suggestions</label>
+              <select id="doctine_content_suggestions" class="form-control ps-0"> </select>
             </div>
           <% end %>
 
-          <div class="row">
-            <div class="col-sm-12 p-2">
-              <strong> <%= label_tag :content %> </strong>
-              <%= rich_text_area_tag :content, doctrine.content, placeholder: "Doctrine Content" %>
-            </div>
+          <div class="mb-3">
+            <label for="subject-name" class="col-form-label">Content</label>
+            <%= rich_text_area_tag :content, doctrine.content, placeholder: "Doctrine Content" %>
           </div>
         </div>
-
         <div class="modal-footer">
           <button type="submit" class="btn btn-primary">Save</button>
           <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
diff --git a/app/components/document_doctrine_index_component/document_doctrine_index_component.html.erb b/app/components/document_doctrine_index_component/document_doctrine_index_component.html.erb
index 481b215..045420a 100644
--- a/app/components/document_doctrine_index_component/document_doctrine_index_component.html.erb
+++ b/app/components/document_doctrine_index_component/document_doctrine_index_component.html.erb
@@ -1,19 +1,19 @@
-<div class="card card-header row-flex m-3 clickable-link" href="<%= opts[:is_disable_clickable_link].present? ? '#' : document_doctrine_path(document_id, id)%>">
+<div class="row-flex m-3 mt-0 doctrine-content-body clickable-link" href="<%= opts[:is_disable_clickable_link].present? ? '#' : document_doctrine_path(document_id, id)%>">
   <% if opts[:is_subjects_index].blank? %>
     <% if opts[:is_doctrines_index].present? && opts[:subject_ids].reject(&:blank?).present? %>
-      <h4> <%= subjects.where(id: opts[:subject_ids].map(&:to_i)).map(&:lineage_name).join(" ") %> </h4>
+      <h5 style="color: darkred;"> <%= subjects.where(id: opts[:subject_ids].map(&:to_i)).map(&:lineage_name).join(" ") %> </h5>
     <% elsif subjects.present? %>
       <% subjects.each do |subject| %>
-        <h4> <%= subject.lineage_name %> </h4>
+        <h5 style="color: darkred;"> <%= subject.lineage_name %> </h5>
       <% end %>
     <% else %>
-      <h4> (No Subjects Provided) </h4>
+      <h5> (No Subjects Provided) </h5>
     <% end %>
   <% end %>
   
-  <div class="container-sm <%= opts[:is_subjects_index].present? ? 'm-0 ps-0' : 'ms-3' %>">
+  <div class="container-sm <%= opts[:is_subjects_index].present? ? 'm-0 ps-0' : '' %>">
     <p class="mb-0"> <%= raw content.html_safe %> </p>
-
+   
     <div class="container-sm ms-3">
       <% annotations.each do |annotation| %>
         <% if opts[:is_doctrines_index].present? %>
@@ -48,4 +48,6 @@
       <% end %>
     </div>
   </div>
+
+  <hr/>
 </div>
diff --git a/app/components/pagination_component/pagination_component.html.erb b/app/components/pagination_component/pagination_component.html.erb
index eeb56cf..0beedf0 100644
--- a/app/components/pagination_component/pagination_component.html.erb
+++ b/app/components/pagination_component/pagination_component.html.erb
@@ -1,9 +1,9 @@
 <div class="col col-md-12">
   <header class="header bg-white b-b clearfix">
     <div class="row m-t-sm align-items-end pagination-body">
-      <div class="col-md-6">
+      <div class="col-md-6 mb-0">
         <% if opts[:is_subject_breadcrums].present? && subjects.present? %>
-          <ol class="breadcrumb">
+          <ol class="breadcrumb mb-0">
             <% subjects.each do |subject| %>
               <% subject.ancestors.each do |ancestor| %>
                 <li class="breadcrumb-item d-inline-flex"> 
@@ -30,4 +30,5 @@
       </div>
     </div>
   </header>
+  <hr class="mt-0"/>
 </div>
diff --git a/app/javascript/src/application.scss b/app/javascript/src/application.scss
index 2bd369f..f347db2 100644
--- a/app/javascript/src/application.scss
+++ b/app/javascript/src/application.scss
@@ -39,4 +39,58 @@
 .main-content-body {
   min-height: 100vh !important;
   overflow: auto;
-}
\ No newline at end of file
+}
+
+// Modal Form custom styling //
+
+.modal-doctrine-body .selectize-control {
+  border: none !important;
+}
+
+
+.modal-doctrine-body .modal-header {
+  background: darkred !important;
+  color: #fff !important;
+
+  button.btn-close-x {
+    background: transparent;
+    border: none;
+    color: #fff;
+    font-size: 18px;
+    width: 30px;
+  }
+  
+  button.btn-close-x:hover {
+    background: white !important;
+    border-radius: 18px;
+    color: darkred !important;
+    width: 30px;
+  }
+}
+
+// Document custom styling //
+
+.doct-body-index div:last-child .hr {
+  display: none !important;
+}
+
+.doc-nav-body.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
+  color: #ffffff !important;
+  background: darkred !important;
+  font-weight: 800;
+}
+
+.doc-nav-body .nav-item button {
+  color: #000;
+}
+
+// Cited custom styling //
+
+.cited-table-body .table-width {
+  width: 97%;
+  margin: 0 auto;
+}
+
+.doctrine-index-body .doctrine-content-body {
+  padding-left: 15px;
+}
diff --git a/app/views/doctrines/search.html.erb b/app/views/doctrines/search.html.erb
index f1be41e..e71b3d8 100644
--- a/app/views/doctrines/search.html.erb
+++ b/app/views/doctrines/search.html.erb
@@ -1,5 +1,5 @@
-<div class="card container-sm mt-1 p-0"> 
-  <div class="container m-2"> <%= render PaginationComponent.new(data: @doctrines, opts: { is_subject_breadcrums: true, subject_ids: params[:subject_ids] }) %> </div>
+<div class="container-sm mt-1 p-0 doctrine-index-body"> 
+  <div class="container m-2 ps-0"> <%= render PaginationComponent.new(data: @doctrines, opts: { is_subject_breadcrums: true, subject_ids: params[:subject_ids] }) %> </div>
 
   <% if params[:is_index_table].to_s.eql?("true") %>
     <div class="card-body col-sm-12 tableFixHead p-0 mt-1">
diff --git a/app/views/documents/show.html.erb b/app/views/documents/show.html.erb
index 74e6838..8a45598 100644
--- a/app/views/documents/show.html.erb
+++ b/app/views/documents/show.html.erb
@@ -1,24 +1,45 @@
+
+
 <div class="card mt-1 g-3">
-  <div class="card-header mt-1 mb-2 col-sm-12">
-    <table class="table table-borderless">
-      <tbody>
-        <tr>
-          <td class="text-start" style="width: 160px;"> Reference Number: </td>
-          <td class="text-start"> <strong> <%= @document.reference_number %> </strong> </td>
-          <td class="text-end" style="width: 50px;" > Date: </td>
-          <td class="text-end" style="width: 160px;"> <strong> <%= @document.docdate.present? ? @document.docdate.strftime("%m/%d/%Y") : @document.year %> </strong> </td>
-        </tr>
+  <div class="container p-2 card-header">
+    <div class="row">
+      <div class="col-lg-12"> 
+        <div class="row">
+          <div class="col-lg-6">
+          </div>
+          <div class="col-lg-3 text-end"> 
+          <b>Date : </b>
+          </div>
+          <div class="col-lg-3 text-end"> 
+            <b><%= @document.docdate.present? ? @document.docdate.strftime("%m/%d/%Y") : @document.year %> </b>
+          </div>
+        </div>
+      </div>
 
-        <tr>
-          <td style="width: 160px;" class="text-start"> Title: </td>
-          <td colspan="3" class="text-start"> <strong> <%= @document.title %> </strong> </td>
-        </tr>
-      </tbody>
-    </table>
+      <div class="col-lg-12 mt-2 mb-2"> 
+        <div class="row"> 
+          <div class="col-lg-3"> 
+            Reference Number :
+          </div>
+          <div class="col-lg-9"> 
+            <b><%= @document.reference_number %></b>
+          </div>
+        </div>
+      </div>
+      <div class="col-lg-12  mb-2"> 
+        <div class="row">
+          <div class="col-lg-3"> 
+            Title : 
+          </div>
+          <div class="col-lg-9"> 
+          <strong> <%= @document.title %> </strong> 
+          </div>
+        </div>
+      </div>
+    </div>
   </div>
-
-  <div class="card-body">
-    <ul class="nav nav-tabs" id="menuTab" role="tablist">
+  <div class="card-body p-0">
+    <ul class="doc-nav-body nav nav-tabs nav-justified" id="menuTab" role="tablist">
       <li class="nav-item" role="presentation">
         <button class="nav-link active" id="analysisMenuTab" data-bs-toggle="tab" data-bs-target="#analysisTabContent" type="button" role="tab" aria-controls="analysisTab" aria-selected="true">Analysis</button>
       </li>
@@ -30,19 +51,18 @@
       </li>
     </ul>
 
-    <div class="tab-content">
+    <div class="tab-content" style="height: 550px;overflow: auto;">
       <div class="tab-pane fade show active" id="analysisTabContent" role="tabpanel" aria-labelledby="home-tab">
         <div class="row">
-          <div class="d-flex justify-content-end p-3">
+          <div class="d-flex justify-content-end" style="margin: 10px 0 0 -20px;">
             <a class="btn btn-sm btn-primary" data-bs-toggle="modal" data-bs-target="#doctrineModal"> Add Doctrine </a>
           </div>
-
           <div class="container-sm row-flex col-sm-12 mt-2">
             <%= render(DoctrineModalFormComponent.new(current_user: current_user, doctrine: @document.doctrines.new, subjects: @subjects.order(name: :asc), opts: { form_url: jurisprudence_doctrines_path(jurisprudence_id: @document.id), form_method: :post })) %>
           </div>
         </div>
 
-        <div class="container-sm row-flex col-sm-12 mt-2">
+        <div class="container-sm row-flex col-sm-12 p-0 doct-body-index">
           <%= render(DocumentDoctrineIndexComponent.with_collection(@doctrines, current_user: current_user)) %>
         </div>
       </div>
@@ -53,10 +73,10 @@
         </div>
       </div>
 
-      <div class="tab-pane fade" id="ciatatonTabContent" role="tabpanel">
-        <div class="card card-header mt-1"> <h4> Cited Ins Documents </h4> </div>
-        <table class="table table-striped table-hover mb-0">
-          <thead>
+      <div class="tab-pane fade cited-table-body" id="ciatatonTabContent" role="tabpanel">
+        <div class="mt-3 ps-3"> <h4> Cited Ins Documents </h4> </div>
+        <table class="table table-hover mb-0 table-width">
+          <thead style="position: sticky;top: 0">
             <th class="bg-light"> Reference No. </th>
             <th class="bg-light"> Title </th>
             <th class="bg-light"> Date </th>