/* root */

:root {
	/* -------------- body content font styles -------------- */

	/* font family */
	--asp-font-family-sans-serif: verdana, sans-serif;
	--asp-font-family-sans-serif-heading: "Oswald", sans-serif;
	--asp-font-family-serif: "Times New Roman", serif;

	/* font color for light bg */
	--asp-font-color-dk: #505050; /* default text color */
	--asp-font-color-dkr: #000; /* bold text color */

	/* font color  for dark bg */
	--asp-font-color-lt: rgb(255 255 255 / 80%); /* default text color */
	--asp-font-color-ltr: rgb(255 255 255 / 100%); /* bold text color */

	/* font sizes */
	--asp-font-size-body-1: 16px; /* primary page content */
	--asp-font-size-body-2: 14px; /* secondary content / aside */
	--asp-font-size-body-3: 12px; /* tertiary content / table column headers / error/ fine print */
	--asp-font-size-heading-1: 30px;
	--asp-font-size-heading-2: 24px;
	--asp-font-size-heading-3: 20px;
	--asp-font-size-heading-4: 18px;
	--asp-font-size-heading-5: 16px;
	--asp-font-size-micro: 11px; /* special cases  */
	--asp-line-height-micro: 1.5;
	--asp-letter-spacing-micro: 0.5px;
	--asp-line-height-body-1: 1.7;
	--asp-line-height-heading-1: 1.4;
	--asp-line-height-heading-2: 1.4;
	--asp-line-height-heading-3: 1.5;
	--asp-line-height-heading-4: 1.7;
	--asp-line-height-heading-5: 1.7;
	--asp-margin-heading-1: 0 auto 40px;
	--asp-margin-heading-2: 0 0 40px;
	--asp-margin-heading-3: 0 0 20px;
	--asp-margin-heading-4: 0 0 20px;
	--asp-margin-heading-5: 0;
	--asp-margin-paragraph: 0 0 20px;
	--asp-margin-top-heading: 40px;
	--asp-margin-hr: 40px;

	/* max width for content */
	--asp-content-width-max-1: 1000px;
	--asp-content-width-max-2: 800px;
	--asp-content-width-max-3: 600px;

	/* -------------- main site colors accents -------------- */
	--asp-main-color: #003087;
	--asp-main-color-ltr: #fff; /* white */
	--asp-main-color-lt: #f1f5f9; /* very light blue */
	--asp-main-color-dkr: #002262; /* very dark blue */
	--asp-accent-color: #e89743; /* accent color */
	--asp-accent-color-lt: #ffa64a; /* light accent color */

	/* -------------- links and buttons -------------- */
	--asp-link-color-default: #003087; /* default link color */
	--asp-link-color-hover: #003fb1; /* hover link color */
	--asp-button-color-default: #003087; /* default button color */
	--asp-button-color-hover: #003fb1; /* hover button color */
	--asp-button-font-color: #fff; /* button fill text color */
	--asp-button-font-size: 14px;
	--asp-button-line-height: 20px;
	--asp-button-padding: 11px 20px;
	--asp-button-height: 44px;
	--asp-button-width-min: 120px;
	--asp-button-padding-icon-only: 11px 0px;
	--asp-button-border-radius: 5px;
	--asp-button-overlay-opacity: 0.04; /* for text, outline buttons hover bg color overlay opacity */
	--asp-button-group-gap: 20px 20px;
	--asp-button-group-padding: 20px 0;

	/* -------------- icon sizes -------------- */
	--asp-icon-size-1: 24px;
	--asp-icon-size-2: 18px;
	--asp-icon-size-3: 16px;
	--asp-icon-size-heading: 30px;

	/* -------------- states -------------- */
	--asp-state-disabled-opacity: 0.3;
	--asp-state-disabled-filter: grayscale(100%) brightness(100%);
	--asp-state-soldout-color: #b00;
	--asp-state-error-color: #b00;
	--asp-state-success-color: #339043;
	--asp-state-green: #339043;
	--asp-state-yellow: #c27f1f;
	--asp-state-red: #b00;

	/* -------------- borders and shades on light background -------------- */
	--asp-border-radius-1: 10px; /* for outter large blocks - banner, sessions, accordions  - not for buttons */
	--asp-border-radius-2: 5px; /* for inner nested blocks - not for buttons */
	--asp-border-color-dkr: #c0c0c0; /* border color */
	--asp-border-color-dk: #eee; /* for keyline color */
	--asp-bg-color-dkr: #f5f5f5; /* for header footer background shade */
	--asp-bg-color-dk: #f7f7f7; /* for general row cell background shade */
	--asp-bg-color-dk-alt: #f9f9f9; /* for alt row cell background shade */
	--asp-bg-color-body: #fff; /* site body color */

	/* table  */
	--asp-table-cell-padding: 10px;
	--asp-table-header-cell-padding: 10px;
	--asp-table-line-height: 1.7;
	--asp-table-col-label-width: 130px;
	--asp-table-col-value-width: 150px;
	--asp-table-cell-checkbox-width: 40px;
	--asp-table-cell-column-gap: 20px;
	--asp-table-margin: 40px auto;

	/* -------------- site shell -------------- */

	/* site width */
	--asp-site-padding-horizontal: 20px;
	--asp-site-width-max: 1500px;
	--asp-site-width-min: 280px;

	/* padding */
	--asp-site-header-padding-vertical: 11px;
	--asp-page-container-padding-vertical: 40px;
	--asp-footer-section-padding-vertical: 20px;

	/* -------------- site  header -------------- */
	--asp-site-header-height: 75px;
	--asp-site-header-bg-color: #003087;
	--asp-site-header-logo-width: 170px;

	/* -------------- nav -------------- */
	--asp-nav-toggle-color: #fff;
	--asp-nav-toggle-bg-color: transparent;
	--asp-site-nav-bg-color: #002262;
	--asp-site-submenu-bg-color: #001844;
	--asp-site-submenu-toggle-width: 60px;
	--asp-site-nav-border-color: rgb(255 255 255 / 30%);
	--asp-site-nav-height-max: 100vh;

	/* for links that use opacity - nav */
	--asp-site-nav-link-opacity: 0.8;
	--asp-site-nav-link-opacity-hover: 1;

	/* --------------  form -------------- */
	--asp-form-font-family: inherit;
	--asp-form-font-size-1: 14px; /* default font size for label, fields */
	--asp-form-font-size-2: 12px; /* font size for error hints and tool tips */
	--asp-form-line-height: 20px;
	--asp-form-label-padding: 5px 0;
	--asp-form-label-line-height: 20px;
	--asp-form-field-padding: 10px 10px;
	--asp-form-field-select-padding: 10px 25px 10px 10px;
	--asp-form-field-textarea-padding: 10px;
	--asp-form-field-height: 44px;
	--asp-form-field-margin: 20px;
	--asp-form-field-border-radius: 5px;
	--asp-form-field-border-color: #c0c0c0;
	--asp-form-field-bg-color: #f7f7f7;

	/* ---------- focus visible outline color ----------- */
	--asp-focus-outline-color-1: #0075f9; /* main outline color */
	--asp-focus-outline-color-2: rgb(
		255 255 255 / 75%
	); /* alternate outline color for on contrasting dark background  */

	/* -------------- layouts -------------- */
	--asp-layout-column-gap: 40px;
	--asp-layout-column-count: 1;

	/* -------------- hr -------------- */
	--asp-hr-margin: 40px 0;

	/* transitions */
	--asp-transition-timing: 0.25s ease-out;

	overscroll-behavior: none;
}

/* end root */

*,
*::before,
*::after {
	box-sizing: border-box;
}

*:focus-visible {
	outline: var(--asp-focus-outline-color-1) solid 1px;
	outline-offset: 2px;
}

.site-header .logo *:focus-visible {
	outline: var(--asp-focus-outline-color-2) solid 1px;
	outline-offset: 2px;
}

.aux-links *:focus-visible {
	outline: var(--asp-focus-outline-color-2) solid 1px;
	outline-offset: -1px;
	opacity: 0.7;
}

.nav-links *:focus-visible {
	outline: var(--asp-focus-outline-color-1) solid 1px;
	outline-offset: -1px;
	opacity: 0.7;
}

/*
*:last-child {
	margin-bottom: 0;
}
*/

/* ------- GENERAL TEXT STYLES ------ */
html {
	text-size-adjust: 100%;
	scroll-behavior: smooth;
}

body {
	background-color: #fff;
	font-family: var(--asp-font-family-sans-serif);
	line-height: var(--asp-line-height-body-1);
	font-size: var(--asp-font-size-body-1);
	color: var(--asp-font-color-dk);
	padding: 0;
	margin: 0;
	min-width: var(--asp-site-width-min);
}

.asp-heading-1 {
	font-weight: 500;
	font-family: var(--asp-font-family-sans-serif-heading);
	font-size: var(--asp-font-size-heading-1);
	margin: var(--asp-margin-heading-1);
	line-height: var(--asp-line-height-heading-1);
}

.asp-heading-2 {
	font-weight: 500;
	font-family: var(--asp-font-family-sans-serif-heading);
	font-size: var(--asp-font-size-heading-2);
	margin: var(--asp-margin-heading-2);
	line-height: var(--asp-line-height-heading-2);
}

.asp-heading-3 {
	font-weight: 500;
	font-family: var(--asp-font-family-sans-serif-heading);
	font-size: var(--asp-font-size-heading-3);
	margin: var(--asp-margin-heading-3);
	line-height: var(--asp-line-height-heading-3);
}

.asp-heading-4 {
	font-weight: bold;
	font-size: var(--asp-font-size-heading-4);
	margin: var(--asp-margin-heading-4);
	line-height: var(--asp-line-height-heading-4);
}

.asp-heading-5 {
	font-weight: bold;
	font-size: var(--asp-font-size-heading-5);
	margin: var(--asp-margin-heading-5);
	line-height: var(--asp-line-height-heading-5);
}

[class*="asp-heading"] {
	color: var(--asp-font-color-dkr);
	font-optical-sizing: auto;
}

[class*="asp-heading"] > .text-normal {
	font-weight: normal;
	color: var(--asp-font-color-dk);
	font-size: initial;
}

* + [class*="asp-heading-1"],
* + [class*="asp-heading-2"],
* + [class*="asp-heading-3"] {
	margin-top: var(--asp-margin-top-heading);
}

[class*="asp-heading"]:empty {
	display: none;
}

[class*="asp-heading-icon"] {
	max-width: 100%;
	position: relative;
}

p {
	margin: var(--asp-margin-paragraph);
}

table {
	border-collapse: collapse;
	margin: var(--asp-margin-paragraph);
}

table p {
	text-align: inherit;
}

b,
strong {
	color: var(--asp-font-color-dkr);
}

a b,
a strong {
	color: inherit;
}

.text-center {
	text-align: center;
}

.text-left,
.text-left p {
	text-align: left;
}

.text-right,
.text-right p {
	text-align: right;
}

.text-normal {
	font-weight: normal;
}

.block-center {
	margin-left: auto;
	margin-right: auto;
}

.no-margin-bottom {
	margin-bottom: 0;
}

.no-margin {
	margin: 0;
}

img {
	display: block;
	width: 100%;
}

hr {
	border-top: var(--asp-border-color-dk) solid 2px;
	border-left: 0;
	border-right: 0;
	border-bottom: 0;
	margin: var(--asp-margin-hr) auto;
}

ul {
	list-style-type: none;
	padding: 0;
	margin: 0;
}

li {
	break-inside: avoid;
}

ol {
	margin: var(--asp-margin-paragraph);
}

ol > li {
	margin-bottom: 10px;
}

/* bullet list  */
ul.bullet {
	list-style-type: none;
	padding: 0;
	margin: var(--asp-margin-paragraph);
}

ul.bullet > li {
	position: relative;
	padding-left: 20px;
	margin-bottom: 10px;
}

ul.bullet > li::before {
	content: "\25cf";
	position: absolute;
	transform: scale(0.6) translateX(-30px);
}

ul.bullet > li:last-child {
	margin-bottom: 0;
}

li > ul.bullet,
li > ol.ordered {
	margin-top: 20px;
	margin-left: 20px;
}

.no-bullet > li {
	margin-bottom: 10px;
}

/* button reset */
button {
	font-family: var(--asp-font-family-sans-serif);
	appearance: auto;
	line-height: inherit;
	margin: 0;
	transform: none;
}

/* screen reader only */
.sr-only {
	overflow: hidden;
	width: 1px;
	height: 1px;
	margin: 0 0 0 -2px;
	clip: rect(0, 0, 0, 0);
	border: 0;
}

/* content width */
.content-width-max-1 {
	max-width: var(--asp-content-width-max-1);
	margin: 0 auto;
}

.content-width-max-2 {
	max-width: var(--asp-content-width-max-2);
	margin: 0 auto;
}

.content-width-max-3 {
	max-width: var(--asp-content-width-max-3);
	margin: 0 auto;
}

/* --------------- TEXT LINKS --------------- */
a {
	display: inline-block;
	color: var(--asp-link-color-default);
	text-decoration: underline;
}

a:hover,
a:focus-visible {
	color: var(--asp-link-color-hover);
	text-decoration: none;
}

/* element icon, element label */

.asp-el-icon,
.asp-el-label {
	line-height: var(--asp-button-line-height);
	vertical-align: middle;
	display: inline-block;
	position: relative;
}

.asp-el-icon {
	font-size: var(--asp-icon-size-2);
}

.asp-link .asp-el-label {
	text-decoration: underline;
}

.asp-el-icon + .asp-el-label,
.asp-el-label + .asp-el-icon {
	margin-left: 10px;
}

[class*="asp-heading-icon"] .asp-el-icon {
	display: block;
	text-align: center;
	margin: 0 auto 20px;
	height: 50px;
	width: 50px;
	line-height: 60px;
	font-size: 30px;
	border-radius: 50%;
	color: var(--asp-font-color-dkr);
}

/* for non link or button labels */
:not(.asp-link) .asp-el-label,
:not(.asp-button) .asp-el-label {
	line-height: inherit;
}

/* --------------- BUTTONS --------------- */

/* group of buttons */
.asp-button-group,
.asp-form-footer {
	display: flex;
	flex-flow: row wrap;
	gap: var(--asp-button-group-gap);
	width: 100%;
	padding: var(--asp-button-group-padding);
	justify-content: center;
	align-items: center;
	margin-top: 20px;
}

.asp-button-group:empty,
.asp-form-footer:empty {
	display: none;
}

.asp-button .asp-el-icon,
.asp-button .asp-el-label {
	text-decoration: none;
	vertical-align: top;
}

.asp-button .asp-el-icon {
	font-size: var(--asp-icon-size-2);
}

.asp-button .asp-el-label {
	line-height: var(--asp-button-line-height);
	white-space: wrap;
}

/* default button */
.asp-button {
	font-family: inherit;
	text-decoration: none;
	font-size: var(--asp-button-font-size);
	color: var(--asp-button-font-color);
	line-height: var(--asp-button-line-height);
	background-color: var(--asp-button-color-default);
	padding: var(--asp-button-padding);
	min-height: var(--asp-button-height);
	min-width: var(--asp-button-width-min);
	border-radius: var(--asp-button-border-radius);
	border: var(--asp-button-color-default) solid 1px;
	display: inline-flex;
	justify-content: center;
	cursor: pointer;
	position: relative;
	overflow: hidden;
	white-space: nowrap;
}

.asp-button:hover,
.asp-button:focus-visible {
	color: var(--asp-button-font-color);
	background-color: var(--asp-button-color-hover);
	border-color: var(--asp-button-color-hover);
}

/* button outline */
.asp-button.outline {
	background-color: transparent;
	color: var(--asp-button-color-default);
	border-color: var(--asp-button-color-default);
}

.asp-button.outline:hover,
.asp-button.outline:focus-visible {
	background-color: transparent;
	color: var(--asp-button-color-default);
	border-color: var(--asp-button-color-hover);
}

/* button text only */
.asp-button.text {
	background-color: transparent;
	border-color: transparent;
	color: var(--asp-button-color-default);
}

.asp-button.text:not(.hover-outline) {
	border: 0;
}

.asp-button.text:hover,
.asp-button.text:focus-visible {
	background-color: transparent;
	color: var(--asp-button-color-default);
}

/* button outline text - hover create shade in the background */

.asp-button.outline:hover::after,
.asp-button.outline:focus-visible::after,
.asp-button.text:hover::after,
.asp-button.text:focus-visible::after {
	content: "";
	display: block;
	position: absolute;
	z-index: 0;
	inset: 0;
	background-color: var(--asp-button-color-hover);
	opacity: var(--asp-button-overlay-opacity);
}

/* button icon only */
.asp-button.icon-only {
	min-width: 0;
	width: var(--asp-button-height);
	padding: var(--asp-button-padding-icon-only);
	height: var(--asp-button-height);
	text-align: center;
}

.icon-only .asp-el-label {
	overflow: hidden;
	width: 1px;
	height: 1px;
	margin: 0 0 0 -1px;
	opacity: 0.1;
}

.icon-only .asp-el-icon {
	width: calc(var(--asp-button-height) - 2px);
}

/* link with an icon and label */
.asp-link {
	color: var(--asp-link-color-default);
	font-size: var(--asp-font-size-body-1);
	text-decoration: none;
	cursor: pointer;
	display: inline-flex;
	flex-wrap: nowrap;
	border: 0;
	background-color: transparent;
}

.asp-link:hover,
.asp-link:focus-visible {
	color: var(--asp-link-color-hover);
}

.asp-link:hover .asp-el-label,
.asp-link:focus-visible .asp-el-label {
	text-decoration: none;
}

/* gd link icon only */
.asp-link.icon-only {
	min-width: 0;
	width: var(--asp-icon-size-1);
	height: var(--asp-icon-size-1);
	padding: 0;
	text-align: center;
}

.asp-link.icon-only .asp-el-icon {
	width: auto;
	margin: 0;
}

/* -- special hover outline  -- */
.asp-button.text.hover-outline:hover,
.asp-button.text.hover-outline:focus-visible {
	background-color: transparent;
	border-color: var(--asp-button-color-default);
}

.asp-button.text.hover-outline::after,
.asp-button.text.hover-outline:hover::after,
.asp-button.text.hover-outline:focus-visible::after {
	display: none;
}

/* special hover inverse */

.asp-button.hover-inverse {
	background-color: transparent;
	color: var(--asp-button-color-default);
	border-color: var(--asp-button-color-default);
}

.asp-button.hover-inverse:hover .asp-el-label,
.asp-button.hover-inverse:focus-visible .asp-el-label {
	color: var(--asp-button-font-color);
	opacity: 1;
}

.asp-button.hover-inverse:hover,
.asp-button.hover-inverse:focus-visible {
	background-color: var(--asp-button-color-hover);
	color: var(--asp-button-font-color);
	border-color: var(--asp-button-color-hover);
}

/* special hover expanding label */
.asp-button.hover-expand-label {
	transition: all var(--asp-transition-timing);
}

.asp-button.hover-expand-label:hover .asp-el-label,
.asp-button.hover-expand-label:focus-visible .asp-el-label {
	vertical-align: bottom;
	height: auto;
	bottom: 0;
	text-align: left;
	margin-left: 10px;
	width: auto;
	opacity: 1;
}

.asp-button.hover-expand-label:hover .asp-el-icon,
.asp-button.hover-expand-label:focus-visible .asp-el-icon {
	width: auto;
	margin: 0;
}

.asp-button.hover-expand-label:hover,
.asp-button.hover-expand-label:focus-visible {
	padding: var(--asp-button-padding);
	width: auto;
}

/* disabled */
.asp-disabled,
[disabled] {
	pointer-events: none;
	outline: none;
	filter: var(--asp-state-disabled-filter);
	opacity: var(--asp-state-disabled-opacity);
}

/* -------------- BREAK POINT -------------- */

@media screen and (min-width: 480px) {
	:root {
		/* -------------- site  header -------------- */
		--asp-site-header-height: 85px;
		--asp-site-header-logo-width: 200px;
	}
}

/* -------------- BREAK POINT -------------- */

@media screen and (min-width: 768px) {
	:root {
		/* -------------- general ---------------- */
		--asp-font-size-heading-1: 34px;
		--asp-font-size-heading-2: 28px;
		--asp-font-size-heading-3: 22px;

		/* -------------- layouts -------------- */
		--asp-layout-column-count: 2;
	}
}

/* -------------- BREAK POINT -------------- */

@media screen and (min-width: 992px) {
	:root {
		/* -------------- site  header -------------- */
		--asp-site-header-height: 150px;
		--asp-site-header-logo-width: 250px;
		--asp-site-submenu-toggle-width: 25px;

		/* -------------- layouts -------------- */
		--asp-layout-column-count: 3;
	}

	.cols-max-2 {
		--asp-layout-column-count: 2;
	}

	.cols-max-3 {
		--asp-layout-column-count: 3;
	}
}

@media screen and (min-width: 1280px) {
	:root {
		/* -------------- general ---------------- */
		--asp-font-size-heading-1: 38px;

		/* -------------- site shell -------------- */

		/* site width */
		--asp-site-padding-horizontal: 30px;

		/* -------------- layouts -------------- */
		--asp-layout-column-count: 4;
	}
}
