Solved issue #4768

index.html

@@ -3471,6 +3471,62 @@
         margin-top: 0;
         margin-bottom: 10px;
       }
+
+      /* Responsive design for screens smaller than 768px */
+@media screen and (max-width: 768px) {
+    .popup-content-nl {
+        flex-direction: column; /* Stack elements vertically on mobile */
+        max-width: 90%; /* Make the popup smaller */
+        height: auto; /* Allow height to adjust automatically */
+        padding: 10px; /* Add some padding */
+    }
+
+    .popup-left-nl {
+        display: none; /* Hide the image on mobile */
+    }
+
+    .popup-right-nl {
+        width: 100%;
+        padding: 20px;
+        text-align: center; 
+    }
+
+    .popup-right-nl h1 {
+        font-size: 20px; 
+    }
+
+    .popup-right-nl .h2-nl {
+        font-size: 16px; /* Adjust the subheading font size */
+    }
+
+    .popup-right-nl p {
+        font-size: 14px; /* Adjust text size for mobile */
+    }
+
+    .close1-btn-nl {
+        width: 20px;
+        cursor: pointer;
+        margin: 18px 10px;
+        position: absolute;
+        top: -4px;
+        right: 12px;
+        font-size: 18px;
+        font-weight: 800;
+        z-index: 1010; /* Ensure the close button is on top */
+    }
+
+    .no-thanks-nl {
+        font-size: 14px; /* Adjust 'No thanks' font size */
+    }
+
+    .signup-btn1-nl {
+        font-size: 14px; 
+    }
+
+    .terms-nl {
+        font-size: 10px; /* Adjust terms text size */
+    }
+}
     </style>
     <div id="popup-nl" class="popup-nl">
       <div class="popup-content-nl">