/**
 * Default_std
 **/

:root {
    /* DEVICE WIDTHS =========== */
    --oldMobile: 425px;
    --mobile: 720px;
    --tablet: 1024px;
    --logoFactor: 1.0;
    --hd_TransitionWidth: 55px;
    --hd_menuWidthShim: 1px; /* Increase this to narrow the width of the mobile devices vertical dropdown menu */
    --hdMenuMinWidth: 155px;
    --navManuLeftPadding: 20px;
    /* COLOURS =========== */
    --menuBackground: var(--white);
    --navButtonBackground: var(--white);

    --trans: transparent;
    /* Menu dimensions */
    --main-menu-height: 75px;
    --main-menu-ratio: 1.0; /* calc(var(--main-menu-height) / 100.0);       */
    --popup-caption-height: 56px; /* calc(var(--main-menu-ratio) * 56);     */
    --progress-bar-height: 9px;
    /* spacer between nav-menu icons */
    --navMarginLeft: 85px;
    --size32px: 24px; /* calc(var(--main-menu-ratio) * 24);     */
    --size28px: 20px; /* calc(var(--main-menu-ratio) * 24);     */
    --size20px: 15px; /* calc(var(--main-menu-ratio) * 15);     */
    --size18px: 13px; /* calc(var(--main-menu-ratio) * 18);     */
    --size16px: 12px; /* calc(var(--main-menu-ratio) * 12);     */
    --size15px: 11px; /* calc(var(--main-menu-ratio) * 11.25)   */
    --size14px: 10px; /* calc(var(--main-menu-ratio) * 10.5);   */
    --size12px: 9px; /* calc(var(--main-menu-ratio) * 9);      */
    --size11px: 8px; /* calc(var(--main-menu-ratio) * 8.25);   */
    --size10px: 7px; /* calc(var(--main-menu-ratio) * 7.5);    */
    --size9px: 6px; /* calc(var(--main-menu-ratio) * 6.75);   */
    --size2em: 1.5em; /* calc(var(--main-menu-ratio) * 1.5em);  */
    /* Form Controls and layout */
    --form-background: #f0f0f0;
    --formControl-minWidth: 240px;
    --formTitle-fontSize: 16px;
    --formLabel-fontSize: 16px;
    --formInput-fontSize: 16px;
    --formText-style: italic;
    --formGroup-rightPadding: 5px;
    --formGroup-leftPadding: 5px;
    --formRow-topMargin: 0;
    --formGroup-topMargin: 1px;
    --formGroup-bottomMargin: 1px;
    --formString-width: 475px;
    --formText-width: 100%;
    /* Used as overrides on grids etc*/
    --white: #fff;
    --black: #000;
    --grey: #979797;
    --dark-grey: #4a4a4a;
    --light-grey: #E0E0E0;
    --mid-grey: #888;
    --pale-grey: #fafafa;
    --button-text: #fbf8f8;
    --disabledItem: #ccc;
    --pale-green: #f4fff4;
    /* body area foreground and background */

    --pageBackground: #F8F8F8;
    /* form area foreground and background */
    --formForeground: var(--primary);
    --formBackground: var(--form-background);
    /* Traffic light colours used for: OOPS! / warning / OK */
    --red-light: #ff0000; /*  Problem  */
    --orange-light: #ff7d00; /*  Warning  */
    --green-light: #0c8f00; /*  All good */
    /* Default font */
    --themeFontFamily: Montserrat, "Open Sans", Helvetica, Arial, sans-serif;
    --themeFontMonoSpaced: "Lucida Console", Monaco, "Courier New", monospace;
    /* Theme underline/separator */
    --themeSeparator: solid 1px var(--primary);
    --themeSeparator-secondary: solid 1px var(--dark-grey);
    /* Sundry metrics */
    --smallRadius: 3px;
    --mediumRadius: 5px;
    --largeRadius: 7px;
    --toolBoxWidth: 97px; /*calc(var(--main-menu-ratio) * 97.5)*/

    --defaultVerticalSpacing: 7px;
    --defaultHorizontalSpacing: 9px;
    /* Font sizes by name */
    --size7X: 72px; /* Humungous */
    --size6X: 64px; /* massive */
    --size5X: 56px; /* quintuple xtra-large */
    --size4X: 42px; /* quadruple xtra-large */
    --size3X: 34px; /* treble xtra-large */
    --size2X: 28px; /* double xtra-large */
    --sizeXL: 24px; /* xtra-large */
    --sizeLG: 18px; /* large */
    --sizeML: 17px; /* medium-large */
    --sizeMP: 16px; /* medium plus */
    --sizeMD: 15px; /* medium */
    --sizeNP: 14px; /* normal plus */
    --sizeNM: 13px; /* normal*/
    --sizeSM: 12px; /* small */
    --sizeXS: 11px; /* xtra-small */
    --sizeTN: 9px; /* tiny */
    --margin7X: 72px; /* Humungous */
    --margin6X: 64px; /* massive */
    --margin5X: 56px; /* quintuple xtra-large */
    --margin4X: 42px; /* quadruple xtra-large */
    --margin3X: 34px; /* treble xtra-large */
    --margin2X: 28px; /* double xtra-large */
    --marginXL: 24px; /* xtra-large */
    --marginLG: 18px; /* large */
    --marginML: 16px; /* medium-large */
    --marginMP: 15px; /* medium plus */
    --marginMD: 14px; /* medium */
    --marginNP: 13px; /* normal plus */
    --marginNM: 12px; /* normal*/
    --marginSM: 11px; /* small */
    --marginXS: 10px; /* xtra-small */
    --marginTN: 8px; /* tiny */
    /*--size7X: calc(1 + (var(--main-menu-ratio) * 72));*/ /* Humungous */
    /*--size6X: calc(1 + (var(--main-menu-ratio) * 64));*/ /* massive */
    /*--size5X: calc(1 + (var(--main-menu-ratio) * 56));*/ /* quintuple xtra-large */
    /*--size4X: calc(1 + (var(--main-menu-ratio) * 42));*/ /* quadruple xtra-large */
    /*--size3X: calc(1 + (var(--main-menu-ratio) * 34));*/ /* treble xtra-large */
    /*--size2X: calc(1 + (var(--main-menu-ratio) * 28));*/ /* double xtra-large */
    /*--sizeXL: calc(1 + (var(--main-menu-ratio) * 24));*/ /* xtra-large */
    /*--sizeLG: calc(1 + (var(--main-menu-ratio) * 18));*/ /* large */
    /*--sizeML: calc(1 + (var(--main-menu-ratio) * 16));*/ /* medium-large */
    /*--sizeMP: calc(1 + (var(--main-menu-ratio) * 15));*/ /* medium plus */
    /*--sizeMD: calc(1 + (var(--main-menu-ratio) * 14));*/ /* medium */
    /*--sizeNP: calc(1 + (var(--main-menu-ratio) * 13));*/ /* normal plus */
    /*--sizeNM: calc(1 + (var(--main-menu-ratio) * 12));*/ /* normal*/
    /*--sizeSM: calc(1 + (var(--main-menu-ratio) * 11));*/ /* small */
    /*--sizeXS: calc(1 + (var(--main-menu-ratio) * 10));*/ /* xtra-small */
    /*--sizeTN: calc(1 + (var(--main-menu-ratio) * 9));*/ /* tiny */
    /* Sundry control dimensions */
    --tallCtrlHeight: 37px; /* calc(var(--main-menu-ratio) * 37.5);         */
    --normalCtrlHeight: 31px; /* calc(1 + (var(--main-menu-ratio) * 26.25));  */
    --compactCtrlHeight: 23px; /* calc(var(--main-menu-ratio) * 15);           */
    --shallowCtrlHeight: 15px; /* calc(var(--main-menu-ratio) * 15);           */
    --maxSize: 100%;
    --w350: 467px; /* calc(var(--main-menu-ratio) * 467);          */
    --w325: 244px; /* calc(var(--main-menu-ratio) * 244);          */
    --w300: 225px; /* calc(var(--main-menu-ratio) * 225);          */
    --w275: 206px; /* calc(var(--main-menu-ratio) * 206);          */
    --w250: 188px; /* calc(var(--main-menu-ratio) * 187.5);        */
    --w225: 165px; /* calc(var(--main-menu-ratio) * 165);          */
    --w200: 150px; /* calc(var(--main-menu-ratio) * 150);          */
    --w175: 132px; /* calc(var(--main-menu-ratio) * 132);          */
    --w150: 113px; /* calc(var(--main-menu-ratio) * 112.5);        */
    --verticalMenuButtonWidth: 250px;
    --wideCtrlWidth: 110px; /* calc(var(--main-menu-ratio) * 108.75);       */
    --widerCtrlWidth: 94px; /* calc(var(--main-menu-ratio) * 93.75);        */
    --extraCtrlWidth: 86px; /* calc(var(--main-menu-ratio) * 86.25);        */
    --normalCtrlWidth: 79px; /* calc(var(--main-menu-ratio) * 78.75);        */
    --slimCtrlWidth: 56px; /* calc(var(--main-menu-ratio) * 56.25);        */
    --compactCtrlWidth: 44px; /* calc(var(--main-menu-ratio) * 37.5);         */
    --narrowCtrlWidth: 38px; /* calc(var(--main-menu-ratio) * 37.5);         */
    --tinyCtrlWidth: 27px; /* calc(var(--main-menu-ratio) * 26.25);        */
    /* Help Drawer Stuff - Theme agnostic settings */
    --helpDrawer-width: 650px;
    --helpDrawer-height: 760px;
    --helpDrawer-padding: 9px;
    --helpDrawer-colour: var(--dark-grey);
    --helpDrawer-borderColour: var(--dark-grey);
    --helpDrawer-backgroundColour: var(--white);
    --helpDrawer-headingColour: var(--white);
    --helpDrawer-headingBackgroundColour: var(--dark-grey);
    --helpDrawer-subHeadingColour: var(--black);
    --helpDrawer-subHeadingBackgroundColour: var(--light-grey);
    --helpDrawer-headingsVerticalSpacing: 7px;
    --helpDrawer-treeViewLeftRightMargin: 15px;
    /* dialog box size */
    --popup-padding: 8px;
    --request-popup-X: 768px; /*calc(var(--main-menu-ratio) * 768);*/
    --request-popup-Y: 540px; /*calc(var(--main-menu-ratio) * 540);*/
    /* table-builder - foreground / background etc */
    --tbHeaderColour: var(--dark-grey);
    --tbHeaderBackground: var(--pale-grey);
    --tbMinStringWidth: 176px; /* calc(var(--main-menu-ratio) * 176.25);   */
    --tbIntegerWidth: 75px; /* calc(var(--main-menu-ratio) * 75);       */
    --tbNumericWidth: 90px; /* calc(var(--main-menu-ratio) * 90);       */
    --tbDateWidth: 98px; /* calc(var(--main-menu-ratio) * 97.5);     */
    --tbRowLabelWidth: 131px; /* calc(var(--main-menu-ratio) * 131.25);   */
    --tbCellSpacing: 3px; /* calc(1 + (var(--main-menu-ratio) * 2.25));   */
    --tbFontSize: var(--sizeML);
    --tbIconSize: var(--sizeLG);
    --tbNumericFontSize: var(--sizeNP);
    --tbCellBorderRadius: 4px; /* calc(var(--main-menu-ratio) * 3.75);     */
    --tbIconSpacing: 4px; /* calc(var(--main-menu-ratio) * 3.75);     */ /* Horizontal margin for function icons - sets the gap between */
}

/* 
 * Bootstrap scheme overrides {
*/
.breadcrumb {
	background-color: var(--form-background);
}
.breadcrumb-item, .breadcrumb-item.active {
	color: var(--pageForeground);
}
.card {
    background-color: var(--white);
    border-color: var(--light-grey);
}
.card.midBorder {
    border-color: rgba(0, 0, 0, 0.25);
}
.text-muted {
    color: var(--pageForeground) !important;
}
.text-success {
    color: #119d31 !important;
}
.badge-primary {
    background-color: #006ee5;
}
.badge-success {
    background-color: #119d31;
}
.badge-info {
    background-color: #028da3;
}
.btn-outline-secondary {
    color: var(--pageForeground);
    border-color: var(--pageForeground);
}
.btn-outline-danger {
    background: var(--white);
}
.form-control:disabled, .form-control[readonly] {
    background-color: var(--formBackground);
    opacity: 1;
}
/* 
 * Bootstrap scheme overrides }
*/

/* 
 * Popper.JS scheme overrides {
*/

.tooltip .tooltip-inner {
    color: var(--white);
    background-color: var(--dark-grey);
}
.tooltip.bs-tooltip-top .arrow::before {
    border-top-color: var(--dark-grey);
}
.tooltip.bs-tooltip-right .arrow::before {
    border-right-color: var(--dark-grey);
}
.tooltip.bs-tooltip-bottom .arrow::before {
    border-bottom-color: var(--dark-grey);
}
.tooltip.bs-tooltip-left .arrow::before {
    border-left-color: var(--dark-grey);
}

.onTop {
    /* Keep the nav menus and dropdowns on top of other controls */
    z-index: 9999999;
}