@font-face {
	font-family: 'geico';
	src:  url('https://www.geico.com/public/design-kit/4.0/fonts/geico.eot?-xlxh80');
	src:  url('https://www.geico.com/public/design-kit/4.0/fonts/geico.eot?#iefix-xlxh80') format('embedded-opentype'), 
	    url('https://www.geico.com/public/design-kit/4.0/fonts/geico.woff?-xlxh80') format('woff'), 
	    url('https://www.geico.com/public/design-kit/4.0/fonts/geico.ttf?-xlxh80') format('truetype'), 
	    url('https://www.geico.com/public/design-kit/4.0/fonts/geico.svg?-xlxh80#geico') format('svg');
	font-weight: normal;
	font-style: normal;
}

html, body {
	height: auto;
	margin: 0;
	padding: 0;
	overflow-x: clip;
}

#primary-header {
	position: relative;
}

header {
	height: 60px;
	background-color: #154995;
}

#title-bar {
	height: 46px;
	font-style: bold;
	text-align: center;
	font-size: 18px;
	color: #FFF;
	background-color: #004B9B;
	padding-top: 9px;
}

.container{
	max-width: 168rem;
}

#quote-form-wrapper {
	position: relative;
	margin: 2rem auto 2rem;
	max-width: 50rem;
}
#gecko {
	display: none;
}
#arcs {
	display: none;
	position:relative;
	width: 100%;
	max-width: 50rem;
}

/*
@media all and (min-width: 768px) {
	#arcs {
		display: block;
		position:absolute;
		top: 0;
		right: calc(50% - 400px);
		width: 40rem;
		max-width: 50rem;
	}
}
*/
@media all and (min-width: 1000px) {
	#gecko{
		display: block;
		position:absolute;
		width: 500px;
		top: -6rem;
		left: -35rem;
		z-index: 0;
	}
}
@media all and (min-width: 1150px) {
	#arcs {
		display: block;
		position:absolute;
		top: 0;
		right: calc(50% - 720px);
		width: 50rem;
		max-width: 80rem;
	}
}
@media all and (min-width: 1200px) {
	#arcs {
		display: block;
		position:absolute;
		top: 0;
		right: calc(30% - 720px);
		width: 70rem;
		max-width: 80rem;
	}
	#gecko {
		display: block;
		position:absolute;
		width: 550px;
		top:-8rem;
		left: -40rem;
		z-index: 0;
	}
}
@media all and (min-width: 1250px) {
	#arcs {
		right: calc(30% - 720px);
		width: 75rem;
	}
}
#quote-form-wrapper h1 {
	color: #0B2455;
	font-size: 3.7rem;
	line-height: 4rem;
	
}
#quote-form-wrapper h2,
#features h2 {
	font-size: 2rem;
	line-height: 2.5rem;
	font-weight: 400;
}
#quote-form-wrapper h4 {
	font-weight: 600;
	margin-top: 3rem;
}
@media all and (min-width: 1000px) {
	#quote-form-wrapper h1 {
		font-size: 3.5rem;
		line-height: 4rem;
		/*width: 50%;*/
		max-width: 57.5rem;
	}
	#quote-form-wrapper h2,
	#features h2 {
		font-size: 2rem;
		line-height: 2.4rem;
		font-weight: 400;
		/*width:50%;*/
	}
}
@media all and (min-width: 1200px) {
	#quote-form-wrapper h1 {
		font-size: 4rem;
		line-height: 4.2rem;
		width: 50%;
		max-width: 57.5rem;
	}
	#quote-form-wrapper h2,
	#features h2 {
		font-size: 2.7rem;
		line-height: 3.2rem;
		font-weight: 400;
		width:50%;
	}
}
@media all and (min-width: 385px) and (max-width: 470px) {
	#quote-form-wrapper h2 span {
		display: block;
	}
}
@media all and (min-width: 1150px)  {
	#quote-form-wrapper h1,
	#quote-form-wrapper h2{
		width:55%;
	}
	#quote-form-wrapper h2 span {
		/*display: block;*/
	}
}

#quote-form-wrapper .icon-frame {
	width: 7rem;
	height: 5.6rem;
	border: 6px solid #0B2455;
	color: #0B2455;
	border-radius: 20px;
	font-size: 4.2rem;
	line-height: 4.8rem;
}

#quote-form-wrapper p {
	max-width: 240px;
	margin: 40px auto 50px;
	color: #222222;
	text-align: center;
}

@media all and (min-width: 1000px) {
	#quote-form-wrapper p {
		font-size: 20px;
		max-width: none;
		text-align: left;
	}
}

#quote-form-wrapper p b {
	font-weight: 900;
}
#quote-form{
	position: relative;
	z-index: 1;
}
@media all and (min-width: 1000px) {
	#quote-form {
		display: flex;
		flex-direction: row;
		max-width: 550px;
	}
}

#zip {
	width: 100%;
	border-radius: 30px;
	border-color: #194B93;
	margin-bottom: 10px;
	text-align: center;
}

#zip-submit {
	margin-bottom: 25px;
}

@media all and (min-width: 481px) {
	#zip-submit {
		width: 100%;
	}
}

@media all and (min-width: 1000px) {
	#zip, #zip-submit {
		margin-right: 10px;
	}
}

#and-more h2, 
.additional-ctas h2 {
	font-size: 2rem;
	font-weight: 400;
}

@media all and (max-width: 1000px) {
	.additional-ctas h2 {
		line-height: 2.4rem;
		margin-top: 2rem;
		margin-bottom: 2.4rem;
	}
}

#features,
.ctas {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.cta {
	width: 100%;
	max-width: 400px;
	padding-bottom: 3rem;
	margin-bottom: 4rem;
	border-bottom: 1px solid #676767;
}

.cta:last-child {
	border-bottom: none;
}

.cta .btn {
	width: 100%;
	text-align: center;
}

@media all and (min-width: 1150px) {
	.cta {
		display: flex;
		flex-direction: column;
		height: 20rem;
		margin: 3rem 0;
		padding: 0 3rem;
		border-right: 1px solid #676767;
		border-bottom: none;
	}

	.cta p {
		flex-grow: 1;
	}

	.cta:last-child {
		border-right: none;
	}
}

@media all and (min-width: 1000px) {
	#quote-form-wrapper {
		max-width: calc(100% - 350px);
		margin: 3rem auto 4.5rem 240px;
	}
	#and-more {
		max-width: calc(100% - 350px);
		position: relative;
		z-index: 1;
		margin:0 auto 0 190px;
	}
	#and-more h2,
	.additional-ctas h2 {
		font-size: 2.7rem;
	}
}
@media all and (min-width: 1150px) {
	#quote-form-wrapper {
		max-width: calc(100% - 350px);
		margin: 3rem auto 4.5rem 190px;
	}
	#features,
	.ctas {
		align-items: flex-start;
		justify-content: center;
		flex-direction: row;
		flex-wrap: nowrap;
		max-width: 100%;
		margin: 0 auto;
		position: relative;
		z-index: 1;
	}
	#and-more{
		margin:0;
	}
}


@media all and (min-width: 1000px) {
	#features h2 {
		width: 100%;
		margin-bottom: 30px;
		text-align: left;
	}
}

.highlight {
	display: flex;
	flex-direction: row;
	flex-wrap: no-wrap;
	width: 100%;
	max-width: 400px;
	height: 155px;
	margin-bottom: 25px;
	background-color: #FFFFFF;
	border: 1px solid #1E4071;
	border-radius: 12px;
	overflow: hidden;
}

@media all and (min-width: 1000px) {
	.highlight {
		margin-right: 20px;
	}
}

.highlight--stat {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 150px;
	height: 100%;
	background-color: #F4F2EA;
	border-right: 1px solid #1E4071;
}

@media all and (min-width: 1200px) {
	.highlight--stat {
		width: 170px;
	}
}

.highlight--stat img {
	max-width: 6rem;
	max-height: 6rem;
}

.highlight--text {
	display: flex;
	justify-content: center;
	width: calc(100% - 120px);
	height: 100%;
	padding: 0 15px;
	flex-direction: column;
}

.highlight--text p {
	margin-bottom: 0;
	font-size: 16px;
	line-height: 19.5px;
}
.disclaimer {
	overflow-y: visible;
	margin-left: auto;
	margin-right: auto;
	background-color: transparent;
	color: #8D8D8D;
	max-width: 1330px;
}