section * { box-sizing: border-box; }
html, body, main { margin:0; padding:0; height:100%; }
.t-100 { display:block; width:100%; }
.j-p { width:300px; margin:auto; background:rgba(255,255,255); padding:15px; }
.j-m { display:block; margin:auto; }
.j-g { display:block; margin:auto; }
pagina, .pagina { display:block; }

sobretela, .sobretela { position:fixed; top:0px; right:0px; bottom:0px; left:0px; background:rgba(255,255,255,0.8); display:none; overflow:auto; }
sobretela pagina, sobretela .pagina, .sobretela pagina, .sobretela .pagina { background:rgba(255,255,255); box-shadow:2px 2px 8px #aaa; }
sobretela .j-p, .sobretela .j-p, sobretela .j-m, .sobretela .j-m, sobretela .j-g, .sobretela .j-g { background:rgba(255,255,255); box-shadow:2px 2px 8px #aaa; }


@media screen and (min-width:1024.1px){
	.t-100 { padding:20px; }
	pagina, .pagina { width:1024px; margin:auto; padding:20px; }
	.j-p { margin-top:80px; }
	.j-m { width:600px; margin-top:80px; padding:20px; }
	.j-g { width:1080px; margin-top:80px; padding:20px; }
}

@media screen and (min-width:800.1px) and (max-width: 1024px){
	.t-100 { padding:15px; }
	pagina, .pagina { width:800px; margin:auto; padding:15px; }
	.j-p { margin-top:60px; }
	.j-m { width:600px; margin-top:60px; padding:15px; }
	.j-g { width:800px; margin-top:80px; padding:20px; }
}

@media screen and (min-width:512.1px) and (max-width: 800px){
	.t-100 { padding:10px; }
	pagina, .pagina { width:512px; margin:auto; padding:10px; }
	.j-p { margin-top:40px; }
	.j-m { width:500px; margin-top:40px; padding:10px; }
	.j-g { width:100%; margin-top:80px; padding:10px; }
}

@media screen and (max-width:512px){
	.t-100 { padding:10px; }
	pagina, .pagina { width:100%; padding:10px; }
	.j-p { margin-top:40px; }
	.j-m { width:100%; margin-top:40px; padding:10px; }
	.j-g { width:100%; margin-top:80px; padding:10px; }
}