.summon-us {
	display: flex;
	flex-direction: column;
	background: linear-gradient(to bottom, black 1dvh, transparent 10dvh calc(100% - 10dvh), black calc(100% - 1dvh)), url("./../images/backgrounds/Background.jpg");
	padding: 5dvh 2dvh;
}

.page-headers {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

.page-header {
	color: white;
	margin: 0;
	text-align: center;
}

.company-details {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	color: white;
	width: 100%;
	font-size: 1.5rem;
}

.company-hours-header {
	margin: 2dvh 0 0 0;
	font-size: 2.25rem;
}

.company-phone {
	margin: 0;
	text-align: center;
}

.company-phone a {
	color: white;
	font-size: 1.75rem;
}

.company-hours {
	display: grid;
	grid-template-columns: 100px 100px;
	width: auto;
	column-gap: 24px;
	padding-bottom: 48px;
}

.company-days {
	text-align: end;
}

.summon-body {
	display: flex;
	flex-direction: row;
}

.email-list {
	display: flex;
	flex-direction: column;
	row-gap: 48px;
}

.email {
	color: white;
	margin: 8px;
	padding: 24px;
	display: flex;
	flex-direction: column;
	row-gap: 24px;
}

.email-address {
	font-size: 1.25rem;
	font-weight: bold;
	align-self: center;
	color: white;
}

.email-for {
	text-align: center;
}

.email-lexi   { box-shadow: inset 0 0 5px 1px var(--color-primary-red), 0 0 5px 1px var(--color-primary-red); }
.email-lily   { box-shadow: inset 0 0 5px 1px var(--color-primary-purple), 0 0 5px 1px var(--color-primary-purple); }
.email-narmo  { box-shadow: inset 0 0 5px 1px var(--color-primary-red), 0 0 5px 1px var(--color-primary-red); }
.email-kyro   { box-shadow: inset 0 0 5px 1px var(--color-primary-purple), 0 0 5px 1px var(--color-primary-purple); }
.email-richie { box-shadow: inset 0 0 5px 1px var(--color-primary-silver), 0 0 5px 1px var(--color-primary-silver); }
.email-info   { box-shadow: inset 0 0 5px 1px var(--color-primary-silver), 0 0 5px 1px var(--color-primary-silver); }

.location {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.location-text {
	margin: 0;
	color: white;
	font-size: 1.5rem;
}

/* Phone - Vertical */
@media screen and (width >= 320px) and (width < 768px) {
	.summon-us { padding: 5dvh 0;}
	.page-header { font-size: 2rem; }
	.location { width: 100%; padding-bottom: 48px; }
	.location-text { text-align: center; }
	/* .email-list { width: 100%; } */
	.email-address { font-size: 1.25rem; }
	.email-detail { text-align: center; font-size: 1.25rem; }
	.email-for { font-size: 1.25rem; }
	.summon-body { display: flex; flex-direction: column-reverse; }
	.google-map { width: 100%; height: 33dvh; }
}

/* Phone - Horizontal */
@media screen and (width >= 768px) and (width < 1300px) {
	.page-header { font-size: 2.5rem; }
	.location { width: 100%; }
	.location-text { text-align: center; }
	.email-list { width: 100%; }
	.email-address { font-size: 2.5rem; }
	.email-detail { text-align: center; font-size: 1.5rem; }
	.email-for { font-size: 1.5rem; }
	.summon-body { display: flex; flex-direction: column-reverse; }
	.google-map { width: 66dvw; height: 66dvh; }
}

/* Desktop */
@media screen and (width >= 1300px) {
	.page-header { font-size: 2.5rem; }
	.location { width: 50%; }
	.email-list { width: 50%; }
	.email-address { font-size: 2.5rem; }
	.email-detail { text-align: center; font-size: 1.5rem; }
	.email-for { font-size: 1.5rem; }
	.google-map { width: 33dvw; height: 33dvw; }
}
