/*---Tablet---*/

@media screen and (min-width: 768px) {
	body { min-width: 768px; max-width: 1024px; }
	.container {width: 100%;}
	.service-container section { display: grid; grid-template-columns: 320px 400px; grid-gap: 20px;  }
	#quote { font-size: 2.4rem; }

}

/*---Desktop---*/

@media screen and (min-width: 1024px) {
	body { min-width: 1024px; max-width: 1284px; }
	.mobile { display: none; }
	.tablet { display: block; }
	.container { width: 100%; }
	.service-container section { display: grid; grid-template-columns: 480px 480px; grid-gap: 20px;  }
	#quote { font-size: 3.2rem; }
}

@media screen and (min-width: 1285px) {
	body { min-width: 1285px; max-width: 1920px;  }

	body { width: 80%; margin: auto; }
	#bar,#cross { display: none; }
	.nav-ul { display: block; }
	nav ul { width: auto; float: right;  }
	nav li { float: left;}
	nav ul li a { padding-left: 20px; margin-left:40px; background-color: black; filter: invert(0); padding-top: 0; }
	h2 { margin-top: 40px; margin-bottom: 20px; }
	h3 { margin-top: 32px; margin-bottom: 16px; }
	#map { width: 100%; margin: auto; }
	#quote { font-size: 2.8rem; }
}