<!DOCTYPE>
<html>
<style>
#element-container-vmax {
background:green;
}
</style>
<div id="element-container-vmax">TEST PASSED</div>
<script>
function applyStyle() {
var viewportMaxLength = Math.max(window.innerWidth, window.innerHeight);
var elementStyle = document.getElementById("element-container-vmax").style;
elementStyle.height = Math.floor(30 * viewportMaxLength / 100) + "px";
elementStyle.width = Math.floor(30 * viewportMaxLength / 100) + "px";
elementStyle.fontSize = Math.floor(3 * viewportMaxLength / 100) + "px";
elementStyle.lineHeight = Math.floor(4 * viewportMaxLength / 100) + "px";
elementStyle.textIndent = Math.floor(2 * viewportMaxLength / 100) + "px";
elementStyle.marginLeft = Math.floor(2 * viewportMaxLength / 100) + "px";
elementStyle.marginRight = Math.floor(2 * viewportMaxLength / 100) + "px";
elementStyle.marginTop = Math.floor(2 * viewportMaxLength / 100) + "px";
elementStyle.marginBottom = Math.floor(2 * viewportMaxLength / 100) + "px";
elementStyle.borderTopLeftRadius = Math.floor(1 * viewportMaxLength / 100) + "px";
elementStyle.borderTopRightRadius = Math.floor(1 * viewportMaxLength / 100) + "px";
elementStyle.borderBottomLeftRadius = Math.floor(1 * viewportMaxLength / 100) + "px";
elementStyle.borderBottomRightRadius = Math.floor(1 * viewportMaxLength / 100) + "px";
elementStyle.paddingLeft = Math.floor(2 * viewportMaxLength / 100) + "px";
elementStyle.paddingRight = Math.floor(2 * viewportMaxLength / 100) + "px";
elementStyle.paddingTop = Math.floor(2 * viewportMaxLength / 100) + "px";
elementStyle.paddingBottom = Math.floor(2 * viewportMaxLength / 100) + "px";
elementStyle.minHeight = Math.floor(10 * viewportMaxLength / 100) + "px";
elementStyle.minWidth = Math.floor(10 * viewportMaxLength / 100) + "px";
elementStyle.maxHeight = Math.floor(60 * viewportMaxLength / 100) + "px";
elementStyle.maxWidth = Math.floor(60 * viewportMaxLength / 100) + "px";
}
applyStyle();
</script>
</html>