* {
	box-sizing: border-box;
}

html {
	height: 100%;
}

body {
	margin: 0;
	background: #192B33;
}

a {
	text-decoration: none;
	cursor: pointer;
}

::selection {
	background: #A4C8C6;
	color: #FFFFFF;
}

/* -------------------- RESPONSIVE -------------------- */

desktop {
	display: block;
	height: 100%;
	width: 100%;
}

mobile {
	display: none;
}

/* -------------------- HEADER -------------------- */

header {
	display: block;
	margin-top: 10vw;
	height: 40vw;
	width: 100%;
/* */
	background: url(../img/bg.jpg);
	background-size: cover;
}

#shane {
	display: block;
	position: relative;
	height: 30vw;
	width: 30vw;
	left: 5vw;
	top: 10vw;
/* */
	background: url(../img/shane.webp) no-repeat;
	background-size: contain;
}

#sig {
	display: block;
	position: relative;
	height: 4vw;
	width: 12vw;
	left: 25vw;
	top: 24vw;
/* */
	background: url(../img/signature.svg) no-repeat;
	background-size: contain;
}

#tag {
	position: relative;
	width: 55%;
	left: 35%;
	top: -20vw;
}

#tag span:nth-child(1) {
	display: block;
	margin: 0 0 1.5vw 0;
/* */
	font-family: 'Raleway', sans-serif;
	font-weight: 700;
	font-size: 5vw;
	line-height: 5vw;
	color: #FFFFFF;
}

#tag span:nth-child(2) {
	display: block;
	margin: 0 0 1vw 0;
	height: 3px;
	width: 14vw;
/* */
	background: #A4C8C6;
}

#tag span:nth-child(3) {
	display: block;
/* */
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 4.2vw;
	line-height: 4.2vw;
	color: #FFFFFF;
}

/* -------------------- MAIN -------------------- */

main {
	display: block;
/* */
	background: #F8F8F8;
}

/* -------------------- CONTENT - TEAM -------------------- */

#team {
	display: flex;
	flex-wrap: nowrap;
	flex-direction: row;
	justify-content: space-evenly;
	align-items: stretch;
	align-content: stretch;
}

#letter {
	display: block;
	padding: 5vw;
	width: 60%;
/* */
	font-family: 'Inter', sans-serif;
	font-weight: 700;
	font-size: 4vw;
	color: #192B33;
}

#letter span {
	display: block;
	margin: 2vw 0 0 0;
/* */
	font-family: 'Raleway', sans-serif;
	font-weight: 400;
	font-size: 1.5vw;
	line-height: 3vw;
	color: #192B33;
}

#photo {
	display: block;
	padding: 5vw 5vw 5vw 0;
	width: 40%;
}

#frame {
	display: block;
	height: 100%;
	width: 100%;
/* */
	background: url(../img/team.webp) no-repeat;
	background-size: cover;
	border-radius: 8px;
}

/* -------------------- CONTENT - VIDEO -------------------- */

#video {
	display: block;
	width: 100%;
/* */
	text-align: center;
	font-family: 'Inter', sans-serif;
	font-weight: 700;
	font-size: 4vw;
	color: #FFFFFF;
}

video {
	width: 100%;
}

video[poster] {
	object-fit: cover;
}

/* -------------------- CONTENT - SERVICES -------------------- */

#services {
	display: flex;
	flex-wrap: nowrap;
	flex-direction: row;
	justify-content: space-evenly;
	align-items: stretch;
	align-content: stretch;
/* */
	padding: 5vw;
}

#svc-home {
	display: block;
	height: 35vw;
	width: 30%;
/* */
	background: url(../img/services/home.jpg) no-repeat center top #192B33;
	background-size: cover;
}

#svc-auto {
	display: block;
	height: 35vw;
	width: 30%;
/* */
	background: url(../img/services/auto.jpg) no-repeat center bottom #192B33;
	background-size: cover;
}

#svc-life {
	display: block;
	height: 35vw;
	width: 30%;
/* */
	background: url(../img/services/life.jpg) no-repeat center bottom #192B33;
	background-size: cover;
}

#services span {
	display: block;
	margin: 80% 0 0 0;
	padding: 2vw;
	width: 100%;
/* */
	text-align: center;
	font-family: 'Raleway', sans-serif;
	font-weight: 700;
	font-size: 3vw;
	color: #FFFFFF;
/* */
	background: rgba(25,43,51,0.9);
}

#services span:hover {
	background: rgba(204,127,43,0.5);
}

/* -------------------- CONTENT - CONSULT -------------------- */

#consult {
	display: block;
	width: 100%;
/* */
	text-align: center;
	font-family: 'Inter', sans-serif;
	font-weight: 700;
	font-size: 4vw;
	color: #FFFFFF;
/* */
	background: #CACACA;
}

.calendly-inline-widget {
	height: 60vw;
	width: 100%;
}

/* -------------------- FOOTER -------------------- */

footer {
	padding: 5vw;
/* */
	display: flex;
	flex-wrap: nowrap;
	flex-direction: row;
	justify-content: space-evenly;
	align-items: stretch;
	align-content: stretch;
}

#foot-left {
	width: 40%;
/* */
	font-family: 'Raleway', sans-serif;
	font-weight: 500;
	font-size: 1vw;
	line-height: 1.5vw;
	color: #A4C8C6;
}

logo {
	display: block;
	margin: 0 0 1vw 0;
	height: 7vw;
	width: 24vw;
/* */
	background: url(../img/logo.jpg) no-repeat;
	background-size: contain;
}

#foot-right {
	width: 60%;
	padding: 0 0 0 5vw;
/* */
	display: flex;
	flex-wrap: nowrap;
	flex-direction: row;
	justify-content: space-evenly;
	align-items: stretch;
	align-content: stretch;
}

#lnk {
	width: 30%;
	padding: 2vw 0 0 0;
}

#lnk a {
	display: block;
/* */
	font-family: 'Raleway', sans-serif;
	font-weight: 500;
	font-size: 1.5vw;
	line-height: 3vw;
	color: #CC7F2B;
}

#lnk a:hover {
	color: #FFFFFF;
}

#loc {
	width: 70%;
}

#loc iframe {
	padding: 0;
	margin: 0;
	height: 100%;
	width: 100%;
	border: none;
}

/* -------------------- FIXED NAV -------------------- */

nav {
	display: block;
	position: fixed;
	height: 10vw;
	width: 100%;
	top: 0;
/* */
	background: url(../img/peak.svg) no-repeat #192B33;
	background-position: 350% -5vw;
	background-size: 90vw;
}

#logo {
	display: block;
	margin: 2.5vw 0 0 3vw;
	height: 5vw;
	width: 17vw;
/* */
	color: transparent;
/* */
	background: url(../img/logo.jpg) no-repeat;
	background-size: contain;
}

nav span {
	position: absolute;
	height: 10vw;
	left: 28vw;
	top: 0;
}

nav span a {
	height: 10vw;
	margin: 0 2vw 0 0;
	padding: 0.5vw 0;
/* */
	font-family: 'Raleway', sans-serif;
	font-weight: 500;
	font-size: 1.5vw;
	line-height: 10vw;
	color: #FFFFFF;
/* */
	border-bottom: 4px solid #192B33;
}

nav span a:hover {
	border-bottom: 4px solid #A4C8C6;
}

#tel {
	display: block;
	position: absolute;
	padding: 1vw 1.5vw 1vw 3.5vw;
	right: 4vw;
	top: 3vw;
/* */
	font-family: 'Inter', sans-serif;
	font-weight: 700;
	font-size: 1.5vw;
	line-height: 1.5vw;
	color: #FFFFFF;
/* */
	background: url(../img/phone.svg) no-repeat #CC7F2B;
	background-position: 1.2vw 1vw;
	background-size: 1.5vw;
	border-radius: 4px;
/* */
	animation: drift 4s ease-in-out infinite;
}

#tel:hover {
	animation: none;
	right: 6vw;
}

@keyframes drift {
	0% { transform: translateX(0vw); }
	50% { transform: translateX(-2vw); }
	100% { transform: translateX(0vw); }
}

/* -------------------- MEDIA -------------------- */

@media only screen and (max-width: 744px) and (orientation: portrait) {

	desktop {
		display: none;
	}
	
	mobile {
		display: block;
		height: 100%;
		width: 100%;
	}
	
	#tel {
		display: block;
		position: absolute;
		padding: 1.5vw 2vw 1.5vw 7vw;
		right: 10vw;
		top: 9.5vw;
	/* */
		font-family: 'Inter', sans-serif;
		font-weight: 700;
		font-size: 3.5vw;
		line-height: 3.5vw;
		color: #192B33;
	/* */
		background: url(../img/mobile.svg) no-repeat #A4C8C6;
		background-position: 1.5vw 1.2vw;
		background-size: 4vw;
		border-radius: 4px;
	/* */
		animation: none;
	}
	
	#tel:hover {
		right: 10vw;
	}
	
	#logo {
		display: block;
		margin: 6vw 0 0 7vw;
		height: 12vw;
		width: 40vw;
	/* */
		color: transparent;
	/* */
		background: url(../img/logo.jpg) no-repeat;
		background-size: contain;
	}
	
	section {
		display: block;
		position: absolute;
		width: 100%;
		top: 24vw;
	}
	
	#gradient {
		display: block;
		padding: 10vw;
		width: 100%;
	/* */
		background: linear-gradient(170deg,rgba(25, 43, 51, 1) 0%, rgba(164, 200, 198, 1) 100%);
	}
	
	#gradient span:nth-child(1) {
		display: block;
	/* */
		font-family: 'Raleway', sans-serif;
		font-weight: 700;
		font-size: 7.5vw;
		line-height: 7.5vw;
		color: #FFFFFF;
	}
	
	#gradient span:nth-child(2) {
		display: block;
		margin: 4vw 0;
		height: 3px;
		width: 14vw;
	/* */
		background: #A4C8C6;
	}
	
	#gradient span:nth-child(3) {
		display: block;
	/* */
		font-family: 'Raleway', sans-serif;
		font-weight: 700;
		font-size: 5vw;
		line-height: 5vw;
		color: #FFFFFF;
	}
	
	#portrait {
		display: block;
		padding: 10vw;
		height: 60vw;
		width: 100%;
	/* */
		background: url(../img/people/shane.webp) no-repeat top left;
		background-size: cover;
	}
	
	#signature {
		display: block;
		height: 11vw;
		width: 35vw;
	/* */
		background: url(../img/signature.svg) no-repeat;
		background-size: contain;
	}
	
	#statement {
		display: block;
		padding: 10vw;
		background: #F8F8F8;
	}
	
	#statement span {
		font-family: 'Inter', sans-serif;
		font-weight: 700;
		font-size: 7vw;
		color: #192B33;
	}
	
	#statement p {
		font-family: 'Raleway', sans-serif;
		font-weight: 400;
		font-size: 3vw;
		line-height: 5vw;
		color: #192B33;
	}
	
	#insurance {
		padding: 5vw 0 0 0;
		width: 100%;
	/* */
		text-transform: uppercase;
		font-family: 'Inter', sans-serif;
		font-weight: 700;
		font-size: 4vw;
		color: #A4C8C6;
	}
	
	#insurance span {
		text-transform: uppercase;
		font-family: 'Inter', sans-serif;
		font-weight: 700;
		font-size: 5vw;
		color: #A4C8C6;
	}
	
	#insurance p {
		text-transform: none;
		font-family: 'Raleway', sans-serif;
		font-weight: 400;
		font-size: 3vw;
		line-height: 5vw;
		color: #192B33;
	}
	
	#consultation {
		display: block;
		width: 100%;
	/* */
		text-align: center;
		font-family: 'Inter', sans-serif;
		font-weight: 700;
		font-size: 4vw;
		color: #FFFFFF;
	/* */
		background: #F8F8F8;
	}

	.calendly-inline-widget {
		height: 185vw;
		width: 100%;
	}

	#location {
		width: 100%;
	}
	
	#location iframe {
		padding: 0;
		margin: 0;
		height: 40vw;
		width: 100%;
		border: none;
	}
	
	#closer {
		display: block;
		padding: 7vw;
	}
	
	#closer span {
		font-family: 'Raleway', sans-serif;
		font-weight: 500;
		font-size: 4vw;
		line-height: 5vw;
		color: #A4C8C6;
	}
	
	#closer p {
		font-family: 'Raleway', sans-serif;
		font-weight: 500;
		font-size: 2.2vw;
		line-height: 4vw;
		color: #A4C8C6;
	}

}

/* -------------------- PRINT -------------------- */

@media print {

	* {
		display: none;
	}

}
