diff --git a/addons/pos_online_payment/static/src/app/utils/online_payment_popup/online_payment_popup.xml b/addons/pos_online_payment/static/src/app/utils/online_payment_popup/online_payment_popup.xml
index c799693ff03..56ef71e65a4 100644
--- a/addons/pos_online_payment/static/src/app/utils/online_payment_popup/online_payment_popup.xml
+++ b/addons/pos_online_payment/static/src/app/utils/online_payment_popup/online_payment_popup.xml
@@ -16,8 +16,8 @@
                     <div><span>Order id: </span><span t-esc="props.order.server_id"/></div>
                 </div>
             </main>
-            <footer class="footer footer-flex">
-                <div class="button cancel" style="background-color: #F3BBBB; color: rgb(168, 89, 89);" t-on-click="cancel">Cancel</div>
+            <footer class="footer modal-footer">
+                <div class="button cancel btn btn-lg" t-on-click="cancel">Cancel</div>
             </footer>
         </div>
     </t>
diff --git a/addons/pos_online_payment/static/src/css/popups/online_payment_popup.css b/addons/pos_online_payment/static/src/css/popups/online_payment_popup.css
index 861739bb081..908c15b5cab 100644
--- a/addons/pos_online_payment/static/src/css/popups/online_payment_popup.css
+++ b/addons/pos_online_payment/static/src/css/popups/online_payment_popup.css
@@ -1,9 +1,19 @@
+.pos .online-payment-popup .body {
+    padding: 1rem;
+}
+
 .pos .online-payment-popup .title {
     font-weight: bold;
+    font-size: 1.1rem;
+    padding-top: .3rem;
+    padding-bottom: 1rem;
+    border-bottom: solid 1px rgba(60, 60, 60, 0.1);
 }
 
 .pos .online-payment-popup .instructions p {
+    padding-top: 1rem;
     margin-bottom: 0;
+    font-size: 1rem;
 }
 
 .pos .online-payment-popup .instructions .qr-code {
@@ -17,8 +27,11 @@
     padding-top: .6rem;
     justify-content: left;
     text-align: left;
+    font-size: 1rem;
 }
 
 .pos .online-payment-popup .footer .button {
     margin: auto;
+    background-color: #F3BBBB;
+    color: rgb(168, 89, 89);
 }