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, font, 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,
caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
body {
	font-size:16px;
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
/* remember to define focus styles! */
:focus {
	outline: 0;
}
/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}
/* tables still need 'cellspacing="0"' in the markup */











header {
	display:block;
	width:100%;
	margin:0 auto;
	padding:0;
	position:relative;
}

header article.header {
	position:relative;
	top:0;
	z-index:1;
	display:flex;
	flex-direction:row;
	justify-content:center;
	width:calc(100% - 2.5rem);
	max-width:calc(100% - 2.5rem);
	margin:0 auto;
	padding:1.25rem;
	box-shadow:0px 5px 25px rgba(0,0,0,0.2);
}

header article .logo {
	display:flex; 
	justify-content:center;
	align-items: center;
	align-content:flex-start;
	width:auto; 
	max-height:7.5rem;
	padding:0;
	margin:0 auto;
}
header article .logo img { max-width:11.875rem; width:11.875rem; height:auto; margin:0 auto; text-align:center; }


header .hero {
	display:flex;
	flex-direction:row;
	justify-content:flex-start;
	align-content:center;
	align-items:center;
	background-color:rgb(229, 230, 231);
	height:45vh;
	max-height:60vh;
	min-height:33.125rem;
}
header .hero {
	background-repeat:no-repeat;
	background-size:cover;
	background-position-x:left;
	background-position-y:15%;
	background-image:url(images/photo_two-women-embracing.jpg);	
}
header .hero.small {
	max-height:30vh;
	height:25rem;
	min-height:20rem;
}


header .hero .hero-text {
	display:flex;
	margin:0 auto;
	max-width:75rem;
	width:100%;
}

header .hero-text h1 {
	display:block;
	width:45%;
	height:auto;
	margin:0;
	padding:2rem;
	background-color:rgba(255,255,255, 0.8);
}




main { display:block; margin:0 auto; padding:0; }


section {
	display:block;
	width:100%;
	margin:0;
	padding:0;
	text-align:center;
}










section article {
	display:flex;
	flex-direction:column;
	justify-content:flex-start;
	align-items:stretch;
	align-content:stretch;
	margin:0 auto;
	padding:3.75rem 1.875rem;
	max-width:calc(75rem - 3.75rem);
	width:calc(100% - 3.75rem);	
	text-align:left;
}
section article.cta {
	padding:0rem 1.875rem 3rem 1.875rem;
	
}

section article header {
	display:flex;
	flex-direction:row;
	justify-content:space-between;
	align-items:center;
	align-content:flex-start;
	width:100%;
	padding:0;
	margin:0 auto;
	text-align:center;
	position:relative;
}











article .solution {
	display:flex;
	flex-direction:row;
	justify-content:flex-start;
	align-items:stretch;
	width:100%;
	margin:0;
	padding:0;
}

.card {
	flex-grow:1;
	position:relative;
	width:50%;
	margin:0 0 1.5rem 0;
	padding:3.75rem 4.375rem;
	text-align:center;
	border-radius:0.5rem;
	background-color:rgba(255,255,255,0.94);
	-webkit-box-shadow: 0px 0 0px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 0px 0px 0px 0px rgba(0,0,0,0.75);
	box-shadow: 0px 0px 0px 0px rgba(0,0,0,0.75);
	transition:box-shadow ease-in-out 0.4s;
}
.card:first-child { margin: 0 1.5rem 1.5rem 0; }
.card:last-child { margin: 0 0 1.5rem 0; }
/*
.card:hover {
	background-color:rgba(255,255,255,1.0);
	-webkit-box-shadow: 0px 10px 25px 5px rgba(0,0,0,0.75);
	-moz-box-shadow: 0px 10px 25px 5px rgba(0,0,0,0.75);
	box-shadow: 0px 10x 25px 5px rgba(0,0,0,0.75);
}
*/
.card .image {
	display:block;
	padding:0;
	margin:0 auto;
	margin-bottom:1.5rem;
	width:100%;
	height:15.625rem;
	text-align:center;
}
.card .image img { width:auto; max-height:13.625rem; height:12.625rem; transition:all ease-in-out 0.4s; }












article .advocate, article .content {
	display:flex;
	flex-direction:row;
	width:100%;
	margin:0;
	padding:0;
	border-top-left-radius:0.5rem;
	border-top-right-radius:0.5rem;
	background-color:rgb(255,255,255);
	overflow:hidden;
}

article .advocate .column, article .content .column {
	display:flex;
	flex-direction:column;
	justify-content:flex-start;
	align-items:flex-start;
	align-content:flex-start;
}
article .advocate .column.half {
	width:calc(50% - 8rem);
	padding:4rem 3rem 2rem 5rem;
}
article .advocate .column.no-padding { width:50%; padding:0; }
article .advocate .column.full, article .content .column.full {
	width:calc(100% - 8rem);
	padding:4rem 4rem 2rem 4rem;
}


article .advocate .column.half .image {
	display:flex;
	justify-content:center;
	align-items:flex-start;
	align-content:flex-start;
	width:100%;
	max-height:32rem;
	overflow:hidden;
}
article .advocate .column.half .image img { width:auto; max-height:36rem; height:100%; }















.privacy  { padding:5rem 0; }
.privacy article {
	position:relative;
	max-width:calc(75rem - 11.5rem);
	width:calc(100% - 7.5rem);
	padding:3.75rem;
	margin:0 auto;
	background-color:rgb(255,255,255);
	border:0.125rem solid rgb(194, 230, 133);
	border-radius:0.5rem;
	overflow: visible;
}

.privacy article .badge {
	position:relative;
	display:flex;
	flex-direction:row;
	justify-content:center;
	align-items:center;
	align-content:center;
	width:100%;
	height:auto;
	padding:0;
	margin:0 auto;
}

.privacy article .badge .image {
	position:relative;
	top:-11rem;
	z-index:1;
	display:block;
	width:12rem;
	height:12rem;
	margin:0 0 -8rem 0;
	padding:2rem;
	border-radius:25rem;
	border:0;
	background-color:rgb(42, 170, 225);
}
.privacy article .badge .image:after {
	content:"";
	display:block;
	padding-bottom:100%;
}
.privacy article .badge .image img { width:100%; height:auto; margin:0; padding:0; }















article .cta-box {
	display:flex;
	flex-direction:column;
	justify-content:center;
	width:calc(100% - 8.825rem);
	margin:0 auto;
	padding:3rem 4.375rem;
	border-radius:0.5rem;
	text-align:center;
	background-color:rgb(230, 243, 209);
}









footer {
	display:block;
	width:100%;
	margin:0;
	padding:0;
	text-align:center;
}
footer .content {
	display:flex;
	flex-direction:row;
	justify-content:center;
	max-width:75rem;
	width:100%;
	margin:0 auto;
	padding:2rem 0;
}
footer .content cite {
	font-family:'Roboto', sans-serif;
	font-size:0.825rem;
	line-height:1rem;
	font-weight:400;
	font-style:normal;
	color:rgb(88, 88, 91);
}
footer .content p {
	margin: 0 0 0 0.875rem;
	font-family:'Roboto', sans-serif;
	font-size:0.825rem;
	line-height:1rem;
	font-weight:400;
	font-style:normal;
	color:rgb(88, 88, 91);
}
footer .content p a {
	color:rgb(22, 121, 190);
	font-weight:700;
	text-underline-offset:0.5rem;
	text-decoration-color:rgb(153, 222, 246);
	transition:all ease-in-out 0.3s;
}
footer .content p a:hover {
	color:rgb(23, 83, 119);
	text-decoration-color:rgb(42, 170, 225);
}









hr { 
	display:block;
	width:100%;
	height:2px;
	margin:0;
	padding:0;
	font-size:0px;
	line-height:2px;
	border:0px;
	overflow:hidden;
}









/* 
##############################
##############################
##############################

	TEXT STYLES
	
##############################
##############################
##############################	
*/





h1 {
	font-family:'Roboto', sans-serif;
	font-size:3rem;
	line-height:3rem;
	font-weight:300;
	text-align:left;
	color:rgb(22,121,190);
}

h2 {
	width:100%;
	margin:0 0 3.75rem 0;
	font-family:'Roboto Slab', serif;
	font-size:3rem;
	line-height:3rem;
	font-weight:600;
	text-align:center;
}
.privacy h2 { margin:0 0 2rem 0; }

article header .line {
	display:block;
	flex-grow:3;
	content:" ";
	width:70%;
	height:2px;
	margin-top:-3rem;
	border-top-width:2px;
	border-top-style:solid; 
	border-top-color:rgb(42, 170, 225);
}
article header .line.green {
	border-top-color:rgb(131, 189, 54);
}
.privacy header .line { margin-top:-1rem; }
article header h2 { display:block; flex-grow:1; }


h3 {
	margin:0 0 1.125rem 0;
	font-family:'Roboto Slab', serif;
	font-size:1.5rem;
	line-height:1.5rem;
	font-weight:500;
	color:rgb(88, 88, 91);
}

h4 {
	font-family:'Roboto', sans-serif;
	font-size:1.875rem;
	line-height:3rem;
	font-weight:300;
	text-align:left;
	color:rgb(255,255,255);	
	font-weight:300;
}
h4 strong {
	font-weight:500;
}


h5 {
	margin: 0 0 2rem 0;
	font-family:'Roboto', sans-serif;
	font-size:2.25rem;
	line-height:2.25rem;
	font-weight:300;
	text-align:center;
	color:rgb(82, 131, 17);	
}
h5 strong { font-weight:900; }


p {
	margin:0 0 1.5rem 0;
	padding:0;
	font-family:'Roboto', sans-serif;
	font-size:1rem;
	line-height:1.5rem;
	font-weight:400;
	color:rgb(88, 88, 91);
}
p:last-child { margin:0; }
.card. .text p { text-align:center; }
.advocate p {
	font-size:1.5rem;
	line-height:2.25rem;
	color:rgb(23,83,119);
	font-weight:200;
	text-align:left;
}
.advocate .full p {
	margin-bottom:1rem;
	font-size:1.125rem;
	line-height:2rem;
	color:rgb(18, 18, 19);
	font-weight:400;
	text-align:left;
}

p a, .content .full p a, .content .full ul li a, .content .full ol li a  {
	color:rgb(22, 121, 190);
	font-weight:700;
	text-underline-offset:0.5rem;
	text-decoration-color:rgb(153, 222, 246);
	transition:all ease-in-out 0.3s;
}
p a:hover, .content .full p a:hover, .content .full ul li a:hover, .content .full ol li a:hover {
	color:rgb(23, 83, 119);
	text-decoration-color:rgb(42, 170, 225);
}

p.large {
	font-size:1.5rem;
	line-height:2rem;
	font-weight:300;
}



ol {
	list-style:none;
	margin:1rem 0 0 1rem;
	padding:0;
}

ul {
	list-style:none;
	margin:1rem 0 0 1rem;
	padding:0;
}
ul li:before {
	display:inline-block;
	width:1rem;
	margin-left:-1rem;
	content:"\2022";
	font-weight:900;
	color:rgb(22, 121, 190);
	
}
ul li {
	margin:0 0 1rem 0;
	font-family:'Roboto', sans-serif;
	font-size:1.125rem;
	line-height:1.25rem;
	color:rgb(23,83,119);
	font-weight:600;
	text-align:left;	
}






.content h2 {
	width:100%;
	margin:3rem 0 1rem 0;
	font-family:'Roboto Slab', serif;
	font-size:2rem;
	line-height:2rem;
	font-weight:600;
	color:rgb(22, 121, 190);
	text-align:left;
}


.content h3 {
	width:100%;
	margin:2rem 0 1rem 0;
	font-family:'Roboto', san-serif;
	font-size:1.5rem;
	line-height:1.5rem;
	font-weight:800;
	color:rgb(42, 170, 225);
	text-align:left;
}

.content h4 {
	width:100%;
	margin:1.5rem 0 0.875rem 0;
	font-family:'Roboto', san-serif;
	font-size:1.25rem;
	line-height:1.25rem;
	font-weight:300;
	color:rgb(42, 170, 225);
	text-align:left;
}

.content .full p {
	margin-bottom:1rem;
	font-size:1rem;
	line-height:1.5rem;
	color:rgb(18, 18, 19);
	font-weight:400;
	text-align:left;
}
.content ul { margin:1rem 0 1rem 3rem; }
.content ol {
	list-style-type:decimal;
	margin:1rem 0 1rem 3rem;
	padding:0;
}

.content .full ul li:before {
	display:inline-block;
	width:1rem;
	margin-left:-1rem;
	content:"\2022";
	font-weight:900;
	color:rgb(166, 168, 171);
	
}
.content .full ul li, .content .full ol li {
	margin:0 0 1rem 0;
	font-family:'Roboto', sans-serif;
	font-size:0.875rem;
	line-height:1.125rem;
	color:rgb(88, 88, 91);
	font-weight:400;
	text-align:left;	
}

.content .full p u {
	font-weight:600;
}








/* 
##############################
##############################
##############################

	FORM
	
##############################
##############################
##############################	
*/




form { 
	display:flex;
	flex-direction:row;
	justify-content:space-between;
	margin:0;
	padding:0;
	border:0;
}

._field-wrapper {
	display:flex;
	flex-grow:2;
	width:auto;
	margin:0 1rem 0 0;
}

input[type='text'],
input[type='email'] {
	width:100%;
	margin:0;
	padding:1.125rem 1.25rem 1.25rem 3.875rem;
	border-radius:0.5rem;
	border:1px solid rgb(131, 189, 54);
	background-color:rgba(255, 255, 255, 0.7);
	transition:all ease-in-out 0.3s;
	font-family:'Roboto', sans-serif;
	font-size:1.125rem;
	line-height:1.25rem;
	color:rgb(131, 189, 54);
	font-weight:200;
}
input[type='text']::-webkit-input-placeholder,
input[type='email']::-webkit-input-placeholder,
input[type='text']::-moz-placeholder,
input[type='email']::-moz-placeholder {
	color:rgb(131, 189, 54);
}
input[type='text']:focus,
input[type='email']:focus {
	color:rgb(46, 80, 2);
	border:1px solid rgb(82, 131, 17);
	background-color:rgba(255, 255, 255, 1.0);
}
input[type='text'].email {
	background-image:url(images/icon_email.png);
	background-position:0.875rem center;
	background-size:2rem;
	background-repeat:no-repeat;	
}



input[type='submit'],
button {
	display:block;
	flex-grow:1;
	width:auto;
	margin:0;
	padding:1rem 2rem;
	font-family:'Roboto', sans-serif;
	font-size:1.125rem;
	line-height:1.25rem;
	font-weight:600;
	text-align:center;
	color:rgb(255, 255, 255);
	border:0px;
	border-radius:10rem;
	background:rgb(131, 189, 54);
/* 	background: linear-gradient(0deg, rgba(82, 131, 17, 1) 0%, rgba(131, 189, 54, 1) 100%); */
	transition:all ease-in-out 0.3s;
	-webkit-appearance: none;
}
input[type='submit']:hover,
button:hover {
	cursor:pointer;
	background:rgb(82, 131, 17, 1);
/* 	background: linear-gradient(0deg, rgba(46, 80, 2, 1) 0%, rgba(82, 131, 17, 1) 100%); */
}
button a {
	color:rgb(255, 255, 255);
	text-decoration:none;
}







/* 
##############################
##############################
##############################

	OVERRIDES
	
##############################
##############################
##############################	
*/


.bg-green100 { background-color:rgb(230, 243, 209); }
.bg-green200 { background-color:rgb(194, 230, 133); }
.bg-green300 { background-color:rgb(131, 189, 54); }
.bg-green400 { background-color:rgb(82, 131, 17); }
.bg-green500 { background-color:rgb(46, 80, 2); }

.bg-blue100 { background-color:rgb(232, 247, 255); }
.bg-blue200 { background-color:rgb(153, 222, 246); }
.bg-blue300 { background-color:rgb(42, 170, 225); }
.bg-blue400 { background-color:rgb(22, 121, 190); }
.bg-blue500 { background-color:rgb(23, 83, 119); }

.bg-blue500-gradient {
	background: rgb(22,121,190);
	background: linear-gradient(0deg, rgba(22,121,190,1) 0%, rgba(23,83,119,1) 100%);
}
.bg-blue200-gradient {
	background: rgb(232,247,255);
	background: linear-gradient(0deg, rgba(232,247,255,1) 0%, rgba(163,222,246,1) 100%);
}
.bg-green100-gradient {
	background: rgb(230,243,209);
	background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(230,243,209,1) 100%);
}
.bg-green300-gradient {
	background: rgb(131, 189, 54);
	background: linear-gradient(0deg, rgba(46, 80, 2,1) 0%, rgba(131, 189, 54,1) 100%);
}
.bg-half {
	background-size:100% 20rem;
	background-repeat:repeat-x;
}


.divider-green100 { background-color:rgb(230, 243, 209); }
.divider-green200 { background-color:rgb(194, 230, 133); }
.divider-green300 { background-color:rgb(131, 189, 54); }
.divider-green400 { background-color:rgb(82, 131, 17); }
.divider-green500 { background-color:rgb(46, 80, 2); }

.divider-blue100 { background-color:rgb(232, 247, 255); }
.divider-blue200 { background-color:rgb(153, 222, 246); }
.divider-blue300 { background-color:rgb(42, 170, 225); }
.divider-blue400 { background-color:rgb(22, 121, 190); }
.divider-blue500 { background-color:rgb(23, 83, 119); }


.text-white { color:rgb(255, 255, 255); }

.text-green100 { color:rgb(230, 243, 209); }
.text-green200 { color:rgb(194, 230, 133); }
.text-green300 { color:rgb(131, 189, 54); }
.text-green400 { color:rgb(82, 131, 17); }
.text-green500 { color:rgb(46, 80, 2); }

.text-blue100 { color:rgb(232, 247, 255); }
.text-blue200 { color:rgb(153, 222, 246); }
.text-blue300 { color:rgb(42, 170, 225); }
.text-blue400 { color:rgb(22, 121, 190); }
.text-blue500 { color:rgb(23, 83, 119); }




@media all and (max-width:80rem) and (min-width:56rem) {
	
	header article .logo img { width:9rem; }

	header .hero {
		max-height:30vh;
		min-height:23rem;
		height:27rem;
	}
	
	section, article { overflow:hidden; }
	
	h2 {
		flex-grow:5;
		width:100%;
	}
	article header .line {
		flex-grow:1;
		width:60%;
	}
	article .solution {
		flex-direction:row;
	}
	.privacy { width:calc(100% - 4rem); padding:2rem; overflow:hidden; }
	.privacy article {
		max-width:calc(100% - 4rem);
		width:calc(100% - 4rem);
		padding:2rem;
		overflow:hidden;
	}
	.privacy article .badge .image {
		top:0;
		margin:0 0 3rem 0;
	}		
	
/*
	article .advocate { flex-direction:column-reverse; }
	article .advocate .column.half {
		width:calc(100% - 6rem);
		padding:2rem 3rem 2rem 3rem;
	}
	article .advocate .column.no-padding { width:100%; padding:0; }
*/
	
}
@media all and (max-width:56rem) and (min-width:20rem) {
	
	header article .logo img { width:7.5rem; }
	
	header .hero {
		justify-content:center;
		align-content:flex-end;
		align-items:flex-end;
		max-height:30vh;
		min-height:25rem;
		height:25rem;
		background-size:cover;
		background-position-x:100%;
	}
	
	header .hero-text h1 { width:100%; text-align:center; }
	
	section, article { overflow:hidden; }
	
	article header .line {
		flex-grow:1;
		content:" ";
		width:35%;
	}
	
	h1 { font-size:2.25rem; line-height:2.25rem; }
	h2 { font-size:2rem; line-height:2rem; }
	h4 { font-size:1.5rem; line-height:2.25rem; }
	h5 { margin: 0 0 1rem 0; font-size:1.5rem; line-height:1.875rem;}
	
	article {
		padding:3rem 1.5rem;
		max-width:calc(75rem - 3rem);
		width:calc(100% - 3rem);	
		text-align:left;
	}

		
	article .solution {
		flex-direction:column;
	}
	.card { width:calc(100% - 6rem); padding:2.5rem 3rem; }
	.card:first-child { margin: 0 0 1.5rem 0; }
	.card:last-child { margin: 0 0 1.5rem 0; }
	
	
	article .content .column.full {
		width:calc(100% - 3rem);
		margin:0;
		padding:1.5rem;
	}	
	
	.privacy { width:calc(100% - 4rem); padding:2rem; overflow:hidden; }
	.privacy article {
		max-width:calc(100% - 4rem);
		width:calc(100% - 4rem);
		padding:2rem;
		overflow:hidden;
	}
	.privacy article .badge .image {
		top:0;
		margin:0 0 3rem 0;
	}	
	
	article .advocate { flex-direction:column-reverse; }
	article .advocate .column.half {
		width:calc(100% - 4rem);
		margin:0;
		padding:2rem;
	}
	article .advocate .column.no-padding { width:100%; padding:0; }
	article .advocate .column.half .image {
		align-items:center;
		align-content:center;
		max-height:18rem;
	}
	article .advocate .column.half .image img {
		width:100%; height:auto;
	}
	
	article.cta { width:calc(100% - 4rem);padding:0 2rem 2rem 2rem; }
	article .cta-box { width:calc(100% - 6rem); padding:2rem 3rem; }
	form { flex-direction:column; }
	input[type='text'], input[type='email'] { flex-grow:1; margin:0 0 1rem 0; }
	
	footer .content { flex-direction:column; }
	footer .content cite { margin: 0 0 1rem 0; }
	footer .content p { display:inline-block; margin:0 0 0.625rem 0; }
	
	
}