diff --git a/templates/base.html b/templates/base.html
index b67284d..42b8119 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -21,6 +21,7 @@
         <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/tailwindcss/dist/tailwind.min.css">
         <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free/css/all.min.css">
         {% endblock %}
+        
         <style>
             body {
                 /* // padding-bottom: 10px; */
@@ -385,14 +386,14 @@
             </div>
         <!-- Copyright -->
         </footer>
-        
-
         <!--jQuery -->
         <script
             src="https://code.jquery.com/jquery-3.6.0.js"
             integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk="
             crossorigin="anonymous"
         ></script>
+
+        
         <!-- Boostrap Scripts -->
         <script
             defer
diff --git a/templates/strategy_tw.html b/templates/strategy_tw.html
index 5b97471..d7f66b9 100644
--- a/templates/strategy_tw.html
+++ b/templates/strategy_tw.html
@@ -51,8 +51,8 @@ div.card{
                 <li><span class="fa-li"><i class="fa-solid fa-scroll"></i></span>未輸入投資組合名稱則會由系統隨機生成。</li>
             </ul>
         </div>
-        <div class="modal" id="intro" tabindex="-1" data-bs-backdrop="static">
-            <div class="modal-dialog">
+        <div class="modal fade" id="intro" tabindex="-1" data-bs-backdrop="static">
+            <div class="modal-dialog modal-dialog-centered">
               <div class="modal-content">
                 <div class="modal-header">
                     <h5 class="card-title text-xl font-bold pt-2">
@@ -79,7 +79,6 @@ div.card{
               </div>
             </div>
         </div>
-        
         <div class="card my-2" style="border-radius: 7px;">
             <div class="card-header d-flex">
                 <div class="py-2 font-bold text-xl">