:root {
	/* hex */
	--orange600: #9B2405;
	/* alt -- */
	--orange500: #FF4F00;
	--orange300: #F0690B;
	--orange100: #F4D0BB;
	--blue900: #0D2E3F;
	--blue800: #0D427E;
	--blue600: #2860AD;
	--blue500: #2d64ff;
	--blue300: #24AADD;
	--blue200: #79f5ff;
	--blue100: #EBF3FA;
	--teal800: #1C655F;
	--teal600: #369292;
	--teal100: #7BC1CC;
	--purple500: #281491;
	--purple200: #b6a4e2;
	--pink500: #8D004B;
	--pink200: #E82367;
	--pink50: #FDEFF5;
	--yellow500: #EBC02A;
	--green50: #D2E2B3;
	--green100: #AEF761;
	--green200: #117711;
	--tan100: #e6c79b;
	--tan70: #F5E9D6;
	--tan20: #F8F5F2;
	--gray800: #272727;
	--gray500: #494949;
	--gray100: #969696;
	--gray50: #EEEEEE;
	--gray20: #F7F7F7;
	--white: #ffffff;
	--black: #000000;

	/*rgba*/
	--orange600-trans: rgba(155, 36, 5, 0.88);
	--orange500-trans: rgba(255, 79, 0, 0.88);
	--orange300-trans: rgba(240, 105, 11, 0.88);
	--orange100-trans: rgba(244, 208, 187, 0.88);
	--blue900-trans: rgba(13, 46, 63, 0.88);
	--blue800-trans: rgba(13, 66, 126, 0.88);
	--blue600-trans: rgba(40, 96, 173, 0.88);
	--blue300-trans: rgba(36, 170, 221, 0.88);
	--blue200-trans: rgba(121, 245, 255, 0.88);
	--blue100-trans: rgba(235, 243, 250, 0.88);
	--teal800-trans: rgba(28, 101, 95, 0.88);
	--teal600-trans: rgba(54, 146, 146, 0.88);
	--teal100-trans: rgba(123, 193, 204, 0.88);
	--purple500-trans: rgba(40, 20, 145, 0.88);
	--purple200-trans: rgba(182, 164, 226, 0.88);
	--pink500-trans: rgba(141, 0, 75, 0.88);
	--pink200-trans: rgba(232, 35, 103, 0.88);
	--pink50-trans: rgba(253, 239, 245, 0.88);
	--yellow500-trans: rgba(235, 192, 42, 0.88);
	--green100-trans: rgba(174, 247, 97, 0.88);
	--green200-trans: rgba(42, 57, 27, 0.88);
	--tan100-trans: rgba(141, 0, 75, 0.88);
	--tan70-trans: rgba(245, 233, 214, 0.88);
	--tan20-trans: rgba(248, 245, 242, 0.88);
	--gray800-trans: rgba(13, 46, 63, 0.88);
	--gray500-trans: rgba(73, 73, 73, 0.88);
	--gray100-trans: rgba(150, 150, 150, 0.88);
	--gray50-trans: rgba(238, 238, 238, 0.88);
	--gray20-trans: rgba(247, 247, 247, 0.88);
	--white-trans: rgba(255, 255, 255, 0.88);
	--black-trans: rgba(0, 0, 0, 0.88);
}

/*BUTTONS*/
.btn {
	position: relative;
	text-align: center;

	justify-content: center;
	align-items: center;

	font-size: .8rem;
	padding: 1.0em 2.25em;
	letter-spacing: -.01em;

	border-radius: 3rem;
	/* transition: background .2s ease-in-out, border .2s ease-in-out, box-shadow .3s ease-in-out, color .3s ease-in-out; */
	transition: border .2s ease-in-out, box-shadow .3s ease-in-out, color .3s ease-in-out;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	vertical-align: middle;
	white-space: nowrap;

	background: transparent;
	border: none;
}

.btn-p-container.text-tiny .btn {
	font-size: .7rem;
}

.btn.arrow-prev {
	padding: 1.0em 2.25em 1.0em calc(2.75em + 2px)
}

.btn.arrow-prev::after {
	content: '⟵';
	position: absolute;
	left: 1.15em;
	line-height: 1;
	font-size: 1.4em;
}

.btn.arrow-next {
	padding: 1.0em calc(2.75em + 2px) 1.0em 2.25em;
}

.btn.arrow-next::after {
	content: '⟶';
	position: relative;
	right: -0.5em;
	line-height: 1;
	font-size: 1.4em;
}

@media (max-width: 480px) {
	.btn.arrow-next {
		padding: 1em calc(1.15em + 2px) 1em 1.15em;
	}
}

.webkit.mac .btn.arrow-prev::after,
.chrome.mac .btn.arrow-prev::after,
.mac.webkit .btn.arrow-next::after,
.mac.chrome .btn.arrow-next::after {
	top: -3px;
}

@media (max-width: 840px) {
	.btn.arrow-prev::after {
		margin-left: 0.55em;
		left: unset;
	}

	.btn.arrow-next::after {
		margin-left: 0.55em;
		right: unset;
	}
}

.btn--flex {
	display: flex;
}

.btn--wide {
	width: 100%
}

.btn--tight {
	padding-right: 1em;
	padding-left: 1em
}

.btn--inline {
	display: inline-flex;
	margin-right: .5em;
	margin-bottom: .5em;
	vertical-align: top
}

.btn:hover {
	text-decoration: none;
}

/*A1 Buttons */
.btn-a1 {
	background: var(--orange600);
	border-color: var(--orange500);
	color: var(--white);
	box-shadow: inset -450px 0 0 0 var(--orange500);
}

.btn-a1:focus,
.btn-a1:hover,
.btn-a1:active,
.btn-a1.active {
	background: var(--orange600);
	border-color: var(--orange600);
	color: var(--white);
	box-shadow: inset 0px 0 0 0 var(--orange500);
}

.btn-outline.btn-a1 {
	color: var(--gray800);
	box-shadow: inset 0px 0 0 1px var(--orange500);
}

.btn-outline.btn-a1:focus,
.btn-outline.btn-a1:hover,
.btn-outline.btn-a1:active,
.btn-outline.btn-a1.active {
	background: transparent;
	border-color: var(--orange500);
	color: var(--white);
	box-shadow: inset -450px 0px 0px 0px var(--orange500);
}

/*B1 Buttons */
.btn-b1 {
	background: var(--blue900);
	border-color: var(--blue600);
	color: var(--white);
	box-shadow: inset -450px 0 0 0 var(--blue600);
}

.btn-b1:focus,
.btn-b1:hover,
.btn-b1:active,
.btn-b1.active {
	background: var(--blue900);
	border-color: var(--blue900);
	color: var(--white);
	box-shadow: inset 0px 0 0 0 var(--blue600);
}

.btn-outline.btn-b1 {
	color: var(--blue900);
	box-shadow: inset 0px 0 0 1px var(--blue600);
}

.btn-outline.btn-b1:focus,
.btn-outline.btn-b1:hover,
.btn-outline.btn-b1:active,
.btn-outline.btn-b1.active {
	background: transparent;
	border-color: var(--blue900);
	color: var(--blue200);
	box-shadow: inset -450px 0px 0px 0px var(--blue900);
}

/*C1 Buttons */
.btn-c1 {
	background: var(--blue600);
	border-color: var(--blue200);
	color: var(--blue900);
	box-shadow: inset -450px 0 0 0 var(--blue200);
}

.btn-c1:focus,
.btn-c1:hover,
.btn-c1:active,
.btn-c1.active {
	background: var(--blue600);
	border-color: var(--blue200);
	color: var(--white);
	box-shadow: inset 0px 0 0 0 var(--blue200);
}

.btn-outline.btn-c1 {
	color: var(--blue900);
	box-shadow: inset 0px 0 0 1px var(--blue300);
}

.btn-outline.btn-c1:focus,
.btn-outline.btn-c1:hover,
.btn-outline.btn-c1:active,
.btn-outline.btn-c1.active {
	background: transparent;
	border-color: var(--blue600);
	color: var(--white);
	box-shadow: inset -450px 0px 0px 0px var(--blue600);
}

/*D1 Buttons */
.btn-d1 {
	background: var(--teal800);
	border-color: var(--teal100);
	color: var(--gray800);
	box-shadow: inset -450px 0 0 0 var(--teal100);
}

.btn-d1:focus,
.btn-d1:hover,
.btn-d1:active,
.btn-d1.active {
	background: var(--teal800);
	border-color: var(--teal800);
	color: var(--white);
	box-shadow: inset 0px 0 0 0 var(--teal100);
}

.btn-outline.btn-d1 {
	color: var(--teal800);
	box-shadow: inset 0px 0 0 1px var(--teal100);
}

.btn-outline.btn-d1:focus,
.btn-outline.btn-d1:hover,
.btn-outline.btn-d1:active,
.btn-outline.btn-d1.active {
	background: transparent;
	border-color: var(--teal100);
	color: var(--gray800);
	box-shadow: inset -450px 0px 0px 0px var(--teal100);
}

/*E1 Buttons */
.btn-e1 {
	background: var(--purple500);
	border-color: var(--purple200);
	color: var(--purple500);
	box-shadow: inset -450px 0 0 0 var(--purple200);
}

.btn-e1:focus,
.btn-e1:hover,
.btn-e1:active,
.btn-e1.active {
	background: var(--purple500);
	border-color: var(--purple500);
	color: var(--white);
	box-shadow: inset 0px 0 0 0 var(--purple200);
}

.btn-outline.btn-e1 {
	color: var(--gray800);
	box-shadow: inset 0px 0 0 1px var(--purple200);
}

.btn-outline.btn-e1:focus,
.btn-outline.btn-e1:hover,
.btn-outline.btn-e1:active,
.btn-outline.btn-e1.active {
	background: transparent;
	border-color: var(--purple200);
	color: var(--gray800);
	box-shadow: inset -450px 0px 0px 0px var(--purple200);
}

/*F1 Buttons */
.btn-f1 {
	background: var(--pink500);
	border-color: var(--pink200);
	color: var(--white);
	box-shadow: inset -450px 0 0 0 var(--pink200);
}

.btn-f1:focus,
.btn-f1:hover,
.btn-f1:active,
.btn-f1.active {
	background: var(--pink500);
	border-color: var(--pink500);
	color: var(--white);
	box-shadow: inset 0px 0 0 0 var(--pink200);
}

.btn-outline.btn-f1 {
	color: var(--gray800);
	box-shadow: inset 0px 0 0 1px var(--pink200);
}

.btn-outline.btn-f1:focus,
.btn-outline.btn-f1:hover,
.btn-outline.btn-f1:active,
.btn-outline.btn-f1.active {
	background: transparent;
	border-color: var(--pink200);
	color: var(--white);
	box-shadow: inset -450px 0px 0px 0px var(--pink200);
}


/* white solid button style */
.btn-white {
	background: var(--white);
	border-color: var(--white);
	color: var(--gray800);
	box-shadow: inset -450px 0 0 0 var(--pink200);
}

.btn-white:focus,
.btn-white:hover,
.btn-white:active,
.btn-white.active {
	background: var(--white);
	border-color: var(--white);
	color: var(--black);
	box-shadow: inset 0px 0 0 0 var(--white);
}

/* white-outline button style */
.btn-white-outline {
	background: transparent;
	border: 1px solid var(--white);
	color: var(--white);
	/* box-shadow: inset -300px 0 0 0 var(--white); */
}

.btn-white-outline:focus,
.btn-white-outline:hover,
.btn-white-outline:active,
.btn-white-outline.active {
	background: var(--white);
	border-color: var(--white);
	color: var(--gray800);
}

/* gray800-outline button style */
.btn-gray800-outline {
	background: transparent;
	border: 1px solid var(--gray800);
	color: var(--gray800);
}

.btn-gray800-outline:focus,
.btn-gray800-outline:hover,
.btn-gray800-outline:active,
.btn-gray800-outline.active {
	background: var(--white);
	border-color: var(--white);
	color: var(--gray800);
}

.btn-outline {
	border-width: 1px;
	border-style: solid;
	background: transparent;
}

.btn-text-white {
	color: var(--white) !important;
}

.btn-text-black {
	color: var(--black) !important;
}

.btn-text-gray800 {
	color: var(--gray800) !important;
}

.btn-text-gray500 {
	color: var(--gray500) !important;
}

.btn-text-gray100 {
	color: var(--gray100) !important;
}

.btn-text-gray50 {
	color: var(--gray50) !important;
}

.btn-text-gray20 {
	color: var(--gray20) !important;
}

.btn-text-blue900 {
	color: var(--blue900) !important;
}

.btn-text-blue800 {
	color: var(--blue800) !important;
}

.btn-text-blue600 {
	color: var(--blue600) !important;
}

.btn-text-blue200 {
	color: var(--blue200) !important;
}

.btn-text-blue100 {
	color: var(--blue100) !important;
}

.btn-text-orange600 {
	color: var(--orange600) !important;
}

.btn-text-orange500 {
	color: var(--orange500) !important;
}

.btn-text-orange300 {
	color: var(--orange300) !important;
}

.btn-text-orange100 {
	color: var(--orange100) !important;
}

.btn-text-teal800 {
	color: var(--teal800) !important;
}

.btn-text-teal600 {
	color: var(--teal600) !important;
}

.btn-text-teal100 {
	color: var(--teal100) !important;
}

.btn-text-tan100 {
	color: var(--tan100) !important;
}

.btn-text-tan70 {
	color: var(--tan70) !important;
}

.btn-text-tan20 {
	color: var(--tan20) !important;
}

.btn-text-purple500 {
	color: var(--purple500) !important;
}

.btn-text-purple200 {
	color: var(--purple200) !important;
}

.btn-text-pink500 {
	color: var(--pink500) !important;
}

.btn-text-pink200 {
	color: var(--pink200) !important;
}

.btn-text-pink50 {
	color: var(--pink50) !important;
}

.btn-text-yellow500 {
	color: var(--yellow500) !important;
}

.btn-text-green200 {
	color: var(--green200) !important;
}

.btn-text-green100 {
	color: var(--green100) !important;
}

/*BACKGROUND*/
.bg-blue900 {
	background-color: var(--blue900);
}

.bg-blue800 {
	background-color: var(--blue800);
}

.bg-blue600 {
	background-color: var(--blue600);
}

.bg-blue500 {
	background-color: var(--blue500);
}

.bg-blue300 {
	background-color: var(--blue300);
}

.bg-blue200 {
	background-color: var(--blue200);
}

.bg-blue100 {
	background-color: var(--blue100);
}

.bg-teal800 {
	background-color: var(--teal800);
}

.bg-teal600 {
	background-color: var(--teal600);
}

.bg-teal100 {
	background-color: var(--teal100);
}

.bg-tan100 {
	background-color: var(--tan100);
}

.bg-tan70 {
	background-color: var(--tan70);
}

.bg-tan20 {
	background-color: var(--tan20);
}

.bg-orange600 {
	background-color: var(--orange600);
}

.bg-orange500 {
	background-color: var(--orange500);
}

.bg-orange300 {
	background-color: var(--orange300);
}

.bg-orange100 {
	background-color: var(--orange100);
}

.bg-purple500 {
	background-color: var(--purple500);
}

.bg-purple200 {
	background-color: var(--purple200);
}

.bg-pink500 {
	background-color: var(--pink500);
}

.bg-pink200 {
	background-color: var(--pink200);
}

.bg-pink50 {
	background-color: var(--pink50);
}

.bg-yellow500 {
	background-color: var(--yellow500);
}

.bg-green50 {
	background-color: var(--green50);
}

.bg-green100 {
	background-color: var(--green100);
}

.bg-green200 {
	background-color: var(--green200);
}

.bg-gray800 {
	background-color: var(--gray800);
}

.bg-gray500 {
	background-color: var(--gray500);
}

.bg-gray100 {
	background-color: var(--gray100);
}

.bg-gray50 {
	background-color: var(--gray50);
}

.bg-gray20 {
	background-color: var(--gray20);
}

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

.bg-black {
	background-color: var(--black);
}

/*BACKGROUND*/
.bg-blue900-trans {
	background-color: var(--blue900-trans);
}

.bg-blue800-trans {
	background-color: var(--blue800-trans);
}

.bg-blue600-trans {
	background-color: var(--blue600-trans);
}

.bg-blue300-trans {
	background-color: var(--blue300-trans);
}

.bg-blue200-trans {
	background-color: var(--blue200-trans);
}

.bg-blue100-trans {
	background-color: var(--blue100-trans);
}

.bg-teal800-trans {
	background-color: var(--teal800-trans);
}

.bg-teal600-trans {
	background-color: var(--teal600-trans);
}

.bg-teal100-trans {
	background-color: var(--teal100-trans);
}

.bg-tan100-trans {
	background-color: var(--tan100-trans);
}

.bg-tan70-trans {
	background-color: var(--tan70-trans);
}

.bg-tan20-trans {
	background-color: var(--tan20-trans);
}

.bg-orange600-trans {
	background-color: var(--orange600-trans);
}

.bg-orange500-trans {
	background-color: var(--orange500-trans);
}

.bg-orange300-trans {
	background-color: var(--orange300-trans);
}

.bg-orange100-trans {
	background-color: var(--orange100-trans);
}

.bg-purple500-trans {
	background-color: var(--purple500-trans);
}

.bg-purple200-trans {
	background-color: var(--purple200-trans);
}

.bg-pink500-trans {
	background-color: var(--pink500-trans);
}

.bg-pink200-trans {
	background-color: var(--pink200-trans);
}

.bg-pink50-trans {
	background-color: var(--pink50-trans);
}

.bg-yellow500-trans {
	background-color: var(--yellow500-trans);
}

.bg-green100-trans {
	background-color: var(--green100-trans);
}

.bg-green200-trans {
	background-color: var(--green200-trans);
}

.bg-gray800-trans {
	background-color: var(--gray800-trans);
}

.bg-gray500-trans {
	background-color: var(--gray500-trans);
}

.bg-gray100-trans {
	background-color: var(--gray100-trans);
}

.bg-gray50-trans {
	background-color: var(--gray50-trans);
}

.bg-gray20-trans {
	background-color: var(--gray20-trans);
}

.bg-white-trans {
	background-color: var(--white-trans);
}

.bg-black-trans {
	background-color: var(--black-trans);
}

/*TEXT*/
.text-blue900,
.btn.text-blue900 {
	color: var(--blue900);
}

.text-blue800,
.btn.text-blue800 {
	color: var(--blue800);
}

.text-blue600,
.btn.text---blue600 {
	color: var(--blue600);
}

.text-blue500,
.btn.text-blue500 {
	color: var(--blue500);
}

.text-blue300,
.btn.text-blue300 {
	color: var(--blue300);
}

.text-blue200,
.btn.text-blue200 {
	color: var(--blue200);
}

.text-blue100,
.btn.text-blue100 {
	color: var(--blue100);
}

.text-teal800,
.btn.text-teal800 {
	color: var(--teal800);
}

.text-teal600,
.btn.text-teal600 {
	color: var(--teal600);
}

.text-teal100,
.btn.text-teal100 {
	color: var(--teal100);
}

.text-tan100,
.btn.text-tan100 {
	color: var(--tan100);
}

.text-tan70,
.btn.text-tan70 {
	color: var(--tan70);
}

.text-tan20,
.btn.text-tan20 {
	color: var(--tan20);
}

.text-orange600,
.btn.text-orange600 {
	color: var(--orange600);
}

.text-orange500,
.btn.text-blue900 {
	color: var(--orange500);
}

.text-orange300,
.btn.text-orange300 {
	color: var(--orange300);
}

.text-orange100,
.btn.text-orange100 {
	color: var(--orange100);
}

.text-purple500,
.btn.text-purple500 {
	color: var(--purple500);
}

.text-purple200,
.btn.text-purple200 {
	color: var(--purple200);
}

.text-pink500,
.btn.text-pink500 {
	color: var(--pink500);
}

.text-pink200,
.btn.text-pink200 {
	color: var(--pink200);
}

.text-pink50,
.btn.text-pink50 {
	color: var(--pink50);
}

.text-yellow500,
.btn.text-yellow500 {
	color: var(--yellow500);
}

.text-green100,
.btn.text-green100 {
	color: var(--green100);
}

.text-gray800,
.btn.text-gray800 {
	color: var(--gray800);
}

.text-gray500,
.btn.text-gray500 {
	color: var(--gray500);
}

.text-gray100,
.btn.text-gray100 {
	color: var(--gray100);
}

.text-gray50,
.btn.text-gray50 {
	color: var(--gray50);
}

.text-gray20,
.btn.text-gray20 {
	color: var(--gray20);
}

.text-black,
.btn.text-black {
	color: var(--black);
}

.text-white,
.btn.text-white {
	color: var(--white);
}

/*BORDERS */
.border-blue900 {
	border-color: var(--blue900);
}

.border-blue800 {
	border-color: var(--blue800);
}

.border-blue600 {
	border-color: var(--blue600);
}

.border-blue500 {
	border-color: var(--blue500);
}

.border-blue300 {
	border-color: var(--blue300);
}

.border-blue200 {
	border-color: var(--blue200);
}

.border-blue100 {
	border-color: var(--blue100);
}

.border-teal800 {
	border-color: var(--teal800);
}

.border-teal600 {
	border-color: var(--teal600);
}

.border-teal100 {
	border-color: var(--teal100);
}

.border-tan100 {
	border-color: var(--tan100);
}

.border-tan70 {
	border-color: var(--tan70);
}

.border-tan20 {
	border-color: var(--tan20);
}

.border-orange600 {
	border-color: var(--orange600);
}

.border-orange500 {
	border-color: var(--orange500);
}

.border-orange300 {
	border-color: var(--orange300);
}

.border-orange100 {
	border-color: var(--orange100);
}

.border-purple500 {
	border-color: var(--purple500);
}

.border-purple200 {
	border-color: var(--purple200);
}

.border-pink500 {
	border-color: var(--pink500);
}

.border-pink200 {
	border-color: var(--pink200);
}

.border-pink50 {
	border-color: var(--pink50);
}

.border-yellow500 {
	border-color: var(--yellow500);
}

.border-green100 {
	border-color: var(--green100);
}

.border-green50 {
	border-color: var(--green50);
}

.border-gray800 {
	border-color: var(--gray800);
}

.border-gray500 {
	border-color: var(--gray500);
}

.border-gray100 {
	border-color: var(--gray100);
}

.border-gray50 {
	border-color: var(--gray50);
}

.border-gray20 {
	border-color: var(--gray20);
}

.border-white {
	border-color: var(--white);
}

.border-black {
	border-color: var(--black);
}

.toast.bg-green100 a,
.toast.bg-green100 a:visited {
	color: var(--gray800);
	text-decoration: underline;
}

.toast.bg-green100 a:hover {
	color: var(--black);
	text-decoration: none;
}