html{
	font-family: helvetica, arial, sans-serif;
	line height: 1.0;
	font-size: 16px;
	scroll-behavior: smooth;
	}

@media screen and (min-width: 360px){
	html{
		font-size:8px
	}
}


@media screen and (min-width: 600px){
	html{
		font-size:11px
	}
}


@media screen and (min-width: 900px){
	html{
		font-size:14px
	}
}

@media screen and (min-width: 1500px){
	html{
		font-size:16px
	}
}

@media screen and (min-width: 1900px){
	html{
		font-size:22px
	}
}

@media screen and (min-width: 2400px){
	html{
		font-size:28px
	}
}


body {
	background-color: #050E6B;
	/*background-color: black;*/
	background-size: 100% 100%;
	background-repeat: no-repeat;
	/*background-size: cover;*/
	box-sizing: border-box;
	}


/*format header div*/
#headerrow{
	width: 60%;
	height: 40%;
	margin-left: 20%;
	margin-right: 20%;
	padding-top: 20px;
	background-color: default;
	opacity: 1;
	float: left;
	text-align:center;
	vertical-align:middle;
		display: flex;
		justify-content: center;
		align-items: center;
	box-sizing: border-box;
	}


#logo{
	width: 60%;
	height: auto;
	box-sizing: border-box; /*DIV size is fixed and not add margin and padding to total width*/
	}



#content{
	width: 60%;
	height: 50%;
	margin-left: 20%;
	margin-right: 20%;
	background-color: default;
	float: left;
	font-size:1.8em;
	font-family: 'Arial' 'sans-serif';
	color: #EBF2EA;
	text-align:center;
	vertical-align:middle;
		display: flex;
		justify-content: center;
		align-items: center;
	box-sizing: border-box;
	}