/*** Custom CSS for Yolo FCU Application ***/
/* --------------------------------------------------------- */

/*  Table of Contents: */
/*
   1. FONTS
   2. GLOBAL STYLING
   3. GLOBAL FOUNDATION.CSS OVERRIDES/ADDITIONS
   4. HEADER/MASTHEAD
   5. LOGO
   6. HEADERS
   7. TEXT
   8. TOP BAR - TITLE BAR - NAVIGATION
   9. APPLICATION PROGRESS MENU
  10. CONTENT/CONTENT PAGE
  11. FORMS
  12. BUTTONS
  13. PRODUCT SELECTION AND LIST
  14. SUMMARY
  15. FOOTER
*/

/* 1. FONTS (WEB FONTS)
/* --------------------------------------------------------- */

@import url("https://p.typekit.net/p.css?s=1&k=suf0skb&ht=tk&f=139.169.173.175.176.5474&a=82917664&app=typekit&e=css");

@font-face {
	font-family:"proxima-nova";
	src:url("https://use.typekit.net/af/2555e1/00000000000000007735e603/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("woff2"),url("https://use.typekit.net/af/2555e1/00000000000000007735e603/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("woff"),url("https://use.typekit.net/af/2555e1/00000000000000007735e603/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("opentype");
	font-display:auto;font-style:normal;font-weight:700;font-stretch:normal;
}

@font-face {
	font-family:"proxima-nova";
	src:url("https://use.typekit.net/af/8738d8/00000000000000007735e611/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n8&v=3") format("woff2"),url("https://use.typekit.net/af/8738d8/00000000000000007735e611/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n8&v=3") format("woff"),url("https://use.typekit.net/af/8738d8/00000000000000007735e611/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n8&v=3") format("opentype");
	font-display:auto;font-style:normal;font-weight:800;font-stretch:normal;
}

@font-face {
	font-family:"proxima-nova";
	src:url("https://use.typekit.net/af/78aca8/00000000000000007735e60d/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n6&v=3") format("woff2"),url("https://use.typekit.net/af/78aca8/00000000000000007735e60d/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n6&v=3") format("woff"),url("https://use.typekit.net/af/78aca8/00000000000000007735e60d/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n6&v=3") format("opentype");
	font-display:auto;font-style:normal;font-weight:600;font-stretch:normal;
}

@font-face {
	font-family:"proxima-nova";
	src:url("https://use.typekit.net/af/efe4a5/00000000000000007735e609/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("woff2"),url("https://use.typekit.net/af/efe4a5/00000000000000007735e609/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("woff"),url("https://use.typekit.net/af/efe4a5/00000000000000007735e609/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("opentype");
	font-display:auto;font-style:normal;font-weight:400;font-stretch:normal;
}

@font-face {
	font-family:"proxima-nova";
	src:url("https://use.typekit.net/af/3322cc/00000000000000007735e616/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3") format("woff2"),url("https://use.typekit.net/af/3322cc/00000000000000007735e616/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3") format("woff"),url("https://use.typekit.net/af/3322cc/00000000000000007735e616/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3") format("opentype");
	font-display:auto;font-style:italic;font-weight:400;font-stretch:normal;
}

@font-face {
	font-family:"proxima-nova";
	src:url("https://use.typekit.net/af/1be3c2/00000000000000007735e606/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n3&v=3") format("woff2"),url("https://use.typekit.net/af/1be3c2/00000000000000007735e606/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n3&v=3") format("woff"),url("https://use.typekit.net/af/1be3c2/00000000000000007735e606/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n3&v=3") format("opentype");
	font-display:auto;font-style:normal;font-weight:300;font-stretch:normal;
}

.tk-proxima-nova { font-family: "proxima-nova",sans-serif; }

/* 2. GLOBAL STYLING
/* --------------------------------------------------------- */

:root {
	--brandpurple: #592C82; /* brand purple */
	--brandlime: #9BE300; /* brand bright green */
	--cclime: #388F00;
	--fontBlack: #2f3138;
	--brandgray: #DEDEDE; /* brand gray */
	--brandgreen: #9BE300; /* brand green */
	--brandblue: #0abbe1; /* brand blue */
	--medgray: #666666; /* input field borders */
	--ccgray: #757577;
	--white: #FFFFFF;
	--black: #000;

	font-size: 16px; }

*{  -moz-box-sizing: border-box; 
	-webkit-box-sizing: border-box; 
	box-sizing: border-box; }

*:focus { /* chrome/safari issue - this removes yellow border appearing on selected items */ 
    outline: none; }

body {
	margin: 0px; 
	padding: 0px;
	font-family: "proxima-nova",sans-serif;
	font-weight: normal;
	font-style: normal;
	font-size: 1rem; /* 16px */
	background-color: var(--white);
	color: var(--fontBlack); }

div {
	margin: 0;
	padding: 0;	}

/* 3. GLOBAL FOUNDATION.CSS OVERRIDES/ADDITIONS
/* (also look for specific overrides in sections within css) */
/* --------------------------------------------------------- */

.menu > li > a {
	padding: .2rem 1rem; }

.menu > li > a img, .menu > li > a i, .menu > li > a svg { /*to correct and have even padding around all the .top-bar-right li items*/
	margin-right: 0; }

p { margin-bottom: 0; }

/* 4. HEADER/MASTHEAD
/* --------------------------------------------------------- */

#masthead {
	margin: 0;
	padding: 0;
	height: 76px; }
/* @media only screen and (min-width: 40em) { /* any screen 640px or wider (medium screens) */
@media only screen and (min-width: 64em) { /* any screen 1024px or wider (large screens and up) */
#masthead {
	height: fit-content; }}

/* 5. LOGO
/* --------------------------------------------------------- */

.logo {
	display: block;
	margin: 0;
	padding: 0px;
	width: 75%;
	height: auto;
	object-fit: contain; }
@media only screen and (min-width: 64em) { /* any screen 1024px or wider (large screens and up) */
	.logo {
		margin: .875rem 0 .875rem .3125rem; }}

.logo-small {
	display: block;
	width: auto;
	height: auto;
	max-width: 75%;
	object-fit: contain;
	padding-top: 10px;
	margin: 0.5rem auto; }
/*.logo_small {*/
/*	margin: 0;*/
/*	padding: 20px;*/
/*	width: 200;*/
/*	height: 49px; }*/

/*.logo {*/
/*	margin: 0;*/
/*	padding: 20px;*/
/*	width: 250;*/
/*	height: 61px; }*/

/* 6. HEADERS
/* --------------------------------------------------------- */

h1, h2, h3, h4 {
	text-rendering: optimizeLegibility;
	margin: 0;
	padding: 0; }
	
h1 {
	font-family: "proxima-nova",sans-serif;
	font-weight: normal;
	font-style: normal;
	color: var(--fontBlack);
	font-size: 2.25rem; /* 36px */ }

.page-title {
	font-family: "proxima-nova",sans-serif;
	font-weight: normal;
	font-style: normal;
	color: var(--fontBlack);
	font-size: 2.25rem; /* 36px */ }

h2 {
	font-family: "proxima-nova",sans-serif;
	font-weight: normal;
	font-style: normal;
	font-size: 1.75rem; /* 28px */
	color: var(--fontBlack);
 }

h3 {
	font-family: "proxima-nova",sans-serif;
	font-weight: normal;
	font-style: normal;
	font-size: 1.375rem; /* 22px */
	color: var(--brandpurple); }

h4 {
	font-family: "proxima-nova",sans-serif;
	font-weight: normal;
	font-style: normal;
	font-size: 1.125rem; /* 18px */
	color: var(--fontBlack); }

/* 7. TEXT
/* --------------------------------------------------------- */

.explain_text {
	font-family: "proxima-nova",sans-serif;
	font-weight: normal;
	font-style: normal;
	font-size: 1.1875rem; }

.font-size-16 {
	font-size: 16px;
}

td {
	font-family: "proxima-nova",sans-serif;
	font-weight: normal;
	font-style: normal;
	font-size: 1.1875rem; }

#attachmentFile {
	font-family: "proxima-nova",sans-serif;
	font-weight: normal;
	font-style: normal;
	font-size: 1.1875rem; }

/* 8. TOP BAR - TITLE BAR - NAVIGATION
/* --------------------------------------------------------- */
/* Secondary Top Bar */
.secondary-top-bar {
	margin: 0;
	padding: 1%;
	width: 100%;
	/*border: 1px solid #797979;*/
	background-color: var(--brandpurple);
	box-sizing: border-box;
	font-family: "proxima-nova",sans-serif;
}

.secondary-top-bar .row {
	max-width: 1200px;
	margin: 0 auto;
}

.secondary-top-bar-right {
	float: right;
}

.secondary-top-bar-right .menu {
	display: inline-block;
	margin: 0;
	padding: 0;
}

.secondary-top-bar-right .menu li {
	display: inline-block;
	margin: 0;
	padding: 0;
}

.secondary-top-bar-right .menu li a {
	display: inline-block;
	padding: 2px 10px;
	color: var(--white);
	font-size: 15px;
	text-decoration: none;
}

.secondary-top-bar-right .menu li a:hover {
	text-decoration: underline;
}
/* Foundation Overrides */
.top-bar {
	margin: 0;
	padding: 0;
	background-color: var(--white); }

.top-bar-title {
  	float: none;
  	margin: 0;
	padding: 0;
	background-color: var(--white); }
/* End Foundation Overrides */

/* 9. APPLICATION PROGRESS MENU
/* --------------------------------------------------------- */
.top-bar, .top-bar ul {
	background-color: var(--white); }
/* For small view */
#app_progress_small {
	display: block;
	margin: 0;
	padding: 1.0625rem .5rem .5rem .5rem;
	background-color: var(--white);
	border-bottom: 2px solid var(--brandgray);
	z-index: 1;
	position: relative; }
.progress-meter {
	background-color: var(--brandpurple)
}
#app_progress_small li {
	padding: 0 10px; }


/* completed */
#app_progress_small .circle_completed {
	width: 28px;
	height: 28px;
	background-color: var(--purple);
	border: 1px solid var(--purple);
	border-radius: 50%;
	font-family: 'Varela', sans-serif;
	font-size: 1.125rem;
	font-weight: 400;
	color: var(--white);
	line-height: 24px;
	text-align: center; }

/* active */
#app_progress_small .circle_active {
	width: 28px;
	height: 28px;
	background-color: var(--purple);
	border: 1px solid var(--purple);
	border-radius: 50%;
	text-align: center;
	font-family: 'Varela', sans-serif;
	font-size: 1.125rem;
	font-weight: 700;
	color: var(--white);
	line-height: 24px; }

/* not completed */
#app_progress_small .circle_not_completed {
	width: 28px;
	height: 28px;
	background-color: var(--green);
	border: 1px solid var(--green);
	border-radius: 50%;
	text-align: center;
	font-family: 'Varela', sans-serif;
	font-size: 1.125rem;
	font-weight: 400;
	color: var(--black);
	line-height: 24px; }

#app_progress_small p.active_text {
	font-weight: 400;
	color: var(--black);
	margin-bottom: 0; }

/* For large view */
#app_progress_large {
	margin: 0 0 0 0;
	padding: 2%;
	display: flex;
	justify-content: flex-start;
	background-color: var(--dkgray);
	border-bottom: 7px solid var(--dkgray); }

#app_progress_large .progress { /* this is the connecting horizontal line */
	max-width: 40em;
	background-color: var(--brandgray);
	height: .0625rem; }
@media only screen and (min-width: 64em) { /* any screen 1024px or wider (large screens and up) */
	#app_progress_large .progress {
		width: 897px; }}
@media only screen and (min-width: 67.5em) { /* any screen 1080px or wider (large screens and up) */
	#app_progress_large .progress {
		width: 958px; }}
@media only screen and (min-width: 69.5em) { /* any screen 1112px or wider (large screens and up) */
	#app_progress_large .progress {
		width: 1064px; }}
@media only screen and (min-width: 80em) { /* any screen 1280px or wider (large screens and up) */
	#app_progress_large .progress {
		width: 1070px; }}

#app_progress_large .genisyscu_progress {
	position: absolute;
	left: 51%;
	right: 50%;
	margin-right: -50%;
	transform: translate(-50%, -50%);
	transform-style: preserve-3d;
	margin-top: 14px;
	margin-right: auto;
	margin-left: auto;
	display: block;
	/*width: 45%*/
	/*z-index: 1;*/ }

#app_progress_large .app_progress_bg {
	background-color: var(--brandpurple); }

#app_progress_large .app_progress_menu {
	margin: 0 0 -.75rem 0; /* overriding unwanted margin-bottom being inherited */
	padding: 0 0 .875rem 0; }

#app_progress_large .app_progress_menu .first_menu {
	margin-left: 88px; } /* this pushes progress menu to the right to make space for progress title above as per client request */

#app_progress_large .progress_title_text {
	padding-top: 20px;
	line-height: 15px;
	color: var(--brandpurple);
	font-weight: 700;
	text-transform: uppercase; }
@media only screen and (min-width: 80em) { /* any screen 1280px or wider (large screens and up) */
	#app_progress_large .progress_title_text {
		font-size: 1.0625rem; }}

#app_progress_large li.simple_li {
	width: auto;
	margin: 0;
	padding: 0; }

#app_progress_large li.progress_li {
	margin: 0;
	list-style-type: none;
	position: relative;
	width: 131px;
	/*z-index: 10;*/ }
@media only screen and (min-width: 64em) { /* any screen 1024px or wider (large screens and up) */
	#app_progress_large li.progress_li {
		width: 131px; }}
@media only screen and (min-width: 69.5em) { /* any screen 1112px or wider (large screens and up) */
	#app_progress_large li.progress_li {
		width: 158px; }}
@media only screen and (min-width: 80em) { /* any screen 1280px or wider (large screens and up) */
	#app_progress_large li.progress_li {
		width: 157px; }}

#app_progress_large li.progress_li_text {
	margin: 0 auto 0 auto;
	padding-top: .25rem;
	list-style-type: none;
	text-align: center;
	font-family: 'Varela', sans-serif;
	font-size: .75rem;
	text-transform: uppercase;
	white-space: nowrap;
	position: relative;
	/*z-index: 10;*/ }
@media only screen and (min-width: 64em) { /* any screen 1024px or wider (large screens and up) */
	#app_progress_large li.progress_li_text {
		font-size: .75rem; }}
@media only screen and (min-width: 80em) { /* any screen 1280px or wider (large screens and up) */
	#app_progress_large li.progress_li_text {
		font-size: .875rem;
		width: 140px; }}

/* active */
#app_progress_large .circle_active {
	width: 28px;
	height: 29px;
	background-color: var(--brandpurple);
	border: 3px solid var(--brandpurple);
	border-radius: 50%;
	color: var(--brandpurple);
	line-height: 22px;
	text-align: center;
	font-family: 'Varela', sans-serif;
	font-size: 1.125rem;
	font-weight: 700;
	margin-left: auto;
	margin-right: auto;
	position: relative;
	display: block; }

#app_progress_large li.active_text {
	color: var(--brandpurple);
	font-weight: 700; }

/* not active */
#app_progress_large .circle_not_active {
	width: 28px;
	height: 29px;
	background-color: var(--white);
	border: 3px solid var(--brandgray);
	border-radius: 50%;
	color: var(--white);
	line-height: 22px;
	text-align: center;
	font-family: 'Varela', sans-serif;
	font-size: 1.125rem;
	font-weight: 400;
	font-style: normal;
	margin-left: auto;
	margin-right: auto;
	position: relative;
	display: block; }

#app_progress_large li.not_active_text {
	color: var(--brandgray);
	font-weight: 400; }

/* completed */
#app_progress_large .circle_completed {
	width: 25px;
	height: 25px;
	background-color: var(--white);
	border: 3px solid var(--white);
	border-radius: 50%;
	color: var(--orange);
	line-height: 20px;
	text-align: center;
	font-size: 1.0625rem;
	font-style: normal;
	margin-left: auto;
	margin-right: auto;
	display: block; }

/* check mark inside app progress completed circle */
#checkmark {
	position: relative;
	display: inline-block;
	width: 24px;
	height: 24px; }

#checkmark::before {
	position: absolute;
	left: 0;
	top: 50%;
	height: 50%;
	width: 3px;
	background-color: var(--black);
	content: "";
	transform: translateX(8px) rotate(-45deg);
	transform-origin: left bottom; }

#checkmark::after {
	position: absolute;
	left: 0;
	bottom: 0;
	height: 3px;
	width: 100%;
	background-color: var(--black);
	content: "";
	transform: translateX(10px) rotate(-45deg);
	transform-origin: left bottom; }

#app_progress_large li > ul > li {
	padding: 0 5px; }

.progress_left {
	/*width: 20%;*/
}

.progress_right {
	/*width: 80%;*/
	margin-top: 25px;
}

/* 10. CONTENT/CONTENT PAGE
/* --------------------------------------------------------- */

/* Foundation Overrides */
#content .column:last-child:not(:first-child), #content .columns:last-child:not(:first-child) {
    /*float: right;*/
	float: left; } /*this affects form fields: to align left when in columns that don't add up to 12 on grid*/
@media screen and (min-width: 64em) {  /* any screen 1024px or wider (large screens and up) */
.large-3 {
	width: 24%; }

.large-9 {
	width: 73%; }}
/* End Foundation Overrides */

#content {
	margin: 0;
	padding: 0;
	background-color: var(--white); }

/* content_page headers */
#content .page_title {
	margin: 0;
	padding: 0 0 .5rem 0; }

/* explain text */ 
/*see also .explain_text in TEXT section, this applies only within the #content section */
#content p.explain_text {
	line-height: 1.5;
	display: block; }
/* end content_page headers */

/* content_page */
.content_page {
	margin: 0;
	padding: 20px .4375rem 20px .4375rem; }
@media only screen and (min-width: 64em) { /* any screen 1024px or wider (large screens and up) */
.content_page {
	margin: 0;
	padding: 35px .625rem 35px .625rem; }}

.content_page small {
	display: block;
	text-transform: capitalize;
	color: var(--brandgreen);
	font-family: "proxima-nova",sans-serif;
	font-weight: normal;
	font-style: normal;
	font-size: .9375rem;
	margin: 0 0 .5rem 0; }
@media only screen and (min-width: 40em) { /* any screen 640px or wider (medium screens) */
.content_page small {
	margin: .5rem 0 0 0; }}

.required_asterisk {
	font-size: 12px;
	color: var(--brandpurple);
	vertical-align: super;
	margin-right: .25rem;
	margin-left: .1rem;}

/* 11. FORMS
/* --------------------------------------------------------- */

form {
	padding: .5rem 0;
	margin: 0;
	clear: both;
    border-collapse: separate;
	overflow: hidden;
    z-index: 2; }

form h3 {
	color: var(--black); }
		
label {
	font-family: "proxima-nova",sans-serif;
	font-weight: normal;
	font-style: normal;
	font-size: 1.125rem; /* 18px */
	color: var(--black);
	margin-bottom: 0; }

form a:link, form a:visited {
	color: var(--blue);
	text-decoration: none; }

form a:hover {
	text-decoration: underline; }

form .explain_text { /*see also .explain_text in TEXT section, this applies only within the form section */
	margin-bottom: 0;
	color: var(--black); }

[type='text'], [type='date'], [type='email'], [type='tel'], [type='number'], [type='password'], textarea, select {
	color: var(--black);
	border: 1px solid var(--medgray);
	background-color: var(--white);
	overflow: hidden;
	height: 2.5rem;
	border-radius: 15px; }

 [type=checkbox] {
	vertical-align: -2px;
 	margin-left: 2%; }

[type='radio'] {
	margin: 0; }

.fieldset {
	border-top: 1px solid var(--black);
	border-right: none;
	border-bottom: none;
	border-left: none;
	padding: 1rem 0;
	margin: 0; }
@media only screen and (min-width: 64em) { /* any screen 1024px or wider (large screens and up) */
.fieldset {
	margin: 0;
	padding: .5rem 0; }}

.fieldset_pp { /* this is only used for primary phone input and its radio buttons */
	border-top: none;
	padding: 0; }

.fieldset h4 {
	margin: .25rem 0; }
/* ********************************* */	
.fs_first {
	margin: .5rem 0 0 0;
	padding: 0 .75rem; }
@media only screen and (min-width: 64em) { /* any screen 1024px or wider (large screens and up) */
.fs_first {
	margin: 1.5rem 0 0 0;
	padding: 0 .9375rem; }}
/* ********************************* */
.fs_mid {
	margin: 0 0 .5rem 0;
	padding: 0 .75rem; }
@media only screen and (min-width: 64em) { /* any screen 1024px or wider (large screens and up) */
.fs_mid {
	padding: 0 .9375rem; }}
/* ********************************* */		
.fs_last {
	margin: 0 0 .5rem 0;
	padding: 0 .75rem; }
@media only screen and (min-width: 64em) { /* any screen 1024px or wider (large screens and up) */
.fs_last {
	margin: 0 0 1.5rem 0;
	padding: 0 .9375rem; }}
/* ********************************* */	
.fs_question, .fs_label {
	font-size: 1.125rem; }

.fs_first .fs_question, .fs_mid .fs_question, .fs_last .fs_question {
	margin-right: -.625rem;
	margin-left: -.625rem; }
@media only screen and (min-width: 64em) { /* any screen 962px or wider (medium screens) */
.fs_first .fs_question, .fs_mid .fs_question, .fs_last .fs_question { 
	margin-right: -.9375rem;
	margin-left: -.9375rem; }}

.fs_first .fs_label, .fs_mid .fs_label, .fs_last .fs_label {
	padding-right: 1.25rem;
	padding-left: .3125rem; }

.radio_row {
	text-align: center; }
@media only screen and (min-width: 40em) { /* any screen 640px or wider (medium screens) */
.radio_row {
	text-align: left; }}

.radio_pp {
	margin-top: 0; }
@media only screen and (min-width: 64em) { /* any screen 1024px or wider (medium screens) */
.radio_pp {
	margin-top: 36px; }}

/* placeholder text */
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { /* Chrome/Opera/Safari */
	font-size: 1.0625rem;
	color: var(--black); }

input::-moz-placeholder, textarea::-moz-placeholder { /* Firefox 19+ */
	font-size: 1.0625rem;
	color: var(--black); }

input:-ms-input-placeholder, textarea:-ms-input-placeholder { /* IE 10+ */
	font-size: 1.0625rem;
	color: var(--black); }

input::placeholder, textarea::placeholder {
	font-size: 1.0625rem;
	color: var(--black); }

/* 12. BUTTONS
/* --------------------------------------------------------- */

/* Foundation Overrides */
button, .button {
	margin-bottom: 0;
	font-family: "proxima-nova",sans-serif;
	font-weight: normal;
	font-style: normal;
	font-size: .875rem;
	text-transform: capitalize;
	/* text-rendering: optimizeLegibility; */
	/* Safari 3-4, iOS 1-3.2, Android 1.6- */
	-webkit-border-radius: 18px; 
	/* Firefox 1-3.6 */
	-moz-border-radius: 18px;  
	/* Opera 10.5, IE 9, Safari 5, Chrome, Firefox 4, iOS 4, Android 2.1+ */
	border-radius: 18px;
	overflow: hidden;
	display: flex;
	justify-content: center;
	align-items: center
}
/* End Foundation Overrides */
#portalLoginButton {
	color: var(--fontBlack);
	font-weight: 600;
	background-color: var(--brandgreen);
	/*-webkit-transition: background-color 0.3s ease-out;*/
	/*-moz-transition: background-color 0.3s ease-out;*/
	/*-ms-transition: background-color 0.3s ease-out;*/
	/*-o-transition: background-color 0.3s ease-out;*/
	/*transition: background-color 0.3s ease-out;*/
	display: flex;
	justify-content: center;
	width: 100%;
	height: 36px;
	max-width: 100%;
	margin-left: 0;
	margin-right: 0;
	border: 1px solid transparent !important;
	border-radius: 18px !important; }

#uploadButton {
	color: var(--fontBlack);
	font-weight: 600;
	background-color: var(--brandgreen);
	/*-webkit-transition: background-color 0.3s ease-out;*/
	/*-moz-transition: background-color 0.3s ease-out;*/
	/*-ms-transition: background-color 0.3s ease-out;*/
	/*-o-transition: background-color 0.3s ease-out;*/
	/*transition: background-color 0.3s ease-out;*/
	display: flex;
	justify-content: center;
	width: 100%;
	height: 36px;
	max-width: 20%;
	margin-left: 0;
	margin-right: 0;
	border: 1px solid transparent !important;
	border-radius: 18px !important; }

#uploadButton:hover {
	text-decoration: none;
	display: flex;
	justify-content: center;
	color: #3F414A;
	border: 2px solid #3F414A !important;
	background-color:  #FFFFFF; }

#addThreadForm_0 {
	color: var(--fontBlack);
	font-weight: 600;
	background-color: var(--brandgreen);
	/*-webkit-transition: background-color 0.3s ease-out;*/
	/*-moz-transition: background-color 0.3s ease-out;*/
	/*-ms-transition: background-color 0.3s ease-out;*/
	/*-o-transition: background-color 0.3s ease-out;*/
	/*transition: background-color 0.3s ease-out;*/
	display: flex;
	justify-content: center;
	width: auto;
	height: 36px;
	margin-left: 0;
	margin-right: 0;
	border: 1px solid transparent !important;
	border-radius: 18px !important; }

#addThreadForm_0:hover {
	text-decoration: none;
	display: flex;
	justify-content: center;
	color: #3F414A;
	border: 2px solid #3F414A !important;
	background-color:  #FFFFFF; }

#webPortalLoginForm_0 {
	color: var(--fontBlack);
	font-weight: 600;
	background-color: var(--brandgreen);
	/*-webkit-transition: background-color 0.3s ease-out;*/
	/*-moz-transition: background-color 0.3s ease-out;*/
	/*-ms-transition: background-color 0.3s ease-out;*/
	/*-o-transition: background-color 0.3s ease-out;*/
	/*transition: background-color 0.3s ease-out;*/
	display: flex;
	justify-content: center;
	width: 100%;
	height: 36px;
	max-width: 25%;
	margin-left: 0;
	margin-right: 0;
	border: 1px solid transparent !important;
	border-radius: 18px !important; }

#portalLoginButton:hover {
	text-decoration: none;
	display: flex;
	justify-content: center;
	color: #3F414A;
	border: 2px solid #3F414A !important;
	background-color:  #FFFFFF; }
#next {
	float: right;
}
.button.cta {
	color: var(--fontBlack);
	font-weight: 600;
	background-color: var(--brandgreen);
	/*-webkit-transition: background-color 0.3s ease-out;*/
    /*-moz-transition: background-color 0.3s ease-out;*/
    /*-ms-transition: background-color 0.3s ease-out;*/
    /*-o-transition: background-color 0.3s ease-out;*/
	/*transition: background-color 0.3s ease-out;*/
	display: flex;
	justify-content: center;
    width: 100%;
	height: 36px;
	max-width: 100%;
    margin-left: 0;
    margin-right: 0;}
@media only screen and (min-width: 40em) { /* any screen 640px or wider (medium screens) */		
.button.cta {
	width: 160px;
	display: flex;
	justify-content: center;}}

.button.cta:hover {
	text-decoration: none;
	display: flex;
	justify-content: center;
	color: #3F414A;
	border: 2px solid #3F414A;
	background-color:  #FFFFFF; }

/* ps_cta is the mini button within product selection */
.button.ps_cta {
	margin-left: 0;
	margin-right: 0;
	padding: 6px 12px;
	line-height: 20px;
	color: var(--white);
	text-transform: capitalize;
	font-family: "proxima-nova",sans-serif;
	font-weight: normal;
	font-style: normal;
	background-color: var(--brandpurple);
	display: inline-block;
	width: 110px;
	height: 34px;
	-webkit-box-shadow: none; 
	box-shadow: none;
	/*-webkit-transition: all 0.2s ease-out;*/
	/*-moz-transition: all 0.2s ease-out;*/
	/*-ms-transition: all 0.2s ease-out;*/
	/*-o-transition: all 0.2s ease-out;*/
	/*transition: all 0.2s ease-out; */
}

.button.ps_cta:hover {
	text-decoration: none;
	color: var(--white);
	background-color: var(--cclime); }

.button.list_cta {
	font-family: "proxima-nova",sans-serif;
	font-weight: normal;
	font-style: normal;
	background-color: var(--brandgreen);
	width: auto;
	padding: 3px 6px;
	line-height: 12px;
	/* Safari 3-4, iOS 1-3.2, Android 1.6- */
	-webkit-border-radius: 2px; 
	/* Firefox 1-3.6 */
	-moz-border-radius: 2px;  
	/* Opera 10.5, IE 9, Safari 5, Chrome, Firefox 4, iOS 4, Android 2.1+ */
	border-radius: 2px;
	overflow: hidden; }

.client_button_group {
	text-align: center; /* centering trick */
	margin-top: 1.25rem; }
@media only screen and (min-width: 64em) { /* any screen 1024px or wider (large screens and up) */
.client_button_group {
	margin-top: 2rem;
	margin-left: 0; }}

.client_button_group li {
	padding-right: 2rem; }

.client_button_group li:last-child {
	padding-right: 0; }

.cta_menu > li > a {
	padding: 10px 20px; }

.cta_menu {
	display: inline-block; /* centering trick */ }

/* 13. PRODUCT SELECTION AND LIST
/* --------------------------------------------------------- */
/* Product Section - TABS */

#product_section p.explain_text {
	margin-bottom: .5rem; }

#product_section .product_section_link:link, #product_section .product_section_link:visited {
	font-family: "proxima-nova",sans-serif;
	font-weight: normal;
	font-style: normal;
	color: var(--brandpurple);
	text-decoration: underline; }

#product_section .tabs_row {
	padding-right: .625rem;
	padding-left: .625rem; }
@media only screen and (min-width: 48em) { /* any screen 768px or wider (medium screens) */
#product_section .tabs_row {
	padding-right: .9375rem;
	padding-left: .9375rem; }}

#product_section .tabs {
	display: flex;
	flex-wrap: wrap; /* make sure it wraps */
	background-color: var(--white);
	border: none;
	padding: 0;
	margin: 0; }

#product_section .tabs label {
	order: 1;  /*  Put the labels first */
	display: block;
	padding: .875rem 2rem;
	margin-right: 1rem;
	margin-bottom: -1px; /* as a precaution */
	cursor: pointer;
	border-radius: 10px 10px 0 0;
	color: var(--white);
	background-color: var(--ccgray);
	overflow: hidden;
  	font-weight: bold;
  	transition: all ease 0.2s; }

#product_section .tabs .tab {
  	order: 99;  /* Put the tabs last  */
  	flex-grow: 1;
	width: 100%;
	display: none;
  	padding: 1.75rem;
	border: 10px solid var(--brandgreen);
  	background-color: var(--white); }

#product_section .tabs .tab h2 {
	margin-bottom: 1rem;
	color: var(--brandgreen); }

#product_section .tabs .tab h3, .tabs .tab p {
	margin-bottom: 1.125rem; }

#product_section .tabs .tab .ps_col2, #product_section .tabs .tab .ps_col4, #product_section .tabs .tab .ps_col6, #product_section .tabs .tab .ps_col8, #product_section .tabs .tab .ps_col10 {
	border-left: none;
	padding-top: 1.75rem;
	padding-left: .625rem;
	border-top: 1px solid var(--brandgray);
	border-left: none; }
@media only screen and (min-width: 40em) { /* any screen 640px or wider (medium screens) */
#product_section .tabs .tab .ps_col2, #product_section .tabs .tab .ps_col4, #product_section .tabs .tab .ps_col6, #product_section .tabs .tab .ps_col8, #product_section .tabs .tab .ps_col10 {
	border-top: none;
	border-left: 1px solid var(--brandgray);
	padding-top: 0;
	padding-left: 1.4375rem; }}
#product_section .tabs .tab .ps_col3, #product_section .tabs .tab .ps_col4, #product_section .tabs .tab .ps_col5, #product_section .tabs .tab .ps_col6, #product_section .tabs .tab .ps_col7, #product_section .tabs .tab .ps_col8, #product_section .tabs .tab .ps_col9, #product_section .tabs .tab .ps_col10, #product_section .tabs .tab .ps_col11 {
	border-top: 1px solid var(--brandgray);
	padding-top: 1.25rem;}
#product_section .tabs .tab .ps_col10 {
	border-bottom: 1px solid var(--brandgray);}

#product_section .tabs .tab .ps_add_row {
	border-top: 1px solid var(--brandgray);
	padding-top: 1.25rem; }

#product_section .tabs input[type="radio"] {
	display: none; }

#product_section .tabs input[type="radio"]:checked + label {
	color: var(--white);
	background-color: var(--brandgreen); }

#product_section .tabs input[type="radio"]:checked + label + .tab {
	display: block; }

#product_section .tabs input[type='radio'] + label {
	margin-left: 0; }

@media (max-width: 45em) {
#product_section .tabs .tab, .tabs label {
    order: initial; }
#product_section .tabs label {
    width: 100%;
    margin-right: 0;
    margin-top: .25rem; }}

#product_section .tabs .tab .tabs_menu {
	padding-bottom: 1.25rem; }

#product_section .tabs .tab .tabs_menu li {
	padding-right: 1rem; }

#product_section .tabs .tab .tabs_menu li:last-child {
	padding-right: 0; }
/* End TABS */

/* Product Section - Account List */
#product_section .account_list_row {
	margin: 0;
	padding: 1.75rem 0 0 0; }

/* #product_section .account_list_table h3 {
	margin-bottom: .5rem; } */

#product_section .account_list_table .cta_col {
	text-align: center; }

#product_section .account_list_table tr {
	padding: .75rem;
	background-color: var(--white);
	border-bottom: 1px dotted var(--brandgray); }

#product_section .account_list_table tr:last-child {
	border-bottom: none; }

#product_section .account_list_table tbody tr:nth-child(even) {
	background-color: var(--white); }

#product_section .account_list_table td {
	padding: 15px; }

#product_section .account_list_table td.account_type {
	font-family: "proxima-nova",sans-serif;
	font-weight: normal;
	font-style: normal;
	color: var(--brandpurple); }

/* 14. SUMMARY
/* --------------------------------------------------------- */

/* review page */
.review_section p {
	margin-top: 1rem;
	margin-bottom: .5rem; }

.review_section .review_agreement_text {
	font-family: "proxima-nova",sans-serif;
	font-weight: normal;
	font-style: normal;
	font-size: .9375rem;
	margin-top: 1rem;
	margin-bottom: 0; }

.review_section .review_table {
	background-color: var(--white); }

.review_section table tbody tr:nth-child(even) {
	background-color: var(--white); }

.review_section table thead, table tbody, table tfoot {
	border: none;
	background-color: var(--white); }

.review_section table tbody tr {
	border-bottom: 1px dotted var(--brandgray); }

.review_section table tbody tr:last-child {
	border-bottom: none; }

.review_section .review_table thead, .review_section .review_table tbody, .review_section .review_table tfoot {
    border: none;
    background-color: var(--white); }

.review_section .eligibility_table, .review_section .applicant_information_table, .review_section .beneficiary_table {
	padding: 1.75rem;
	background-color: var(--white);
	border-bottom: 1px solid var(--brandgreen); }

.review_section .review_cta {
	float: right;
	width: 100px; }

/* whichever table is the LAST table on the review section page, remove the border-bottom. Can use this .last_table class or remove the table from the css dec that assigns the border-bottom (above).  */
.review_section .last_table {
	border-bottom: none; }

.review_section .review_table tbody th {
	font-family: "proxima-nova",sans-serif;
	font-weight: normal;
	font-style: normal;
	font-size: 1rem;
	text-align: left; }

.review_section .sub_table {
	margin-bottom: 0; }

/* review table and .sub_table */
.review_table, .sub_table {
	table-layout: fixed; }

/* .sub_table */
.sub_table tr {
	vertical-align: top; }

.sub_table address {
	font-style: normal;
	font-size: 1rem; }

/* 15. FOOTER
/* --------------------------------------------------------- */

/* needed special id (#client_footer) for footer since #content overrides footer styles */
#client_footer {
	margin: 0;
	padding: 1.5rem 0;
	background-color: var(--brandpurple);
	color: var(--white);
	width: 100%;
	position: absolute;
}

/* Foundation Overrides */
#client_footer .menu > li > a {
	padding: .25rem 0;
	font-size: 15px;}
/* End Foundation Overrides */

/* footer_links */
#client_footer .footer_links li {
	text-align: center;
	color: var(--white);
	font-size: 15px; }

.footer_right {
	margin: 6%;
	float: right;
}

#client_footer .footer_link:hover {
	text-decoration: none; }

hr {
	background-color: var(--brandlime);
	height: 2px;
}
.padding-bottom-2 {
	padding-bottom: 2%;
}

.side-note-font {
	font-family: "proxima-nova",sans-serif;
	font-weight: normal;
	font-style: normal;
	color: var(--brandpurple); }

.display-contents {
	display: contents;
}

.padding-left-0 {
	padding-left: 0px;
}

#contactMethod option {
	border-radius: 8px;
}
button cta summary_btn hover-color-black:hover  {
	color: var(--textblack);
}

.summary-section {
	padding: 10px;
}

.background-gray {
	background: var(--brandgray);
}

.memberLoginDiv {
	display: grid;
	justify-content: center;
	background-color: #F2F2F2;
	padding: 24px;
	border-radius: 20px;
	width: 100%;
}


@media only screen and (min-width:1020px) {
	.memberLoginDiv{
		margin-left:1%;
	}
}
@media only screen and (max-width:1020px) {
	.memberLoginDiv{
		margin: 10px auto;
	}
	.secondary-top-bar {
		margin-bottom: 10px;
	}
	#masthead {
		display: flex;
		justify-content: center;
		align-items: center;
	}
}

.border-radius-18 {
	border-radius: 18px;
}

.border-radius-10 {
	border-radius: 10px;
}

#submit_0_6 .button {
	width: 160px;
	background-color: var(--brandgreen);
	color: var(--fontBlack);
	font-weight: 600;
	height: 36px;
}

#submit_0_6 .button:hover {
	width: 160px;
	height: 36px;
	/*text-decoration: none;*/
	/*display: flex;*/
	/*justify-content: center;*/
	color: #3F414A;
	border: 2px solid #3F414A;
	background-color:  #FFFFFF; }

.mobile-header-image {
	display: flex;
	justify-content: center;
}