body{
	background-color: #70757d;
	margin: 0px;
	overflow-x: hidden;
}
#barra_superior{
	width: 100%; 
	background-color: #8f99a8;
	border-style: solid;
	border-width: 2px;
}
#texto_pf{
	font-family: "Noto Sans", sans-serif; font-simargin:10px; 
	font-size: 50px; 
	margin: 0px;
}
#texto_pf a{
	color: inherit;
	text-decoration: none;
}
#secao_inferior{
	min-height: 25%; 
	background-color: #8f99a8; 
	width: 100%; 
	border-style: solid;
	border-width: 0px 2px 2px 2px;
	display: flow-root;
}
#foot{
	margin-top: 4px;
}
#foot > * {
	margin-right: 25px; 
	font-size: 17px; 
	margin-top: 10px;
	font-family: 'Arial', sans-serif
}
#foot a{
	text-decoration: none; 
	color: #e8e8e8
}



@media (max-width: 767px) {
	  #principal{
		height: 99%;
		max-width: 100%;
		margin: 1px;
		box-sizing: border-box;
	}
	#texto_pf{
		font-size: 10vw; 
	}
	#barra_superior{
		min-height: 80px; 
	}
	#secao_inferior{
		min-height: 30%;
	}
}

@media (max-width: 767px)  and (orientation: landscape){
	  #principal{
		height: 100%;
		margin: 2 2% 2% 2%;
	}
	#texto_pf{
		font-family: "Noto Sans", sans-serif; font-simargin:10px; 
		font-size: 45px; 
		margin: 0px;
	}
	#barra_superior{
		min-height: 100px; 
	}
	#secao_inferior{
		min-height: 50%;
	}
	
}

@media (min-width: 768px) {
	  #principal{
		height: 100%;
		margin-top: 6px;
		margin-left: 15%; margin-right: 15%;
	}
	#barra_superior{
		border-width: 2px;
		min-height: 80px;
	}
	#secao_inferior{
		border-width: 0px 2px 2px 2px;
		min-height: 30%;
	}
}

@media (min-width: 768px) and (orientation: landscape){
	  #principal{
		height: 100%;
		margin-top: 6px;
		margin-left: 20%; margin-right: 20%;
	}
	#barra_superior{
		border-width: 2px;
		min-height: 100px; 
	}
	#secao_inferior{
		border-width: 0px 2px 2px 2px;
		min-height: 50%;
	}
}

@media (min-width: 1300px) {
	  #principal{
		height: 100%;
		margin-top: 6px;
		margin-left: 30%; margin-right: 30%;
	}
	#barra_superior{
		border-width: 2px;
		min-height: 80px;
	}
	#secao_inferior{
		border-width: 0px 2px 2px 2px;
		min-height: 30%;
		
	}
}