@font-face { font-family: 'Runda'; font-weight: light; src: url('fonts/Runda Light.otf') format('opentype'); }
@font-face { font-family: 'Runda'; font-weight: normal; src: url('fonts/Runda Normal.otf') format('opentype'); }
@font-face { font-family: 'Runda'; font-weight: bold; src: url('fonts/Runda Bold.otf') format('opentype'); }

html, body { margin: 0; padding: 0; font-family: 'Runda', sans-serif; font-weight: 400; font-size: 15px; color: #000000; background: #ffffff; }

h1 { font-style: normal; font-weight: bold; font-size: 60px; line-height: 72px; margin: 0; }
h2 { font-style: normal; font-weight: bold; font-size: 40px; line-height: 48px; margin: 0; }
h3 { font-style: normal; font-weight: bold; font-size: 32px; line-height: 39px; margin: 0; }
h4 { font-style: normal; font-weight: bold; font-size: 24px; line-height: 29px; margin: 0; }
input { font-style: normal; font-weight: bold; font-size: 16px; line-height: 19px; margin: 0; }
textarea { font-family: inherit; font-style: normal; font-weight: bold; font-size: 16px; line-height: 19px; margin: 0; }
p { font-style: normal; font-weight: normal; font-size: 16px; line-height: 19px; margin: 0; }
.large { font-style: normal; font-weight: normal; font-size: 20px; line-height: 24px; }
.medium { font-style: normal; font-weight: normal; font-size: 16px; line-height: 19px; }

a { color: inherit; }	
.container { max-width: 1170px; margin: 0 auto; position: relative; overflow: auto; padding: 0 10px; }
.btn { display: inline-block; color: #ffffff; background: #C53A3F; font-style: normal; font-weight: bold; font-size: 16px; line-height: 19px; text-align: center; text-transform: uppercase; padding: 20px 30px; text-align: center; border-radius: 50px; text-decoration: none; border: 0; cursor: pointer; }
.btn:hover { background: #AB3237; }
.btn.clear { padding: 18px 28px; border: 2px solid #C53A3F; color: #C53A3F; background: none; }
.btn.clear:hover { border: 2px solid #AB3237; color: #AB3237; }
.btn.light { color: #C53A3F; background: #ffffff; }
.btn.light:hover { background: #f3f3f3; }

label { position: relative; display: block; }
label .label { position: absolute; top: 16px; left: 16px; text-align: left; z-index: 1; color: #000000; font-style: normal; font-weight: bold; font-size: 16px; line-height: 19px; }
label.required .label:after { content: '*'; }
label.hideLabel .label { display: none; }
label input { width: 100%; box-sizing: border-box; padding: 16px; height: 52px; border: 0; }
label textarea { width: 100%; box-sizing: border-box; padding: 16px; height: 152px; border: 0; }
label .error-desc { display: none; }
label.error .error-desc { display: block; }

body { padding-top: 139px;  }
#header { position: fixed; width: 100%; background: #ffffff; top: 0; z-index: 100; }
#header .container { display: flex; flex-direction: row; justify-content: space-between; align-items: center; height: 139px; }
#header .text { display: flex; flex-direction: row; justify-content: flex-end; align-items: center; }
#header .text h4 { color: #395790; text-align: right; }
#header .text .btn { margin-left: 20px; }

#form { background: url(images/hero-desktop.jpg) no-repeat; background-size: cover; color: #ffffff; padding: 82px 0 86px; }
#form .container { display: flex; flex-direction: row; justify-content: space-between; align-items: center; }
#form .content { max-width: 650px; }
#form .content h3 { margin-bottom: 20px; }
#form .content h1 { margin-bottom: 20px; }
#form .content h4 { margin-bottom: 20px; }
#form .content .images img { vertical-align: middle; }
#form .form { flex: 0 0 470px; background: #395790; border: 10px solid #FFFFFF; box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.5); border-radius: 10px; width: 470px; padding: 30px; box-sizing: border-box; text-align: center; position: relative; }
#form .form h3 { margin-bottom: 30px; }
#form .form label { margin-bottom: 20px; }
#form .form .btn { margin-bottom: 30px; }
#form .form .text { font-style: normal; font-weight: bold; font-size: 16px; line-height: 19px; }
#form .form .thankyou { display: none; position: absolute; top: 0; left: 0; z-index: 1; background: #395790; height: 100%; width: 100%; flex-direction: column; justify-content: center; }
#form .form.completed .thankyou { display: flex; }

#msg { background: #395790; color: #ffffff; padding: 40px 0; text-align: center; }
#msg h4 { margin-bottom: 40px; }

#offer { padding: 60px 0; }
#offer .container { display: flex; flex-direction: row; justify-content: space-between; align-items: center; overflow: visible; }
#offer .badges { display: flex; flex-direction: row; justify-content: center; align-items: center; flex-wrap: wrap; max-width: 560px; margin: -10px -20px; }
#offer .badges img { width: 240px; margin: 10px 20px; display: block; }
#offer .badges .asterisk { font-style: italic; font-size: 16px; line-height: 19px; flex-basis: 100%; text-align: center; }
#offer .content { max-width: 570px; }
#offer .content h2 { margin-bottom: 20px; }
#offer .content p { margin-bottom: 20px; }
#offer .content .text { margin-bottom: 20px; font-weight: bold; font-size: 24px; line-height: 29px; }
#offer .content .btn { margin-right: 20px; }

.cta_section { background: #9E1F24; color: #ffffff; padding: 40px 0; text-align: center; }
.cta_section h2 { margin-bottom: 40px; }
.cta_section .ctas { display: flex; flex-direction: row; align-items: flex-start; }
.cta_section .cta { margin: 0 30px; flex: 1; }
.cta_section .cta h4 { margin-bottom: 20px; min-height: 58px; }

#why { padding: 40px 0; }
#why .container { display: flex; flex-direction: row-reverse; justify-content: space-between; align-items: center; }
#why .content h2 { margin-bottom: 20px; }
#why .content .subtitle { font-size: 24px; font-style: normal; font-weight: 700; line-height: 29px; letter-spacing: 0em; color: #395790; }
#why .content ul { margin: 0; padding: 0; max-width: 450px; }
#why .content ul li { margin: 22px 0; position: relative; padding-left: 43px; font-style: normal; font-weight: normal; font-size: 16px; line-height: 19px; list-style: none; }
#why .content ul li:before { width: 23px; height: 23px; content: ''; display: block; position: absolute; left: 0; top: 50%; margin-top: -11px; }
#why .content ul li.i_flag:before { background: url('images/icon-flag.png'); }
#why .content ul li.i_house:before { background: url('images/icon-house.png'); }
#why .content ul li.i_trophy:before { background: url('images/icon-trophy.png'); }
#why .content ul li.i_quote:before { background: url('images/icon-quote.png'); }
#why .content .images { margin: 40px 0; }
#why .content .images img { max-height: 60px; margin-left: 20px; }
#why .content .images img:first-child { margin-left: 0; }

#testimonial .container { overflow: visible; padding: 40px 10px; }
#testimonial .box { padding: 40px 100px; background: #395790; border: 10px solid #FFFFFF; box-sizing: border-box; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5); border-radius: 20px; text-align: center; color: #ffffff; }
#testimonial .box .rating { margin-bottom: 20px; display: flex; flex-direction: row; justify-content: center; align-items: center; }
#testimonial .box .rating img { margin: 0 10px; }
#testimonial .box h4 { margin-bottom: 20px; }
#testimonial .box p.large { margin: 20px auto; max-width: 770px; }
#testimonial .box p.quotee { margin: 0 auto; font-style: italic; font-weight: bold; font-size: 20px; line-height: 24px; }

#process { padding: 40px 0; text-align: center; }
#process h2 { position: relative; margin-bottom: 40px; display: inline-block; }
#process h2:before { content: ''; display: block; position: absolute; background: url(images/lines.png); width: 170px; height: 26px; top: 50%; left: -220px; margin-top: -13px; }
#process h2:after { content: ''; display: block; position: absolute; background: url(images/lines.png); width: 170px; height: 26px; top: 50%; right: -220px; margin-top: -13px; }
#process .processes { display: flex; flex-direction: row; justify-content: space-between; align-items: flex-start; padding: 0px; }
#process .processes .process { width: 270px; text-align: left; max-width: 25%; }
#process .processes .process img { max-width: 100%; }
#process .processes .process h4 { margin: 20px 0 10px; }

#footer { padding: 40px 0; background: #000000; color: #ffffff; text-align: center; }
#footer .ctas { margin: 40px 0; }
#footer .ctas a { text-decoration: none; font-style: normal; font-weight: normal; font-size: 20px; line-height: 24px; margin: 0 60px; }
#footer .links { list-style: none; margin: 0; padding: 0; }
#footer .links li { display: inline-block; font-style: normal; font-weight: bold; font-size: 12px; line-height: 14px; margin: 0 40px; }
#footer .links li a { text-decoration: none; }

@media only screen and (max-width: 1000px) {
	.container { padding: 0 10px; }
	
	h1 { font-size: 40px; line-height: 48px; }
	h2 { font-size: 32px; line-height: 39px; }
	h3 { font-size: 24px; line-height: 29px; }
	h4 { font-size: 20px; line-height: 24px; }
	
	body { padding-top: 205px;  }
	
	#header.m_sticky { position: fixed; }
	#header.m_sticky .logo { display: none; }
	#header.m_sticky .text { margin-top: 0; }
	#header.m_sticky .text h4 { display: none; }
	#header { position: absolute; padding: 20px 0; }
	#header .container { flex-direction: column; height: auto; }
	#header .logo img { max-width: 100%; }
	#header .text { flex-direction: column; margin-top: 20px; text-align: center; }
	#header .text h4 { text-align: center; margin-bottom: 20px; }
	#header .text .btn { margin-left: 0; }
	
	#form { background: none; padding: 0; }
	#form .container { flex-direction: column; padding: 0; }
	#form .content { background: url(images/hero-mobile.jpg) no-repeat; background-size: cover; padding: 40px 10px; text-align: center; max-width: none; width: 100%; }
	#form .form { flex: 1; width: auto; max-width: 470px; margin: 20px 10px; padding: 20px; }
	#form .form .btn { width: 230px; white-space: normal; }
	
	#offer { padding: 40px 0; }
	#offer .container { flex-direction: column; }
	#offer .content { text-align: center; margin-top: 30px; }
	#offer .content .btn { margin: 10px; }
	
	.cta_section { padding-bottom: 20px; }
	.cta_section .ctas { flex-direction: column; }
	.cta_section h2 { margin-bottom: 20px; }
	.cta_section .cta { width: 100%; margin: 20px 0; }
	.cta_section .cta h4 { min-height: 0; }
	
	#why .container { flex-direction: column; text-align: center; }
	#why .container > img { max-width: 100%; margin-bottom: 40px; }
	#why .content ul { text-align: left; margin: 0 auto; }
	#why .content .images img { margin: 5px 10px; max-height: 40px; }	
	
	#testimonial .box { padding: 30px 24px; }
	#testimonial .box .rating img { margin: 0 5px; }
	
	#process h2 { max-width: 200px; margin: 0 auto 25px; }
	#process h2:before { left: -190px; }
	#process h2:after { right: -190px; }
	#process .processes { flex-direction: column; align-items: center; }
	#process .processes .process { width: auto; max-width: 370px; margin: 15px 0; }
	#process .processes .process img { width: 100%; }
	
	#footer .logo { max-width: 100%; }
	#footer .ctas a { display: block; margin: 20px 0; }
	#footer .links li { margin: 10px 20px; }
}
