/* BEGIN: ELEMENTS =========================================================== */

* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	-webkit-tap-highlight-color: transparent;
}

html {
  scroll-behavior: smooth;
}

body {
	background-color: white;
	color: #004f77;
	font-family: 'Exo 2', sans-serif;
	font-size: 16px;
	font-weight: 500;
	line-height: 1.25em;
	padding: 0 1.25em;
	padding: 0 calc( (100vw - 290px) / 2 );
}

a {
	color: #004f77;
	border-bottom: 1px dashed #004f77;
	text-decoration: none;
}

b {
	font-size: 800;
}

address {
	
	font-style: normal;
}

@media screen and (min-width: 320px) {

	body {
		padding: 0 calc( (100vw - 290px) / 2 );
	}

}

@media screen and (min-width: 570px) {

	body {
		padding: 0 calc( (100vw - 530px) / 2 );
	}

}

@media screen and (min-width: 850px) {

	body {
		padding: 0 calc( (100vw - 810px) / 2 );
	}

}

@media screen and (min-width: 1120px) {

	body {
		padding: 0 calc( (100vw - 1080px) / 2 );
	}

}

/* END: ELEMENTS ============================================================= */

/* BEGIN: CLASSES ============================================================ */

.section {
	border-bottom: 1px solid #004f77;

	padding-top: 1.25em;
}

@media screen and (min-width: 570px) {

	.section {
		display: grid;
		column-gap: 1.25em;
		grid-template-columns: 1fr 1fr;
	}

}

@media screen and (min-width: 850px) {

	.section {
		grid-template-columns: 1fr 1fr 1fr;
	}

}

@media screen and (min-width: 1120px) {

	.section {
		grid-template-columns: 1fr 1fr 1fr 1fr;
	}

}

	.header {
		font-weight: 800;
		margin-bottom: 0.625em;
		text-transform: uppercase;
		font-size: 1em;
	}

	.content {
		margin-bottom: 1.25em;
		margin-left: 1.25em;
	}

.list {
	margin-bottom: 0.625em;
}

	.content span {
		display: block;
/* 		white-space: nowrap; */
	}


/* END: CLASSES ============================================================== */

/* BEGIN: OBJECTS ============================================================ */

	/* BEGIN: #title =========================================================== */

	#title {
		padding-bottom: 0.625em;
		text-align: center;
	}

	#title span {
		display: block;
	}

	#title > h1 > img {
		width: 10em;
		margin: 0.625em 0;
	}
	
	#title > h1 > span > img {
		height: 1em;
	}

	@media screen and (min-width: 570px) {

		#title h1 {
			display: grid;
			column-gap: 1.25em;
			grid-column: 1 / 3;
			grid-template-columns: 9em 1fr;
			row-gap: 0.625em;
		}

		#title span {
			grid-column: 2 / 3;
			text-align: left;
		}

		#title span:nth-of-type(1) {
			align-self: flex-end;
		}

		#title > h1 > img {
			margin: 0;
			grid-row: 1 / 3;
			width: 9em;
		}

	}

	@media screen and (min-width: 850px) {

		#title h1 {
			grid-column: 1 / 4;
			grid-template-columns: 8em 1fr;
			row-gap: 0;
		}

		#title > h1 > img {
			width: 8em;
		}

	}

	@media screen and (min-width: 1120px) {

		#title h1 {
			grid-column: 1 / 5;
			grid-template-columns: 7em 1fr;
		}

		#title > h1 > img {
			width: 7em;
		}

	}

	/* END: #title ============================================================= */

	/* BEGIN: #phones ========================================================== */
	
	@media screen and (min-width: 570px) {
		
		#phones .header {
			grid-column: 1 / 3;
		}
		
	}
		
	@media screen and (min-width: 850px) {
		
		#phones .header {
			grid-column: 1 / 4;
		}
		
	}
		
	@media screen and (min-width: 1120px) {
		
		#phones .header {
		grid-column: 1 / 5;
		}
		
	}
	
	/* END: #phones ============================================================ */
	
	/* BEGIN: #amenities ======================================================= */
	
	#amenities .subsection  {
	display: flex;
	}
	#amenities img {
	width: 2.5em;
	}
	
	/* END: #amenities ========================================================= */
	
	
	/* BEGIN: #services ======================================================== */

	#services .content > span:first-child:before {
		content: "\2605";
		font-size: 0.875em;
		margin-left: -1.5em;
		padding-right: 0.5em;
	}

	@media screen and (min-width: 570px) {

		#services .header {
			grid-column: 1 / 3;
		}

	}

	@media screen and (min-width: 850px) {

		#services .header {
			grid-column: 1 / 4;
		}

	}

	@media screen and (min-width: 1120px) {

		#services .header {
			grid-column: 1 / 5;
		}

	}

	/* END: #services ========================================================== */

	/* BEGIN: #employees ======================================================= */
	
		#employees .header {
/* 			text-transform: none; */
		}
		
	/* END: #employees ========================================================= */

	/* BEGIN: #map ============================================================= */

		#map {
			display: block;
/* 			display: none; */
		}

		#map iframe {
			border: 1px solid #004f77;
			height: 50vh;
			margin-bottom: 1.25em;
			width: 100%;
		}

		@media screen and (min-width: 570px) {

		#map iframe {
			grid-column: 1 / 3;
		}

	}

	@media screen and (min-width: 850px) {

		#map iframe {
			grid-column: 1 / 4;
		}

	}

	@media screen and (min-width: 1120px) {

		#map iframe {
			grid-column: 1 / 5;
		}

	}

	@media (orientation: landscape) {

		#map iframe {
			height: 75vh;
		}

	}

	/* END: #map =============================================================== */

	/* BEGIN: #copyright ======================================================= */

	#copyright {
		display: block;
		border-bottom: 0;
		padding-bottom: 0.625em;
	}

		#copyright div {
			align-content: center;
			display: flex;
			justify-content: flex-end;
		}

		#copyright span {
			font-size: 1.625em;
		}

	/* END: #copyright ======================================================= */

/* END: OBJECTS ============================================================== */