diff --git a/MovieInfo.html b/MovieInfo.html
index d19935e..83a88af 100644
--- a/MovieInfo.html
+++ b/MovieInfo.html
@@ -27,14 +27,6 @@
     <!-- Sweetalert2 -->
     <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
     <script src="js/theme.js"></script>
-    <style>
-      .showtimes-container {
-        margin-top: 30px;
-      }
-      .showtime-buttons .btn {
-        margin: 5px;
-      }
-    </style>
   </head>
 
   <body>
diff --git a/img/RealizeBanner.jpg b/img/RealizeBanner.jpg
deleted file mode 100644
index a7880ec..0000000
Binary files a/img/RealizeBanner.jpg and /dev/null differ
diff --git a/index.html b/index.html
index 0be4c2b..d2d464d 100644
--- a/index.html
+++ b/index.html
@@ -49,6 +49,10 @@
             <img src="WGLogo.png" alt="" width="40px" />
           </a>
           <div class="offcanvas offcanvas-end" tabindex="-1" id="offcanvasNavbar" aria-labelledby="offcanvasNavbarLabel">
+            <div class="offcanvas-header">
+              <h5 class="offcanvas-title" id="offcanvasNavbarLabel"><a href="index.html"><img src="WGLogo.png" alt="" width="40px"/></a></h5>
+              <button type="button" class="btn-close" data-bs-dismiss="offcanvas" aria-label="Close"></button>
+            </div>
             <div class="offcanvas-body">
               <ul class="navbar-nav flex-grow-1 pe-3">
                 <li class="nav-item">
diff --git a/js/fetchShowing.js b/js/fetchShowing.js
index 0dc43f2..0290931 100644
--- a/js/fetchShowing.js
+++ b/js/fetchShowing.js
@@ -26,7 +26,7 @@ fetch('Movies.txt')
       </div>
       <div style="display: none;" id="qr-code-${movie.lineNumber}">
         <h3 style="text-align: center; color: #000;">Số tiền cần thanh toán: 70.000 VNĐ</h3>
-        <img width="600px" src="img/QR-code.jpg" alt="QR Code" />
+        <img width="600px" style="max-width: 100%; height: auto;" src="img/QR-code.jpg" alt="QR Code" />
         <div class="d-flex justify-content-center mt-3">
               <button class="btn btn-success mx-2" onclick="confirmBooking()">Xác nhận</button>
               <button class="btn btn-danger mx-2" onclick="$.fancybox.close()">Hủy</button>
diff --git a/js/fetchUpcoming.js b/js/fetchUpcoming.js
index 1700af3..7a9af31 100644
--- a/js/fetchUpcoming.js
+++ b/js/fetchUpcoming.js
@@ -26,7 +26,7 @@ fetch('Movies.txt')
       </div>
       <div style="display: none;" id="qr-code-${movie.lineNumber}">
         <h3 style="text-align: center; color: #000;">Số tiền cần thanh toán: 70.000 VNĐ</h3>
-        <img width="600px" src="img/QR-code.jpg" alt="QR Code" />
+        <img width="600px" style="max-width: 100%; height: auto;" src="img/QR-code.jpg" alt="QR Code" />
         <div class="d-flex justify-content-center mt-3">
               <button class="btn btn-success mx-2" onclick="confirmBooking()">Xác nhận</button>
               <button class="btn btn-danger mx-2" onclick="$.fancybox.close()">Hủy</button>
diff --git a/js/navbarHandle.js b/js/navbarHandle.js
new file mode 100644
index 0000000..c796034
--- /dev/null
+++ b/js/navbarHandle.js
@@ -0,0 +1,19 @@
+$(document).ready(function() {
+    var $offcanvasNavbar = $('#offcanvasNavbar');
+    var $navbar = $('.navbar-nav');
+
+    $(window).resize(function() {
+      moveLoginButtons();
+    });
+    function moveLoginButtons() {
+      if ($(window).width() <= 280) {
+        $('.login-button').appendTo($offcanvasNavbar.find('.navbar-nav'));
+      } else {
+
+        $('.login-button').appendTo($navbar);
+      }
+    }
+
+    moveLoginButtons();
+  });
+  
\ No newline at end of file
diff --git a/style.css b/style.css
index 4e7ac0a..8766253 100644
--- a/style.css
+++ b/style.css
@@ -28,8 +28,8 @@ body {
 
 .header .navbar {
   height: 80px;
-  background-color: rgba(var(--bs-body-bg-rgb), 1.5); /* Adjust the alpha value to make it darker */
-  transition: 0.3s background-color; /* Fixing the transition property */
+  background-color: rgba(var(--bs-body-bg-rgb), 1.5);
+  transition: 0.3s background-color;
   padding: 0.5rem;
   box-shadow: 0 2px 4px 0 rgba(0,0,0,.2);
 }
@@ -69,6 +69,25 @@ body {
   display: none;
 }
 
+@media (max-width: 353px) {
+  .header .right-bt-sign {
+    display: none;
+  }
+  .header .left-bt-login {
+  border-radius: 50px;
+  }
+}
+@media (max-width: 261px) {
+  .header .right-bt-sign {
+    display: none;
+  }
+  .header .left-bt-login {
+    border-radius: 50px;
+    font-size: 10px;
+    padding: 13 px;
+  }
+}
+
 .content1 {
   margin-top: 90px;
 }
@@ -472,4 +491,25 @@ body {
   position: relative;
   z-index: 1;
   text-align: center;
+}
+
+/* MovieInfo */
+.showtimes-container {
+  margin-top: 30px;
+}
+
+.showtime-buttons .btn {
+  margin: 5px;
+}
+
+@media (max-width: 768px) {
+  #qr-code-modal {
+    width: 100% !important;
+    padding: 10px;
+  }
+
+  #qr-code-modal img {
+    width: 100% !important;
+    height: auto;
+  }
 }
\ No newline at end of file
