<!DOCTYPE html>
<html lang=”en”>
    <head>
        <meta charset=”UTF-8″>
        <meta name=”viewport” content=”width=device-width, initial-scale=1.0″>
        <title>Iframe Page</title>
        <style>
            .iframe-wrapper {
                position: relative;
                overflow: hidden;
                width: 100%;
                padding-top: 45%;
            }
            @media (max-width: 770px) {
                .iframe-wrapper {
                    padding-top: 100%;
                }
            }
            @media (max-width: 510px) {
                .iframe-wrapper {
                    padding-top: 150%;
                }
            }
            @media (max-width: 395px) {
                .iframe-wrapper {
                    padding-top: 220%;
                }
            }
            @media (max-width: 330px) {
                .iframe-wrapper {
                    padding-top: 270%;
                }
            }
            @media (max-width: 300px) {
                .iframe-wrapper {
                    padding-top: 300%;
                }
            }
            .embedded-frame {
                position: absolute;
                top: 0;
                right: 0;
                bottom: 0;
                left: 0;
                width: 100%;
                height: 100%;
                border: none;
            }
            .no-scrollbar {
                -ms-overflow-style: none;
                scrollbar-width: none;
            }
            .no-scrollbar::-webkit-scrollbar {
                display: none;
            }
            .testing{
                height: 400px;
            }
        </style>
     </head>
     <body>
        <div class=”iframe-wrapper no-scrollbar”>
            <iframe class=”embedded-frame no-scrollbar” src=”http://localhost:3000/clients-questionnaire”></iframe>
        </div>
     </body>
</html>