diff --git a/themes/src/main/resources/theme/base/login/login-config-totp.ftl b/themes/src/main/resources/theme/base/login/login-config-totp.ftl
index 914ecb5..0515c27 100755
--- a/themes/src/main/resources/theme/base/login/login-config-totp.ftl
+++ b/themes/src/main/resources/theme/base/login/login-config-totp.ftl
@@ -11,7 +11,7 @@
         </li>
     <li>
         <p>${msg("loginTotpStep2")}</p>
-        <img src="data:image/png;base64, ${totp.totpSecretQrCode}" alt="Figure: Barcode"><br/>
+        <img id="kc-totp-secret-qr-code" src="data:image/png;base64, ${totp.totpSecretQrCode}" alt="Figure: Barcode"><br/>
         <span class="code">${totp.totpSecretEncoded}</span>
         </li>
     <li>
                 
                
                    
                    diff --git a/themes/src/main/resources/theme/keycloak/login/resources/css/login.css b/themes/src/main/resources/theme/keycloak/login/resources/css/login.css
index 7b202e1..bbf08af 100644
--- a/themes/src/main/resources/theme/keycloak/login/resources/css/login.css
+++ b/themes/src/main/resources/theme/keycloak/login/resources/css/login.css
@@ -152,6 +152,11 @@ ol#kc-totp-settings li:first-of-type {
     margin-top: 0;
 }
 
+#kc-totp-secret-qr-code {
+    max-width:150px;
+    max-height:150px;
+}
+
 /* OAuth */
 
 #kc-oauth h3 {
@@ -244,18 +249,6 @@ ol#kc-totp-settings li:first-of-type {
 .zocial.microsoft {background-color: #0052a4; color: #fff;}
 .zocial.microsoft:before { content: "\f15d"; }
 
-@media (min-width: 1281px) {
-    #kc-container-wrapper {
-        bottom: 13%;        
-    }
-    
-    #kc-logo-wrapper {
-        position: absolute;
-        top: 50px;
-        right: 50px;
-    }
-}
-
 @media (min-width: 768px) {
     #kc-container-wrapper {
         position: absolute;
@@ -326,7 +319,13 @@ ol#kc-totp-settings li:first-of-type {
     }
 }
 
-@media (max-height: 500px) {
+@media (min-height: 621px) {
+    #kc-container-wrapper {
+        bottom: 12%;
+    }
+}
+
+@media (max-height: 620px) {
     #kc-container-wrapper {
     }
 }