@charset "UTF-8";

/* CSS Document */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}
body {
line-height: 1;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
body 				{	background:#fff;font-family: 'Montserrat', sans-serif; font-weight:300; color:#333; line-height:1.3; box-sizing:border-box}
object 				{	outline:none; }
a:active, a:focus 	{ 	outline: none; border:0px; -moz-outline-style:none; }
a:focus 			{ 	outline: none; }
.clear 				{ 	clear:both; display:block }
a 					{ 	text-decoration:none;color:#333;}
a:hover 			{ 	text-decoration:none;}
sup					{	vertical-align: super;font-size: smaller;}
.clear				{	clear:both}

.container			{	width:100%;}
.header				{	width:100%; background:#EC1B23; display:flex;justify-content: space-between;}
.header	h1			{	color:#fff}
.heart_rate			{	width:20%; margin-left:20px;align-self: center;}
.heart_rate	img		{	width:100%; height:auto}
.california_needs	{	text-align:right; width: 55%;align-self: center;}
.california_needs h1{	font-size:55px; font-weight:700; line-height:1; margin: 30px 30px 30px 0;}
.hero_image			{	line-height:0; z-index:0}
.hero_image_mobile	{	line-height:0; z-index:0; display:none}
.hero_image img		{	width:100%; height:auto}
.hero_footer		{	width:100%; background:#000; z-index:0}
.hero_footer h2		{	font-size:45px; color:#fff; font-weight:700; }
.content			{	max-width:1040px; margin: 0 auto; padding: 70px 0 40px 0}
.content_lt			{	float:left; width:55%;}
.content_lt	p		{	padding: 10px 0; font-size:20px; line-height:1.5}
.content_lt	li		{	padding: 5px 0; font-size:20px; line-height:1.5}
.content_lt ul		{	margin-left:45px}
.content_rt			{	float:right; width:38%; margin-top:-320px; z-index:1000; position:relative}
.hero_footer_container{	max-width:1040px; margin: 0 auto; padding: 30px 0}
.hero_footer_container h2 {	width:60%;}
.form				{	background:#DDDDDD; padding: 40px 20px 50px 20px}
.content_mobile		{	padding:40px 20px 10px 20px;display:none;}
.content_mobile	p		{	padding: 10px 0; font-size:20px; line-height:1.5}

.video_container				{	width: 100%;max-width: 860px; margin:0 auto; padding: 30px 20px;box-sizing: border-box;}
.video-container_main			{	position: relative;padding-bottom: 56.25%;padding-top: 30px;height: 0;overflow: hidden;}
.video-container_main iframe, 
.video-container_main object, 
.video-container_main embed		{	position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
.person_icon::before		{	content: url(../images/form_icon_person.gif);}
.phone_icon::before			{	content: url(../images/form_icon_phone.gif);}
.location_icon::before		{	content: url(../images/form_icon_location.gif);}
.email_icon::before			{	content: url(../images/form_icon_email.gif);}
.person_icon, 
.phone_icon, 
.email_icon,
.location_icon				{	line-height:0; margin-left: -65px; position:relative; box-sizing:border-box; float:right; margin-top:10px; padding-right:10px}
.form input					{	width: 100%; border:1px solid #CCC; font-size:16px; padding: 12px 10px;box-sizing: border-box; color:#666; background:#fff;font-family:'Montserrat', sans-serif;}
input.submit_btn{	color:#fff; background:#EC1B23; font-size:22px; border:none; border-radius:45px; padding:16px 0; margin-top:20px; cursor:pointer; height:60px;-webkit-border-radius:45px;-webkit-appearance:none;}
.form h3					{	font-size:40px; color:#EC1B23; font-weight:700; display:block; text-align:center; padding:0; margin:0; line-height:1}
.form h4					{	font-size:22px; color:#000; font-weight:300; display:block; text-align:center; margin-bottom:14px; margin-top:10px}

.thankyou p					{	padding: 8px 0}
.letter_btn					{	color:#fff; background:#EC1B23; font-size:18px; border:none; border-radius:45px; padding:16px 10px;cursor:pointer; -webkit-border-radius:45px;-webkit-appearance:none; display: inline-block; margin: 20px 0; text-align:center; width:100%; box-sizing:border-box;}

.letter_view				{	color:#000; background: url(../images/letter.png) 30px center no-repeat #ccc; font-size:16px; border:none; border-radius:45px; padding:16px 40px 16px 80px;cursor:pointer; -webkit-border-radius:45px;-webkit-appearance:none; display: inline-block; margin: 10px 0 20px 0; text-align:center; box-sizing:border-box; cursor:pointer}

.span_one					{	width:100%; margin: 10px 0; display:block; float:left}
.span_two					{	width:48%; margin: 10px 0; display:block}
.float_left					{	float:left; margin-right:1%;}
.float_right				{	float:right; margin-left:1%;}

::-webkit-input-placeholder {   color: #666;}
::-moz-placeholder 			{ 	color: #666;}
:-ms-input-placeholder 		{ 	color: #666;}
:-moz-placeholder 			{ 	color: #666;}

.learn_more 				{	display:block; text-align:center; margin: 20px auto; max-width:1060px; }
.learn_more h5				{	color:#000; font-size:24px; margin: 10px 0 60px 0;}
.learn_more p				{	font-size:16px; padding: 0 0 0 0}
.break						{	width: 30%; height:1px; background:#666; margin:40px auto; ddisplay:none}
.learn_more_stories			{	display:flex;flex-wrap: wrap;justify-content: space-between;}
.learn_more_stories img		{	width:80%; height:auto}
.learn_more_stories > div	{	width:40%; fborder:1px solid #0CC; margin-bottom:20px}

input.error_box					{	border:2px solid #F00}
.submit_btn_loader			{	padding: 30px 0; display:none}

.footer				{	width:100%; background:#EC1B23;}
.footer_container	{	max-width:1000px; margin: 0 auto; padding: 20px 20px; text-align:center}
.footer_container p	{	color:#fff; text-align:center; font-size:14px}

@media only screen and (max-width : 1280px) {
	.california_needs	{	width: 70%}
	.california_needs h1{	font-size:45px}
	.heart_rate			{	width: 25%;}
}

@media only screen and (max-width : 980px) {
	.header				{	flex-direction: column;}
	.heart_rate			{	width: 35%;}
	.california_needs	{	width:100%; text-align:center;}
	.california_needs h1{	font-size:34px; line-height:1.2; margin:10px 20px}
	.content_lt			{	float:none; width:100%;padding: 10px 4%; box-sizing:border-box}
	.content_lt	p		{	padding: 10px 0; font-size:20px; line-height:1.5; font-size:18px}
	.content_rt			{	float:none; width:100%; margin-top:0px; z-index:1000; position:relative}
	.content_mobile	li		{	padding: 5px 0; font-size:20px; line-height:1.5}
	.content_mobile ul		{	margin-left:45px}
	.hero_footer_container h2 {	width: 100%; text-align:center; line-height:1.1; font-size:28px; padding: 0 2%; box-sizing:border-box;}
	.hero_footer_container{	padding:20px 0;}
	.content			{	padding: 0;}
	.learn_more			{	padding: 10px 2%;}
	.hero_image			{	display:none}
	.hero_image_mobile	{	display:block}
	.hero_image_mobile img{	width:100%; height:auto}
	.content_lt			{	display:none;}
	.content_mobile		{	display:block;}
	
	 .learn_more_stories{	flex-direction: column;}
	 .learn_more_stories > div	{	width:100%;}
	 .learn_more_stories img		{	width:60%; height:auto}
	
}

@media only screen and (max-width : 680px) {
	.california_needs h1{	font-size:30px; }
}

@media only screen and (max-width : 420px) {
	.learn_more	img		{	width:100%; height:auto}
	.hero_footer h2		{	font-size:22px}
}

@media only screen and (max-width : 380px) {
}