/* ==========================================================================
Estrutura Responsivo - Media Queries
========================================================================== */
/* 
*1200px - Monitores Wide
*1024px - Tablets maiores em modo paisagem, monitores antigos
*768px  - Tablets maiores em modo retrato
*600px  - Tablets pequenos
*480px  - Smartphones no modo paisagem
*320px  - Smartphones no modo retrato
*/


/* Paisagem tablet / Paisagem desktop */
@media only screen and (max-width: 1049px) { 
	.nav { font-size: 1.6em; }
}


@media only screen and (max-width: 769px) {
	.coluna {
		background: rgba(255,255,255,0.9);
		width: 100%;
		min-width: auto;
		min-height: 0;
		padding: 2em;
		text-align: center;
	}

	.coluna p { font-size: 1.5em; }

	.coluna:nth-child(2) {
		text-align: center;
		box-shadow: none;
	}
	
	.nav.direita { left: auto; }
}


@media only screen and (max-width: 649px) { 
	.nav { font-size: 1.4em; }
}


@media (max-width: 480px) {
	
	body,
	.nav a,
	.menu li a { color: #7b7b7b; }
	.menu > li.barra { border-right: 1px dotted #9f9f9f; }
	.nav i { margin-left: -40px; }
	
	h1 { font-size: 2.0em; }
	
	#principal { padding-top: 10%; }
	
	.nav a { margin-bottom: 5px; }
	.nav.direita { margin-left: 30px; }
	
	.modal a.fechar-modal {
		top: 10px;
		right: -5px;
	}
}