Deep link from branch.io

<!DOCTYPE html>
<html>

<head>
	<meta name="deepview-service" content="deepview-service">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<link href="https://fonts.googleapis.com/css?family=Open+Sans:700,300" rel="stylesheet" type="text/css">
	<style>
		body {
			margin: 0;
			word-wrap: break-word;
		}

/* ============ Portrait ============ */
		.main-image {
			width: 125px;
			height: 125px;
			margin: 20vh auto 0 auto;

background-image: url(https://dangdungcntt.files.wordpress.com/2020/02/logo-blue-square-circle.png?w=200);

background-size: contain;
			background-repeat: no-repeat;
			background-position: bottom center;
		}

#content-container {
			box-sizing: border-box;
			padding: 24px;
			margin: 0 24px 0 24px;
			background-color: #ffffff;
		}

.app-title {
			font-size: 14px;
			text-align: center;
			padding-bottom: 11px;
			text-transform: uppercase;
		}

.input-wrapper {
			position: fixed;
			bottom: 0;
			left: 0;
			width: 100%;
			height: 110px !important;
			background-color: white;
			-webkit-box-shadow: 0px -20px 20px -8px rgba(255, 255, 255, 1);
			-moz-box-shadow: 0px -20px 20px -8px rgba(255, 255, 255, 1);
			box-shadow: 0px -20px 20px -8px rgba(255, 255, 255, 1);
		}

.input-container {
			width: 100%;
			padding: 0 24px;
			text-align: center;
			-webkit-box-sizing: border-box;
			-moz-box-sizing: border-box;
			box-sizing: border-box;
		}

.form-get-the-app {
			text-align: center;
			padding-top: 10px;
		}

.form-get-the-app>input {
			margin-right: 10px;
			padding-top: 10px;
			padding-bottom: 10px;
			background-color: #FFFFFF;
			border: 1px solid #979797;
			border-radius: 2px;
			font-size: 60px;
			color: #CECECE;
			line-height: 24px;
			padding-left: 20px;
		}

.cta-button {
			display: block;
			height: 62px;
			line-height: 62px;
			background-color: #06122F;
			border-radius: 2px;
			font-size: 20px;
			padding: 0 20px;
			margin: 0 20px;
			color: #FFFFFF;
			text-align: center;
			text-decoration: none;
		}

/* No data (portrait) */
		@media only screen and (orientation: portrait) {
			.card--no-data .main-image {

background-image: url(https://dangdungcntt.files.wordpress.com/2020/02/logo-blue-square-circle.png?w=200);
			}
		}

/* ============ Landscape ============ */
		@media only screen and (orientation: landscape) {
			.main-image {
				margin: 30px auto 0 auto;
			}

#content-container {
				padding: 10px 24px;
			}

.input-wrapper {
				height: 80px !important;
			}

.input-container {
				width: 50%;
				margin: 0 auto;
			}

.form-get-the-app {
				padding-top: 8px;
			}

.cta-button {
				height: 44px;
				line-height: 44px;
			}
		}

/* Reusables */
		.text-bold {
			font-family: "Open Sans", Helvetica, serif;
			font-weight: 700
		}

.text-light {
			font-family: "Open Sans", Helvetica, serif;
			font-weight: 400;
		}
	</style>
</head>

<body>
	<div class="card center">
		<div class="main-image"></div>
		<div id="content-container">
			<div class="app-title text-bold">NDD Blog</div>
		</div>
		<div class="input-wrapper">
			<div class="input-container">
				<form class="form-get-the-app">
					<a href="https://53f71-alternate.app.link/1VDW9Q5jocb?__branch_flow_type=viewapp&__branch_flow_id=869468082960279168&_t=869465513110522062"
						class="cta-button text-light">Get The App</a>
				</form>
			</div>
		</div>
	</div>
	<script type="text/javascript">
		function validateProtocol(url){
   var parser = document.createElement("a");
   parser.href = url; 
   var protocol = parser.protocol.toLowerCase();
   if ([ "javascript:", "vbscript:", "data:", "ftp:", ":", " "].indexOf(protocol) < 0) {
      return url;}
   return null;
}

function isSafariBrowser(ua) {
      return !!/^((?!chrome|android|crios|fxios).)*safari/i.test(ua);
    }

function isSafari12Dot3OrGreater() {
      var ua = navigator.userAgent;
      var isSafari = isSafariBrowser(ua);

if (isSafari) {
        return isGreaterThanVersion(ua, 12.3);
      }

return false;
    };
          window.onload = function() {
            window.top.location = validateProtocol("hangnhat://open?link_click_id=869465513110522062");
            setTimeout(function timeout() {
              if (document.webkitHidden || document.hidden) { return; };
              if (isSafari12Dot3OrGreater()) {
                if (window.confirm("Open in App Store?")) {
                  window.top.location = validateProtocol("https://53f71-alternate.app.link/1VDW9Q5jocb?__branch_flow_type=viewapp&__branch_flow_id=869468082960279168&_t=869465513110522062");
                }
              } else {
                window.top.location = validateProtocol("https://53f71-alternate.app.link/1VDW9Q5jocb?__branch_flow_type=viewapp&__branch_flow_id=869468082960279168&_t=869465513110522062");
              }
            }, 250);
          };
	</script>
</body>

</html>