diff --git a/src/html/components/dashboard/_topbar.astro b/src/html/components/dashboard/_topbar.astro
index 8c4a96b66..6726a10b3 100644
--- a/src/html/components/dashboard/_topbar.astro
+++ b/src/html/components/dashboard/_topbar.astro
@@ -4,6 +4,7 @@ const distPath = path;
 ---
 <!--begin::Header-->
 <nav class="app-header navbar navbar-expand bg-body">
+  <!--begin::Container-->
   <div class="container-fluid">
     <!--begin::Start Navbar Links-->
     <ul class="navbar-nav">
@@ -143,6 +144,7 @@ const distPath = path;
           <!--end::User Image-->
           <!--begin::Menu Body-->
           <li class="user-body">
+            <!--begin::Row-->
             <div class="row">
               <div class="col-4 text-center">
                 <a href="#">Followers</a>
@@ -154,6 +156,7 @@ const distPath = path;
                 <a href="#">Friends</a>
               </div>
             </div>
+            <!--end::Row-->
           </li>
           <!--end::Menu Body-->
           <!--begin::Menu Footer-->
@@ -168,5 +171,6 @@ const distPath = path;
     </ul>
     <!--end::End Navbar Links-->
   </div>
+  <!--end::Container-->
 </nav>
 <!--end::Header-->
diff --git a/src/html/components/docs/color-mode.mdx b/src/html/components/docs/color-mode.mdx
index e9e87f685..cdb9f9611 100644
--- a/src/html/components/docs/color-mode.mdx
+++ b/src/html/components/docs/color-mode.mdx
@@ -1,6 +1,7 @@
 ```html
 <!-- Navbar -->
 <nav class="app-header navbar navbar-expand bg-body">
+  <!--begin::Container-->
   <div class="container-fluid">
     <!-- Start navbar links -->
     <ul class="navbar-nav">
@@ -76,6 +77,7 @@
       </li>
     </ul>
   </div>
+  <!--end::Container-->
 </nav>
 ```
 
diff --git a/src/html/components/docs/components/main-header.mdx b/src/html/components/docs/components/main-header.mdx
index 07631388d..d794282a6 100644
--- a/src/html/components/docs/components/main-header.mdx
+++ b/src/html/components/docs/components/main-header.mdx
@@ -1,6 +1,7 @@
 ```html
 <!-- Navbar -->
 <nav class="app-header navbar navbar-expand bg-body">
+  <!--begin::Container-->
   <div class="container-fluid">
     <!-- Start navbar links -->
     <ul class="navbar-nav">
@@ -132,6 +133,7 @@
           </li>
           <!-- Menu Body -->
           <li class="user-body">
+            <!--begin::Row-->
             <div class="row">
               <div class="col-4 text-center">
                 <a href="#">Followers</a>
@@ -143,7 +145,7 @@
                 <a href="#">Friends</a>
               </div>
             </div>
-            <!-- /.row -->
+            <!--end::Row-->
           </li>
           <!-- Menu Footer-->
           <li class="user-footer">
@@ -154,6 +156,7 @@
       </li>
     </ul>
   </div>
+  <!--end::Container-->
 </nav>
 <!-- /.navbar -->
 ```
\ No newline at end of file
diff --git a/src/html/pages/UI/timeline.astro b/src/html/pages/UI/timeline.astro
index c6b5c5c06..df5df016b 100644
--- a/src/html/pages/UI/timeline.astro
+++ b/src/html/pages/UI/timeline.astro
@@ -28,7 +28,9 @@ const page = 'timeline';
       <main class="app-main">
         <!--begin::App Content Header-->
         <div class="app-content-header">
+          <!--begin::Container-->
           <div class="container-fluid">
+            <!--begin::Row-->
             <div class="row">
               <div class="col-sm-6">
                 <h3 class="mb-0">Timeline</h3>
@@ -40,11 +42,14 @@ const page = 'timeline';
                 </ol>
               </div>
             </div>
+            <!--end::Row-->
           </div>
+          <!--end::Container-->
         </div>
         <!--end::App Content Header-->
         <!--begin::App Content-->
         <div class="app-content">
+          <!--begin::Container-->
           <div class="container-fluid">
             <!-- Timelime example  -->
             <div class="row">
@@ -150,7 +155,8 @@ const page = 'timeline';
               <!-- /.col -->
             </div>
             <!-- /.row -->
-          </div><!-- /.container-fluid -->
+          </div>
+          <!--end::Container-->
         </div>
         <!--end::App Content-->
       </main>
diff --git a/src/html/pages/docs/browser-support.astro b/src/html/pages/docs/browser-support.astro
index bd1737812..49022d93d 100644
--- a/src/html/pages/docs/browser-support.astro
+++ b/src/html/pages/docs/browser-support.astro
@@ -29,7 +29,9 @@ const page = "browser-support";
       <main class="app-main">
         <!--begin::App Content Header-->
         <div class="app-content-header">
+          <!--begin::Container-->
           <div class="container-fluid">
+            <!--begin::Row-->
             <div class="row">
               <div class="col-sm-6">
                 <h3 class="mb-0">Browser Support</h3>
@@ -43,14 +45,18 @@ const page = "browser-support";
                 </ol>
               </div>
             </div>
+            <!--end::Row-->
           </div>
+          <!--end::Container-->
         </div>
         <!--end::App Content Header-->
         <!--begin::App Content-->
         <div class="app-content">
+          <!--begin::Container-->
           <div class="container-fluid">
             <BrowserSupport />
-          </div><!-- /.container-fluid -->
+          </div>
+          <!--end::Container-->
         </div>
         <!--end::App Content-->
       </main>
diff --git a/src/html/pages/docs/color-mode.astro b/src/html/pages/docs/color-mode.astro
index 4bd65114b..19f68f684 100644
--- a/src/html/pages/docs/color-mode.astro
+++ b/src/html/pages/docs/color-mode.astro
@@ -29,7 +29,9 @@ const page = "color-mode";
       <main class="app-main">
         <!--begin::App Content Header-->
         <div class="app-content-header">
+          <!--begin::Container-->
           <div class="container-fluid">
+            <!--begin::Row-->
             <div class="row">
               <div class="col-sm-6">
                 <h3 class="mb-0">Color Mode Toggle</h3>
@@ -43,17 +45,22 @@ const page = "color-mode";
                 </ol>
               </div>
             </div>
+            <!--end::Row-->
           </div>
+          <!--end::Container-->
         </div>
         <!--end::App Content Header-->
         <!--begin::App Content-->
         <div class="app-content">
+          <!--begin::Container-->
           <div class="container-fluid">
+            <!--begin::Row-->
             <div class="row g-4">
               <!-- Start column -->
               <div class="col-12">
                 <!-- Navbar -->
                 <nav class="navbar navbar-expand bg-body">
+                  <!--begin::Container-->
                   <div class="container-fluid">
                     <!-- Start navbar links -->
                     <ul class="navbar-nav">
@@ -129,6 +136,7 @@ const page = "color-mode";
                       </li>
                     </ul>
                   </div>
+                  <!--end::Container-->
                 </nav>
               </div>
               <!-- Start column -->
@@ -137,8 +145,9 @@ const page = "color-mode";
 
               </div>
             </div>
-            <!-- /.row -->
-          </div><!-- /.container-fluid -->
+            <!--end::Row-->
+          </div>
+          <!--end::Container-->
         </div>
         <!--end::App Content-->
       </main>
diff --git a/src/html/pages/docs/components/main-header.astro b/src/html/pages/docs/components/main-header.astro
index 023350ca5..488c58e89 100644
--- a/src/html/pages/docs/components/main-header.astro
+++ b/src/html/pages/docs/components/main-header.astro
@@ -30,7 +30,9 @@ const distPath = path;
       <main class="app-main">
         <!--begin::App Content Header-->
         <div class="app-content-header">
+          <!--begin::Container-->
           <div class="container-fluid">
+            <!--begin::Row-->
             <div class="row">
               <div class="col-sm-6">
                 <h3 class="mb-0">Main Header Component</h3>
@@ -44,11 +46,14 @@ const distPath = path;
                 </ol>
               </div>
             </div>
+            <!--end::Row-->
           </div>
+          <!--end::Container-->
         </div>
         <!--end::App Content Header-->
         <!--begin::App Content-->
         <div class="app-content">
+          <!--begin::Container-->
           <div class="container-fluid">
             <div class="callout callout-warning mb-4">
               <h5 class="fw-bold">Reminder!</h5>
@@ -66,6 +71,7 @@ const distPath = path;
 
             <!-- Navbar -->
             <nav class="navbar navbar-expand bg-body">
+              <!--begin::Container-->
               <div class="container-fluid">
                 <!-- Start navbar links -->
                 <ul class="navbar-nav">
@@ -197,6 +203,7 @@ const distPath = path;
                       </li>
                       <!-- Menu Body -->
                       <li class="user-body">
+                        <!--begin::Row-->
                         <div class="row">
                           <div class="col-4 text-center">
                             <a href="#">Followers</a>
@@ -208,7 +215,7 @@ const distPath = path;
                             <a href="#">Friends</a>
                           </div>
                         </div>
-                        <!-- /.row -->
+                        <!--end::Row-->
                       </li>
                       <!-- Menu Footer-->
                       <li class="user-footer">
@@ -219,12 +226,13 @@ const distPath = path;
                   </li>
                 </ul>
               </div>
+              <!--end::Container-->
             </nav>
             <!-- /.navbar -->
 
             <MainHeader />
           </div>
-          <!-- /.container-fluid -->
+          <!--end::Container-->
         </div>
         <!--end::App Content-->
       </main>
diff --git a/src/html/pages/docs/components/main-sidebar.astro b/src/html/pages/docs/components/main-sidebar.astro
index 9e5dd9a49..196832daf 100644
--- a/src/html/pages/docs/components/main-sidebar.astro
+++ b/src/html/pages/docs/components/main-sidebar.astro
@@ -29,7 +29,9 @@ const page = "main-sidebar";
       <main class="app-main">
         <!--begin::App Content Header-->
         <div class="app-content-header">
+          <!--begin::Container-->
           <div class="container-fluid">
+            <!--begin::Row-->
             <div class="row">
               <div class="col-sm-6">
                 <h3 class="mb-0">Main Sidebar Component</h3>
@@ -43,15 +45,18 @@ const page = "main-sidebar";
                 </ol>
               </div>
             </div>
+            <!--end::Row-->
           </div>
+          <!--end::Container-->
         </div>
         <!--end::App Content Header-->
         <!--begin::App Content-->
         <div class="app-content">
+          <!--begin::Container-->
           <div class="container-fluid">
             <MainSidebar />
           </div>
-          <!-- /.container-fluid -->
+          <!--end::Container-->
         </div>
         <!--end::App Content-->
       </main>
diff --git a/src/html/pages/docs/introduction.astro b/src/html/pages/docs/introduction.astro
index 844d65f90..edc4cb521 100644
--- a/src/html/pages/docs/introduction.astro
+++ b/src/html/pages/docs/introduction.astro
@@ -29,7 +29,9 @@ const page = "introduction";
       <main class="app-main">
         <!--begin::App Content Header-->
         <div class="app-content-header">
+          <!--begin::Container-->
           <div class="container-fluid">
+            <!--begin::Row-->
             <div class="row">
               <div class="col-sm-6">
                 <h3 class="mb-0">Introduction</h3>
@@ -43,14 +45,18 @@ const page = "introduction";
                 </ol>
               </div>
             </div>
+            <!--end::Row-->
           </div>
+          <!--end::Container-->
         </div>
         <!--end::App Content Header-->
         <!--begin::App Content-->
         <div class="app-content">
+          <!--begin::Container-->
           <div class="container-fluid">
             <Introduction />
-          </div><!-- /.container-fluid -->
+          </div>
+          <!--end::Container-->
         </div>
         <!--end::App Content-->
       </main>
diff --git a/src/html/pages/docs/layout.astro b/src/html/pages/docs/layout.astro
index ec5294688..47672928f 100644
--- a/src/html/pages/docs/layout.astro
+++ b/src/html/pages/docs/layout.astro
@@ -28,7 +28,9 @@ const page = "layout";
       <main class="app-main">
         <!--begin::App Content Header-->
         <div class="app-content-header">
+          <!--begin::Container-->
           <div class="container-fluid">
+            <!--begin::Row-->
             <div class="row">
               <div class="col-sm-6">
                 <h3 class="mb-0">Layout</h3>
@@ -42,7 +44,9 @@ const page = "layout";
                 </ol>
               </div>
             </div>
+            <!--end::Row-->
           </div>
+          <!--end::Container-->
         </div>
         <!--end::App Content Header-->
         <!--begin::App Content-->
diff --git a/src/html/pages/examples/login.astro b/src/html/pages/examples/login.astro
index aa924ddf0..6ca28f84c 100644
--- a/src/html/pages/examples/login.astro
+++ b/src/html/pages/examples/login.astro
@@ -38,6 +38,7 @@ const htmlPath = '..';
                 <span class="fa-solid fa-lock"></span>
               </div>
             </div>
+            <!--begin::Row-->
             <div class="row">
               <div class="col-8">
                 <div class="form-check">
@@ -55,6 +56,7 @@ const htmlPath = '..';
               </div>
               <!-- /.col -->
             </div>
+            <!--end::Row-->
           </form>
 
           <div class="social-auth-links text-center mb-3 d-grid gap-2">
diff --git a/src/html/pages/examples/register.astro b/src/html/pages/examples/register.astro
index 27076141c..f4ff83eef 100644
--- a/src/html/pages/examples/register.astro
+++ b/src/html/pages/examples/register.astro
@@ -44,6 +44,7 @@ const htmlPath = '..';
                 <span class="fa-solid fa-lock"></span>
               </div>
             </div>
+            <!--begin::Row-->
             <div class="row">
               <div class="col-8">
                 <div class="form-check">
@@ -61,6 +62,7 @@ const htmlPath = '..';
               </div>
               <!-- /.col -->
             </div>
+            <!--end::Row-->
           </form>
 
           <div class="social-auth-links text-center mb-3 d-grid gap-2">
diff --git a/src/html/pages/forms/general.astro b/src/html/pages/forms/general.astro
index 6ac9ad9b4..a08cc33fe 100644
--- a/src/html/pages/forms/general.astro
+++ b/src/html/pages/forms/general.astro
@@ -28,7 +28,9 @@ const page = 'general';
       <main class="app-main">
         <!--begin::App Content Header-->
         <div class="app-content-header">
+          <!--begin::Container-->
           <div class="container-fluid">
+            <!--begin::Row-->
             <div class="row">
               <div class="col-sm-6">
                 <h3 class="mb-0">General Form</h3>
@@ -40,12 +42,16 @@ const page = 'general';
                 </ol>
               </div>
             </div>
+            <!--end::Row-->
           </div>
+          <!--end::Container-->
         </div>
         <!--end::App Content Header-->
         <!--begin::App Content-->
         <div class="app-content">
+          <!--begin::Container-->
           <div class="container-fluid">
+            <!--begin::Row-->
             <div class="row g-4">
               <!-- Start column -->
               <div class="col-md-6">
@@ -84,8 +90,9 @@ const page = 'general';
                 <!-- /.card -->
               </div>
             </div>
-            <!-- /.row -->
-          </div><!-- /.container-fluid -->
+            <!--end::Row-->
+          </div>
+          <!--end::Container-->
         </div>
         <!--end::App Content-->
       </main>
diff --git a/src/html/pages/index.astro b/src/html/pages/index.astro
index 094689ab3..41aeacfd8 100644
--- a/src/html/pages/index.astro
+++ b/src/html/pages/index.astro
@@ -34,7 +34,9 @@ const page = 'index';
       <main class="app-main">
         <!--begin::App Content Header-->
         <div class="app-content-header">
+          <!--begin::Container-->
           <div class="container-fluid">
+            <!--begin::Row-->
             <div class="row">
               <div class="col-sm-6">
                 <h3 class="mb-0">Dashboard</h3>
@@ -46,16 +48,20 @@ const page = 'index';
                 </ol>
               </div>
             </div>
+            <!--end::Row-->
           </div>
+          <!--end::Container-->
         </div>
         <!--end::App Content Header-->
         <!--begin::App Content-->
         <div class="app-content">
+          <!--begin::Container-->
           <div class="container-fluid">
-            <!-- Small boxes (Stat box) -->
+            <!--begin::Row-->
             <div class="row">
+              <!--begin::Col-->
               <div class="col-lg-3 col-6" >
-                <!-- small box -->
+                <!--begin::Small Box Widget 1-->
                 <div class="small-box text-bg-primary">
                   <div class="inner">
                     <h3>150</h3>
@@ -67,10 +73,11 @@ const page = 'index';
                   </svg>
                   <a href="#" class="small-box-footer">More info <i class="fa-solid fa-arrow-circle-right"></i></a>
                 </div>
+                <!--end::Small Box Widget 1-->
               </div>
-              <!-- ./col -->
+              <!--end::Col-->
               <div class="col-lg-3 col-6">
-                <!-- small box -->
+                <!--begin::Small Box Widget 2-->
                 <div class="small-box text-bg-success">
                   <div class="inner">
                     <h3>53<sup class="fs-5">%</sup></h3>
@@ -82,10 +89,11 @@ const page = 'index';
                   </svg>
                   <a href="#" class="small-box-footer">More info <i class="fa-solid fa-arrow-circle-right"></i></a>
                 </div>
+                <!--end::Small Box Widget 2-->
               </div>
-              <!-- ./col -->
+              <!--end::Col-->
               <div class="col-lg-3 col-6">
-                <!-- small box -->
+                <!--begin::Small Box Widget 3-->
                 <div class="small-box text-bg-warning">
                   <div class="inner">
                     <h3>44</h3>
@@ -97,10 +105,11 @@ const page = 'index';
                   </svg>
                   <a href="#" class="small-box-footer">More info <i class="fa-solid fa-arrow-circle-right"></i></a>
                 </div>
+                <!--end::Small Box Widget 3-->
               </div>
-              <!-- ./col -->
+              <!--end::Col-->
               <div class="col-lg-3 col-6">
-                <!-- small box -->
+                <!--begin::Small Box Widget 4-->
                 <div class="small-box text-bg-danger">
                   <div class="inner">
                     <h3>65</h3>
@@ -113,11 +122,12 @@ const page = 'index';
                   </svg>
                   <a href="#" class="small-box-footer">More info <i class="fa-solid fa-arrow-circle-right"></i></a>
                 </div>
+                <!--end::Small Box Widget 4-->
               </div>
-              <!-- ./col -->
+              <!--end::Col-->
             </div>
-            <!-- /.row -->
-            <!-- Main row -->
+            <!--end::Row-->
+            <!--begin::Row-->
             <div class="row">
               <!-- Start col -->
               <div class="col-lg-7 connectedSortable">
@@ -350,6 +360,7 @@ const page = 'index';
                     <div id="world-map" style="height: 220px"></div>
                   </div>
                   <div class="card-footer border-0">
+                    <!--begin::Row-->
                     <div class="row">
                       <div class="col-4 text-center">
                         <div id="sparkline-1"></div>
@@ -364,13 +375,15 @@ const page = 'index';
                         <div class="text-white">Sales</div>
                       </div>
                     </div>
+                    <!--end::Row-->
                   </div>
                 </div>
               </div>
               <!-- /.Start col -->
             </div>
             <!-- /.row (main row) -->
-          </div><!-- /.container-fluid -->
+          </div>
+          <!--end::Container-->
         </div>
         <!--end::App Content-->
       </main>
diff --git a/src/html/pages/index2.astro b/src/html/pages/index2.astro
index e8db6f845..bef699bd5 100644
--- a/src/html/pages/index2.astro
+++ b/src/html/pages/index2.astro
@@ -30,7 +30,9 @@ const page = 'index2';
       <main class="app-main">
         <!--begin::App Content Header-->
         <div class="app-content-header">
+          <!--begin::Container-->
           <div class="container-fluid">
+            <!--begin::Row-->
             <div class="row">
               <div class="col-sm-6">
                 <h3 class="mb-0">Dashboard v2</h3>
@@ -42,9 +44,12 @@ const page = 'index2';
                 </ol>
               </div>
             </div>
+            <!--end::Row-->
           </div>
+          <!--end::Container-->
         </div>
         <div class="app-content">
+          <!--begin::Container-->
           <div class="container-fluid">
             <!-- Info boxes -->
             <div class="row">
@@ -110,6 +115,7 @@ const page = 'index2';
             </div>
             <!-- /.row -->
 
+            <!--begin::Row-->
             <div class="row">
               <div class="col-md-12">
                 <div class="card">
@@ -139,6 +145,7 @@ const page = 'index2';
                   </div>
                   <!-- /.card-header -->
                   <div class="card-body">
+                    <!--begin::Row-->
                     <div class="row">
                       <div class="col-md-8">
                         <p class="text-center">
@@ -191,10 +198,11 @@ const page = 'index2';
                       </div>
                       <!-- /.col -->
                     </div>
-                    <!-- /.row -->
+                    <!--end::Row-->
                   </div>
                   <!-- ./card-body -->
                   <div class="card-footer">
+                    <!--begin::Row-->
                     <div class="row">
                       <div class="col-md-3 col-6">
                         <div class="text-center border-end">
@@ -233,7 +241,7 @@ const page = 'index2';
 
                       </div>
                     </div>
-                    <!-- /.row -->
+                    <!--end::Row-->
                   </div>
                   <!-- /.card-footer -->
                 </div>
@@ -241,12 +249,13 @@ const page = 'index2';
               </div>
               <!-- /.col -->
             </div>
-            <!-- /.row -->
+            <!--end::Row-->
 
-            <!-- Main row -->
+            <!--begin::Row-->
             <div class="row">
               <!-- Start col -->
               <div class="col-md-8">
+                <!--begin::Row-->
                 <div class="row">
                   <div class="col-md-6">
                     <!-- DIRECT CHAT -->
@@ -525,7 +534,7 @@ const page = 'index2';
                   </div>
                   <!-- /.col -->
                 </div>
-                <!-- /.row -->
+                <!--end::Row-->
 
                 <!-- TABLE: LATEST ORDERS -->
                 <div class="card">
@@ -684,13 +693,14 @@ const page = 'index2';
                   </div>
                   <!-- /.card-header -->
                   <div class="card-body">
+                    <!--begin::Row-->
                     <div class="row">
                       <div class="col-12">
                         <div id="pie-chart"></div>
                       </div>
                       <!-- /.col -->
                     </div>
-                    <!-- /.row -->
+                    <!--end::Row-->
                   </div>
                   <!-- /.card-body -->
                   <div class="card-footer p-0">
@@ -809,8 +819,9 @@ const page = 'index2';
               </div>
               <!-- /.col -->
             </div>
-            <!-- /.row -->
-          </div><!-- /.container-fluid -->
+            <!--end::Row-->
+          </div>
+          <!--end::Container-->
         </div>
         <!--end::App Content-->
       </main>
diff --git a/src/html/pages/index3.astro b/src/html/pages/index3.astro
index 22bb417d9..9d8b4b3eb 100644
--- a/src/html/pages/index3.astro
+++ b/src/html/pages/index3.astro
@@ -30,7 +30,9 @@ const page = 'index3';
       <main class="app-main">
         <!--begin::App Content Header-->
         <div class="app-content-header">
+          <!--begin::Container-->
           <div class="container-fluid">
+            <!--begin::Row-->
             <div class="row">
               <div class="col-sm-6">
                 <h3 class="mb-0">Dashboard v3</h3>
@@ -42,10 +44,14 @@ const page = 'index3';
                 </ol>
               </div>
             </div>
+            <!--end::Row-->
           </div>
+          <!--end::Container-->
         </div>
         <div class="app-content">
+          <!--begin::Container-->
           <div class="container-fluid">
+            <!--begin::Row-->
             <div class="row">
               <div class="col-lg-6">
                 <div class="card">
@@ -294,8 +300,9 @@ const page = 'index3';
               </div>
               <!-- /.col-md-6 -->
             </div>
-            <!-- /.row -->
-          </div><!-- /.container-fluid -->
+            <!--end::Row-->
+          </div>
+          <!--end::Container-->
         </div>
         <!--end::App Content-->
       </main>
diff --git a/src/html/pages/layout/collapsed-sidebar.astro b/src/html/pages/layout/collapsed-sidebar.astro
index e7d4f1e98..d57f2e40c 100644
--- a/src/html/pages/layout/collapsed-sidebar.astro
+++ b/src/html/pages/layout/collapsed-sidebar.astro
@@ -28,7 +28,9 @@ const page = 'collapsed-sidebar';
       <main class="app-main">
         <!--begin::App Content Header-->
         <div class="app-content-header">
+          <!--begin::Container-->
           <div class="container-fluid">
+            <!--begin::Row-->
             <div class="row">
               <div class="col-sm-6">
                 <h3 class="mb-0">Collapsed Sidebar</h3>
@@ -40,12 +42,16 @@ const page = 'collapsed-sidebar';
                 </ol>
               </div>
             </div>
+            <!--end::Row-->
           </div>
+          <!--end::Container-->
         </div>
         <!--end::App Content Header-->
         <!--begin::App Content-->
         <div class="app-content">
+          <!--begin::Container-->
           <div class="container-fluid">
+            <!--begin::Row-->
             <div class="row">
               <div class="col-12">
                 <!-- Default box -->
@@ -74,8 +80,9 @@ const page = 'collapsed-sidebar';
                 <!-- /.card -->
               </div>
             </div>
-            <!-- /.row -->
-          </div><!-- /.container-fluid -->
+            <!--end::Row-->
+          </div>
+          <!--end::Container-->
         </div>
         <!--end::App Content-->
       </main>
diff --git a/src/html/pages/layout/fixed-sidebar.astro b/src/html/pages/layout/fixed-sidebar.astro
index 303ed428b..e5479faac 100644
--- a/src/html/pages/layout/fixed-sidebar.astro
+++ b/src/html/pages/layout/fixed-sidebar.astro
@@ -29,7 +29,9 @@ const page = 'fixed-sidebar';
       <main class="app-main">
         <!--begin::App Content Header-->
         <div class="app-content-header">
+          <!--begin::Container-->
           <div class="container-fluid">
+            <!--begin::Row-->
             <div class="row">
               <div class="col-sm-6">
                 <h3 class="mb-0">Fixed Layout</h3>
@@ -41,12 +43,16 @@ const page = 'fixed-sidebar';
                 </ol>
               </div>
             </div>
+            <!--end::Row-->
           </div>
+          <!--end::Container-->
         </div>
         <!--end::App Content Header-->
         <!--begin::App Content-->
         <div class="app-content">
+          <!--begin::Container-->
           <div class="container-fluid">
+            <!--begin::Row-->
             <div class="row">
               <div class="col-12">
                 <!-- Default box -->
@@ -75,8 +81,9 @@ const page = 'fixed-sidebar';
                 <!-- /.card -->
               </div>
             </div>
-            <!-- /.row -->
-          </div><!-- /.container-fluid -->
+            <!--end::Row-->
+          </div>
+          <!--end::Container-->
         </div>
         <!--end::App Content-->
       </main>
diff --git a/src/html/pages/layout/layout-rtl.astro b/src/html/pages/layout/layout-rtl.astro
index 0a543edf5..2c63fbb4c 100644
--- a/src/html/pages/layout/layout-rtl.astro
+++ b/src/html/pages/layout/layout-rtl.astro
@@ -29,7 +29,9 @@ const isRtl = true;
       <main class="app-main">
         <!--begin::App Content Header-->
         <div class="app-content-header">
+          <!--begin::Container-->
           <div class="container-fluid">
+            <!--begin::Row-->
             <div class="row">
               <div class="col-sm-6">
                 <h3 class="mb-0">Layout RTL</h3>
@@ -41,12 +43,16 @@ const isRtl = true;
                 </ol>
               </div>
             </div>
+            <!--end::Row-->
           </div>
+          <!--end::Container-->
         </div>
         <!--end::App Content Header-->
         <!--begin::App Content-->
         <div class="app-content">
+          <!--begin::Container-->
           <div class="container-fluid">
+            <!--begin::Row-->
             <div class="row">
               <div class="col-12">
                 <!-- Default box -->
@@ -75,8 +81,9 @@ const isRtl = true;
                 <!-- /.card -->
               </div>
             </div>
-            <!-- /.row -->
-          </div><!-- /.container-fluid -->
+            <!--end::Row-->
+          </div>
+          <!--end::Container-->
         </div>
         <!--end::App Content-->
       </main>
diff --git a/src/html/pages/layout/logo-switch.astro b/src/html/pages/layout/logo-switch.astro
index 9377b288c..2c5e6c74c 100644
--- a/src/html/pages/layout/logo-switch.astro
+++ b/src/html/pages/layout/logo-switch.astro
@@ -40,7 +40,9 @@ const htmlPath = convertPathToHtml(path);
       <main class="app-main">
         <!--begin::App Content Header-->
         <div class="app-content-header">
+          <!--begin::Container-->
           <div class="container-fluid">
+            <!--begin::Row-->
             <div class="row">
               <div class="col-sm-6">
                 <h3 class="mb-0">Logo Switch</h3>
@@ -52,12 +54,16 @@ const htmlPath = convertPathToHtml(path);
                 </ol>
               </div>
             </div>
+            <!--end::Row-->
           </div>
+          <!--end::Container-->
         </div>
         <!--end::App Content Header-->
         <!--begin::App Content-->
         <div class="app-content">
+          <!--begin::Container-->
           <div class="container-fluid">
+            <!--begin::Row-->
             <div class="row">
               <div class="col-12">
                 <!-- Default box -->
@@ -86,9 +92,9 @@ const htmlPath = convertPathToHtml(path);
                 <!-- /.card -->
               </div>
             </div>
-            <!-- /.row -->
+            <!--begin::Row-->
           </div>
-          <!-- /.container-fluid -->
+          <!--end::Container-->
         </div>
         <!--end::App Content-->
       </main>
diff --git a/src/html/pages/layout/sidebar-mini.astro b/src/html/pages/layout/sidebar-mini.astro
index dea812051..7809ec5eb 100644
--- a/src/html/pages/layout/sidebar-mini.astro
+++ b/src/html/pages/layout/sidebar-mini.astro
@@ -28,7 +28,9 @@ const page = 'sidebar-mini';
       <main class="app-main">
         <!--begin::App Content Header-->
         <div class="app-content-header">
+          <!--begin::Container-->
           <div class="container-fluid">
+            <!--begin::Row-->
             <div class="row">
               <div class="col-sm-6">
                 <h3 class="mb-0">Sidebar Mini</h3>
@@ -40,12 +42,16 @@ const page = 'sidebar-mini';
                 </ol>
               </div>
             </div>
+            <!--end::Row-->
           </div>
+          <!--end::Container-->
         </div>
         <!--end::App Content Header-->
         <!--begin::App Content-->
         <div class="app-content">
+          <!--begin::Container-->
           <div class="container-fluid">
+            <!--begin::Row-->
             <div class="row">
               <div class="col-12">
                 <!-- Default box -->
@@ -74,8 +80,9 @@ const page = 'sidebar-mini';
                 <!-- /.card -->
               </div>
             </div>
-            <!-- /.row -->
-          </div><!-- /.container-fluid -->
+            <!--end::Row-->
+          </div>
+          <!--end::Container-->
         </div>
         <!--end::App Content-->
       </main>
diff --git a/src/html/pages/layout/unfixed-sidebar.astro b/src/html/pages/layout/unfixed-sidebar.astro
index 0d4110a65..a95e4b641 100644
--- a/src/html/pages/layout/unfixed-sidebar.astro
+++ b/src/html/pages/layout/unfixed-sidebar.astro
@@ -28,7 +28,9 @@ const page = 'unfixed-sidebar';
       <main class="app-main">
         <!--begin::App Content Header-->
         <div class="app-content-header">
+          <!--begin::Container-->
           <div class="container-fluid">
+            <!--begin::Row-->
             <div class="row">
               <div class="col-sm-6">
                 <h3 class="mb-0">Unfixed Layout</h3>
@@ -40,12 +42,16 @@ const page = 'unfixed-sidebar';
                 </ol>
               </div>
             </div>
+            <!--end::Row-->
           </div>
+          <!--end::Container-->
         </div>
         <!--end::App Content Header-->
         <!--begin::App Content-->
         <div class="app-content">
+          <!--begin::Container-->
           <div class="container-fluid">
+            <!--begin::Row-->
             <div class="row">
               <div class="col-12">
                 <!-- Default box -->
@@ -74,8 +80,8 @@ const page = 'unfixed-sidebar';
                 <!-- /.card -->
               </div>
             </div>
-            <!-- /.row -->
-          </div><!-- /.container-fluid -->
+            <!--end::Row-->
+          </div>
         </div>
         <!--end::App Content-->
       </main>
diff --git a/src/html/pages/tables/simple.astro b/src/html/pages/tables/simple.astro
index 80fb76d45..80bcf421f 100644
--- a/src/html/pages/tables/simple.astro
+++ b/src/html/pages/tables/simple.astro
@@ -28,7 +28,9 @@ const page = 'simple';
       <main class="app-main">
         <!--begin::App Content Header-->
         <div class="app-content-header">
+          <!--begin::Container-->
           <div class="container-fluid">
+            <!--begin::Row-->
             <div class="row">
               <div class="col-sm-6">
                 <h3 class="mb-0">Simple Tables</h3>
@@ -40,12 +42,16 @@ const page = 'simple';
                 </ol>
               </div>
             </div>
+            <!--end::Row-->
           </div>
+          <!--end::Container-->
         </div>
         <!--end::App Content Header-->
         <!--begin::App Content-->
         <div class="app-content">
+          <!--begin::Container-->
           <div class="container-fluid">
+            <!--begin::Row-->
             <div class="row">
               <div class="col-md-6">
                 <div class="card">
@@ -323,8 +329,9 @@ const page = 'simple';
               </div>
               <!-- /.col -->
             </div>
-            <!-- /.row -->
-          </div><!-- /.container-fluid -->
+            <!--end::Row-->
+          </div>
+          <!--end::Container-->
         </div>
         <!--end::App Content-->
       </main>
diff --git a/src/html/pages/widgets/cards.astro b/src/html/pages/widgets/cards.astro
index eef41b117..3c9036292 100644
--- a/src/html/pages/widgets/cards.astro
+++ b/src/html/pages/widgets/cards.astro
@@ -28,7 +28,9 @@ const page = 'cards';
       <main class="app-main">
         <!--begin::App Content Header-->
         <div class="app-content-header">
+          <!--begin::Container-->
           <div class="container-fluid">
+            <!--begin::Row-->
             <div class="row">
               <div class="col-sm-6">
                 <h3 class="mb-0">Cards</h3>
@@ -40,15 +42,19 @@ const page = 'cards';
                 </ol>
               </div>
             </div>
+            <!--end::Row-->
           </div>
+          <!--end::Container-->
         </div>
         <!--end::App Content Header-->
         <!--begin::App Content-->
         <div class="app-content">
+          <!--begin::Container-->
           <div class="container-fluid">
             <h4 class="mb-2">Cards</h4>
 
             <h5 class="mb-2">Abilities</h5>
+            <!--begin::Row-->
             <div class="row">
               <div class="col-md-3">
                 <div class="card card-primary collapsed-card">
@@ -131,8 +137,10 @@ const page = 'cards';
               </div>
               <!-- /.col -->
             </div>
+            <!--end::Row-->
 
             <h5 class="mb-2">Card Outlined</h5>
+            <!--begin::Row-->
             <div class="row">
               <div class="col-md-3">
                 <div class="card card-outline card-primary collapsed-card">
@@ -215,8 +223,10 @@ const page = 'cards';
               </div>
               <!-- /.col -->
             </div>
+            <!--end::Row-->
 
             <h5 class="mb-2">Card with <code>.text-bg-*</code> </h5>
+            <!--begin::Row-->
             <div class="row">
               <div class="col-md-3">
                 <div class="card text-bg-primary collapsed-card">
@@ -299,8 +309,9 @@ const page = 'cards';
               </div>
               <!-- /.col -->
             </div>
-            <!-- /.row -->
-          </div><!-- /.container-fluid -->
+            <!--end::Row-->
+          </div>
+          <!--end::Container-->
         </div>
         <!--end::App Content-->
       </main>
diff --git a/src/html/pages/widgets/info-box.astro b/src/html/pages/widgets/info-box.astro
index 61d3790ce..b0adde8ec 100644
--- a/src/html/pages/widgets/info-box.astro
+++ b/src/html/pages/widgets/info-box.astro
@@ -28,7 +28,9 @@ const page = 'info-box';
       <main class="app-main">
         <!--begin::App Content Header-->
         <div class="app-content-header">
+          <!--begin::Container-->
           <div class="container-fluid">
+            <!--begin::Row-->
             <div class="row">
               <div class="col-sm-6">
                 <h3 class="mb-0">Info Box</h3>
@@ -40,13 +42,17 @@ const page = 'info-box';
                 </ol>
               </div>
             </div>
+            <!--end::Row-->
           </div>
+          <!--end::Container-->
         </div>
         <!--end::App Content Header-->
         <!--begin::App Content-->
         <div class="app-content">
+          <!--begin::Container-->
           <div class="container-fluid">
             <h5 class="mb-2">Info Box</h5>
+            <!--begin::Row-->
             <div class="row">
               <div class="col-12 col-sm-6 col-md-3">
                 <div class="info-box">
@@ -110,10 +116,11 @@ const page = 'info-box';
               </div>
               <!-- /.col -->
             </div>
-            <!-- /.row -->
+            <!--end::Row-->
 
             <!-- =========================================================== -->
             <h5 class="mb-2">Info Box With Custom Shadows <small><i>Using Bootstrap's Shadow Utility</i></small></h5>
+            <!--begin::Row-->
             <div class="row">
               <div class="col-12 col-sm-6 col-md-3">
                 <div class="info-box shadow-none">
@@ -177,10 +184,11 @@ const page = 'info-box';
               </div>
               <!-- /.col -->
             </div>
-            <!-- /.row -->
+            <!--end::Row-->
 
             <!-- =========================================================== -->
             <h5 class="mt-4 mb-2">Info Box With <code>bg-*</code></h5>
+            <!--begin::Row-->
             <div class="row">
               <div class="col-md-3 col-sm-6 col-12">
                 <div class="info-box text-bg-primary">
@@ -263,10 +271,11 @@ const page = 'info-box';
               </div>
               <!-- /.col -->
             </div>
-            <!-- /.row -->
+            <!--end::Row-->
 
             <!-- =========================================================== -->
             <h5 class="mt-4 mb-2">Info Box With <code>bg-gradient</code></h5>
+            <!--begin::Row-->
             <div class="row">
               <div class="col-md-3 col-sm-6 col-12">
                 <div class="info-box text-bg-primary bg-gradient">
@@ -349,8 +358,9 @@ const page = 'info-box';
               </div>
               <!-- /.col -->
             </div>
-            <!-- /.row -->
-          </div><!-- /.container-fluid -->
+            <!--end::Row-->
+          </div>
+          <!--end::Container-->
         </div>
         <!--end::App Content-->
       </main>
diff --git a/src/html/pages/widgets/small-box.astro b/src/html/pages/widgets/small-box.astro
index 38d957e92..ff75220a4 100644
--- a/src/html/pages/widgets/small-box.astro
+++ b/src/html/pages/widgets/small-box.astro
@@ -28,7 +28,9 @@ const page = 'small-box';
       <main class="app-main">
         <!--begin::App Content Header-->
         <div class="app-content-header">
+          <!--begin::Container-->
           <div class="container-fluid">
+            <!--begin::Row-->
             <div class="row">
               <div class="col-sm-6">
                 <h3 class="mb-0">Small Box</h3>
@@ -40,11 +42,14 @@ const page = 'small-box';
                 </ol>
               </div>
             </div>
+            <!--end::Row-->
           </div>
+          <!--end::Container-->
         </div>
         <!--end::App Content Header-->
         <!--begin::App Content-->
         <div class="app-content">
+          <!--begin::Container-->
           <div class="container-fluid">
             <!-- Small Box (Stat card) -->
             <h5 class="mb-2">Small Box</h5>
@@ -113,7 +118,8 @@ const page = 'small-box';
               <!-- ./col -->
             </div>
             <!-- /.row -->
-          </div><!-- /.container-fluid -->
+          </div>
+          <!--end::Container-->
         </div>
         <!--end::App Content-->
       </main>