
	body {
		font-family: arial;
	}
		
	.banner {
		background: #003887;
		display: flex;
		justify-content: space-around;
		color: #fff;
		font-size: 30px;
		align-items: center;
	}
		
	.toalhas {
		width: 400px;
	}
		
	.servicos-oferecidos {
		display: flex;
		justify-content: space-around;
		margin: 50px 0 0 0;
	}
	
	.icones {
		width: 60px;
	}
		
	.servicos {
		display:flex;
		gap: 40px;
		padding: 0 20px 0 20px;
		background: #C6D9F4;
		color: #284268;
		border-radius: 25px 0 25px 0;
		box-shadow:0 8px 24px rgba(0,0,0,.08);
	}
	
	.servicos h3 {
		text-transform: uppercase;
		}
		
	
	aside {
		display: flex;
		flex-direction: column;
		width: none;
		gap: 15px;
		margin: 25px 0 0 0;
	}
	
	.chamada-servicos {
		padding: 10px;
	}
	
	.chamada-servicos h3 {
		font-size: 40px;
		color: #284268;
		text-transform: uppercase;
	}
		
	.chamada-servicos p {
		font-size: 22px;
		color: #717276;
	}
		
	.onde-estamos {
		display: flex;
		align-items: flex-end;
		gap: 48px;
		max-width: 1200px;
		margin: 60px auto 0;
		padding: 64px 24px;
	}			

	.mapa img {
		width:360px;
		border-radius:6px;
		box-shadow:0 8px 24px rgba(0,0,0,.08);
	}

	.informacao {
		color:#284268;
		width:640px;
	}

	.onde {
		margin:0 0 8px;
		font-size:20px;
		color:#7b8aa0;
	}

	.estamos {
		margin:0 0 24px;
		 font-size:38px;
		color:#284268;
	}	

	.horario{
		margin:0;
		font-size:16px;
		color:#5e6a7a;
	}
	
	.horario strong{ 
		color:#1d2a3a; 
	}
		
	
	@media (max-width: 680px){ 
	  
	.menu { 
		width: 100%; 
	}
	
	.menu ul {
		gap: 20px;
		justify-content: center;
	}
	
	banner {
		flex-direction: column;
		text-align: center;
		padding: 24px 16px;
	}
	
	.toalhas {
		width: 280px;
		margin: 0 auto;
	}
	
	.banner h2 {
		font-size: 22px;
		line-height: 1.25;
		margin: 0;
	}
	
	.servicos-oferecidos {
		flex-direction: column;
		gap: 16px;
		margin: 28px 0 0 0;
		padding: 0 16px;
	}
	.chamada-servicos{
		padding: 0;
	}
	
	.chamada-servicos h3{
		font-size: 26px;
		margin: 4px 0 8px;
	}
	
	.chamada-servicos p{
		font-size: 16px;
		margin: 0 0 8px;
	}

	aside{
		flex-direction: column; 
		gap: 12px;
		margin: 0;
	}
	
	.servicos{
		gap: 16px;
		padding: 14px;
	}
	
	.icones { 
		width: 44px;
	}
	
	.onde-estamos{
		flex-direction: column-reverse;
		align-items: stretch;
		gap: 20px;
		margin: 32px auto 0;
		padding: 24px 16px;
		max-width: 100%;
	}
	
	.mapa img{
		width: 100%;
		max-width: 100%;
	}
	
	.informacao{
		width: 100%;
	}
	
	.onde { 
		font-size: 16px;
		margin: 0 0 4px; 
	}
		
	.estamos {
		font-size: 28px;
		margin: 0 0 12px;
	}
	  
	.horario{
		font-size: 15px; 
	}
	}