/** @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%);
}
