*{
	margin:0;
	padding:0;
	border:0;
	font-size: 100%;
	outline: 0;
	vertical-align: baseline;
	font-weight: normal;
	line-height: normal;
	font-style: normal;
	list-style: none;
	text-decoration: none;
	}

:root{
	--white:#ffffff;
	--black:#242424;
	--brand:#3a6abb;
	--blue:#3b82f6;

	
	--gray0:#f9fafb;
	--gray1:#f3f4f6;
	--gray2:#e5e7eb;
	--gray3:#d1d5dc;
	--gray4:#9ca3af;
	--gray5:#6b7280;
	--gray6:#4b5563;
	--gray7:#374151;
	--gray8:#1f2937;
	--gray9:#111827;

	--green5:#22c55e;
	--green6:#16a34a;

	--system-ui: system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	}

html{
	font-family: var(--system-ui);
	color:var(--black);
	}

body{
	display: flex;
	flex-direction: column;
	height: 100vh;
	}

main{
	flex:1 1 auto;
	}






section.gray{
	background-color: var(--gray4);
	text-align: center;
	padding:60px 20px;
	}
section.gray h3{
	font-size: 40px;
	line-height: 40px;
	font-weight: 700;
	color:var(--white);
	margin-bottom: 8px;
	}
section.gray p{
	font-size: 24px;
	font-weight: 400;
	color:var(--white);
	}
section.gray em{
	font-style: normal;
	text-align: center;
	font-size: 14px;
	color:var(--white);
	}
	
section.gray .cta{
	display:block;
	margin:0 auto;
	text-align: center;
	width:180px;
	height:44px;
	border:1px solid var(--white);
	background-color: var(--gray4);
	color:var(--white);
	line-height: 44px;
	border-radius:3px;
	transition: .2s;
	font-size: 20px;
	margin-top: 16px;
	margin-bottom: 6px;
	}
section.gray .cta:hover{
	border:1px solid var(--brand);
	background-color: var(--brand);
	text-decoration: none;
	}
	

section.timecard{
	margin:0 auto;
	max-width: 1080px;
	padding:0 20px;
	margin-bottom: 120px;
	}
section.black{
	background-color: var(--black);
	text-align: center;
	padding:60px 20px;
	}
section.black h3{
	font-size: 40px;
	line-height: 40px;
	font-weight: 700;
	color:var(--white);
	margin-bottom: 8px;
	}
section.black p{
	font-size: 24px;
	font-weight: 400;
	color:var(--white);
	}
	




section.blue{
	background-color: var(--brand);
	text-align: center;
	padding:60px 20px;
	}

section.blue img.stars{
	text-align: center;
	width:190px;
	margin-bottom: 12px;
	}

section.blue h3{
	font-size: 40px;
	line-height: 40px;
	font-weight: 700;
	color:var(--white);
	margin-bottom: 8px;
	}
section.blue p{
	font-size: 24px;
	font-weight: 400;
	color:var(--white);
	}

.tcard1{
	display:none;
	}
.tcard2{
	display:inline-block;
	border:1px solid var(--gray4);
	border-radius:10px;
	padding:12px;
	}
	
img.tc1 {
	width: 100%;
	height: 100%;
	}


@media only screen and (min-width: 500px){
.tcard1{
	display:inline-block;
	border:1px solid var(--gray4);
	border-radius:10px;
	padding:10px;
	}
.tcard2{
	display:none;
	}
}


@media only screen and (min-width: 1120px){
img.tc1 {
	width: 1058px;
	height: 538px;
	}
}




	
section.contact{
	margin:100px auto 40px auto;
	padding:0 20px;
	max-width: 640px;
	}
section.contact h1{
	text-align: center;
	font-size: 60px;
	font-weight: 700;
	letter-spacing: -2px;
	line-height: 60px;
	margin-bottom: 12px;
	}
section.contact h2{
	text-align: center;
	font-size: 30px;
	font-weight: 400;
	letter-spacing: -1px;
	line-height: 30px;
	margin-bottom: 40px;
	}


section.contact p{
	text-align: center;
	font-size: 21px;
	font-weight: 400;
	letter-spacing: 0;
	line-height: 26px;
	}
	
	
	
section.contact p b{
	font-weight: 700;
	}
@media only screen and (min-width: 500px){
section.contact{
	margin-top: 140px;
	}
}


section.subcontact{
	margin:20px auto 100px auto;
	padding:0 20px;
	max-width: 540px;
	}
section.subcontact p{
	text-align: center;
	font-size: 18px;
	font-weight: 400;
	letter-spacing: 0;
	line-height: 26px;
	}



section.subtitle{
	text-align: center;
	margin-top:80px;
	padding:0 20px;
	}
section.subtitle h2{
	font-size: 36px;
	font-weight: 700;
	color:var(--brand);
	}