/**
 * Consolidated SCSS base styles
 * 	Generated: 2026-10-01 08:26:09
 *
 * AUTO-GENERATED FILE - DO NOT EDIT MANUALLY
 * Edit the source files in scss/base/ and run:
 * php builds/buildAllStylesCSS.php
 */

/* ========== _base-00-normalize.scss ========== */

/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

/* Document
   ========================================================================== */

/*
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */

html {
  line-height: 1.15; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
}

/* Sections
   ========================================================================== */

/**
 * Remove the margin in all browsers.
 */

body {
  margin: 0;
}

/**
 * Render the `main` element consistently in IE.
 */

main {
  display: block;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */

h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

/* Grouping content
   ========================================================================== */

/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */

hr {
  box-sizing: content-box; /* 1 */
  height: 0; /* 1 */
  overflow: visible; /* 2 */
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

pre {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/* Text-level semantics
   ========================================================================== */

/**
 * Remove the gray background on active links in IE 10.
 */

a {
  background-color: transparent;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */

abbr[title] {
  border-bottom: none; /* 1 */
  text-decoration: underline; /* 2 */
  text-decoration: underline dotted; /* 2 */
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */

b,
strong {
  font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

code,
kbd,
samp {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/**
 * Add the correct font size in all browsers.
 */

small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/* Embedded content
   ========================================================================== */

/**
 * Remove the border on images inside links in IE 10.
 */

img {
  border-style: none;
}

/* Forms
   ========================================================================== */

/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */

button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-size: 100%; /* 1 */
  line-height: 1.15; /* 1 */
  margin: 0; /* 2 */
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */

button,
input { /* 1 */
  overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */

button,
select { /* 1 */
  text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */

 /**
button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
}
 */

/**
 * Remove the inner border and padding in Firefox.
 */

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */

button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

/**
 * Correct the padding in Firefox.
 */

fieldset {
  padding: 0.35em 0.75em 0.625em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */

legend {
  box-sizing: border-box; /* 1 */
  color: inherit; /* 2 */
  display: table; /* 1 */
  max-width: 100%; /* 1 */
  padding: 0; /* 3 */
  white-space: normal; /* 1 */
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */

progress {
  vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */

textarea {
  overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */

[type="checkbox"],
[type="radio"] {
  box-sizing: border-box; /* 1 */
  padding: 0; /* 2 */
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */


[type="search"] {
  //-webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */

[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */

::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/* Interactive
   ========================================================================== */

/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */

details {
  display: block;
}

/*
 * Add the correct display in all browsers.
 */

summary {
  display: list-item;
}

/* Misc
   ========================================================================== */

/**
 * Add the correct display in IE 10+.
 */

template {
  display: none;
}

/**
 * Add the correct display in IE 10.
 */

[hidden] {
  display: none;
}

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


/* ========== _base-01-global.scss ========== */

/** @format */

//	============================================================================ Global
html {
	font-size: 100%;
	position: relative; // sticky footer
	min-height: 100%; // sticky footer
	-webkit-tap-highlight-color: transparent;
}

body {
	background-color: var(--body-bg-color);
	font-family: var(--font-family-sans-serif);
	font-size: var(--font-size-base);
	line-height: var(--line-height-computed);
	padding: 0;
	width: 100%;
	height: 100%;
}

textarea {
	resize: both;
}

div.ajax-loader {
	background: url("../images/ajax-loader.gif") scroll no-repeat 50% 50% transparent;
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 2500;
}


/* ========== _base-02-navbar.scss ========== */

/** @format */

//*  <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< - >>>>>>>>>>>>>>>>>>>>>>>>>>>>>> Navigation
@use "../common/common-variables-sass.scss" as sassVariables;

nav {
	font-family: var(--font-family-sans-serif);
	font-size: var(--font-size-menu);
	font-variant: small-caps;
	height: var(--navbar-height);
	border: 0;
}
.navbar {
	background-color: var(--navbar-default-color-bg);
	color: var(--base-white);
	margin: 0;
}
.navbar-nav > li > a {
	background-color: var(--navbar-default-color-bg);
	color: var(--base-white);
	text-decoration: none;
}
.navbar-nav > li > .dropdown-menu {
	border-radius: 0px;
}
.navbar-nav .open .dropdown-menu > li {
	background-color: var(--navbar-default-color-bg);
	min-height: var(--navbar-height) / 2;
}
.liDivider {
	border-bottom: 1px solid var(--navbar-height);
}
/*
.navbar-nav .open .dropdown-menu > li:nth-of-type(3) {
	border-bottom: 1px solid var(--navbar-height);
}
*/
.navbar-nav .open .dropdown-menu > li > a {
	background-color: var(--navbar-default-color-bg);
	color: var(--base-white);
	text-decoration: none;
	border-bottom: 0px solid var(--navbar-height);
}
.navbar-nav .open .dropdown-menu > li > a:focus {
	background-color: var(--navbar-default-color-bg);
}
.navbar-nav .open .dropdown-menu > li > a:hover {
	background-color: var(--accent-red);
}

ul.dropdown-menu {
	background: var(--navbar-default-color-bg);
	color: var(--base-white);
	padding-top: 0;
	padding-bottom: 0;
	margin-left: -1px;
	border: 1px solid var(--navbar-height);
	border-radius: 0;
	//border-bottom: 0;
}
.dropdown-menu {
	border-top: 1px solid var(--body-bg-color);
	margin-left: 0;
}
.dropdown-submenu {
	position: relative;
}
.dropdown-submenu > .dropdown-menu {
	top: 0;
	left: 100%;
	margin-top: -1px;
	margin-left: 1px;
	/*-webkit-border-radius: 0 6px 6px 6px;
    -moz-border-radius: 6px 0 6px 6px;
    border-radius: 0 6px 6px 6px;*/
	border: 1px solid var(--body-bg-color);
}
.dropdown-submenu:hover > .dropdown-menu {
	display: block;
}
.dropdown-submenu > a:after {
	display: block;
	content: " ";
	float: right;
	width: 0;
	height: 0;
	border-color: transparent;
	border-style: solid;
	border-width: 5px 0 5px 5px;
	border-left-color: var(--base-white);
	margin-top: 5px;
	margin-right: -10px;
}
.dropdown-submenu:hover > a:after {
	border-left-color: var(--navbar-default-color-bg); //var(--navbar-height);
}

nav.navbar.navbar-inverse.navbar-fixed-top {
	margin-top: 0;
}
.navbar-inverse .navbar-nav .open .dropdown-menu > li > a {
	color: var(--base-white);
	width: auto;
}
.navbar-inverse {
	background-color: var(--navbar-default-color-bg);
	border: 0;
	border-color: var(--navbar-default-color-bg);
	border-radius: 0;
	min-height: calc(var(--navbar-height) / 2);
}
.navbar-inverse .navbar-collapse {
	border-color: var(--navbar-default-color-bg);
}
.navbar-inverse .navbar-nav > li > a {
	color: var(--base-white);
	text-decoration: none;
	padding-top: 14px;
	padding-bottom: 14px;
	//border-right: 1px solid var(--navbar-height);
}
.navbar-inverse li:hover a:hover {
	background-color: var(--accent-red);
	color: var(--base-white);
}
.navbar-inverse .navbar-nav > .open > a,
.navbar-inverse .navbar-nav > .open > a:hover,
.navbar-inverse .navbar-nav > .open > a:focus {
	color: var(--base-white);
	background-color: var(--accent-red);
}

//  <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< - >>>>>>>>>>>>>>>>>>>>>>>>>>>>>> Responsive Navbar
//  Large screens (≥768px): Hide hamburger menu, show full navbar
@media screen and (min-width: sassVariables.$screen-bp-sm) {
	#menu_Menu {
		display: none;
	}
}

//  Small screens (<768px): Show hamburger menu, collapsible navbar
@media screen and (max-width: sassVariables.$screen-bp-sm) {
	.navbar-collapse {
		padding-right: 15px;
		padding-left: 15px;
		overflow-x: visible;
		-webkit-overflow-scrolling: touch;
		border-top: 1px solid transparent;
		-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
		box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
	}
	.navbar-collapse.in {
		overflow-y: auto;
	}
	button.navbar-toggle.btn-md:hover,
	button.navbar-toggle.btn-md:focus {
		background-color: var(--accent-red);
	}
	.nav > li {
		//background-color: var(--navbar-default-color-bg);
		width: var(--navbar-width);
		text-indent: 1em;
	}
	.nav > li > a {
		display: inherit;
	}
	.nav > li > a::before {
		content: "";
	}
	.nav.navbar-nav > li > a {
		font-family: var(--font-family-base);
		font-size: var(--font-size-base);
		font-variant: small-caps;
		line-height: 20px;
		width: var(--navbar-width);
		//border: 1px solid var(--navbar-height);
	}
	.navbar-header {
		height: var(--navbar-height);
		background-color: var(--navbar-default-color-bg);
	}
	.navbar-toggle {
		color: var(--base-white);
		position: relative;
		float: left;
		margin: 0 30px 0 0;
		padding: 3px 10px;
		background-color: var(--navbar-default-color-bg);
		background-image: none;
		border: 0 solid transparent;
		border-radius: 0;
		height: var(--navbar-height);
	}
	.navbar-toggle:focus,
	.navbar-toggle:hover {
		background-color: var(--accent-red);
		outline: 0;
	}
	.navbar-toggle:active {
		background-color: var(--accent-red);
	}

	.navbar-inverse .navbar-nav > li > a {
		color: var(--base-white);
		text-decoration: none;
		padding-top: 5px;
		padding-bottom: 5px;
		//border-right: 1px solid var(--navbar-height);
	}

	.navbar-nav {
		margin: 0 -15px;
	}
	.navbar-nav .open .dropdown-menu {
		position: static;
		float: none;
		width: auto;
		height: var(--navbar-height);
		margin-top: 0;
		background-color: transparent;
		border: 0;
		-webkit-box-shadow: none;
		box-shadow: none;
	}
	.navbar-nav .open .dropdown-menu > li > a {
		background-color: var(--navbar-default-color-bg);
		color: var(--base-white);
		text-decoration: none;
		line-height: 20px;
		min-height: var(--navbar-height);
		width: auto;
		padding: 5px 15px 5px 10px;
		//border-bottom: 1px solid var(--navbar-height);
	}
	.navbar-nav .open .dropdown-menu > li > a:hover,
	.navbar-nav .open .dropdown-menu > li > a:focus {
		background-color: var(--accent-red);
	}
	.dropdown-menu {
		background-color: var(--navbar-default-color-bg); //var(--navbar-height);
		color: var(--accent-red);
		width: auto; //var(--navbar-width);
		height: var(--navbar-height);
		margin: 0;
	}
	.dropdown-menu ul {
		width: auto; //var(--navbar-width) - 80;
		color: var(--accent-red);
	}
	.dropdown-menu > ul {
		min-width: var(--navbar-width);
	}
	.dropdown-menu > li {
		min-height: calc(var(--navbar-height) / 2);
		//border: 1px solid var(--navbar-height);
		//margin-top: -1px;
		margin-left: -2px;
	}
	.dropdown-menu > li > a {
		background-color: var(--navbar-default-color-bg);
		color: var(--base-white);
		text-decoration: none;
		min-height: calc(var(--navbar-height) / 2);
		padding: 5px 10px 5px 0;
	}
	.dropdown-menu > li > a:hover,
	.dropdown-menu > li > a:focus {
		background-color: var(--accent-red);
	}
	.navbar-static-top .navbar-collapse,
	.navbar-fixed-top .navbar-collapse,
	.navbar-fixed-bottom .navbar-collapse {
		padding-right: 0;
		padding-left: 0;
	}
	.navbar-fixed-top .navbar-collapse,
	.navbar-fixed-bottom .navbar-collapse {
		max-height: 340px;
	}

	#menu_UL-SM {
		max-height: 1500px;
	}
	#menu_UL-SM.navbar-collapse.collapse.in {
		background-color: var(--navbar-default-color-bg);
		color: var(--accent-red);
		width: var(--navbar-width);
		margin-left: 0;
	}
}


/* ========== _base-05-typography.scss ========== */

/** @format */

//  ============================================================================ Typography
h1,
h2,
h3,
h4,
h5 {
	font-family: var(--font-family-serif);
	font-weight: 700;
	color: var(--accent-red);
	padding: 0;
	margin: 0;
}

h1 {
	font-size: 2em;
	line-height: 1.6;
}

h2 {
	font-size: 1.7em;
	text-align: center;
}

h3 {
	font-size: 1.4em;
	margin-bottom: 0.25em;
}

h4 {
	font-size: 1.2em;
	margin-top: 15px;
}

h5 {
	font-size: 1.2em;
	line-height: 1.5;
}

h1.center,
h2.center,
h3.center,
h4.center,
h5.center {
	text-align: center;
}

h1.indent,
h2.indent,
h3.indent,
h4.indent,
h5.indent {
	margin-left: 1.25em;
}

p {
	line-height: 1.5em;
	margin: 0.5em 0;
}

p.indent {
	text-indent: 1.5em;
	margin-right: 10px;
}

a:link {
	text-decoration: underline;
	color: var(--brand-dark);
	outline: 0;
}

a:visited {
	text-decoration: underline;
	color: var(--accent-red);
	outline: 0;
}

a:hover,
a:active {
	background-color: var(--table-rollover);
	color: var(--base-white);
	outline: 0;
}

hr {
	height: 3px;
	border: 0;
	margin: 10px 0;
	background-color: var(--brand-dark);
}
hr.divider {
	color: var(--base-white);
	height: 1px;
	margin: 9px 0;
	overflow: hidden;
}

//  ============================================================================ Div Styles
div.indent {
	margin-left: 2em;
}

div.spacer {
	height: 10px;
}

div.spacer_sm {
	height: 5px;
}

div.tab_space {
	margin-right: 10px;
}

div.search {
	width: 48%;
	border-left: 4px solid var(--brand-dark);
	padding-left: 10px;
}

.colText {
	column-count: 4;
}

//	============================================================================ Text Styles
.ancestor {
	font-weight: 700;
	color: var(--accent-red);
}

#blockquote {
	font-family: var(--font-family-serif);
	font-style: italic;
	font-size: 1.2em;
}

.bibliography,
.bolditalic {
	font-style: italic;
	font-weight: 700;
}

.caption {
	font-family: var(--font-family-serif);
	font-style: italic;
	font-size: 0.9em;
	color: var(--base-black);
	text-align: center;
}

.textblockquote {
	font-family: var(--font-family-serif);
	font-style: italic;
	font-size: 1.1em;
	line-height: 1.25em;
	margin-left: 0;
	margin-right: 0;
}

.notethis {
	font-style: italic;
	font-weight: 700;
	color: var(--accent-red);
}

.required,
.warning {
	font-weight: 700;
	color: var(--accent-red);
}

.required_field {
	font-family: var(--font-family-serif);
	font-size: var(--font-size-base);
	font-style: italic;
	font-weight: 700;
	color: var(--accent-red);
	text-align: center;
	margin-top: 3px;
}

.validated {
	font-weight: 700;
	color: var(--accent-green);
}

.whisper {
	font-size: 0.8em;
}

.wrong {
	text-decoration: line-through;
}


/* ========== _base-06-form.scss ========== */

/** @format */

//  ============================================================================ Forms
label {
	font-family: var(--font-family-sans-serif);
	font-size: 14px;
	font-weight: 700;
	margin-bottom: 0;
}

div.dt-container select.dt-input {
	padding: 0 8px;
}

input,
textarea,
option,
select {
	background-color: var(--base-color-95);
	font-family: var(--font-family-sans-serif);
	font-size: 1em; //var(--font-size-sm);
	line-height: var(--line-height-computed);
	font-weight: normal;
	padding-left: 0.2em;
	height: var(--form-control-height);
	border: 1px solid var(--base-black);
}

option:focus {
	color: var(--base-white);
	background-color: var(--base-color-80);
}

input[type="checkbox"],
input[type="radio"] {
	margin-top: 0;
	outline: none;
}

div.outer,
#admin_Login,
#main_Form {
	background-color: var(--form-background-color);
	padding: 5px;
	font-size: 12px;
	width: 100%;
	position: relative;
	border-width: 5px;
	border-style: solid;
	border-radius: 0;
	border-top-color: var(--photo-border-color-top);
	border-left-color: var(--photo-border-color-left);
	border-right-color: var(--photo-border-color-right);
	border-bottom-color: var(--photo-border-color-bottom);
	box-shadow: none;
	margin-left: auto;
	margin-right: auto;
}

#admin_Login {
	font-weight: 700;
	margin-top: 100px;
}

.form-control {
	background-color: var(--base-color-95);
	height: var(--form-control-height);
}

.form-border {
	border: 1px solid var(--brand-dark);
	padding-top: 5px;
}

.form-group {
	display: inline-block;
	margin-bottom: 15px;
	vertical-align: middle;
}

.form-group:before,
.form-group:after {
	display: table;
	content: " ";
}

.form-group:after {
	clear: both;
}

.ui-widget-content {
	background-color: var(--base-color-95);
	border: 1px solid var(--base-black);
	font-family: var(--font-family-sans-serif);
	font-size: 14px;
}

.ui-autocomplete .ui-menu-item {
	background-color: var(--base-color-85);
	font-size: 14px;

	&:hover {
		background-color: var(--base-color-80);
	}
}

//	<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< - >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> Form Tabber tabs styles
.tab-content > .tab-pane {
	display: none;
	border: 1px solid var(--brand-dark);
	padding-top: 5px;
	margin-top: -1px;
}
.tab-content > .active {
	display: block;
}
.nav-tabs {
	border-bottom: 0 solid var(--brand-dark);
}
.nav-tabs > li {
	float: left;
	margin-bottom: 0;
	margin-left: 0;
	margin-right: 0;
}
// tab-default
.nav-tabs > li > a {
	background-color: var(--tab-default-body-color);
	color: var(--tab-default-text-color);
	height: 24px;
	font-family: var(--font-family-sans-serif);
	font-size: 14px; //var(--font-size-base);
	font-weight: bold;
	text-decoration: none;
	line-height: 0.2em;
	padding: 10px 8px; // padding around tab text
	border-color: var(--tab-default-border-color);
	border-radius: 8px 8px 0 0;
	margin-right: 5px; // Space between tabs *****
}
.nav-tabs > li > a:hover {
	background-color: var(--tab-hover-body-color);
	color: var(--tab-hover-text-color);
	border-color: var(--tab-hover-border-color);
}
// tab-active
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:focus {
	background-color: var(--tab-active-body-color);
	color: var(--tab-active-text-color);
	cursor: default;
	border-color: var(--tab-active-border-color) var(--tab-active-border-color)
		var(--tab-active-body-color);
}
.nav-tabs > li.active > a:hover {
	background-color: var(--tab-active-body-color);
	color: var(--tab-active-text-color);
	cursor: default;
	border-color: var(--tab-active-border-color) var(--tab-active-border-color)
		var(--tab-active-body-color);
}


/* ========== _base-07-list.scss ========== */

/** @format */

//	============================================================================ Lists
.list_db > a {
	font-family: var(--font-family-sans-serif);
	font-size: var(--font-size-md);
	font-weight: 700;
	text-decoration: none !important;
	line-height: 1.1em;
	color: var(--base-black);
	margin-left: 10px;
}

.list_db > a:hover {
	background-color: var(--accent-red);
	color: var(--base-white);
}


/* ========== _base-08-button.scss ========== */

//	<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< - >>>>>>>>>>>>>>>>>>>>>>>>>>>>>> Buttons
.buttonMid {
	width: 66px;
	height: 24px;
	padding: 0px;
	margin: 0 5px 0 5px;
	color: var(--base-white);
	font-size: 14px;
	font-weight: bold;
	font-variant: small-caps;
	font-family: var(--font-family-sans-serif);
	background: var(--table-button);
	border: 1px solid var(--table-button);
}

.buttonMid:hover,
.buttonMid:focus,
.buttonMid:active {
	background-color: var(--accent-red);
	color: var(--base-white);
	border: 0px;
	border-style: solid;
	border-color: var(--accent-red);
	outline: none;
	cursor: pointer;
}


/* ========== _base-09-tabber.scss ========== */

/** @format */

//	============================================================================
//	REQUIRED to hide the non-active tab content.
//	But do not hide them in the print stylesheet!
//	============================================================================
.tabberlive .tabbertabhide {
	display: none;
}

//	============================================================================
//	.tabber = before the tabber interface is set up
//	.tabberlive = after the tabber interface is set up
//	============================================================================
//.tabber {}
.tabberlive {
	margin-top: 1em;
}

//	============================================================================
//	ul.tabbernav = the tab navigation list
//	li.tabberactive = the active tab
//	============================================================================
ul.tabbernav {
	margin: 0;
	padding: 1px 0;
	border-bottom: 1px solid var(--brand-dark); // Top border of the display box
	font-weight: 700;
	font-size: 14px;
	font-family: var(--font-family-sans-serif);
}
ul.tabbernav li {
	list-style: none;
	margin: 0;
	display: inline;
}
ul.tabbernav li a {
	padding: 3px 0.5em;
	margin-right: 5px;
	border: 1px solid var(--brand-dark); // Border of the tabs
	border-radius: 8px 8px 0 0;
	// border-bottom: none;*/
	background: var(--base-color-pct-20); // Background of non-active tabs
	text-decoration: none;
}
ul.tabbernav li a:link {
	color: var(--tab-border-top);
} // Tab text
ul.tabbernav li a:visited {
	color: var(--tab-border-top);
}

ul.tabbernav li a:hover {
	color: var(--base-white);
	background: var(--tab-border-top); // Background of tabs on roll-over
	border-color: var(--tab-border-top);
}
ul.tabbernav li.tabberactive a {
	background-color: var(--tab-border-bottom); // Background and border of active tab
	border-bottom: 1px solid var(--tab-border-bottom);
}
ul.tabbernav li.tabberactive a:hover {
	color: var(--base-white);
	background: var(--tab-border-top); // Background and border of active tab roll-over
	border-bottom: 1px solid var(--tab-border-top);
}
//	============================================================================
//	.tabbertab = the tab content
//	Add style only after the tabber interface is set up (.tabberlive)
//	============================================================================
.tabberlive .tabbertab {
	padding: 5px;
	border: 1px solid var(--tab-border-top); // Border of display area
	border-top: 0;
}
// If desired, hide the heading since a heading is provided by the tab
.tabberlive .tabbertab h2 {
	display: none;
}
.tabberlive .tabbertab h3 {
	display: none;
}
// Example of using an ID to set different styles for the tabs on the page
//.tabberlive#tab1 {}
//.tabberlive#tab2 {}
.tabberlive#tab2 .tabbertab {
	height: 200px;
	overflow: auto;
}


/* ========== _base-10-table.scss ========== */

/*
 *	<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< - >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>
 *
 *	CSS elemnts for dataTables alphabet_Search-2.0
 *
 *	<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< - >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>
 */
div.alphabet {
	font-family: "Roboto Mono", Verdana, "sans-serif";
	font-size: var(--table-font-size);
	line-height: 20px;
	display: table;
	width: 100%;
	margin: 0;
}

div.alphabet span {
	display: table-cell;
	background-color: var(--ltr-active);
	color: var(--base-white);
	text-align: center;
	width: 3.7037%;
	padding-bottom: 2px;
	border-left: 2px solid var(--body-color-background);
	border-right: 2px solid var(--body-color-background);
	cursor: pointer;
}

div.alphabet span.active {
	background: var(--accent-red);
	color: var(--base-white);
	text-decoration: none;
}

div.alphabet span.active:hover {
	background-color: var(--accent-red);
}

div.alphabet span.empty {
	background: var(--ltr-empty);
}

div.alphabet span.empty:hover {
	text-decoration: none;
}

div.alphabet span.empty:nth-last-child(1) {
	border-right: 0;
}

div.alphabetInfo {
	font-size: var(--table-font-size);
	font-weight: 500;
	display: block;
	position: absolute;
	border-radius: 0px;
	color: var(--base-black);
	top: -1.25em;
	height: 1.8em;
	padding-top: 0.1rem;
	padding-left: 3px;
	text-align: center;
	z-index: 1;
}

/*
 *	<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< - >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>
 *
 *	    CSS elements to enhance dataTables-2.0
 *
 *  <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< - >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>
 */

table {
	&.center {
		margin-left: auto;
		margin-right: auto;
	}

	&.dataTable {
		margin: 0 auto;
		clear: both;
		width: 100%;

		& thead > tr > th {
			background-color: var(--table-head-bg);
			color: var(--base-white);
			font-size: var(--table-font-size);
			font-weight: 700;
			vertical-align: middle;
			letter-spacing: 1px;
			height: var(--table-line-height);
			padding: 1px 6px;
			border-bottom: 1px solid var(--base-black);
			cursor: pointer;
			*cursor: hand;

			&.center {
				font-size: var(--table-font-size);
				font-weight: 700;
				height: var(--table-line-height);
				text-align: center;
			}
			&.dt-orderable-asc span.dt-column-order:before,
			&.dt-orderable-asc span.dt-column-order:after,
			&.dt-orderable-desc span.dt-column-order:before,
			&.dt-orderable-desc span.dt-column-order:after,
			&.dt-ordering-asc span.dt-column-order:before,
			&.dt-ordering-asc span.dt-column-order:after,
			&.dt-ordering-desc span.dt-column-order:before,
			&.dt-ordering-desc span.dt-column-order:after,
			&.dt-orderable-asc span.dt-column-order:before,
			&.dt-orderable-asc span.dt-column-order:after,
			&.dt-orderable-desc span.dt-column-order:before,
			&.dt-orderable-desc span.dt-column-order:after,
			&.dt-ordering-asc span.dt-column-order:before,
			&.dt-ordering-asc span.dt-column-order:after,
			&.dt-ordering-desc span.dt-column-order:before,
			&.dt-ordering-desc span.dt-column-order:after {
				opacity: 1;
				color: var(--base-white);
			}

			&.dt-ordering-asc span.dt-column-order:before,
			&.dt-ordering-desc span.dt-column-order:after,
			&.dt-ordering-asc span.dt-column-order:before,
			&.dt-ordering-desc span.dt-column-order:after {
				opacity: 0; //0.6;
				color: var(--base-white);
			}

			&.udatal {
				text-align: left;
				white-space: nowrap;
				padding-left: 0.25em;
			}

			&.udatac {
				text-align: center;
			}

			&.udatar {
				text-align: right;
				padding-right: 0.5em;
			}

			&.udatas {
				text-align: right;
				padding-right: 10px;
			}
		}

		& tfoot > th {
			height: 0;
			padding: 0;
			border-top: 1px solid var(--base-black);
			font-weight: 700;
		}

		& tbody > tr {
			cursor: pointer;

			&:nth-child(odd) {
				background-color: var(--table-rowodd);
			}
			&:nth-child(odd):hover {
				background-color: var(--table-rollover);
			}
			&:nth-child(even) {
				background-color: var(--table-roweven);
			}
			&:nth-child(even):hover {
				background-color: var(--table-rollover);
			}

			&:nth-child(odd) td.sorting_1 {
				background-color: var(--table-sortodd);
			}
			&:nth-child(odd):hover td.sorting_1 {
				background-color: var(--table-rollover);
			}
			&:nth-child(even) td.sorting_1 {
				background-color: var(--table-sorteven);
			}
			&:nth-child(even):hover td.sorting_1 {
				background-color: var(--table-rollover);
			}

			&:nth-child(odd).selected td {
				background-color: var(--table-row-selected);
			}
			&:nth-child(even).selected td {
				background-color: var(--table-row-selected);
			}

			&.noHand {
				cursor: none;
			}

			& > td {
				height: var(--table-line-height);
				padding: 1px 10px;
				font-size: var(--table-font-size);
				vertical-align: middle;
				border-bottom: 1px solid var(--base-black);

				&.udatal {
					text-align: left;
					white-space: nowrap;
					padding-left: 0.25em;
				}

				&.udatac,
				&.center {
					text-align: center;
				}

				&.udatar {
					text-align: right;
					padding-right: 0.5em;
				}

				&.udatas {
					text-align: right;
					padding-right: 10px;
				}

				&.lists > a {
					color: var(--base-black);
					font-size: 1.15em;
					text-decoration: underline;
				}
			}
		}
	}
}

/*
 *	<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< - >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>
 *
 *	    CSS .table class to enhance dataTables-2.0
 *
 *  <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< - >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>
 */
.dataTables_wrapper {
	position: relative;
	clear: both;
	zoom: 1;
}

.table {
	margin-bottom: 0;
}

.table > thead > tr > th,
.table > tbody > tr > th,
.table > tfoot > tr > th,
.table > thead > tr > td,
.table > tbody > tr > td,
.table > tfoot > tr > td {
	padding: 4px;
	line-height: var(--line-height-base);
	vertical-align: middle;
	border-top: 1px solid var(--brand-dark);
	border-bottom: 0px solid var(--brand-dark);
	font-size: 12px;
	text-align: center;
}

.table > tfoot > tr > td {
	border-bottom: 0;
	margin-bottom: 20px;
}

.table > tfoot > tr > th {
	color: red;
	font-size: 13px;
}

.table-nohand > tbody > tr {
	cursor: default;
}

.table-striped > tbody > tr:nth-child(even) > td,
.table-striped > tbody > tr:nth-child(even) > th {
	background-color: var(--table-roweven);
}

.table-hover tbody tr:hover td,
.table-hover tbody tr:hover th {
	background-color: var(--table-rollover);
}

div.top > input[type="search"] {
	margin: 0;
}

/*
 *	<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< - >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>
 *
 *	    CSS div.dt-container class to enhance dataTables-2.0
 *
 *  <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< - >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>
 */
div.dt-container .dt-paging .dt-paging-button {
	background-color: var(--btn-paginate);
	color: var(--btn-text);
	font-family: "Roboto Mono", Verdana, "sans-serif";
	font-size: var(--table-font-size);
	line-height: 110%;
	border: var(--btn-border-style);
	border-radius: 5px;
	padding: 1px 6px 2px 5px;
	margin: 3px;
}

div.dt-container .dt-paging .dt-paging-button.current,
div.dt-container .dt-paging .dt-paging-button.current:hover {
	background-color: var(--btn-active);
	color: var(--btn-text);
	cursor: not-allowed;
}

div.dt-container .dt-paging .dt-paging-button.disabled,
div.dt-container .dt-paging .dt-paging-button.disabled:hover,
div.dt-container .dt-paging .dt-paging-button.disabled:active {
	color: var(--btn-text);
	background-color: var(--btn-disabled);
	border: var(--border-style-1); //1px solid transparent;
	cursor: not-allowed;
}

div.dt-container .dt-paging .ellipsis {
	padding: 0 0.25em;
}

div.dt-container .dt-info {
	text-align: center;
	font-size: var(--table-font-size);
	font-weight: 700;
}

div.dt-container .dt-length,
div.dt-container .dt-search,
div.dt-container .dt-info,
div.dt-container .dt-processing,
div.dt-container .dt-paging {
	height: var(--table-line-height);
	padding-bottom: 0;
	margin: 0;
}
div.dt-container .dt-lengthx,
div.dt-container .dt-searchx {
	margin-top: -2.5rem;
}

div.dt-container .dt-empty-footer tbody > tr:last-child > * {
	border-bottom: var(--border-style-1);
}

div.dt-container .dt-search input {
	width: 8em;
}


/* ========== _base-11-modal.scss ========== */

/**
 * Field Help System Styles
 * 
 * Styles for the admin field help icons and modals
 *
 * @format
 */

/* Help Icon Styles */
.field-help-icon {
	color: #337ab7;
	cursor: pointer;
	font-size: 0.9em;
	margin-left: 5px;
	transition: all 0.2s ease;
	display: inline-block;
	vertical-align: middle;
}

.field-help-icon:hover {
	color: #23527c;
	transform: scale(1.15);
}

.field-help-icon:active {
	transform: scale(1.05);
}

/* Label adjustments to accommodate help icon */
label {
	position: relative;
	display: inline-block;
}

/* Help Modal Styles */
.field-help-modal .modal-header {
	background-color: #f5f5f5;
	border-bottom: 2px solid #337ab7;
	padding: 15px 20px;
}

.field-help-modal .modal-title {
	color: var(--color-primary);
	font-size: var(--font-size-xl);
	font-weight: 900;
}

.field-help-modal .modal-title .fa {
	color: var(--color-primary);
	margin-right: 8px;
}

.field-help-modal .modal-body {
	padding: 20px;
	font-size: 14px;
	line-height: 1.6;
	color: #555;
}

.field-help-modal .modal-body p {
	margin-bottom: 10px;
}

.field-help-modal .modal-body ul,
.field-help-modal .modal-body ol {
	margin-left: 20px;
	margin-bottom: 10px;
}

.field-help-modal .modal-body li {
	margin-bottom: 5px;
}

.field-help-modal .modal-body code {
	background-color: #f4f4f4;
	padding: 2px 6px;
	border-radius: 3px;
	font-family: "Roboto Sans-serif", monospace;
	color: #c7254e;
}

.field-help-modal .modal-body strong,
.field-help-modal .modal-body b {
	color: #333;
	font-weight: 600;
}

.field-help-modal .modal-body em {
	font-style: italic;
	color: #666;
}

.field-help-modal .modal-body dl > dt {
	font-weight: 900;
	font-size: var(--font-size-md);
	text-decoration: none;
	padding-bottom: 1rem;
}

.field-help-modal .modal-body dl > dd {
	margin-left: 1.5rem;
	margin-bottom: 0.75rem;

	&.indent {
		margin-left: 3rem;
	}
}

.field-help-modal .modal-footer {
	padding: 15px 20px;
	background-color: #f9f9f9;
	display: none; /* Hide footer if not needed */
}

/* Close button styling */
.field-help-modal .close {
	font-size: 28px;
	font-weight: 300;
	color: #999;
	opacity: 0.6;
	text-shadow: none;
	transition: all 0.2s ease;
}

.field-help-modal .close:hover {
	opacity: 1;
	color: #333;
}

/* Responsive adjustments */
@media (max-width: 768px) {
	.field-help-modal .modal-dialog {
		margin: 10px;
	}

	.field-help-icon {
		font-size: 1em;
	}
}

/* Make help content more readable */
.field-help-modal .modal-body h4,
.field-help-modal .modal-body h5 {
	margin-top: 15px;
	margin-bottom: 10px;
	color: #337ab7;
	font-weight: 600;
}

.field-help-modal .modal-body h4:first-child,
.field-help-modal .modal-body h5:first-child {
	margin-top: 0;
}

/* Example/note boxes in help content */
.field-help-modal .modal-body .help-example {
	background-color: #f0f7ff;
	border-left: 4px solid #337ab7;
	padding: 10px 15px;
	margin: 10px 0;
	border-radius: 3px;
}

.field-help-modal .modal-body .help-note {
	background-color: #fffbf0;
	border-left: 4px solid #f0ad4e;
	padding: 10px 15px;
	margin: 10px 0;
	border-radius: 3px;
}

.field-help-modal .modal-body .help-warning {
	background-color: #fff5f5;
	border-left: 4px solid #d9534f;
	padding: 10px 15px;
	margin: 10px 0;
	border-radius: 3px;
}

/* Animation for modal appearance */
.field-help-modal.fade .modal-dialog {
	transform: scale(0.95);
	opacity: 0;
	transition: all 0.2s ease-out;
}

.field-help-modal.fade.in .modal-dialog {
	transform: scale(1);
	opacity: 1;
}

/* Ensure modals appear above other elements */
.field-help-modal {
	z-index: 1050;
	top: 20px;
}

.field-help-modal .modal-backdrop {
	z-index: 1040;
}


/* ========== _base-12-page.scss ========== */

/** @format */

//	============================================================================ Page Styles
#main_Heading {
	color: var(--accent-red);
	font-family: var(--font-family-serif);
	font-size: var(--font-size-h1);
	font-weight: bold;
	font-style: italic;
	text-align: center;
	line-height: 110%;
	padding-top: 1rem;
	margin-top: var(--navbar-height);
	margin-bottom: 0.5rem;
}

#main_Wrapper {
	display: grid;
	grid-template-columns: repeat(12, [col] 1fr);
	column-gap: 1rem;
	row-gap: 0;
	margin: 0 20%;
	grid-template-areas:
		"main-form"
		"main-table";

	& #main_Form {
		grid-area: main-form;
		grid-column: col 4 / span 6;
		margin-bottom: 1rem;
		grid-row: 2;
		//width: 100%;
		//margin-left: auto;
		//margin-right: auto;

		& #form_Menu {
			width: 100%;
			text-align: center;
			margin-top: 5px;
			padding-bottom: 10px;
			border-bottom: 2px solid var(--brand-dark);
		}

		& #form_Grid,
		& #form_Grid_Tab_1,
		& #form_Grid_Tab_2,
		& #form_Grid_Tab_3,
		& #form_Grid_Tab_4,
		& #form_Grid_Tab_5,
		& #form_Grid_Tab_6 {
			display: grid;
			grid-template-columns: repeat(12, [col] 1fr);
			column-gap: 1rem;
			row-gap: 0;
			margin: 0 1rem;
		}

		& #form_Grid.grid_Border {
			padding: 0.5rem 1rem 0;
			border: 1px solid var(--brand-dark);
			margin: 0;
		}

		& #form_Text {
			color: var(--accent-red);
			font-weight: bold;
			text-align: center;
			width: 100%;
			margin: 0;
		}
	}
	& #main_Table {
		grid-area: main-table;
		grid-column: col 1 / span 12;
		grid-row: 3;
	}
}
#small_Message {
	color: var(--accent-red);
	font-size: var(--font-size-h4);
	font-weight: 900;
	text-align: center;
	line-height: 130%;
	margin-top: 5rem;

	&::before {
		content: "Larger screen required for Admin modules.";
	}
}


/* ========== common_variables-root.scss ========== */

/** @format */

:root {
	--base-color: hsl(var(--base-hue), var(--base-sat), var(--base-lit));

	--body-color-background: var(--base-color-95);
	--body-color-text: var(--base-black);

	--base-white: White;
	--base-black: Black;

	--accent-red: #880000;
	--accent-green: #009900;
	--accent-blue: #000099;
	--accent-gray: #f1f1f1;

	--brand-primary: var(--base-color);
	--brand-accent: var(--accent-red);

	--brand-success: hsl(120, 39%, 54%);
	--brand-info: hsl(194, 66%, 61%);
	--brand-warning: hsl(059, 84%, 62%);
	--brand-danger: hsl(002, 64%, 58%);

	--brand-lite: var(--base-color-70);
	--brand-dark: var(--base-color-40);

	--gray-darker: #9a9a9a;
	--gray-dark: #bbbbbb;
	--gray: #cccccc;
	--gray-light: #dddddd;
	--gray-lighter: #eaeaea;

	--box-shadow-style: 5px 5px 5px 0px var(--brand-dark);
	--box-shadow-bg-png: url(../images/mis_images/paper_texture.png) repeat;
	--box-shadow-bg-gif: url(../images/mis_images/newspaper_bg.gif) repeat;
	--box-shadow-bg-mem: url(../images/mis_images/bg_hf_pattern.jpg) repeat;
	--box-shadow-bg-color: #b1ed9e;

	--search-bg-color: hsl(029, 100%, 75%);

	--link-color: var(--base-color-10);
	--link-hover-color: var(--base-color-60);
	--link-hover-decoration: underline;

	//*	========================================================================== Base Font Family
	--font-family-serif: "Roboto Serif", serif;
	--font-family-sans-serif: "Roboto", sans-serif;
	--font-family-monospace:
		"Roboto Mono", "Menlo", "Monaco", "Consolas", "Courier New", monospace;

	--font-family-base: var(--font-family-sans-serif);
	--font-family-menu: var(--font-family-sans-serif);
	--font-family-table: var(--font-family-sans-serif);
	--font-family-caption: var(--font-family-serif);
	--font-family-dropcap: "Brush Script MT", var(--font-serif);
	--font-family-memorial: "Brush Script MT", var(--font-family-sans-serif);
	--font-family-footer: var(--font-family-sans-serif);

	//*	========================================================================== Base Font Sizes
	--font-size-base: 1rem; //clamp(0.75rem, 0.5rem + 0.667vw, 1rem); // 12-16px;
	--font-size-menu: 1.25rem; //clamp(1rem, 0.688rem + 0.833vw, 1.313rem); //16-21px
	--font-size-table: var(--font-size-sm);
	--font-size-caption: calc(var(--font-size-base) - 2px);

	--font-size-scale: 1.618;
	--font-size-default: 1rem;
	--font-size-whisper: 0.75rem;

	//*	The following values are based on the range indicated on a screen size of 600-1200
	//* Values were computed using the URL: https://www.marcbacon.com/tools/clamp-calculator/
	--font-size-h1: 2.25rem; //clamp(1.875rem, 1.5rem + 1vw, 2.25rem); // 30-36px;
	--font-size-h2: 2rem; //clamp(1.5rem, 1.125rem + 1vw, 1.875rem); // -30px;
	--font-size-h3: 1.75rem; //clamp(0.875rem, -0.236rem + 2.315vw, 1.5rem); // 14-24px;
	--font-size-h4: 1.5rem; //clamp(0.75rem, 0.188rem + 1.5vw, 1.313rem); // 12-21px;
	--font-size-h5: 1.25rem; //clamp(0.625rem, 0.125rem + 1.333vw, 1.125rem); // 10-18px;
	--font-size-h6: 1rem;

	--font-size-xl: 1.5rem; //clamp(1rem, 0.556rem + 0.926vw, 1.25rem); // 16-20px;
	--font-size-lg: 1.25rem; //clamp(0.875rem, 0.431rem + 0.926vw, 1.125rem); // 14-18px;
	--font-size-md: 1rem; //clamp(0.75rem, 0.306rem + 0.926vw, 1rem); // 12-16px;
	--font-size-sm: 0.75rem; //clamp(0.625rem, 0.181rem + 0.926vw, 0.875rem); // 10-14px;
	--font-size-xs: 0.5rem; //clamp(0.5rem, 0.404rem + 0.385vw, 0.75rem); // 8-12px;

	//* ==========================================================================
	//*     Media queries breakpoints
	--navbar-bp-xs: 0px;
	--navbar-bp-sm: 600px;
	--navbar-bp-md: 768px;
	--navbar-bp-lg: 992px;
	--navbar-bp-xl: 1200px;

	--screen-bp-xs: 0px;
	--screen-bp-sm: 600px;
	--screen-bp-md: 768px;
	--screen-bp-lg: 992px;
	--screen-bp-xl: 1200px;

	--footer-bp-xs: 0px;
	--footer-bp-sm: 600px;
	--footer-bp-md: 768px;
	--footer-bp-lg: 992px;
	--footer-bp-xl: 1200px;

	//*	========================================================================== Photo/Image
	--photo-bg-color: var(--base-white);
	--photo-border-color-top: var(--brand-lite);
	--photo-border-color-left: var(--brand-lite);
	--photo-border-color-right: var(--brand-dark);
	--photo-border-color-bottom: var(--brand-dark);
	--photo-padding: 3px;

	--image-padding: 3px;
	--image-bg-color: var(--base-white);
	--image-border-default: 3px solid var(--brand-dark);

	--paper-bg-color: #faefd8;
	--paper-bg-pattern: url(../images/mis_images/paper_texture.png);
	--paper-border-default: 3px solid var(--brand-dark);

	//* ==========================================================================
	//*     Navbar
	--navbar-height: 50px;
	--navbar-width: 230px;
	--navbar-margin-bottom: var(--line-height-computed);
	--navbar-border-radius: var(--border-radius-base);
	--navbar-padding-horizontal: calc(var(--grid-gutter-width) / 2);
	--navbar-padding-vertical: calc(
		(var(--navbar-height) - var(--line-height-computed)) / 2
	);
	--navbar-collapse-max-height: 340px;

	--navbar-default-color-base: var(--base-color);
	--navbar-default-color-bg: var(--navbar-default-color-base);

	--navbar-default-color-text: var(--base-white);
	--navbar-default-color-border: var(--navbar-default-color-bg);

	// Navbar links
	--navbar-default-link-color: #777;
	--navbar-default-link-hover-color: #333;
	--navbar-default-link-hover-bg: transparent;
	--navbar-default-link-active-color: #555;
	--navbar-default-link-active-bg: calc(var(--navbar-default-color-bg) * 6.5%);
	--navbar-default-link-disabled-color: #ccc;
	--navbar-default-link-disabled-bg: transparent;

	// Navbar brand label
	--navbar-default-brand-color: var(--navbar-default-link-color);
	--navbar-default-brand-hover-color: calc(var(--navbar-default-brand-color) * 10%);
	--navbar-default-brand-hover-bg: transparent;

	// Navbar toggle
	--navbar-default-toggle-hover-bg: #ddd;
	--navbar-default-toggle-icon-bar-bg: #888;
	--navbar-default-toggle-border-color: #ddd;

	// === Inverted navbar
	// Reset inverted navbar basics
	--navbar-inverse-color: calc(var(--gray-light) * 15%);
	--navbar-inverse-bg: #222;
	--navbar-inverse-border: calc(var(--navbar-inverse-bg) * 10%);

	// Inverted navbar links
	--navbar-inverse-link-color: calc(var(--gray-light) * 15%);
	--navbar-inverse-link-hover-color: var(--base-white);
	--navbar-inverse-link-hover-bg: transparent;
	--navbar-inverse-link-active-color: var(--navbar-inverse-link-hover-color);
	--navbar-inverse-link-active-bg: calc(var(--navbar-inverse-bg) * 10%);
	--navbar-inverse-link-disabled-color: #444;
	--navbar-inverse-link-disabled-bg: transparent;

	// Inverted navbar brand label
	--navbar-inverse-brand-color: var(--navbar-inverse-link-color);
	--navbar-inverse-brand-hover-color: var(--base-white);
	--navbar-inverse-brand-hover-bg: transparent;

	// Inverted navbar toggle
	--navbar-inverse-toggle-hover-bg: #333;
	--navbar-inverse-toggle-icon-bar-bg: var(--base-white);
	--navbar-inverse-toggle-border-color: #333;

	// === Shared nav styles
	--nav-link-padding: 10px 15px;
	--nav-link-hover-bg: var(--gray-lighter);

	--nav-disabled-link-color: var(--gray-light);
	--nav-disabled-link-hover-color: var(--gray-light);

	--nav-tabs-border-color: #ddd;

	--nav-tabs-link-hover-border-color: var(--gray-lighter);

	--nav-tabs-active-link-hover-bg: var(--body-color-background);
	--nav-tabs-active-link-hover-color: var(--gray);
	--nav-tabs-active-link-hover-border-color: #ddd;

	--nav-tabs-justified-link-border-color: #ddd;
	--nav-tabs-justified-active-link-border-color: var(--body-color-background);

	//* ==========================================================================
	//*     Misc Variables
	--line-height-base: 1.428571429;
	--line-height-computed: calc(
		var(--font-size-base) * var(--line-height-base)
	); // ~20px

	--well-height: 270px;

	--marker-width: 500px;
	--spacer-height: 1rem;

	--min-screen-size: 400;
	--max-screen-size: 800;
	--min-font-size: 16;
	--max-font-size: 24;

	--footer-height: 100px;
	--footer-default-color-bg: var(--base-color-80);

	//* ==========================================================================
	//*     List
	--list-group-bg: var(--base-white);
	--list-group-border: #ddd;
	--list-group-border-radius: var(--border-radius-base);

	--list-group-hover-bg: #f5f5f5;
	--list-group-active-color: var(--component-active-color);
	--list-group-active-bg: var(--component-active-bg);
	--list-group-active-border: var(--list-group-active-bg);
	--list-group-active-body-color-text: calc(var(--list-group-active-bg) * 40%);

	--list-group-disabled-color: var(--gray-light);
	--list-group-disabled-bg: var(--gray-lighter);
	--list-group-disabled-body-color-text: var(--list-group-disabled-color);

	--list-group-link-color: #555;
	--list-group-link-hover-color: var(--list-group-link-color);
	--list-group-link-heading-color: #333;

	//* ==========================================================================
	//*     Padding
	--padding-base-vertical: 6px;
	--padding-base-horizontal: 12px;

	--padding-lg-vertical: 10px;
	--padding-lg-horizontal: 16px;

	--padding-sm-vertical: 5px;
	--padding-sm-horizontal: 10px;

	--padding-xs-vertical: 1px;
	--padding-xs-horizontal: 5px;

	--line-height-lg: 1.3333333; // extra decimals for Win 8.1 Chrome
	--line-height-sm: 1.5;

	--border-radius-base: 4px;
	--border-radius-lg: 6px;
	--border-radius-sm: 3px;

	--border-color: var(--brand-dark);
	--border-style-1: 1px solid var(--border-color);
	--border-style-2: 2px solid var(--border-color);
	--border-style-3: 3px solid var(--border-color);
	--border-style-4: 4px solid var(--border-color);
	--border-style-5: 5px solid var(--border-color);

	--component-active-color: var(--base-color-40);
	--component-active-bg: var(--brand-primary);

	--caret-width-base: 4px;
	--caret-width-lg: 5px;

	//* ==========================================================================
	//*     Maps
	--map-border-color: #020202;
	--map-border-weight: 2px;

	--map-color-this-state: Red;
	--map-color-same-state: Green;
	--map-color-next-state: Yellow;

	--map-color-town-name: var(--dark-grayj); //#525251;

	//* ==========================================================================
	//*     Dropdowns
	--dropdown-bg: var(--base-white);
	--dropdown-border: hsl(0, 0%, 50%);
	--dropdown-fallback-border: #ccc;
	--dropdown-divider-bg: #e5e5e5;

	--dropdown-link-color: var(--gray-dark);
	--dropdown-link-hover-color: brightness(var(--gray-dark), 5%);
	--dropdown-link-hover-bg: #f5f5f5;

	--dropdown-link-active-color: var(--component-active-color);
	--dropdown-link-active-bg: var(--component-active-bg);

	--dropdown-link-disabled-color: var(--gray-light);

	// Text color for headers within dropdown
	--dropdown-header-color: var(--gray-light);

	--dropdown-caret-color: var(--base-black);

	//* ==========================================================================
	//*     Z-index master list
	//*
	//* Warning: Avoid customizing these values. They're used for a bird's eye view
	//* of components dependent on the z-axis and are designed to all work together.
	//*
	--zindex-navbar: 1000;
	--zindex-dropdown: 1000;
	--zindex-popover: 1060;
	--zindex-tooltip: 1070;
	--zindex-navbar-fixed: 1030;
	--zindex-modal-bg: 1040;
	--zindex-modal: 1050;

	//* ==========================================================================
	//*     Grid system
	--grid-columns: 12;
	--grid-gutter-width: 30px;
	--grid-float-breakpoint: var(--screen-sm-min);
	--grid-float-breakpoint-max: calc((var(--grid-float-breakpoint) - 1px));

	//* ==========================================================================
	//*     Container
	//* Small screen / tablet
	--container-tablet: calc((720px + var(--grid-gutter-width)));
	--container-sm: var(--container-tablet);

	//* Medium screen / desktop
	--container-desktop: calc((940px + var(--grid-gutter-width)));
	--container-md: var(--container-desktop);

	//* Large screen / wide desktop
	--container-lg-desktop: calc((1140px + var(--grid-gutter-width)));
	--container-lg: var(--container-lg-desktop);

	//* ==========================================================================
	//*     Pagination
	--pagination-color: var(--link-color);
	--pagination-bg: var(--base-white);
	--pagination-border: var(--base-color-40);

	--pagination-hover-color: var(--link-hover-color);
	--pagination-hover-bg: var(--gray-lighter);
	--pagination-hover-border: var(--base-color-40);

	--pagination-active-color: var(--base-white);
	--pagination-active-bg: var(--brand-primary);
	--pagination-active-border: var(--brand-primary);

	--pagination-disabled-color: var(--gray-light);
	--pagination-disabled-bg: var(--base-white);
	--pagination-disabled-border: var(--base-color-40);

	//* ==========================================================================
	//*     Pager
	--pager-bg-color: var(--base-color-40);
	--pager-border-style: 1px solid var(--pager-bg-color);
	--pager-border-radius: 5px;

	--pager-hover-bg: var(--accent-red);

	--pager-active-bg: var(--pager-bg-color);
	--pager-active-color: var(--base-white);

	--pager-disabled-bg: var(--base-color-40);
	--pager-disabled-color: var(--gray-dark);

	//* ==========================================================================
	//*     Form states
	--state-success-text: #3c763d;
	--state-success-bg: #dff0d8;
	--state-success-border: brightness(spin(var(--state-success-bg), -10), -5%);

	--state-info-text: #31708f;
	--state-info-bg: #d9edf7;
	--state-info-border: brightness(spin(var(--state-info-bg), -10), -7%);

	--state-warning-text: #8a6d3b;
	--state-warning-bg: #fcf8e3;
	--state-warning-border: brightness(spin(var(--state-warning-bg), -10), -5%);

	--state-danger-text: #a94442;
	--state-danger-bg: #f2dede;
	--state-danger-border: brightness(spin(var(--state-danger-bg), -10), -5%);

	//* ==========================================================================
	//*     Tooltips
	--tooltip-max-width: 200px;
	--tooltip-color: var(--base-white);
	--tooltip-bg: var(--base-black);
	--tooltip-opacity: 0.9;

	--tooltip-arrow-width: 5px;
	--tooltip-arrow-color: var(--tooltip-bg);

	//* ==========================================================================
	//*     Popovers
	--popover-bg: var(--base-white);
	--popover-max-width: 276px;
	--popover-border-color: hsl(0, 0%, 20%);
	--popover-fallback-border-color: #ccc;

	--popover-title-bg: calc(var(--popover-bg) * 3%);

	--popover-arrow-width: 10px;
	--popover-arrow-color: var(--popover-bg);

	--popover-arrow-outer-width: (var(--popover-arrow-width) + 1);
	--popover-arrow-outer-color: fadein(var(--popover-border-color), 5%);
	--popover-arrow-outer-fallback-color: calc(
		var(--popover-fallback-border-color) * 20%
	);

	//* ==========================================================================
	//*     Modals
	--modal-inner-padding: 15px;

	--modal-banner-background: var(--base-color-40);
	--modal-banner-body-color-text: var(--base-white);

	--modal-title-padding: 15px;
	--modal-title-line-height: var(--line-height-base);

	--modal-content-bg: var(--base-white);
	--modal-content-border-color: hsl(0, 0%, 20%);
	--modal-content-fallback-border-color: #999;

	--modal-backdrop-bg: var(--base-black);
	--modal-backdrop-opacity: 0.5;
	--modal-header-border-color: #e5e5e5;
	--modal-footer-border-color: var(--modal-header-border-color);

	--modal-width-sm: 400px;
	--modal-width-md: 600px;
	--modal-width-lg: 900px;

	//* ==========================================================================
	//*     Form Alerts
	--alert-padding: 15px;
	--alert-border-radius: var(--border-radius-base);
	--alert-link-font-weight: bold;

	--alert-success-bg: var(--state-success-bg);
	--alert-success-text: var(--state-success-text);
	--alert-success-border: var(--state-success-border);

	--alert-info-bg: var(--state-info-bg);
	--alert-info-text: var(--state-info-text);
	--alert-info-border: var(--state-info-border);

	--alert-warning-bg: var(--state-warning-bg);
	--alert-warning-text: var(--state-warning-text);
	--alert-warning-border: var(--state-warning-border);

	--alert-danger-bg: var(--state-danger-bg);
	--alert-danger-text: var(--state-danger-text);
	--alert-danger-border: var(--state-danger-border);

	//* ==========================================================================
	//*     Progress
	--progress-bg: #f5f5f5;
	--progress-bar-color: var(--base-white);
	--progress-border-radius: var(--border-radius-base);

	--progress-bar-bg: var(--brand-primary);
	--progress-bar-success-bg: var(--brand-success);
	--progress-bar-warning-bg: var(--brand-warning);
	--progress-bar-danger-bg: var(--brand-danger);
	--progress-bar-info-bg: var(--brand-info);

	//* ==========================================================================
	//*    Panels
	--panel-bg: var(--base-white);
	--panel-body-padding: 15px;
	--panel-heading-padding: 10px 15px;
	--panel-footer-padding: var(--panel-heading-padding);
	--panel-border-radius: var(--border-radius-base);

	--panel-inner-border: #ddd;
	--panel-footer-bg: #cccccc;

	--panel-default-text: var(--gray-dark);
	--panel-default-border: #ddd;
	--panel-default-heading-bg: #f5f5f5;

	--panel-primary-text: var(--base-white);
	--panel-primary-border: var(--brand-primary);
	--panel-primary-heading-bg: var(--brand-primary);

	--panel-success-text: var(--state-success-text);
	--panel-success-border: var(--state-success-border);
	--panel-success-heading-bg: var(--state-success-bg);

	--panel-info-text: var(--state-info-text);
	--panel-info-border: var(--state-info-border);
	--panel-info-heading-bg: var(--state-info-bg);

	--panel-warning-text: var(--state-warning-text);
	--panel-warning-border: var(--state-warning-border);
	--panel-warning-heading-bg: var(--state-warning-bg);

	--panel-danger-text: var(--state-danger-text);
	--panel-danger-border: var(--state-danger-border);
	--panel-danger-heading-bg: var(--state-danger-bg);

	--panel-button: calc(var(--base-color) * 25%); // Panel button
	--panel-tplt: calc(var(--base-color) * 05%); // Panel Top/Left Border
	--panel-rtbm: calc(var(--base-color) * 30%); // Right/Bottom Border

	//* ========================================================================== Thumbnails
	--thumbnail-padding: 4px;
	--thumbnail-bg: var(--body-color-background);
	--thumbnail-border: #ddd;
	--thumbnail-border-radius: var(--border-radius-base);

	--thumbnail-caption-color: var(--body-color-text);
	--thumbnail-caption-padding: 9px;

	//* ========================================================================== Wells
	--well-bg: #f5f5f5;
	--well-border: calc(var(--well-bg) * 7%);

	//* ========================================================================== Badges
	--badge-color: var(--base-white);
	--badge-link-hover-color: var(--base-white);
	--badge-bg: var(--gray-light);

	--badge-active-color: var(--link-color);
	--badge-active-bg: var(--base-white);

	--badge-font-weight: bold;
	--badge-line-height: 1;
	--badge-border-radius: 10px;

	//* ========================================================================== Breadcrumbs
	--breadcrumb-padding-vertical: 8px;
	--breadcrumb-padding-horizontal: 15px;
	--breadcrumb-bg: #f5f5f5;
	--breadcrumb-color: #ccc;
	--breadcrumb-active-color: var(--gray-light);
	--breadcrumb-separator: "/";

	//* ========================================================================== Carousel
	--carousel-text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);

	--carousel-control-color: var(--base-white);
	--carousel-control-width: 15%;
	--carousel-control-opacity: 0.5;
	--carousel-control-font-size: 20px;

	--carousel-indicator-active-bg: var(--base-white);
	--carousel-indicator-border-color: var(--base-white);

	--carousel-caption-color: var(--base-white);

	//* ========================================================================== Close
	--close-font-weight: bold;
	--close-color: var(--base-black);
	--close-text-shadow: 0 1px 0 var(--base-white);

	//* ========================================================================== Code
	--code-color: #c7254e;
	--code-bg: #f9f2f4;

	--kbd-color: var(--base-white);
	--kbd-bg: #333;

	--pre-bg: #f5f5f5;
	--pre-color: var(--gray-dark);
	--pre-border-color: #ccc;
	--pre-scrollable-max-height: 340px;

	//* ========================================================================== Type
	--component-offset-horizontal: 180px;
	--text-muted: var(--gray-light);
	--abbr-border-color: var(--gray-light);
	--headings-sm-color: var(--gray-light);
	--blockquote-sm-color: var(--gray-light);
	--blockquote-font-size: (var(--font-size-base) * 1.25);
	--blockquote-border-color: var(--gray-lighter);
	--dl-horizontal-offset: var(--component-offset-horizontal);
	--dl-horizontal-breakpoint: var(--grid-float-breakpoint);
	--hr-border: var(--gray-lighter);

	//* ========================================================================== Buttons
	--btn-color-primary: var(--base-color);

	--btn-active: var(--base-color-90);
	--btn-border: var(--base-color-50);
	--btn-current: var(--base-color-50);
	--btn-disabled: var(--base-color-90);
	--btn-empty: var(--base-color-70);
	--btn-focus: var(--base-color-40);
	--btn-paginate: var(--ltr-empty);
	--btn-text: var(--base-black);

	--btn-border-style: 1px solid var(--btn-border);

	--btn-font-weight: normal;

	--btn-default-color: var(--base-white);
	--btn-default-bg: var(--brand-accent);
	--btn-default-border: var(--btn-default-bg);

	--btn-primary-color: var(--base-white);
	--btn-primary-bg: var(--base-color-35);
	--btn-primary-border: var(--btn-primary-bg);

	--btn-success-color: var(--base-white);
	--btn-success-bg: var(--brand-success);
	--btn-success-border: var(--btn-success-bg);

	--btn-info-color: var(--base-white);
	--btn-info-bg: var(--brand-info);
	--btn-info-border: var(--btn-info-bg);

	--btn-warning-color: var(--base-white);
	--btn-warning-bg: var(--brand-warning);
	--btn-warning-border: var(--btn-warning-bg);

	--btn-danger-color: var(--base-white);
	--btn-danger-bg: var(--brand-danger);
	--btn-danger-border: var(--btn-danger-bg);

	--btn-link-disabled-color: var(--gray-light);

	// Allows for customizing button radius independently from global border radius
	--btn-border-radius-base: var(--border-radius-base);
	--btn-border-radius-lg: var(--border-radius-lg);
	--btn-border-radius-sm: var(--border-radius-sm);

	--ltr-active: var(--base-color-35);
	--ltr-empty: var(--brand-lite); //#A6C9AB;

	//* ========================================================================== Header Variables
	--header-color: inherit;
	--header-height: 142px;
	--header-line-height: 1.1;

	--header-font-family: var(--font-family-serif);
	--header-font-weight: 700;

	//* ========================================================================== Label Variables
	--label-default-bg: var(--gray-light);
	--label-primary-bg: var(--brand-primary);
	--label-success-bg: var(--brand-success);
	--label-info-bg: var(--brand-info);
	--label-warning-bg: var(--brand-warning);
	--label-danger-bg: var(--brand-danger);

	--label-color: var(--base-white);
	--label-link-hover-color: var(--base-white);

	//* ========================================================================== Form Input
	--input-bg: var(--base-white);
	--input-bg-disabled: var(--gray-lighter);

	--input-bg-color: var(--base-white);
	--input-bg-color-hover: var(--base-color-90);
	--input-bg-color-focus: var(--base-color-95);
	--input-bg-color-active: var(--base-color-95);
	--input-bg-color-placeholder: var(--accent-red);

	--input-border-style-1: 1px solid var(--base-color-40);
	--input-border-style-2: 2px solid var(--base-color-40);

	//* This has no effect on '<select>'s in some browsers, due to the limited stylability of '<select>'s in CSS.
	--input-border-radius: var(--border-radius-base);
	--input-border-radius-lg: var(--border-radius-lg);
	--input-border-radius-sm: var(--border-radius-sm);

	--input-border-focus: var(--brand-dark);

	--input-height: 26px;
	--input-height-base: (
		var(--line-height-computed) + (var(--padding-base-vertical) * 2) + 2
	);
	--input-height-lg: (
		ceil(
				var(--font-size-lg) * var(--line-height-lg) +
					(var(--padding-lg-vertical)) * 2
			) +
			2
	);
	--input-height-sm: (
		floor(
				var(--font-size-sm) * var(--line-height-sm) +
					(var(--padding-sm-vertical)) * 2
			) +
			2
	);

	--form-background-color: var(--base-color-90);
	--form-group-margin-bottom: 15px;
	--form-control-height: var(--input-height);

	--legend-color: var(--gray-dark);
	--legend-border-color: #e5e5e5;

	--input-group-addon-bg: var(--gray-lighter);
	--input-group-addon-border-color: var(--input-border);

	--input-cursor-disabled: not-allowed;

	//* ========================================================================== Pills
	--nav-pills-border-radius: var(--border-radius-base);
	--nav-pills-active-link-hover-bg: var(--component-active-bg);
	--nav-pills-active-link-hover-color: var(--component-active-color);

	//* ========================================================================== Table
	--table-width: 50%;
	--table-line-height: 28px;
	--table-font-size: 13px;

	--table-head-bg: var(--base-color-40);
	--table-button: var(--base-color-40);

	--table-rollover: var(--base-color-60);
	--table-rollodd: var(--table-rollover);
	--table-rolleven: var(--table-rollover);

	--table-rowodd: var(--base-color-90);
	--table-roweven: var(--base-color-75);

	--table-sortodd: var(--base-color-83);
	--table-sorteven: var(--base-color-68);

	--table-cell-padding: 8px;
	--table-condensed-cell-padding: 5px;

	--table-bg: transparent;
	--table-bg-accent: #f9f9f9;
	--table-bg-hover: #f5f5f5;
	--table-bg-active: var(--table-bg-hover);

	--table-border-color: #ddd;
	--table-row-selected: var(--base-color-55);

	//*  <<<<<============================================================================ Tabs
	--tab-default-body-color: var(--form-background-color);
	--tab-default-text-color: var(--base-black);
	--tab-default-border-color: var(--brand-dark);

	--tab-active-body-color: var(--brand-dark); //var(--form-background-color);
	--tab-active-text-color: var(--base-white); //var(--brand-dark);
	--tab-active-border-color: var(--brand-dark);

	--tab-hover-body-color: var(--accent-red);
	--tab-hover-text-color: var(--base-white);
	--tab-hover-border-color: var(--accent-red);

	--tab-border-top: #464336;
	--tab-border_bottom: #efede7;

	--tab-color-background: #d6d3c2;

	//*	========================================================================== Base Colors
	--base-color-30: hsl(var(--base-hue), var(--base-sat), 30%);
	--base-color-31: hsl(var(--base-hue), var(--base-sat), 31%);
	--base-color-32: hsl(var(--base-hue), var(--base-sat), 32%);
	--base-color-33: hsl(var(--base-hue), var(--base-sat), 33%);
	--base-color-34: hsl(var(--base-hue), var(--base-sat), 34%);
	--base-color-35: hsl(var(--base-hue), var(--base-sat), 35%);
	--base-color-36: hsl(var(--base-hue), var(--base-sat), 36%);
	--base-color-37: hsl(var(--base-hue), var(--base-sat), 37%);
	--base-color-38: hsl(var(--base-hue), var(--base-sat), 38%);
	--base-color-39: hsl(var(--base-hue), var(--base-sat), 39%);

	--base-color-40: hsl(var(--base-hue), var(--base-sat), 40%);
	--base-color-41: hsl(var(--base-hue), var(--base-sat), 41%);
	--base-color-42: hsl(var(--base-hue), var(--base-sat), 42%);
	--base-color-43: hsl(var(--base-hue), var(--base-sat), 43%);
	--base-color-44: hsl(var(--base-hue), var(--base-sat), 44%);
	--base-color-45: hsl(var(--base-hue), var(--base-sat), 45%);
	--base-color-46: hsl(var(--base-hue), var(--base-sat), 46%);
	--base-color-47: hsl(var(--base-hue), var(--base-sat), 47%);
	--base-color-48: hsl(var(--base-hue), var(--base-sat), 48%);
	--base-color-49: hsl(var(--base-hue), var(--base-sat), 49%);

	--base-color-50: hsl(var(--base-hue), var(--base-sat), 50%);
	--base-color-51: hsl(var(--base-hue), var(--base-sat), 51%);
	--base-color-52: hsl(var(--base-hue), var(--base-sat), 52%);
	--base-color-53: hsl(var(--base-hue), var(--base-sat), 53%);
	--base-color-54: hsl(var(--base-hue), var(--base-sat), 54%);
	--base-color-55: hsl(var(--base-hue), var(--base-sat), 55%);
	--base-color-56: hsl(var(--base-hue), var(--base-sat), 56%);
	--base-color-57: hsl(var(--base-hue), var(--base-sat), 57%);
	--base-color-58: hsl(var(--base-hue), var(--base-sat), 58%);
	--base-color-59: hsl(var(--base-hue), var(--base-sat), 59%);

	--base-color-60: hsl(var(--base-hue), var(--base-sat), 60%);
	--base-color-61: hsl(var(--base-hue), var(--base-sat), 61%);
	--base-color-62: hsl(var(--base-hue), var(--base-sat), 62%);
	--base-color-63: hsl(var(--base-hue), var(--base-sat), 63%);
	--base-color-64: hsl(var(--base-hue), var(--base-sat), 64%);
	--base-color-65: hsl(var(--base-hue), var(--base-sat), 65%);
	--base-color-66: hsl(var(--base-hue), var(--base-sat), 66%);
	--base-color-67: hsl(var(--base-hue), var(--base-sat), 67%);
	--base-color-68: hsl(var(--base-hue), var(--base-sat), 68%);
	--base-color-69: hsl(var(--base-hue), var(--base-sat), 69%);

	--base-color-70: hsl(var(--base-hue), var(--base-sat), 70%);
	--base-color-71: hsl(var(--base-hue), var(--base-sat), 71%);
	--base-color-72: hsl(var(--base-hue), var(--base-sat), 72%);
	--base-color-73: hsl(var(--base-hue), var(--base-sat), 73%);
	--base-color-74: hsl(var(--base-hue), var(--base-sat), 74%);
	--base-color-75: hsl(var(--base-hue), var(--base-sat), 75%);
	--base-color-76: hsl(var(--base-hue), var(--base-sat), 76%);
	--base-color-77: hsl(var(--base-hue), var(--base-sat), 77%);
	--base-color-78: hsl(var(--base-hue), var(--base-sat), 78%);
	--base-color-79: hsl(var(--base-hue), var(--base-sat), 79%);

	--base-color-80: hsl(var(--base-hue), var(--base-sat), 80%);
	--base-color-81: hsl(var(--base-hue), var(--base-sat), 81%);
	--base-color-82: hsl(var(--base-hue), var(--base-sat), 82%);
	--base-color-83: hsl(var(--base-hue), var(--base-sat), 83%);
	--base-color-84: hsl(var(--base-hue), var(--base-sat), 84%);
	--base-color-85: hsl(var(--base-hue), var(--base-sat), 85%);
	--base-color-86: hsl(var(--base-hue), var(--base-sat), 86%);
	--base-color-87: hsl(var(--base-hue), var(--base-sat), 87%);
	--base-color-88: hsl(var(--base-hue), var(--base-sat), 88%);
	--base-color-89: hsl(var(--base-hue), var(--base-sat), 89%);

	--base-color-90: hsl(var(--base-hue), var(--base-sat), 90%);
	--base-color-91: hsl(var(--base-hue), var(--base-sat), 91%);
	--base-color-92: hsl(var(--base-hue), var(--base-sat), 92%);
	--base-color-93: hsl(var(--base-hue), var(--base-sat), 93%);
	--base-color-94: hsl(var(--base-hue), var(--base-sat), 94%);
	--base-color-95: hsl(var(--base-hue), var(--base-sat), 95%);
	--base-color-96: hsl(var(--base-hue), var(--base-sat), 96%);
	--base-color-97: hsl(var(--base-hue), var(--base-sat), 97%);
	--base-color-98: hsl(var(--base-hue), var(--base-sat), 98%);
	--base-color-99: hsl(var(--base-hue), var(--base-sat), 99%);

	--base-color-100: hsl(var(--base-hue), var(--base-sat), 100%);
}