Fit to height in Android Chrome

I’m trying to get this page displayed at maximum height at 16:9 ratio. It works fine in all browsers except in android chrome browser where the bottom is cropped.
Here’s the link to the page:
https://www.inmatrix.com/temp/pikapaint/index6.html
You can see it fits perfectly in desktop.
Here’s how it looks on Andriod Chrome:


You can see the bottom is cropped.

I want the page to be displayed at full height in Android chrome.

Please help.

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
html, body{
height: 100%;
}	

.container {
position: relative;
width: calc(100vh * 0.563);
height: 100%;
margin: auto;
background-image: url(img/bg.jpg);
background-size: 100%;
background-repeat: no-repeat;
}

#embedboxbg {
position: absolute;
background-color: #0f3d59;
width: 93.7%;
height: 45.73%;
opacity: 0.85;
left: 3.15%;
top: 15.44%;
filter: alpha(opacity=85); /* For IE8 and earlier */
}

.embedded_image {
position: relative;
width: 100%;
height: 100%;
}

.embedded_image_hyperlink {
position: absolute;
object-fit: contain;

width: 87.4%;
height: 42.2%;
top: 17.2%;
left: 6.3%;
margin-left: auto;
margin-right: auto;
}

.banner {
position: absolute;
width: 93.7%;
height: 21.66%;
bottom: 15.4%;
left: 3.15%;
}

.bannerbox {
position: absolute;
background-color: #227099;
width: 100%;
height: 100%;
display: block;
margin-left: auto;
margin-right: auto;
opacity: 0.85;
filter: alpha(opacity=85); For IE8 and earlier */
}

.googlelogo{
position: absolute;
width: 22%;
height: 12.5%;
bottom: 1.3%;
left: 3.15%;
}

</style>
<title>Share page</title>
</head>
<body style="margin:0; pbannerding:0;"  bgcolor="#313131">
     <div class="container">
         <div id="embedboxbg"></div>
     <div class="embedded_image">
    <a href="https://pikapaint.com/downlobanner.jpg">	      
    <img class="embedded_image_hyperlink" src="img/embedded_image.png"/> 
    </a>    
     </div>	 
       <div class="banner">
       <div class="bannerbox"></div>	    
       </div>	 
            <div class="googlelogo" onclick="location.href='https://play.google.com/store/apps/details?id=com.embarcbannerero.PIKAPAINT';" style="cursor: pointer;">
    </div>
       </div>
</body>
</html>