diff --git a/src/index.html b/src/index.html
index 0bdd966..636e06b 100755
--- a/src/index.html
+++ b/src/index.html
@@ -112,7 +112,7 @@ <h2 class="h1">Bootstrap 5</h2>
                             <img src="./assets/img/illustrations/bs5-illustrations.svg" alt="Front pages overview">
                         </div>
                     </div>
-                    <div class="col-lg-5">
+                    <div class="col-lg-5 mb-5 mb-lg-0">
                         <h2 class="h1 d-flex align-items-center">Kanban Board <span class="badge-md ms-3 mb-0 fs-6 badge rounded-pill text-dark bg-secondary">Pro</span></h2>
                         <p class="mb-4 lead fw-bold">Advanced FullCalendar.js integration</p>
                         <p class="mb-4">We created a fully editable calendar where you can add, edit and delete events for your admin dashboard.</p>
@@ -136,7 +136,7 @@ <h2 class="h1 d-flex align-items-center">Mapbox <span class="badge-md ms-3 mb-0
                     </div>
                 </div>
                 <div class="row justify-content-between align-items-center mb-5 mb-lg-7">
-                    <div class="col-lg-5">
+                    <div class="col-lg-5 mb-5 mb-lg-0">
                         <h2 class="h1 d-flex align-items-center">Calendar <span class="badge-md ms-3 mb-0 fs-6 badge rounded-pill text-dark bg-secondary">Pro</span></h2>
                         <p class="mb-4 lead fw-bold">Advanced FullCalendar.js integration</p>
                         <p class="mb-4">We created a fully editable calendar where you can add, edit and delete events for your admin dashboard.</p>
diff --git a/src/scss/volt/_components.scss b/src/scss/volt/_components.scss
index c14b919..239ded2 100644
--- a/src/scss/volt/_components.scss
+++ b/src/scss/volt/_components.scss
@@ -22,6 +22,7 @@
 @import "components/popover";
 @import "components/progress";
 @import "components/shapes";
+@import "components/datepicker";
 @import "components/steps";
 @import "components/tables";
 @import "components/type";
diff --git a/src/scss/volt/components/_datepicker.scss b/src/scss/volt/components/_datepicker.scss
index 36126ce..8d18441 100755
--- a/src/scss/volt/components/_datepicker.scss
+++ b/src/scss/volt/components/_datepicker.scss
@@ -2,26 +2,12 @@
  * = Datepickers
  */
 
-.datepicker{
-    table {
-		margin: 0;
-		-webkit-touch-callout: none;
-        user-select: none;
+ .datepicker {
 
-		td {
-            border-radius: 0 !important;
-        }
-
-        th {
-            border-radius: 0;
-            font-weight: 500;
-        }
-
-        td, th {
-            width: 36px !important;
-            height: 36px !important;
-            border: none;
-            text-align: center;
-        }
+    .datepicker-cell.selected,
+    .datepicker-cell.selected:hover {
+      background: $primary;
     }
-}
\ No newline at end of file
+  
+  }
+  
\ No newline at end of file
diff --git a/src/scss/volt/components/_tables.scss b/src/scss/volt/components/_tables.scss
index b27e194..ac36fdd 100644
--- a/src/scss/volt/components/_tables.scss
+++ b/src/scss/volt/components/_tables.scss
@@ -194,11 +194,11 @@
 }
 
 .dataTable-top {
-    padding: 0 1.5rem 1rem 1.5rem;
+    padding: 0 0 1rem 0;
 }
 
 .dataTable-bottom {
-    padding: 1.5rem 1.5rem 0 1.5rem;
+    padding: 1.5rem 0 0 0;
 }
 
 .dataTable-pagination {