:root {
	--blue-main: #1863DC;
	--blue-dark: #134FB0;
	--blue-light: #4682E3;
	--blue-bg1: #D1E0F8;
	--blue-bg2: #ECF3FC;
	--blue-bg3: #F1F6FD;
	--grey-title: #27283C;
	--grey-body: #3D3E50;
	--grey-label: #525363;
	--grey-placeholder: #686876;
	--grey-line: #BEBFC5;
	--white: #ffffff;
	--red: #DD425A;
}

.cy-template a,
.cy-template ul a,
.cy-template p a,
.cy-template li a {
	color: var(--blue-main);
}

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

.cy-template .blue-text,
.cy-template .blue-main {
	color: var(--blue-main) !important;
}

.cy-template a:hover {
	color: var(--blue-main);
}

.cy-template h1,
.cy-template .head1,
.cy-template h2,
.cy-template .head2,
.cy-template h3,
.cy-template .head3,
.cy-template h4,
.cy-template .head4,
.cy-template h5,
.cy-template .head5,
.cy-template h6,
.cy-template .head6,
.cy-template .grey-title {
	color: var(--grey-title);
}

.cy-template .subhead,
.cy-template p,
.cy-template .body-text1,
.cy-template .body-text2,
.cy-template .body-text3,
.cy-template .small-text1,
.cy-template .small-text2,
.cy-template li,
.cy-template .grey-body {
	color: var(--grey-body);
}

.cy-template .grey-placeholder {
	color: var(--grey-placeholder);
}

.cy-template .grey-line {
	color: var(--grey-line);
}

.cy-template .grey-label {
	color: var(--grey-label);
}

.cy-template .divider-bottom,
.cy-template .divider-top,
.cy-template .divider-right,
.cy-template .divider-left,
.cy-template .border {
	border-color: var(--grey-line);
}

.cy-template .pri-xl-btn,
.cy-template .pri-lg-btn,
.cy-template .pri-md-btn,
.cy-template .pri-sm-btn,
.cy-template button,
.cy-template input[type=submit] {
	background: var(--blue-main);
	border-color: var(--blue-main) !important;
	color: var(--white);
}

.cy-template .pri-sm-btn:hover,
.cy-template .pri-md-btn:hover,
.cy-template .pri-lg-btn:hover,
.cy-template .pri-xl-btn:hover,
.cy-template .sec-sm-btn:hover,
.cy-template .sec-md-btn:hover,
.cy-template .sec-lg-btn:hover,
.cy-template .sec-xl-btn:hover,
.cy-template button:hover,
.cy-template input[type=submit]:hover {
	background: var(--blue-dark);
	border-color: var(--blue-dark) !important;
	color: var(--white);
}

.cy-template .sec-sm-btn,
.cy-template .sec-md-btn,
.cy-template .sec-lg-btn,
.cy-template .sec-xl-btn {
	border-color: var(--blue-main);
	color: var(--blue-main);
}

.cy-template .sec-sm-btn:hover,
.cy-template .sec-md-btn:hover,
.cy-template .sec-lg-btn:hover,
.cy-template .sec-xl-btn:hover {
	border-color: var(--blue-dark);
}

/* shadows */
.cy-template .shadow1-grey,
.cy-template .grey-shadow {
	box-shadow: 0px 1px 8px rgba(39, 40, 60, 0.12);
}

.cy-template .shadow1-blue,
.cy-template .blue-shadow {
	box-shadow: 0px 1px 8px rgba(24, 99, 220, 0.12);
}

.cy-template .shadow2-grey,
.cy-template .grey-shadow2 {
	box-shadow: 0px 8px 26px -4px rgba(39, 40, 60, 0.12);
}

.cy-template .shadow2-blue,
.cy-template .blue-shadow2 {
	box-shadow: 0px 8px 28px -4px rgba(24, 99, 220, 0.15);
}

.cy-template .shadow-gradient,
.cy-template .gradient-shadow {
	box-shadow: -13px -16px 48px -18px rgba(24, 99, 220, 0.3), 7px 15px 46px -15px rgba(45, 173, 112, 0.3);
}

.cy-template .red-text {
	color: var(--red) !important;
}

/* background colors */
.cy-template .bg-0 {
	background: transparent;
}

.cy-template .blue-bg {
	background-color: var(--blue-main);
}

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

.cy-template .blue-bg-1 {
	background-color: var(--blue-bg1);
}

.cy-template .blue-bg-2 {
	background-color: var(--blue-bg2);
}

.cy-template .grey-bg,
.blue-bg-3 {
	background-color: var(--blue-bg3);
}

.cy-template .yellow-bg-1 {
	background-color: #FFECCC;
}

.cy-template .reg-bg-1,
.cy-template .red-bg-1 {
	background-color: #E4687B;
}

.cy-template .hero-bg-img {
	background-color: var(--blue-bg3);
	background-image: url(../../images/guideline-images/hero-bg.png);
	background-position: center bottom;
	background-repeat: no-repeat;
	background-size: 100% auto;
}

.cy-template .gradient-bg {
	background: linear-gradient(107.81deg, rgba(24, 99, 220, 0.15) 11.72%, rgba(236, 243, 252, 0) 47.88%, rgba(45, 173, 112, 0.13) 87.71%), var(--blue-bg2);
}

.cy-template .hero-gradient-bg {
	background: radial-gradient(49.73% 66.5% at 80.42% 46.43%, rgba(45, 112, 173, 0.18) 8.65%, rgba(24, 99, 220, 0.15) 24.05%, rgba(45, 173, 112, 0.06) 56.15%, rgba(236, 243, 252, 0) 75.78%, rgba(236, 243, 252, 0) 100%), var(--blue-bg3);
}

.cy-template .linear-gradient {
	background: linear-gradient(180deg, rgba(236, 243, 252, 0) 0%, #ECF3FC 100%);
}

.cy-template .gradient-cy-bg {
	background: linear-gradient(141deg, rgba(117, 208, 251, 0.54) 10.36%, rgba(132, 179, 254, 0.24) 29.69%, rgba(236, 243, 252, 0.00) 45.85%, rgba(45, 173, 112, 0.48) 84.93%);
}

.cy-template img.gradient-bgi {
	filter: drop-shadow(7px 15px 46px rgba(45, 173, 112, 0.30)) drop-shadow(-13px -16px 48px rgba(24, 99, 220, 0.30));
}

.cy-template .responsive-hero-bg {
	background-color: hsla(215, 75%, 96%, 1);
	background-image:
		radial-gradient(at 50% 25%, hsla(215, 75%, 96%, 1) 0px, transparent 50%),
		radial-gradient(at 19% 49%, hsla(215, 75%, 96%, 1) 0px, transparent 50%),
		radial-gradient(at 100% 46%, hsla(215, 75%, 96%, 1) 0px, transparent 50%),
		radial-gradient(at 0% 73%, hsla(215, 75%, 96%, 1) 0px, transparent 50%),
		radial-gradient(at 97% 75%, hsla(215, 75%, 96%, 1) 0px, transparent 50%),
		radial-gradient(at 50% 99%, hsla(223, 100%, 68%, 1) 0px, transparent 50%),
		radial-gradient(at 50% 91%, hsla(148, 86%, 66%, 1) 0px, transparent 50%),
		radial-gradient(at 50% 78%, hsla(223, 100%, 68%, 1) 0px, transparent 50%);
	background-repeat: no-repeat;
	background-position: 0px 45px;
}

@media (max-width: 767px) {
	.cy-template .responsive-hero-bg {
		background-color: hsla(215, 75%, 96%, 1);
		background-image:
			radial-gradient(at 44% 60%, hsla(215, 75%, 96%, 1) 0px, transparent 50%),
			radial-gradient(at 11% 69%, hsla(215, 75%, 96%, 1) 0px, transparent 50%),
			radial-gradient(at 75% 62%, hsla(215, 75%, 96%, 1) 0px, transparent 50%),
			radial-gradient(at 0% 73%, hsla(215, 75%, 96%, 1) 0px, transparent 50%),
			radial-gradient(at 93% 74%, hsla(215, 75%, 96%, 1) 0px, transparent 50%),
			radial-gradient(at 32% 100%, hsla(223, 100%, 68%, 1) 0px, transparent 50%),
			radial-gradient(at 49% 100%, hsla(148, 86%, 66%, 1) 0px, transparent 50%),
			radial-gradient(at 72% 100%, hsla(223, 100%, 68%, 1) 0px, transparent 50%);
		background-position: bottom;
	}
}