:root {
    --ct-red-900: #961717;
    --ct-red-800: #A92323;
    --ct-red-700: #D32F2F;
    --ct-red-600: #E53935;
    --ct-red-500: #F44336;
    --ct-red-400: #EF5350;
    --ct-red-300: #E57373;
    --ct-red-200: #EF9A9A;
    --ct-red-100: #FFCDD2;
    --ct-red-50: #FFEBEE;
    --ct-red-A100: #FF8A80;
    --ct-red-A200: #FF5252;
    --ct-red-A400: #FF1744;
    --ct-red-A700: #D50000;
    --ct-pink-900: #880E4F;
    --ct-pink-800: #A91454;
    --ct-pink-700: #C2185B;
    --ct-pink-600: #D81B60;
    --ct-pink-500: #E91E63;
    --ct-pink-400: #EC407A;
    --ct-pink-300: #F06292;
    --ct-pink-200: #F48FB1;
    --ct-pink-100: #F8BBD0;
    --ct-pink-50: #FCE4EC;
    --ct-pink-A100: #FF80AB;
    --ct-pink-A200: #FF4081;
    --ct-pink-A400: #F50057;
    --ct-pink-A700: #C51162;
    --ct-purple-900: #4A148C;
    --ct-purple-800: #6A1B9A;
    --ct-purple-700: #7B1FA2;
    --ct-purple-600: #8E24AA;
    --ct-purple-500: #9C27B0;
    --ct-purple-400: #AB47BC;
    --ct-purple-300: #BA68C8;
    --ct-purple-200: #CE93D8;
    --ct-purple-100: #E1BEE7;
    --ct-purple-50: #F3E5F5;
    --ct-purple-A100: #EA80FC;
    --ct-purple-A200: #E040FB;
    --ct-purple-A400: #D500F9;
    --ct-purple-A700: #AA00FF;
    --ct-deep-purple-900: #311B92;
    --ct-deep-purple-800: #4527A0;
    --ct-deep-purple-700: #512DA8;
    --ct-deep-purple-600: #5E35B1;
    --ct-deep-purple-500: #673AB7;
    --ct-deep-purple-400: #7E57C2;
    --ct-deep-purple-300: #9575CD;
    --ct-deep-purple-200: #B39DDB;
    --ct-deep-purple-100: #D1C4E9;
    --ct-deep-purple-50: #EDE7F6;
    --ct-deep-purple-A100: #B388FF;
    --ct-deep-purple-A200: #7C4DFF;
    --ct-deep-purple-A400: #651FFF;
    --ct-deep-purple-A700: #6200EA;
    --ct-blue-900: #0B3D89;
    --ct-blue-800: #1257A5;
    --ct-blue-700: #1976D2;
    --ct-blue-600: #1E88E5;
    --ct-blue-500: #2196F3;
    --ct-blue-400: #42A5F5;
    --ct-blue-300: #64B5F6;
    --ct-blue-200: #90CAF9;
    --ct-blue-100: #BBDEFB;
    --ct-blue-50: #E3F2FD;
    --ct-blue-A100: #82B1FF;
    --ct-blue-A200: #448AFF;
    --ct-blue-A400: #2979FF;
    --ct-blue-A700: #2962FF;
    --ct-light-blue-900: #01518E;
    --ct-light-blue-800: #025D92;
    --ct-light-blue-700: #0288D1;
    --ct-light-blue-600: #039BE5;
    --ct-light-blue-500: #03A9F4;
    --ct-light-blue-400: #29B6F6;
    --ct-light-blue-300: #4FC3F7;
    --ct-light-blue-200: #81D4FA;
    --ct-light-blue-100: #B3E5FC;
    --ct-light-blue-50: #E1F5FE;
    --ct-light-blue-A100: #80D8FF;
    --ct-light-blue-A200: #40C4FF;
    --ct-light-blue-A400: #00B0FF;
    --ct-light-blue-A700: #0091EA;
    --ct-cyan-900: #004F52;
    --ct-cyan-800: #006064;
    --ct-cyan-700: #0097A7;
    --ct-cyan-600: #00ACC1;
    --ct-cyan-500: #00BCD4;
    --ct-cyan-400: #26C6DA;
    --ct-cyan-300: #4DD0E1;
    --ct-cyan-200: #80DEEA;
    --ct-cyan-100: #B2EBF2;
    --ct-cyan-50: #E0F7FA;
    --ct-cyan-A100: #84FFFF;
    --ct-cyan-A200: #18FFFF;
    --ct-cyan-A400: #00E5FF;
    --ct-cyan-A700: #00B8D4;
    --ct-teal-900: #004D40;
    --ct-teal-800: #005C51;
    --ct-teal-700: #00796B;
    --ct-teal-600: #00897B;
    --ct-teal-500: #009688;
    --ct-teal-400: #26A69A;
    --ct-teal-300: #4DB6AC;
    --ct-teal-200: #80CBC4;
    --ct-teal-100: #B2DFDB;
    --ct-teal-50: #E0F2F1;
    --ct-teal-A100: #A7FFEB;
    --ct-teal-A200: #64FFDA;
    --ct-teal-A400: #1DE9B6;
    --ct-teal-A700: #00BFA5;
    --ct-green-900: #184E1B;
    --ct-green-800: #266429;
    --ct-green-700: #388E3C;
    --ct-green-600: #43A047;
    --ct-green-500: #4CAF50;
    --ct-green-400: #66BB6A;
    --ct-green-300: #81C784;
    --ct-green-200: #A5D6A7;
    --ct-green-100: #C8E6C9;
    --ct-green-50: #E8F5E9;
    --ct-green-A100: #B9F6CA;
    --ct-green-A200: #69F0AE;
    --ct-green-A400: #00E676;
    --ct-green-A700: #00C853;
    --ct-light-green-900: #285418;
    --ct-light-green-800: #3D6222;
    --ct-light-green-700: #689F38;
    --ct-light-green-600: #7CB342;
    --ct-light-green-500: #8BC34A;
    --ct-light-green-400: #9CCC65;
    --ct-light-green-300: #AED581;
    --ct-light-green-200: #C5E1A5;
    --ct-light-green-100: #DCEDC8;
    --ct-light-green-50: #F1F8E9;
    --ct-light-green-A100: #CCFF90;
    --ct-light-green-A200: #B2FF59;
    --ct-light-green-A400: #76FF03;
    --ct-light-green-A700: #64DD17;
    --ct-lime-900: #827717;
    --ct-lime-800: #9E9D24;
    --ct-lime-700: #AFB42B;
    --ct-lime-600: #C0CA33;
    --ct-lime-500: #CDDC39;
    --ct-lime-400: #D4E157;
    --ct-lime-300: #DCE775;
    --ct-lime-200: #E6EE9C;
    --ct-lime-100: #F0F4C3;
    --ct-lime-50: #F9FBE7;
    --ct-lime-A100: #F4FF81;
    --ct-lime-A200: #EEFF41;
    --ct-lime-A400: #C6FF00;
    --ct-lime-A700: #AEEA00;
    --ct-yellow-900: #F57F17;
    --ct-yellow-800: #F9A825;
    --ct-yellow-700: #FBC02D;
    --ct-yellow-600: #FDD835;
    --ct-yellow-500: #FFEB3B;
    --ct-yellow-400: #FFEE58;
    --ct-yellow-300: #FFF176;
    --ct-yellow-200: #FFF59D;
    --ct-yellow-100: #FFF9C4;
    --ct-yellow-50: #FFFDE7;
    --ct-yellow-A100: #FFFF8D;
    --ct-yellow-A200: #FFFF00;
    --ct-yellow-A400: #FFEA00;
    --ct-yellow-A700: #FFD600;
    --ct-amber-900: #FF6F00;
    --ct-amber-800: #FF8F00;
    --ct-amber-700: #FFA000;
    --ct-amber-600: #FFB300;
    --ct-amber-500: #FFC107;
    --ct-amber-400: #FFCA28;
    --ct-amber-300: #FFD54F;
    --ct-amber-200: #FFE082;
    --ct-amber-100: #FFECB3;
    --ct-amber-50: #FFF8E1;
    --ct-amber-A100: #FFE57F;
    --ct-amber-A200: #FFD740;
    --ct-amber-A400: #FFC400;
    --ct-amber-A700: #FFAB00;
    --ct-orange-900: #E65100;
    --ct-orange-800: #EF6C00;
    --ct-orange-700: #F57C00;
    --ct-orange-600: #FB8C00;
    --ct-orange-500: #FF9800;
    --ct-orange-400: #FFA726;
    --ct-orange-300: #FFB74D;
    --ct-orange-200: #FFCC80;
    --ct-orange-100: #FFE0B2;
    --ct-orange-50: #FFF3E0;
    --ct-orange-A100: #FFD180;
    --ct-orange-A200: #FFAB40;
    --ct-orange-A400: #FF9100;
    --ct-orange-A700: #FF6D00;
    --ct-deep-orange-900: #892406;
    --ct-deep-orange-800: #A23210;
    --ct-deep-orange-700: #E64A19;
    --ct-deep-orange-600: #F4511E;
    --ct-deep-orange-500: #FF5722;
    --ct-deep-orange-400: #FF7043;
    --ct-deep-orange-300: #FF8A65;
    --ct-deep-orange-200: #FFAB91;
    --ct-deep-orange-100: #FFCCBC;
    --ct-deep-orange-50: #FBE9E7;
    --ct-deep-orange-A100: #FF9E80;
    --ct-deep-orange-A200: #FF6E40;
    --ct-deep-orange-A400: #FF3D00;
    --ct-deep-orange-A700: #DD2C00;
    --ct-brown-900: #3E2723;
    --ct-brown-800: #4E342E;
    --ct-brown-700: #5D4037;
    --ct-brown-600: #6D4C41;
    --ct-brown-500: #795548;
    --ct-brown-400: #8D6E63;
    --ct-brown-300: #A1887F;
    --ct-brown-200: #BCAAA4;
    --ct-brown-100: #D7CCC8;
    --ct-brown-50: #EFEBE9;
    --ct-gray-900: #212121;
    --ct-gray-800: #424242;
    --ct-gray-700: #616161;
    --ct-gray-600: #757575;
    --ct-gray-500: #9E9E9E;
    --ct-gray-400: #BDBDBD;
    --ct-gray-300: #E0E0E0;
    --ct-gray-200: #EEEEEE;
    --ct-gray-100: #F5F5F5;
    --ct-gray-50: #FAFAFA;
    --ct-blue-gray-900: #263238;
    --ct-blue-gray-800: #37474F;
    --ct-blue-gray-700: #455A64;
    --ct-blue-gray-600: #546E7A;
    --ct-blue-gray-500: #607D8B;
    --ct-blue-gray-400: #78909C;
    --ct-blue-gray-300: #90A4AE;
    --ct-blue-gray-200: #B0BEC5;
    --ct-blue-gray-100: #CFD8DC;
    --ct-blue-gray-50: #ECEFF1;
    --ct-on-surface-bg: #000;
    --ct-body-bg: #EEEEEE;
    --ct-surface-bg: rgba(255,255,255,1.0);
    --ct-surface-bg-ev1: rgba(0,0,0,0.05);
    --ct-surface-bg-ev2: rgba(0,0,0,0.07);
    --ct-surface-bg-ev3: rgba(0,0,0,0.08);
    --ct-surface-bg-ev4: rgba(0,0,0,0.09);
    --ct-surface-bg-ev5: rgba(0,0,0,0.11);
    --ct-surface-bg-dark: #121212;
    --ct-surface-bg-ev1-dark: rgba(255,255,255,0.05);
    --ct-surface-bg-ev2-dark: rgba(255,255,255,0.07);
    --ct-surface-bg-ev3-dark: rgba(255,255,255,0.08);
    --ct-surface-bg-ev4-dark: rgba(255,255,255,0.09);
    --ct-surface-bg-ev5-dark: rgba(255,255,255,0.11);
    --ct-surface-grey-1: #FAFAFA;
    --ct-surface-grey-2: #F5F5F5;
    --ct-surface-grey-3: #EEEEEE;
    --ct-surface-grey-4: #E0E0E0;
    --ct-surface-grey-5: #BDBDBD;
    --ct-surface-grey-6: #9E9E9E;
    --ct-surface-grey-1-dark: #212121;
    --ct-surface-grey-2-dark: #424242;
    --ct-surface-grey-3-dark: #616161;
    --ct-surface-grey-4-dark: #757575;
    --ct-surface-grey-5-dark: #9E9E9E;
    --ct-input-bg: #FFFFFF;
    --ct-on-input-bg: #000000;
    --ct-dm-warning-text: #ffda6a;
    --ct-dm-warning-bg: #332701;
    --ct-dm-warning-border: #997404;
    --ct-dm-info-text: #6edff6;
    --ct-dm-info-bg: #032830;
    --ct-dm-info-border: #087990;
    --ct-dm-success-text: #75b798;
    --ct-dm-success-bg: #051b11;
    --ct-dm-success-border: #0f5132;
    --ct-dm-danger-text: #ea868f;
    --ct-dm-danger-bg: #2c0b0e;
    --ct-dm-danger-border: #842029;
    /* Default Pink Theme */
    /*    --ct-primary-theme-colour: #E91E63;
    --ct-on-primary-theme-colour: #FFFFFF;
    --ct-primary-dark-theme-colour: #880E4F;
    --ct-on-primary-dark-theme-colour: #FFFFFF;
    --ct-primary-light-theme-colour: #FCE4EC;
    --ct-on-primary-light-theme-colour: #880E4F;
    --ct-secondary-theme-colour: #E91E63;
    --ct-on-secondary-theme-colour: #FFFFFF;
    --ct-secondary-dark-theme-colour: #880E4F;
    --ct-on-secondary-dark-theme-colour: #FFFFFF;
    --ct-secondary-light-theme-colour: #FCE4EC;
    --ct-on-secondary-light-theme-colour: #880E4F;
    --font: 'Roboto';
    --ct-loader-alt-bg: rgba(233, 30, 99, 0.2);
    --ct-loader-bg: rgba(233, 30, 99, 1);*/

    --ct-primary-theme-colour: #006aa1;
    --ct-on-primary-theme-colour: #FFFFFF;
    --ct-primary-dark-theme-colour: #004c73;
    --ct-on-primary-dark-theme-colour: #FFFFFF;
    --ct-primary-light-theme-colour: #e6f5fd;
    --ct-on-primary-light-theme-colour: #004c73;
    --ct-secondary-theme-colour: #006aa1;
    --ct-on-secondary-theme-colour: #FFFFFF;
    --ct-secondary-dark-theme-colour: #004c73;
    --ct-on-secondary-dark-theme-colour: #FFFFFF;
    --ct-secondary-light-theme-colour: #e6f5fd;
    --ct-on-secondary-light-theme-colour: #004c73;
    --font: 'Roboto';
    --ct-loader-bg: #004c7390;
    --ct-loader-alt-bg: #004c7320;
}


.dark:root {
    --ct-on-surface-bg: #FFFFFF;
    --ct-body-bg: #040404;
    --ct-surface-bg: #121212;
    --ct-surface-bg-ev1: rgba(255,255,255,0.05);
    --ct-surface-bg-ev2: rgba(255,255,255,0.07);
    --ct-surface-bg-ev3: rgba(255,255,255,0.08);
    --ct-surface-bg-ev4: rgba(255,255,255,0.09);
    --ct-surface-bg-ev5: rgba(255,255,255,0.11);
    --ct-surface-grey-1: #212121;
    --ct-surface-grey-2: #424242;
    --ct-surface-grey-3: #616161;
    --ct-surface-grey-4: #757575;
    --ct-surface-grey-5: #9E9E9E;
    --ct-surface-grey-6: #9E9E9E;
    --ct-input-bg: #000000;
    --ct-on-input-bg: #FFFFFF;
}

/*#region fonts*/
/* roboto-300 - latin */
@font-face {
    font-display: swap;
    font-family: 'Roboto18';
    font-style: normal;
    font-weight: 300;
    src: url('../font/roboto-v18/roboto-v18-latin-300.woff2') format('woff2');
}
/* roboto-regular - latin */
@font-face {
    font-display: swap;
    font-family: 'Roboto18';
    font-style: normal;
    font-weight: 400;
    src: url('../font/roboto-v18/roboto-v18-latin-regular.woff2') format('woff2');
}
/* roboto-500 - latin */
@font-face {
    font-display: swap;
    font-family: 'Roboto18';
    font-style: normal;
    font-weight: 500;
    src: url('../font/roboto-v18/roboto-v18-latin-500.woff2') format('woff2');
}
/* roboto-700 - latin */
@font-face {
    font-display: swap;
    font-family: 'Roboto18';
    font-style: normal;
    font-weight: 700;
    src: url('../font/roboto-v18/roboto-v18-latin-700.woff2') format('woff2');
}
/* OpenDyslexic-Bold */
@font-face {
    font-display: swap;
    font-family: 'OpenDyslexic';
    font-style: normal;
    font-weight: bold;
    src: url('../font/open-dyslexic/OpenDyslexic-Bold.woff2') format('woff2');
}
/* OpenDyslexic-Bold Italic */
@font-face {
    font-display: swap;
    font-family: 'OpenDyslexic';
    font-style: italic;
    font-weight: bold;
    src: url('../font/open-dyslexic/OpenDyslexic-BoldItalic.woff2') format('woff2');
}
/* OpenDyslexic-Italic */
@font-face {
    font-display: swap;
    font-family: 'OpenDyslexic';
    font-style: italic;
    font-weight: normal;
    src: url('../font/open-dyslexic/OpenDyslexic-Italic.woff2') format('woff2');
}
/* OpenDyslexic-Regular */
@font-face {
    font-display: swap;
    font-family: 'OpenDyslexic';
    font-style: normal;
    font-weight: normal;
    src: url('../font/open-dyslexic/OpenDyslexic-Regular.woff2') format('woff2');
}
/* new-johnston */
@font-face {
    font-display: swap;
    font-family: 'NewJohnston';
    font-style: normal;
    font-weight: normal;
    src: url('../font/new-johnston/johnstonitcstd-medium.woff2') format('woff2');
}
/* new-johnston */
@font-face {
    font-display: swap;
    font-family: 'NewJohnston';
    font-style: normal;
    font-weight: bold;
    src: url('../font/new-johnston/johnston-itc-std-bold.woff2') format('woff2');
}

/* frutiger */
@font-face {
    font-display: swap;
    font-family: 'Frutiger';
    font-style: normal;
    font-weight: 500;
    -webkit-font-smoothing: antialiased;
    src: url('../font/frutiger/frutiger-bold.woff') format('woff');
}

@font-face {
    font-display: swap;
    font-family: 'Frutiger';
    font-style: normal;
    font-weight: 500;
    -webkit-font-smoothing: antialiased;
    src: url('../font/frutiger/frutiger.woff') format('woff');
}

/* san-francisco */
@font-face {
    font-display: swap;
    font-family: 'SanFrancisco';
    font-style: normal;
    font-weight: 400;
    src: url('../font/sanfrancisco/san_francisco.woff2') format('woff2');
}
/* paddington */
@font-face {
    font-display: swap;
    font-family: 'Paddington';
    font-style: normal;
    font-weight: 400;
    src: url('../font/paddington/paddington.woff2') format('woff2');
}
/*#endregion fonts*/

/*#region iFrame styling*/
/* iFrame styling */
.ifrm_cont.ontop:not(.min) {
    border: 1px solid var(--ct-gray-700);
    border-top-width: 1px;
    border-right-width: 1px;
    border-bottom-width: 1px;
    border-left-width: 1px;
    border-top-style: solid;
    border-right-style: solid;
    border-bottom-style: solid;
    border-left-style: solid;
    border-top-color: initial;
    border-right-color: initial;
    border-bottom-color: initial;
    border-left-color: initial;
    border-image-source: initial;
    border-image-slice: initial;
    border-image-width: initial;
    border-image-outset: initial;
    border-image-repeat: initial;
}

.ifrm_cont {
    position: absolute;
    display: block;
    border: 1px solid var(--ct-gray-400);
    background: white;
    box-shadow: 0px 8px 14px #25252557;
    border-radius: 4px;
    padding-top: 35px;
}

.ifrm_head i {
    font-size: 18px;
}

.ifrm_head {
    position: absolute;
    height: 35px;
    z-index: 1;
    top: 0px;
    width: 100%;
    padding: 0px;
    text-align: left;
    background: var(--ct-primary-light-theme-colour);
    color: var(--ct-primary-dark-theme-colour);
    border: 1px solid var(--ct-gray-300);
    border-bottom: 0px;
    box-sizing: border-box;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
}

html.dark .ifrm_head {
    background: var(--ct-surface-grey-3);
    color: #ffffffa6;
}

html.dark .ontop .ifrm_head,
.ontop .ifrm_head {
    background: var(--ct-primary-theme-colour);
    color: var(--ct-on-primary-theme-colour);
}

.ifrm_head button {
    cursor: pointer;
    border-radius: 4px;
}

    .ifrm_head button:active, .ifrm_head button:focus {
        background: var(--ct-primary-dark-theme-colour);
        border: 0px;
    }

.ifrm_cont.min {
    height: 0px !important;
    width: 0px !important;
    box-shadow: none;
    padding-bottom: 39px;
    border: none;
}

    .ifrm_cont.min > .ifrm_head {
        background-color: var(--ct-primary-theme-colour);
    }

        .ifrm_cont.min > .ifrm_head:hover {
            background-color: #950B32;
        }

        .ifrm_cont.min > .ifrm_head > i {
            vertical-align: top;
            font-size: 12px;
        }

    .ifrm_cont.min .ifrm_head .material-icons {
        display: inline-block;
        vertical-align: top;
        font-size: 25px;
        color: var(--ct-primary-dark-theme-colour);
    }

.ifrm_head .material-icons {
    color: var(--ct-primary-dark-theme-colour);
}

html.dark .ontop .ifrm_head .material-icons,
.ontop .ifrm_head .material-icons {
    color: var(--ct-on-primary-theme-colour);
}

html.dark .ifrm_head .material-icons {
    color: #ffffffa6;
}



.ifrm_cont.min > .ifrm_head > span > i {
    font-size: 20px;
}

.ifrm_cont.min > .ifrm_head > .ifrm_close {
    margin-top: 4px;
}

.ifrm_cont.min > .ifrm_head > .ifrm_pin,
.ifrm_cont.min > .ifrm_head > .ifrm_refresh,
.ifrm_cont.min > .ifrm_head > .ifrm_max,
.ifrm_cont.min > .ifrm_head > .ifrm_min {
    display: none;
}

.ifrm_cont.min .ifrm_head {
    width: 188px;
    height: 25px;
    border-radius: 4px;
    display: none;
}

    .ifrm_cont.min .ifrm_head .ifrm_title .ifrm_refresh {
        width: 125px;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        display: inline-block;
        text-align: left;
        font-size: 17px;
    }

.ifrm_cont.max {
    width: 100vw !important;
}


body.sysShortcutPinned .ifrm_cont.max {
    width: calc(100vw - 54px) !important;
}

body.full .ifrm_cont.max {
    top: 0px !important;
    height: calc(100vh - 40px) !important;
}


.ifrm_title {
    height: 27px;
    font-size: 14px;
    padding: 4px 8px;
    line-height: 30px;
    vertical-align: top;
    margin-left: 7.5px;
    display: inline-block;
    max-width: 75%;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    text-align: left;
    vertical-align: super;
}

.ifrm_close, .ifrm_max, .ifrm_min, .ifrm_launch, .ifrm_pin, .ifrm_refresh {
    float: right;
    cursor: pointer;
}

    .ifrm_max > i, .ifrm_launch > i, .ifrm_min > i, .ifrm_close > i, .ifrm_pin > i, .ifrm_refresh > i {
        padding: 8px;
        color: #FFFFFF;
    }

.ifrm {
    width: 100%;
    height: 100%;
    border: 1px solid var(--ct-gray-300);
    border-top: 0px;
    box-sizing: border-box;
}


div.ifrm_tabscroll {
    position: absolute;
    top: 7px;
    z-index: 88 !important;
    text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
}

.ifrm_tabscroll {
    display: none !important;
}

div.ifrm_tabscroll > i.material-icons {
    font-size: 5em;
    color: #F8BBD0;
}

div.ifrm_tabscroll.active > i.material-icons {
    color: #FFFFFF;
}

.ifrm_pin.active {
    background: var(--ct-primary-dark-theme-colour);
}

.ifrm_close > i:hover {
    background: var(--ct-red-900);
}

.ifrm_cont.transition {
    transition: all .3s;
}

div.ifrm_tabscroll > i.material-icons {
    font-size: 5em;
    color: var(--ct-primary-theme-colour);
    position: fixed;
    height: 57px;
    padding: 0.5rem 0;
    text-align: center;
    text-shadow: none;
    z-index: 80;
    top: 5px !important;
    box-shadow: none !important;
}

#ifrm_tabsleft > i:first-of-type {
    width: 160px;
    text-align: right;
}

#ifrm_tabsleft {
    left: 0px;
    position: static;
    top: 0;
}
/*#endregion iFrame styling*/

/* NAVBAR */
/*#region NAVBAR*/
#gcmdNav {
    z-index: 91;
    font-size: 50px;
    position: fixed;
    left: 0px;
    top: 0px;
    color: grey;
    background-color: white;
    border: 1px solid lightgrey;
}

    #gcmdNav:hover {
        color: #FF4081;
        cursor: pointer;
        opacity: 1;
    }

#gdivNav {
    position: fixed;
    z-index: 200;
    top: 60px;
    bottom: 60px;
    left: 5px;
    height: unset;
    width: 80px;
    background-color: var(--ct-primary-dark-theme-colour) !important;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: -moz-none;
    -o-user-select: none;
    user-select: none;
    padding: 4px;
    border-right: 0px;
    border-radius: 4px;
}

    #gdivNav ul {
        list-style: none;
        padding: 0px;
        padding-left: 3px;
        padding-right: 3px;
    }

        #gdivNav ul li ul {
            display: none;
        }

    #gdivNav .material-icons {
        font-size: 40px;
        display: block;
    }

html.dark .material-icons, html.dark .navIcon_extra {
    color: var(--ct-primary-light-theme-colour);
}

#gdivNav.small .material-icons {
    font-size: 30px;
}

#gdivNav a {
    display: block;
    color: var(--ct-on-primary-dark-theme-colour);
}

#gdivNav .menu-right {
    background-image: url("menu_right.png");
    background-position-x: right;
    background-position-y: top;
    background-repeat: no-repeat;
}

#gdivNav a:hover {
    cursor: pointer;
}

#gdivNav li:hover {
    background-color: #EEEEEE;
}

#gdivNav .navSubSec {
    position: fixed;
    display: none;
    margin-left: 100px;
    height: auto;
    background-color: #FFFFFF;
    padding: 5px;
    text-align: left;
    z-index: 1;
    border-radius: 8px;
    padding: 8px;
    border: 2px solid var(--ct-primary-theme-colour);
}

    #gdivNav .navSubSec li {
        display: inline-block;
        width: 100px;
        vertical-align: top;
    }


#gdivNavBG {
    background-color: #00000030;
    position: absolute;
    width: 100%;
    top: 0px;
    bottom: 55px;
    left: 0px;
    padding: 0px;
    margin: 0px;
    z-index: 89;
    height: unset !important;
    opacity: 1 !important;
}


#gdivNav .navSubSec .navTab {
    width: 100%;
}

#gdivNav .navSubSec li a {
    max-height: 92px;
}

#gdivNav .navSubSec .navTab input[type="radio"]:checked + label::before {
    content: 'radio_button_checked';
}

#gdivNav .navSubSec li.navTabContent {
    width: 100%;
    display: inline;
}

#gdivStatus {
    font-weight: 700;
}


.navTab input[type="radio"] + label::before {
    content: 'filter_9_plus' !important;
}

.navTab input[type="radio"] + label:nth-child(2)::before {
    content: 'filter_1' !important;
}

.navTab input[type="radio"] + label:nth-child(4)::before {
    content: 'filter_2' !important;
}

.navTab input[type="radio"] + label:nth-child(6)::before {
    content: 'filter_3' !important;
}

.navTab input[type="radio"] + label:nth-child(8)::before {
    content: 'filter_4' !important;
}

.navTab input[type="radio"] + label:nth-child(10)::before {
    content: 'filter_5' !important;
}

.navTab input[type="radio"] + label:nth-child(12)::before {
    content: 'filter_6' !important;
}

.navTab input[type="radio"] + label:nth-child(14)::before {
    content: 'filter_7' !important;
}

.navTab input[type="radio"] + label:nth-child(16)::before {
    content: 'filter_8' !important;
}

.navTab input[type="radio"] + label:nth-child(18)::before {
    content: 'filter_9' !important;
}

#gdivNav ul.navSubSec > .divNavBack .navBack {
    position: absolute;
    left: 5px;
    top: 10px;
}

#gdivNav ul.navSubSec > .divNavBack a.navBack > i.material-icons {
    font-size: 20px;
    margin-left: 5px;
}

#gdivNav .navSubSec > .navTab:first-of-type {
    border-bottom: 1px solid rgba(0,0,0,0.1);
    padding-bottom: 5px;
    margin-bottom: 5px;
    margin-left: 5%;
    margin-right: 5%;
    width: 90%;
}

#gdivNav > div > ul {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    min-height: 90vh;
}

#gdivNav > div > ul {
    min-height: calc(100vh - 150px);
}

    #gdivNav > div > ul > li {
        position: relative;
        flex-grow: 1;
        flex-shrink: 1;
        flex-basis: auto;
        width: 100%;
        background-color: var(--ct-primary-dark-theme-colour) !important;
    }

    #gdivNav > div > ul > li {
        border-radius: 4px;
        background-color: unset !important;
    }

        #gdivNav > div > ul > li > a {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            margin: 0 !important;
            padding: initial !important;
            width: 100%;
            padding-top: 12px !important;
            padding-bottom: 12px !important;
        }

        #gdivNav > div > ul > li > a {
            transition: none;
            border-radius: 4px;
            padding-top: 6px !important;
            padding-bottom: 6px !important;
        }

            #gdivNav > div > ul > li > a:hover {
                background-color: var(--ct-primary-theme-colour) !important;
            }

#gdivNav ul.navSubSec {
    z-index: 99999;
    box-shadow: var(--ct-primary-dark-theme-colour) 0px 0px 1px 2px, rgb(33 33 33 / 50%) 0px 0px 0px 5000px;
}

#gdivNav ul.navSubSec {
    box-shadow: unset;
}
/*#endregion NAVBAR*/

input#toolSearchText {
    background: var(--ct-surface-bg);
    color: var(--ct-on-surface-bg);
    z-index: 90;
    font-size: 18px;
    line-height: 18px;
    padding-top: 9px;
    padding-bottom: 9px;
    max-width: 695px;
    left: 100px;
}

#toolSearchText, #toolSearchResults {
    top: 62px;
    border-radius: 4px;
}


#toolSearchIcon {
    display: none;
    position: fixed;
    left: 108px;
    top: CALC(1vh + 8px);
    z-index: 90;
    font-size: 36px;
    pointer-events: none;
    cursor: default;
    font-weight: 700;
    color: lightgrey;
}

#toolSearchIcon {
    left: 107px;
    z-index: 91;
    font-size: 28px;
    top: 73px;
}

#toolSearchText {
    display: none;
    position: fixed;
    left: 100px;
    top: 1vh;
    width: CALC(100% - 100px - 1vw);
    font-size: 24px;
    padding: 12px;
    padding-left: 48px;
    border: 0;
    box-shadow: 0 0 20px rgba(0,0,0,0.3);
    z-index: 90;
    background-color: #FFFFFF;
}

#toolSearchText, #toolSearchResults {
    top: 62px;
    border-radius: 4px;
}

input#toolSearchText {
    background: var(--ct-surface-bg);
    color: var(--ct-on-surface-bg);
    z-index: 90;
    font-size: 18px;
    line-height: 18px;
    padding-top: 9px;
    padding-bottom: 9px;
    max-width: 695px;
    left: 100px;
}

span#toolSearchResults {
    max-width: 660px;
    margin-top: 55px;
}

#toolSearchResults {
    display: none;
    position: fixed;
    left: 100px;
    top: CALC(2vh + 52px);
    max-width: CALC(100% - 114px - 1vw - 1em);
    max-height: CALC(100% - 3vh - 96px);
    overflow: auto;
    padding: 1em;
    background: var(--ct-surface-bg);
    box-shadow: 0 0 20px rgba(0,0,0,0.3);
    opacity: 0;
    transition: .5s;
    z-index: 90;
    padding-top: 0px;
    border: 2px solid var(--ct-primary-theme-colour);
    padding-bottom: 0;
}

.widediv {
    width: 85% !important;
}

.custom-modal .modal-footer {
    border-top: 1px solid var(--ct-surface-grey-3);
    border-top-width: 1px;
    border-top-style: solid;
    border-top-color: initial;
    padding: 12px !important;
}

#toolSearchResults ul.navSubSec:not(.nomatch) {
    margin-top: -25px;
}

#toolSearchResults {
    border: 2px solid var(--ct-primary-theme-colour);
}


    #toolSearchResults ul.navSubSec li.searching-match {
        padding-top: 2em;
        border-bottom-color: var(--ct-primary-theme-colour);
    }

        #toolSearchResults ul.navSubSec li.searching-match mark {
            color: var(--ct-primary-theme-colour);
        }

    #toolSearchResults .navSubSec li {
        width: 128px;
    }



    #toolSearchResults li.nav-disabled {
        display: none;
    }

    #toolSearchResults .navSubSec li:not(.searching-match) > a.disabled {
        pointer-events: none !important;
    }

    #toolSearchResults .navSubSec li:not(.searching-match) > a {
        border: unset;
        background: #efefef;
        height: 82px;
        border-radius: 4px;
        margin: 3px;
        padding: 8px;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    #toolSearchResults .navSubSec li:not(.searching-match) > a {
        background: var(--ct-surface-bg-ev1) !important;
    }




        #toolSearchResults .navSubSec li:not(.searching-match) > a:hover {
            background: var(--ct-surface-bg-ev3) !important;
        }


#toolSearchText.searching + #toolSearchResults {
    opacity: 1;
    transition: .25s;
}

#toolSearchResults ul.navSubSec {
    zoom: 125%;
}

    #toolSearchResults ul.navSubSec.nomatch .material-icons {
        color: red;
    }

#toolSearchActions,
#toolRecordActions,
#toolActions {
    position: fixed;
    bottom: 0;
    left: 10px;
    width: auto;
    z-index: 10;
    background: var(--ct-surface-bg);
    border-radius: 5px;
    padding: 4px;
    box-shadow: #00000024 -1px 0px 6px 4px;
    animation: toolActionsIn 0.5s;
    z-index: 1000;
}

#toolActions {
    left: unset;
    right: 10px;
}

#toolSearchActions button, #toolRecordActions button, #toolActions button {
    width: 45px !important;
    height: 45px !important;
    min-width: unset;
}

html.tools-nostickyactions #toolSearchActions button,
html.tools-nostickyactions #toolRecordActions button,
html.tools-nostickyactions #toolActions button {
    outline: 4px solid var(--ct-surface-bg) !important;
}

        #toolSearchActions button.cds-btn-icon::before, #toolRecordActions button.cds-btn-icon::before, #toolActions button.cds-btn-icon::before {
            top: 0;
            left: 10px;
            line-height: 45px;
        }

button.toolbar-disabled,
button:disabled {
    opacity: 0.5 !important;
}

button.waves-effect:after {
    content: "";
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    pointer-events: none;
    background-image: radial-gradient(circle, #000 10%, transparent 10.01%);
    background-repeat: no-repeat;
    background-position: 50%;
    transform: scale(10, 10);
    opacity: 0;
    transition: transform .5s, opacity 1s;
}

#cmdEditSubmit, #cmdUpdateSubmit, #cmdSrchList1Confirm, #cmdGroupSave, #cmdSendNewMsg, #cmdSubmitSearch, #cmdSubmitRecord {
    border: 1px solid transparent;
    background-color: var(--ct-primary-theme-colour);
    color: #FFFFFF;
    opacity: 0.95;
}


div.inputrow input[type=text], div.inputrow input[type=password], div.inputrow input[type=number], div.inputrow textarea, input[type=text], input[type=password], textarea, ct {
    background-color: var(--ct-input-bg);
    color: var(--ct-on-input-bg);
}

div.inputrow input[type="text"], div.inputrow input[type="password"], div.inputrow input[type=number], div.inputrow textarea {
    margin-right: 9px;
    margin-top: 1px;
    font-weight: 700;
}

div.inputrow textarea:before {
    content: ' ';
    width:100%;
    height:22px;
    background:var(--ct-input-bg);
}

input[type="text"], input[type="password"], textarea, .textselect, select {
    -webkit-user-select: text;
    -moz-user-select: text;
    -ms-user-select: text;
    user-select: text;
}

input[type="text"], input[type="password"], input[type="number"], textarea, select {
    transition: all .5s ease-in-out 0s;
    transition: background .4s ease-in-out .1s, border .4s ease-in-out .1s;
    -moz-appearance: none;
    -webkit-appearance: none;
    min-height: 20px;
    font-family: Helvetica;
    width: calc(100% - 12px);
    -webkit-transition: box-shadow 0.1s linear;
    -moz-transition: box-shadow 0.1s linear;
    transition: box-shadow 0.1s linear;
}

input[type="text"], input[type="password"], input[type=number], textarea, select, div.inputrow select {
    padding: 17px 4px 4px 5px;
    border-radius: 4px;
    border: 1px solid var(--ct-blue-gray-300);
    margin-bottom: -4px;
    font-size: 0.8rem;
    min-height: 20px;
}

label.inputlabel {
    text-align: left;
    display: inline-block;
    margin-right: .5em;
    vertical-align: top;
    font-weight: 700;
    position: absolute;
    top: 9px;
    left: 10px;
    width: unset;
    padding: 2px;
    color: var(--ct-on-input-bg);
    font-size: 11px;
}

.inputrow {
    position: relative;
    padding: 6px;
    margin: 0px auto;
    margin-top: -7px;
}

#divSearch .newlayouttbl .inputrow {
    margin-right: -9px;
}

#divSearch {
    max-width: 900px;
    margin: 0 auto;
}

    #divSearch > .inputsector > .inputsectorlabel {
        border-top-left-radius: 4px;
        border-top-left-radius: 4px;
        border-bottom-left-radius: 0px;
        border-bottom-right-radius: 0px;
    }

    #divSearch > div.inputsector.ui-accordion.ui-widget.ui-helper-reset > div {
        border-top-left-radius: 0px;
        border-top-left-radius: 0px;
        border-bottom-left-radius: 4px;
        border-bottom-right-radius: 4px;
    }

    #divSearch > div.inputsector.ui-accordion.ui-widget.ui-helper-reset > div {
        overflow: visible;
        border-top-left-radius: 0px;
        border-top-left-radius: 0px;
        border-bottom-left-radius: 4px;
        border-bottom-right-radius: 4px;
    }

/*label .inputsectorlabel, .ui-accordion .ui-accordion-header {
    border-top-right-radius: 6px;
    border-top-left-radius: 6px;
    padding: 12px !important;
    box-shadow: none !important;
    border: 0px !important;
}*/

div.newlayout .ui-accordion .ui-accordion-content {
    padding: 3px;
    /* overflow: hidden; */
    overflow: visible;
    background: var(--ct-surface-bg) !important;
    box-shadow: none !important;
    border: 0px;
}

.ui-accordion .ui-accordion-content {
    padding: 1em 2.2em;
    border-top: 0;
    overflow: auto;
    margin-right: 0px !important;
}

div.newlayout table.newlayouttbl {
    width: 100%;
    table-layout: fixed;
    font-size: 12px;
}

div.newlayout table.newlayouttbl {
    width: 100%;
    table-layout: fixed;
    font-size: 12px;
}

    .newlayout .newlayouttbl > tbody > tr > td, div.newlayout table.newlayouttbl > tbody > tr > td {
        vertical-align: top;
        padding: 0px;
        margin: 0px;
    }

.inputsector.toolinputsector, #divRecord .inputsector, #divSearch .inputsector {
    border-radius: 0px;
    padding: 0px;
    box-shadow: #00000030 2px 1px 20px 0px;
    background: white;
}

body {
    padding: 0;
    margin: 0;
    font-family: var(--font), Lucida Grande, Lucida Sans, Arial, sans-serif;
    font-size: 12px;
    font-weight: normal;
    color: var(--ct-on-surface-bg);
    background: var(--ct-body-bg) !important;
    min-height: 100%;
    min-height: 100%;
    letter-spacing: .75px;
    /* overflow: auto; */
    margin: 0;
}

#toolRecordActions button span, #toolActions button span, #toolSearchActions button span {
    display: none;
}

#divPrintType input[type="radio"] + label[for="radPrint"]::before {
    content: 'print';
}

#divPrintType input[type="radio"] + label[for="radPDF"]::before {
    content: 'picture_as_pdf';
}

#divPrintType input[type="radio"] + label[for="radHTML"]::before {
    content: 'code';
}

#divPrintType input[type="radio"] + label[for="radCSV"]::before {
    content: 'assignment';
}

.ifrm_head > i.material-icons {
    height: 24px;
    font-size: 1.5rem;
    top: -2px;
    padding: 0.5rem;
    position: absolute;
    display: block;
    opacity: 1;
}

.inifrm .pagehead.globalcentre {
    margin-left: 0px;
    margin-right: 0px;
    height: 35px;
    background: #f50057;
    margin-bottom: 3.5rem;
    opacity: 0;
}

h5, .cds-fs-h5, .inputsector > .inputsectorlabel, #toolSearchText {
    font-size: 1.5rem !important;
    letter-spacing: 0rem !important;
    font-weight: 400 !important;
}

label .inputsectorlabel, .ui-accordion .ui-accordion-header {
    border-top-right-radius: 6px;
    border-top-left-radius: 6px;
    padding: 12px !important;
    padding-top: 12px !important;
    padding-right: 12px !important;
    padding-bottom: 12px !important;
    padding-left: 12px !important;
    box-shadow: none !important;
}

.ontop .ifrm_head .material-icons, .ontop .ifrm_head .ifrm_title {
    opacity: 1;
}

.ifrm_head > .ifrm_title {
    left: 24px;
    top: 6px;
    position: absolute;
    max-width: calc(100% - 100px);
    line-height: unset;
    vertical-align: top;
    opacity: 1;
}

.cds-text-subtitle-2, .cds-inputgroup-label, .ifrm_head > .ifrm_title, .cds-alert h4, .cf-tabs .ct-tab-link, #toolSearchResults a, .tool-menu li {
    font-size: 0.875rem !important;
    letter-spacing: 0.006rem !important;
    font-weight: 500 !important;
}

div.centrerow {
    width: 100%;
    margin: 0 auto 0 auto;
    text-align: center;
    padding: 0;
    padding-top: .2em;
    padding-bottom: .2em;
    margin-bottom: 10px;
    margin-top: 10px;
}

#gdivChannelListData,
#gdivDeskListData {
    overflow-y: auto;
    height: 450px;
}

.custom-modal.normaldiv {
    box-shadow: none !important;
    border-radius: 4px;
    background: var(--ct-surface-bg) !important;
    outline: 1px solid var(--ct-surface-grey-3) !important;
}

div.normaldiv .focused-label.autocomplete {
    padding-bottom: 8px;
    margin-top: -8px;
}

div.normaldiv .inputlabel {
    transition: padding-bottom .5s, margin-top .5s;
}

html.desktop div.normaldiv.custom-modal > div.inputsector > div {
    max-height: calc(95vh - 14.5em);
    overflow: auto;
    border-radius: 0px !important;
}

div.normaldiv div.inputsector {
    width: auto;
}

div.normaldiv {
    width: 800px;
    border: 0px;
    position: fixed;
    height: auto;
    background-color: #FAFAFA;
    z-index: 89;
    max-height: 95vh !important;
    padding: 0px;
    margin-left: 0px;
    z-index: 9999;
}

    div.normaldiv > .inputsector {
        padding: 0px;
        margin-top: -2px;
    }

    div.normaldiv > div.inputsector > div {
        max-height: calc(95vh - 5.5em);
        overflow: auto;
    }

.normaldiv ::-webkit-scrollbar-thumb {
    background: var(--ct-gray-400) !important;
    border: 3px solid var(--ct-surface-bg) !important;
    border-radius: 10px !important;
}

@media screen and (max-width: 450px) {
    .normaldiv {
        width: 80% !important;
    }
}

.custom-modal .ui-accordion .ui-accordion-content {
    padding: 12px !important;
}

.custom-modal.normaldiv .inputsector .inputsectorlabel, .custom-modal.normaldiv .ui-accordion-content {
    background: transparent !important;
    border-bottom: 1px solid var(--ct-surface-grey-3);
    color: var(--ct-on-surface-bg);
}

.custom-modal .modal-footer {
    border-top: 1px solid var(--ct-surface-grey-3);
    padding: 12px !important;
}


#gdivBG {
    opacity: 0.9;
    background-color: #212121;
    position: fixed;
    width: 101%;
    top: 0px;
    left: 0px;
    padding: 0px;
    margin: 0px;
    z-index: 85;
    height: 100vh !important;
}

.inifrm #gdivBG {
    height: 100%;
    width: 100%;
}

.modalContainer {
    display: flex;
    width: 100%;
    height: 100%;
    justify-content: center;
    align-items: center;
    position: fixed;
    top: 0;
    left: 0;
}

    .modalContainer.hideele {
        display: none;
    }

/*.normaldiv, .normaldiv .ui-widget-content:not(.mcs-swatch) {
    background: var(--ct-surface-bg) !important;
}*/

.custom-modal .ui-accordion .ui-accordion-content {
    padding: 12px !important;
}

.listSelectedCount {
    line-height: 42px;
}

table.sorttable {
    width: 96%;
    border-collapse: collapse;
    margin-left: 2%;
    margin-right: 2%;
    table-layout: fixed;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius: 0;
    font-size: 11px;
    border-bottom: 2px solid var(--ct-primary-theme-colour) !important;
}

    table.sorttable tbody tr:not(.no-result) {
        border: 1px solid var(--ct-surface-grey-4);
        border-bottom: 0px;
    }

    table.sorttable tbody tr {
        outline: 1px solid transparent;
    }

/*tr.rowcollapse, tr.rowexpand {
    background: unset;
}
*/
table.sorttable tr th,
table.sorttable tr td {
    padding: 6px;
    border: none;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius: 0;
    word-wrap: break-word;
}

table.sorttable tr th {
    border: 1px solid var(--ct-primary-dark-theme-colour) !important;
}

input[type="checkbox"] + label {
    white-space: pre-line;
    text-align: left;
    min-width: 48px;
    padding: 0;
    /* margin-left: -8px; */
    /* display: inline-block; */
    display: flex;
    cursor: pointer;
    align-items: center;
}

input[type="checkbox"]:checked + label::before {
    content: 'check_box';
    color: var(--ct-primary-dark-theme-colour);
    font-weight: normal;
    text-transform: none;
}

input[type="checkbox"] + label::before {
    font-family: 'Material Icons';
    font-size: 24px;
    /* vertical-align: middle; */
    border-radius: 100%;
    background-color: transparent;
    transition: .25s;
    content: 'check_box_outline_blank';
    color: var(--ct-blue-gray-300);
    /* padding: 4px; */
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    text-transform: none;
    font-weight: normal;
    font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

label.inputsectorlabel .material-icons {
    color: var(--ct-secondary-theme-colour) !important;
}

.custom-modal label.inputsectorlabel i {
    font-size: 32px;
    padding: 0px;
}

button[type="button"], button[type="submit"], button[type="reset"], button {
    border-radius: 42px;
    padding: 7px;
    border: 1px solid transparent;
    opacity: 1;
    transition: color 0s, opacity .5s;
    color: #000;
    min-width: unset;
    min-height: 26px;
}

#gdivDeskList {
    border: none;
}

.iconexpand, .iconcollapse {
    float: right;
    font-size: 18px;
}

tr.rowcollapse .iconexpand {
    display: none;
}

tr.rowexpand .iconcollapse {
    display: none;
}

.iconexpand, .iconcollapse {
    /*float: right;*/
    font-size: 24px;
    vertical-align: middle;
    cursor: pointer;
}

tr.rowexpand .iconcollapse {
    display: none;
}

/*tr.rowcollapse, tr.rowexpand {
    background: unset;
}*/

    tr.rowcollapse .iconexpand {
        display: none;
    }

    tr.rowexpand .iconcollapse {
        display: none;
    }

html.mobile body {
    margin-left: 0;
    margin-right: 0;
}

/* HIDE HIDDEN ELEMENTS (JQuery-UI 1.13.2 Fix) */
.hiddenlabel {
    display: none !important;
}

:focus {
    outline-color: var(--ct-primary-theme-colour);
}

#gdivContentPlaceholder {
    width: 100vw;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    opacity: 1;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAZAAAAGQCAMAAAC3Ycb+AAAB+FBMVEUAAADq6urs7Ozv7+/x8fHw8PDq6urq6urq6urq6urw8PDz8/P09PTq6urs7Ozs7Ozr6+vr6+vr6+vq6urr6+vs7Ozt7e3n5+ft7e3w8PDr6+vs7Ozr6+vq6uru7u7r6+vs7Ozq6urz8/Pv7+/v7+/z8/Pu7u7r6+vx8fHr6+vq6urr6+vu7u7s7Ozq6ury8vL29vbx8fHz8/P39/f09PTt7e3r6+vr6+vq6urt7e3w8PDs7Oz09PTx8fHr6+vs7Ozw8PDv7+/x8fHp6en19fXy8vLq6uru7u7z8/P39/fn5+f29vbs7Oz09PTw8PDr6+vx8fHu7u7q6urt7e3s7Ozr6+vu7u719fXu7u74+Pjs7Ozr6+v29vbv7+/q6urr6+v5+fns7Ozq6uru7u7s7Ozx8fHx8fHz8/Pr6+v09PTu7u7t7e309PTp6enx8fHw8PDs7Ozx8fHq6ur4+Pjz8/Py8vLz8/Py8vLw8PDq6uru7u7q6ur09PTu7u719fX4+Pj09PT4+Pjw8PDu7u7s7Ozt7e3q6urw8PDw8PD39/f4+Pjv7+/09PTr6+vq6urz8/P19fX09PTz8/Pt7e3w8PD19fX5+fnx8fHu7u74+Pj19fX19fX39/fp6enq6urr6+vs7Ozt7e3v7+/u7u7w8PDx8fHz8/P19fXeHLUzAAAAnXRSTlMA2RcVBRLs8f15NxwJTzDuy7WQZ1MhCwigjHtdRSoZ5uLitLFeU0g2A8CuqZJtVlBFRDsxKyP69/Pq5NrXycewrqZ6dWtNQickDw8M+/Lr6NjX0sG+urWlmpWFgXZ2ZC8e5NfQzr2ajGpoZ1gv+O3h3dzc2s7KwbCqm5aNg3NxU0kZ8/Py7+3PxcS7u4+JgGNeQCr8+uzMx6Na+fjkj2av8wAADkJJREFUeNrs3eWPFEEQBfCHu7u7u7sTNEhwJwGCBXeXQIAAgSBBQl7NLhzwb+LBdheuZma3aqZ/3y65L5N3N91d3V2DIAiCIAiCWju9tsFXA/jVmm8/rT2NoJpW7mzRokVdQViBFOo+/9LCpwjS1K1Ro/esH/nQqNEKBGkY2GGdUEH6dxiIIFFDOr+PGIsM6jwEQTLmNBMmQJqtQhDXgctFJkfaXR6LQG330IiJixbuboxAYU57YSpk3VkE9XRojDBFMnoCgv/WuGXE1EXXwpvrP3VvwKpotwDBP02YE7FqoiUNEVR0XFhVTbsjKGtI94hVV3iEoKSuXYQ1IUOaIPjL6D2smX73EfyubR1r6uJQBL+Y2Zw11vwNgh8OF2jAvh4Ivmj4nkZcXYYA8/vRjGZht3d8R1oig5BvK4TGSK7LwPNrPrn6m3RCXrXeS5Oet0Iu7WhKo6Yjj1qYGz5+ii4hb24Opml5S6TbDBq3viVypI/h19UPxSXIjRcO8iCj1siJgS7yICUn/yMXnORBsi1y4C79OLoUmbeArtxDtg1/QGdWdUOWbfAzfnwnZ5Bhzt5X3+zN7vTX03j+i77IqAt0qjcyyct6sIRMzn591EtKO5rBFaKHemI5Wdxpb+w6D7LYFZly0/z+x7+8RabsonsdkSEtmAHnkRk7nA8g30hmJr+tzZ73qZ9CVk7+Gj0PV3/9kQnzmRmdkQHLmzNdUiwW370rFgsiTFnzG3BvvDAlxS2dOh16jd88Pdyp0+qIqSnCvY5MXtS+/WZUdLb9XGEa1g+Hb+eZuNV9Jg/Hv03uU2TyxPmV9r79mKji5QP4f906joyYsGgSPHvPBEk71N/CZkxWTzh2mMkpdB4Hja6dRwsTJFvhV4FJWTMQMQyKmJwBy+HVTCZEBi9HLA1PMjnD4FTb5kxEYSfia/lImBDx2pK5jkmQUUjG1v5MyCi4NJpJeDcRSWmSVG9NgUcr9zC+wi4kaqQwCVPhUBfGdwKJi5iEXnDnujAumY/kLa1jAgpwpzvjatcIqegpjO8BvIkY09u+SMlgYWzTvLXfmMl4ZNsRpGcEY3PWfm6CMJ5tSNUMxiUr4clZxiJjkK5u+xjXdngSMQ7pgdTNYf34nmjtZxyyA+lrvIoxzYYbjRtQQZeH3jnGMwButGQM0gNVspZxeLrpFjGGMaiW1rMYSwM4sZh6sg3/ZGY9Mh4+jKHeNlTVNMbxCj4I1d4eQVV1LTCGAT4+K3aWau1uosp6Mg4fR33bU0saoep6MYYIDrQVas1H9S27zRg8dMocSq1TqIk71DsI+yL+B0vFoSvUmwXzHlJrP2pkHvVgXkcqvWuMGpkiVHsJ64rUkYmoLwtlxqbmt3L5/+ycBjxBtd2wbQ4rszaifzOYlbgOpBl1dqKmnlHHfFOaIcL/Zeu0rFBJbLfI7EydwaixjdR6CMveU6VfzbuILKaO9bZNQgUTnY+KVJoGy1iZ4aJpS2ElThfrA6nSBgbsoZLlD+h2oMo4GDCbSrdgVut11GgHE4Qapr962FA8v4QXUacZzGrI+rPT8mgnlezekn5PjcswQqhhuc8c/83y1ZcPIRBLQwjQRFiJ0Up1BV2psRpWNJnGcpz8Sf1hITX6wIyRGQukJxWiyTBjEHUGwqYWVGhvqKtka+psgk2qQObCkIgqHWBTHRU2w5Dj2QqkwBJcDYhtshWI5DWQgtEvHbIs+4Wsb8YJNaKGMIkKW2BJq+nUEJuBnKZCJ5jSlCo2A1kbArFlFhUOwZR2uQ/kNUw5RpWPsKgBS3I06wWeUOU9LMpCIKBKHSyqEIjdQ9YhEOObbazE9NHLvw3IbyDm/tEzUjkJgYRAfmHiWUIgP5l4lhDITyaeJQzqKYqyMF/MUiA5Xhiae4y8l05CIGm5z5LyUzqxth9yjCX5rPaeosJhmHKHKh9g0SyWkf0t3MWwKMeB2NzCPckyfNwO+WJ88ywFcppl+FkZjmNpPgMBS3M0723D8vwdlMtvIFaPkgoV5sCQOpbl8bB1gWW4ubAjLMvjdYQOVFhzE2Y8ZrYCaUEFeQoz5rG0XAWShWvRVi999mQ5PjYNGwnL83gteiFVzHw3qBXLcjR1/8TefbA4FQRxAB+NuaixIZ69t7P3s2M77PXUQ8XexVNREUWxYS/YUFGE/yZ3op9TUOya5O3Ovjez2d8nuPAumd19s//5xTz8l4rwmc7QHgjByhSSoREVqGqdqWUZr+D9ZwsqUHRi7R44tYpE+IgKdOZldYWVvgNJgCIq0RnxVykEU3xubyssLcyRVOsP47+kx6fnxqASnTGxlU+zZJf1nrB1h+QaCzvjKHMGtl6QYKhC0MzV351ARSq3hS7/Z9soY/dRmcZtYfXUQrlDZW+gMuErEv6RR3hOWRrUHdauk2S3DOyYPZShS6hG9AqxkgIsjc5TZuYYVKF2bB5tRmUiq8hk2JtDwhlYKt2ijDTDnpE+6bN64pS4abg5A3v9SLr+qEZaeVyMGqjo8/undljrvo4yMAw10LlN/0bZiuW2AXT9xUmtgr0elLo2uDhF8vUxsGbaKV2TdqI2kicwVtFtO+yZfZSqgQa10XDdyMM5BDCZ0tQEN4NIBQMHo6p+SCE7EAALZA+3/2EaXByjtDQX4GYl6TARTh51o1TMLcPRTVKiDCd3KRWbkIDWTcg3N+FmB/k39zVcDSctBvWFm1bv1bK5DFejSY+VcNRKfuUWwpmgAYzMcX/p70eaSkhE58H7r4bD2UvyZdJAMNhLmnRtgKvSUPJkp4E7o+oXi+g93LU3kwez2sDhMilThrt7xK/dgEP5ECmzFwzMSuKVWwwex0kdAw6da4lRowGPraRPO1iY48RlzmRwGUb65LaCx0WeTz/okgGX+aTRE3DZRO5uzIcLoeETyVwFm7bp5GR3XzDaQTpNBCPTRLZyTQYcdL1J/5cP4HRkKdkoto4Crxmk1nawMi37KZnGlo/gtkjdnvCnIWD3KZ+vsaSuzxf5n4b8GzqVtYBfadnyXlTV6eX3DXwYTJqtLcALc6F375lF+qdZq3v37jTwQlIAnp0NBr6YQkND33Nz6BfHtyxqaNhk4I9pJuXGISjLSb0SAqKpseF/ZiMcZjUF4BSCcZKC8AaBeEZhKBYQhI65FAqDABSKFIzd0M88poBcg3pSE/ctLYNyIexAftWzA6q1UWheqd6xl2XO8nSyUfFSy8yiAK2BVmY8BanPWeh0gAI1AirpuUuY2FAoJHc8CIM70Ka7iNEN3vR6CGXkTmthchSqBP179dWgkVAk4Hr+03BoYURPouAzYgFUCHU/+Lc+Kk5RykGel/zbbAVnv20Bnif+38ZOCBfa+4+q+kMyE9j7wVpcEVxICiOpDo0Q+0Q6AuovSSJ/GCI9C6f/KqkZkMeIme+ehdXi1r9jguindjBZVCUxK6jedcsLakcpqb8fxaFpqJAvidF9n5PRnjEQYBFF3+U3I2tmhuI8AA8mTDXIjt48GY8ed0dm5k+i6C/rhpWRia0a8+HScXwBUldWmGeZnuIQg1SZy40UVbJxCVK0SVk+dRZ2ITUqBnVmzyA1UygSdSY/jaLqbiElauNe03YPKflIUS0eIyV9KKoJ0lE6Q5GkKwvHKKrNEPinPe+1RoLG81QRS3oSj5CCUxSJuq9QV93tjrqOgncdFIlK+1UynF4KA8/K8YEk8g6eTaUoienwbBdFScyDT5rHFmWlEx7VSSIAq7nwyUykKJluXeBNHd6xZbASHi2lSNJvVjzotfER3uylKLkB8OY6Rck1FuBF3ITYWgwvYkkXV9Zjf7WlfvBiVI4iK3vhxVOK7PQBv1jSXXTAg20U2ZoDD+KNQnuNZbDrHhtIHewEuwsU2WsCr3iuKK6p9DxFLg6A2W6KXLwEs1cUOZkPRrGB1N1BsKqbfP0/SG0qfRAPep1dBaNWilztAaPbFDkrgUMs6WwmgknsNuHR04BLT4oYbAeTToo4LAWTeo91l1bWxwykiEULGMS4Mj43wGI2RZLigcoUcfkMZzFKg1PewJmJayxGU+CsgSI+K+DsLUWSynpsIP1Kzv22/hR9ae9+XqKK4iiAH0rNCmVaZKJmiyILf0GQVIQuiknLgiispKSJUIJKaFURLYp2BW3ade5oRf2bgUzpzPhm3nvz7r1f5Hz+hQf3vAv3+z1F6mOH1iCF6mFqOrFCuMWOTEFgKNbdcUjBFtmBWUjRvrAD2jVTvGfMSU/eGxjYoHUQUrxrzG0FUrz5GeajqilPZpnTb4gP75iPU7GqJ5vMRTXpvqzog9gyzUSK9Cgcc/gF8WWCOZQhvpyZYWavIP4MMgNtCvDvPZso0qNyTEdTbIGsMqMhiE9lx206seJbOMEM1B7p3xozGYV4VmUGVX0Q7+aYwRGIb0PM4DPEs9rwjiLdjrdspgekEY06JtOmgPCOlZjSBUgIS0xF9aqh3GAjzYTENcgGmmKLa4qpPISE0f2C2/Tk3YAPTOE1JBi219sPCWaTbZUg4UywrVVION1OkW7LD7axBAmpn21MQkJ6XmVL7jEkqKe6hNjSxVacVvQG95MtlLoggU2yhXFIaFcV6cZUmWgOEt4AE41AwhvYYIKefZAIxplgHRLDPSbYDwkvOdbvQuIY4a6WIXGcdrqE2FLhP+piM+E7d6H+4Ygcm1TPQ6JZ1z+WLctschgSUVWrNGz5xgbDkJiOOtY7BYnqLOssQuK6wzrXIZE51avacok7vIHENswdHkBiO9erJ++2fOR/YxADHGvcIYgBFdY8gVhwnzWXIRZMK9KNucgtLyE2jHHLI4gN8we0/MeW2yT5B2IGSdcNMaNCflqAmHGFPAmxo6xLiDEbNyGWfO2DiIiIiIiIyF7wF9jsD8A3C1j8AAAAAElFTkSuQmCC) no-repeat;
    z-index: 99999;
    background-position: center;
    background-color: #FFFFFF;
}


#gtxtInputBoxPW {
    width: 250px;
}




@keyframes preloading {
    0% {
        left: -45%;
    }

    100% {
        left: 100%;
    }
}

#gdivPageLoad svg {
    animation: pts_rotate 2s linear infinite;
    margin: auto;
    position: fixed;
    top: CALC(50% - 122px);
    left: CALC(50% - 122px);
    width: 244px;
    -webkit-transform-origin: 50% 50%;
    -moz-transform-origin: 50% 50%;
    -o-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
}

#gdivPageLoad svg {
    position: fixed;
    top: CALC(50% - 122px);
    left: CALC(50% - 122px);
    width: 244px;
    z-index: 1;
    animation: pts_rotate 1s linear infinite;
}

    #gdivPageLoad svg circle {
        stroke-dasharray: 1, 200;
        stroke-dashoffset: 0;
        animation: pts_dash 1.5s ease-in-out infinite, pts_color 6s ease-in-out infinite;
        stroke-linecap: round;
        stroke-width: 4px;
    }

    #gdivPageLoad svg circle {
        animation: pts_dash .75s ease-in-out infinite, pts_color 3s ease-in-out infinite;
    }

@keyframes pts_rotate {
    100% {
        transform: rotate(360deg);
    }
}

@keyframes pts_dash {
    0% {
        stroke-dasharray: 1, 200;
        stroke-dashoffset: 0;
    }

    50% {
        stroke-dasharray: 89, 200;
        stroke-dashoffset: -35px;
    }

    100% {
        stroke-dasharray: 89, 200;
        stroke-dashoffset: -124px;
    }
}

@keyframes pts_color {
    100%, 0% {
        stroke: #F44336;
    }

    40% {
        stroke: var(--ct-primary-light-theme-colour);
    }

    66% {
        stroke: #9C27B0;
    }

    80%, 90% {
        stroke: #673AB7;
    }
}

a {
    color: #212121;
    text-decoration: none;
}

.ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited {
    color: #212121;
}

a img {
    border: 0;
}

.material-icons {
    color: var(--ct-primary-theme-colour);
}

.icon32 {
    font-size: 32px;
}

.pagehead .material-icons {
    display: inline-block;
    font-size: 48px;
}

.pagetitle {
    font-size: 18px;
    line-height: 48px;
    vertical-align: top;
}

div.inputsector {
    margin-left: auto;
    margin-right: auto;
    padding: .2em;
    width: 800px;
}


div.inputrow input[type="text"] + input[type="checkbox"] + input[type=number] {
    margin-left: auto;
}

div.rightrow {
    width: 100%;
    margin: 0 auto 0 auto;
    text-align: right;
    padding: .2em;
}

#spanDayControlLabelPWA, #spanConnectionIDLabelPWA, #spanBrowserLabelPWA {
    cursor: pointer;
}

div.leftrow {
    width: 100%;
    margin: 0 auto 0 auto;
    text-align: left;
    padding: .2em;
}

label.inputsectorlabel, .ui-accordion .ui-accordion-header {
    font-size: 16px;
    display: block;
    padding: 6px 6px 6px 8px;
}

label.inputlabelhelp {
    text-decoration: underline;
    font-style: italic;
    color: rgb(59, 170, 227);
}

    label.inputlabelhelp:hover {
        cursor: pointer;
    }

div.inputlabeltip {
    background-color: white;
}

span.inputspan {
    padding-top: 5px;
    display: inline-block;
}

.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
    color: #212121;
    border: 1px solid #DDDDDD;
    font-weight: normal;
}

.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, .ui-widget-header {
    color: white;
}

.ui-button.ui-state-hover, a.ui-state-default.ui-state-hover {
    background-color: #EEEEEE;
}

.ui-state-active.ui-state-hover {
    background-color: var(--ct-primary-light-theme-colour);
}

a.ui-state-default.ui-state-highlight {
    background-color: #FFF59D;
    color: grey;
}

#divAllocationBox {
    position: fixed;
    min-height: 250px;
    top: 35%;
    z-index: 99999;
}

html.desktop #divAllocationBox {
    min-width: 400px;
    left: 50% !important;
    width: 800px;
    margin-left: -400px;
}

html.mobile #divAllocationBox {
    width: 100%;
}

#lblAllocMsgLbl {
    white-space: pre-wrap;
    overflow-wrap: break-word;
    font-size: 16px;
}

#lblAllocMsgBoxTitle {
    font-size: 20px !important;
}

/*#gimgMsgBoxIcon,*/
#gimgInputBoxImg {
    font-size: 42px;
}

.imgAllocMsgBoxIcons .material-icons {
    font-size: 54px;
}

hr {
    border-style: outset;
}

select {
    height: 32px;
    font-size: unset;
    border: 1px solid var(--ct-blue-gray-300);
    cursor: pointer;
    font-weight: bold;
    -webkit-appearance: none;
    appearance: none;
    background-color: var(--ct-input-bg);
    background: 98% 50% no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='28px' viewBox='0 0 24 24' width='28px' fill='%23757575'%3E%3Cpath d='M0 0h24v24H0V0z' fill='none'/%3E%3Cpath d='M7.41 8.59L12 13.17l4.59-4.58L18 10l-6 6-6-6 1.41-1.41z'/%3E%3C/svg%3E");
    color: var(--ct-on-input-bg);
    text-align: left;
    font-weight: 700;
    width: 100%;
    height: 43px;
    padding-top: 19px;
    margin-top: -4px;
}

    select:focus {
        outline:2px solid var(--ct-primary-theme-colour) !important;
        border: 1px solid var(--ct-surface-bg) !important;
    }

  /*  select > option {
        color: var(--ct-on-primary-light-theme-colour);
        background-color: var(--ct-primary-light-theme-colour);
        font-weight: 700;
        font-size: 0.8rem;
    }

        select > option:hover {
            border: 1px solid #9E9E9E;
            color: var(--ct-on-primary-theme-colour);
            background-color: var(--ct-primary-theme-colour)
        }
option {
    color: var(--ct-on-primary-light-theme-colour);
    background-color: var(--ct-primary-light-theme-colour);
}
    option:hover {
        border: 1px solid #9E9E9E;
        color: var(--ct-on-primary-theme-colour);
        background-color: var(--ct-primary-theme-colour)
    }*/

html.mobile input[type="text"], html.mobile input[type="password"], html.mobile textarea {
    font-size: 16px;
    border: 1px solid #9E9E9E;
    font-weight: bold;
}

div.inputrow input[type="text"], div.inputrow input[type="password"], div.inputrow input[type=number], div.inputrow textarea {
    margin-right: 9px;
    margin-top: 1px;
    /*margin-bottom: 1px;*/
    font-weight: 700;
}

a.linkbtn {
    padding: .18em;
    min-width: 118px;
    min-height: 24px;
}

#IE7 button[type="button"], #IE7 button[type="submit"], #IE7 button[type="reset"], #IE8 button[type="button"], #IE8 button[type="submit"], #IE8 button[type="reset"] {
    min-width: 0px;
    width: 10em;
    min-height: 0px;
    height: 2.5em;
}

#IE7 div.inputrow button[type="button"], #IE8 div.inputrow button[type="button"] {
    width: 38%;
}

.ui-dialog-titlebar-close, .imsendmsg {
    min-height: 0 !important;
    min-width: 0 !important;
}

input.required, textarea.required {
    background: right 2px no-repeat url(data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjRkY4MEFCIiBoZWlnaHQ9IjE2IiB2aWV3Qm94PSIwIDAgMjQgMjQiIHdpZHRoPSIxNiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxwYXRoIGQ9Ik0yMiA5LjI0bC03LjE5LS42MkwxMiAyIDkuMTkgOC42MyAyIDkuMjRsNS40NiA0LjczTDUuODIgMjEgMTIgMTcuMjcgMTguMTggMjFsLTEuNjMtNy4wM0wyMiA5LjI0ek0xMiAxNS40bC0zLjc2IDIuMjcgMS00LjI4LTMuMzItMi44OCA0LjM4LS4zOEwxMiA2LjFsMS43MSA0LjA0IDQuMzguMzgtMy4zMiAyLjg4IDEgNC4yOEwxMiAxNS40eiIvPgoKPC9zdmc+);
    /* background-color: #FFFFFF;*/
}

input.required {
    padding-right: 39px !important;
    width: calc(100% - 47px) !important;
}

textarea.required {
    padding-right: 61px !important;
    width: calc(100% - 69px) !important;
}

.cds-input-btn-end input.required {
    padding-right: 78px !important;
    width: calc(100% - 86px) !important;
}


select.required {
    background: 98% no-repeat url(data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjRkY4MEFCIiBoZWlnaHQ9IjE2IiB2aWV3Qm94PSIwIDAgMjQgMjQiIHdpZHRoPSIxNiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxwYXRoIGQ9Ik0yMiA5LjI0bC03LjE5LS42MkwxMiAyIDkuMTkgOC42MyAyIDkuMjRsNS40NiA0LjczTDUuODIgMjEgMTIgMTcuMjcgMTguMTggMjFsLTEuNjMtNy4wM0wyMiA5LjI0ek0xMiAxNS40bC0zLjc2IDIuMjcgMS00LjI4LTMuMzItMi44OCA0LjM4LS4zOEwxMiA2LjFsMS43MSA0LjA0IDQuMzguMzgtMy4zMiAyLjg4IDEgNC4yOEwxMiAxNS40eiIvPgoKPC9zdmc+);
    /*background-color: #FFFFFF;*/
}

input[disabled], textarea[disabled], select[disabled], input[disabled].invalid, textarea[disabled].invalid, select[disabled].invalid {
    background-color: var(--ct-surface-grey-4) !important;
}

/*	Invalid field styling.	*/
input.invalid {
    background-color: rgb(255, 123, 123) !important;
}

select.invalid {
    background: rgb(255, 123, 123) !important;
    color: var(--ct-on-surface-bg);
}

/*	Uppercase field, Short Time Special field styling.	*/
input.uppercase, textarea.uppercase, input.shorttimespecial, textarea.shorttimespecial {
    text-transform: uppercase;
}
/*	Uppercase field, Short Time Special field styling.	*/
input.lowercase, textarea.lowercase {
    text-transform: lowercase;
}

table.sorttable {
    width: 96%;
    border-collapse: collapse;
    margin-left: 2%;
    margin-right: 2%;
    table-layout: fixed;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius: 0;
    font-size: 11px;
}

   /* table.sorttable thead tr, table.sorttable thead tr th {
        position: -webkit-sticky;
        position: sticky;
        top: 0px;
        z-index: 1;
    }*/

    table.sorttable tr th {
        font-size: 11px;
        background-color: var(--ct-primary-theme-colour);
        color: var(--ct-on-primary-theme-colour);
        height: 26px;
        text-align: left;
        -moz-border-radius: 0;
        -webkit-border-radius: 0;
        border-radius: 0;
        position: sticky;
        top: -1px;
    }

        table.sorttable tr th.sorted {
            background: #DFD;
        }

        table.sorttable tr th.sorteddesc {
            background: #FDD;
        }

/* Input Helper stylings.	*/
div.inputhelp {
    position: absolute;
    background: white;
    border: 1px solid #BBB;
    padding: .2em;
    margin-top: -.15em;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius: 0;
    z-index: 50;
}

html.desktop div.inputhelp {
    left: 25%;
    width: 50%;
    margin-left: 0px;
    margin-right: 25%;
}

html.mobile div.inputhelp {
    width: 100%;
}

div.inputhelp.datepick b {
    width: 10%;
    margin-left: 37%;
    margin-right: auto;
}

div.inputhelp.datepick a#dtpNext {
    margin-left: 1em;
    float: right;
}

div.inputhelp.datepick a#dtpPrev {
    margin-right: 1em;
    float: left;
}

div.inputhelp.datepick table {
    width: 100%;
    table-layout: fixed;
    border-top: 1px solid #BBB;
    margin-top: .2em;
}

    div.inputhelp.datepick table tr td.day {
        border: 1px solid #BBB;
        cursor: pointer;
        text-align: center;
        padding: .2em;
        background-color: white;
        -moz-border-radius: 0;
        -webkit-border-radius: 0;
        border-radius: 0;
    }

        div.inputhelp.datepick table tr td.day:hover {
            background-color: lightgray;
        }

        div.inputhelp.datepick table tr td.day.today {
            background: #DDF;
            border: 1px solid #77C;
        }

        div.inputhelp.datepick table tr td.day.selectedday {
            background: #DFD;
            border: 1px solid #7C7;
        }

a.dateicon {
    display: inline-block;
    height: 20px;
    width: 20px;
    vertical-align: middle;
    text-align: center;
}

    a.dateicon:hover {
        cursor: pointer;
        background-color: lightgrey;
    }

#dtpHdPrev {
    width: 15%;
    text-align: left;
    font-weight: bold;
}

#dtpHdDate {
    width: 70%;
    text-align: center;
}

#dtpHdNext {
    width: 15%;
    text-align: right;
    font-weight: bold;
}

#dtpHdPrev, #dtpHdNext {
    cursor: pointer;
}

#dtpTblMain tr th {
    font-weight: normal;
}

ul.topbar {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 90;
    margin: 0;
    padding: 0;
    background-color: var(--ct-primary-light-theme-colour);
    border-bottom: 1px solid #BBB;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius: 0;
}

.topbarheader > a {
    color: white;
}

.topbarheader:hover > a {
    color: var(--ct-on-surface-bg);
}

html.desktop ul.topbar {
    min-width: 800px;
    position: fixed;
}

ul.topbar, ul.topbar ul {
    text-align: center;
    list-style: none;
    display: inline;
}

    ul.topbar > li {
        vertical-align: top;
        display: inline-block;
        padding: .2em;
        padding-bottom: 0;
        margin-left: 7px;
        margin-right: 7px;
        font-weight: 700;
    }

    ul.topbar li ul {
        position: absolute;
        display: none;
        padding-left: 0;
        background: #FFFFFF;
        border: 1px solid #BBB;
        border-top: 0;
        -moz-border-radius: 0;
        -webkit-border-radius: 0;
        border-radius: 0;
    }

    ul.topbar li ul {
        margin-left: -3px;
    }

    ul.topbar li a {
        text-align: left;
        text-decoration: none;
        display: block;
        padding: .4em;
        font-size: 14px;
    }

    ul.topbar li:hover ul, ul.topbar li ul:hover {
        display: block;
    }

#IE7 ul.topbar li:hover ul, #IE7 ul.topbar li ul:hover {
    margin: 0px;
    margin-left: -3px;
}

ul.topbar li:hover {
    background-color: white;
}

#IE7 ul.topbar li:hover {
    background-color: #FEFFFF;
}

ul.topbar li ul li a:hover {
    background-color: var(--ct-primary-light-theme-colour);
    color: white;
}

div.bottombar {
    position: absolute;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 150;
    background: #FFFFFF;
    border-top: 1px solid #BBB;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius: 0;
    text-align: center;
    vertical-align: middle;
}

html.desktop div.bottombar {
    min-width: 800px;
}

.globalcentre {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    display: block;
}

.rowradio:hover, .rowcheck:hover {
    background-color: #DEDEDE;
}

/*#gdivInfoMain {
    overflow: scroll;
    height: 530px;
}

    #gdivInfoMain div.inputsector {
        width: 700px;
    }*/

td.tdJrnyIDInfo:hover {
    cursor: pointer;
    background-color: #DFD;
}

html.mobile div.enqresultsdiv {
    width: 100%;
    overflow: scroll;
}

html.mobile table.enqresultstbl {
    width: 1200px;
}

#togjfx.jqfxenb, #togalerts.jqfxenb {
    background-color: rgb(255, 123, 123);
}

    #togalerts.jqfxenb::after {
        content: 'Alerts Disabled'
    }

#togjfx.jqfxdis, #togalerts.jqfxdis {
    background-color: rgb(200, 255, 192);
}

    #togalerts.jqfxdis::after {
        content: 'Alerts Enabled'
    }

#togjfx:hover, #gItemNewIM:hover, #gItemNewIMHelp:hover, #gcmdSetDesks:hover, #gcmdSetChannels:hover, #togalerts.hover, #gcmdShowPhoneDialer:hover {
    cursor: pointer;
}

li.mailunread:hover, li.mailunread #gItemMail:hover {
    background: rgb(255, 233, 237);
}

span.mailnumber {
    background: red;
    color: white;
    padding: 2px;
    position: absolute;
    font-size: 15px;
    font-weight: 700;
    top: 2px;
    left: 7px;
    min-width: 20px;
    line-height: 20px;
    border-radius: 50%;
    box-shadow: 0px 3px 6px #000000;
}

img.badge {
    position: absolute;
    z-index: -1;
    max-width: 200px;
    max-height: 100px;
}

@media (max-width: 999px) {
    img.badge {
        opacity: 40%;
    }

    a.training {
        opacity: 40%;
        font-size: 18px !important
    }
}

img.ccs {
    position: fixed;
    right: 0px;
    bottom: 50px;
    z-index: -1;
    height: 75px;
    background: white;
}

a.training {
    right: 0px;
    margin: 5px;
    color: red;
    margin-top: 6px;
    z-index: 91;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 2rem;
}

#glblErrorCont .material-icons {
    display: none;
    position: absolute;
    right: 15px;
    top: 0px;
}

#glblErrorCont:hover .material-icons {
    display: block;
    cursor: pointer;
}

#glblError {
    max-height: 200px;
    overflow-y: auto;
    user-select: text;
}

#gdivConError, #gdivSesExpiry {
    background-color: red;
    color: white;
    font-size: 16px;
    padding-top: 10px;
    padding-bottom: 10px;
}

/* Alert Styles */
#gdivAlertFrame {
    display: none;
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
}

.alertdialog {
    position: fixed;
    z-index: 200;
}

.alertdialog-crew-alarm > div:first-child {
    background-color: #D50000;
}

.alertdialogbody:hover {
    /*text-decoration: underline;*/
    cursor: pointer;
    background-color: #EEEEEE;
    transition: color .4s, background .4s;
}


div.imdialog {
    z-index: 200;
    -webkit-box-shadow: 0px 0px 10px 1px rgba(166,166,166,1);
    -moz-box-shadow: 0px 0px 10px 1px rgba(166,166,166,1);
    box-shadow: 0px 0px 10px 1px rgba(166,166,166,1);
}

    div.imdialog div.imhistdiv {
        height: 90px;
        width: 100%;
        vertical-align: top;
        overflow-y: scroll;
    }

    div.imdialog div.immsgdiv {
        height: 50px;
    }

        div.imdialog div.immsgdiv textarea {
            height: 40px;
            width: 80%;
            resize: none;
            float: left;
            display: inline;
        }

        div.imdialog div.immsgdiv button {
            height: 100%;
            width: 15%;
            float: right;
            display: inline;
        }

    div.imdialog div.imhistdiv div.imhistitmrcv {
        text-align: left;
        padding: 3px;
        background-color: #FFFFFF;
        margin-bottom: 8px;
        margin-right: 10%;
        white-space: pre-wrap;
    }

    div.imdialog div.imhistdiv div.imhistitminprog {
        background-color: #FFE082;
    }

    div.imdialog div.imhistdiv div.imhistitmrpy {
        text-align: left;
        padding: 3px;
        background-color: rgb(215, 235, 249);
        margin-bottom: 8px;
        margin-left: 10%;
        white-space: pre-wrap;
    }

    div.imdialog div.imhistdiv div.imhistitmrpypend {
        color: gray;
        white-space: pre-wrap;
        background-color: #FFFFFF;
    }


li.noresults {
    color: red;
    text-align: center;
}

body, .noselect {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.textselect, input[type="text"], input[type="password"], textarea {
    -webkit-user-select: text;
    -khtml-user-select: text;
    -moz-user-select: text;
    -ms-user-select: text;
    user-select: text;
}

a.csvdownload {
    display: none;
    font-size: 18px;
    color: var(--ct-primary-light-theme-colour);
}

    a.csvdownload:hover {
        color: red;
    }

a.csvdownloadclose {
    position: absolute;
    top: 0;
    right: 0;
}

    a.csvdownloadclose i.material-icons {
        font-size: 36px;
    }

a.csvdownloadicon {
    display: inline-block;
    height: 32px;
    width: 32px;
}

    a.csvdownloadicon i.material-icons {
        font-size: 48px;
    }

.gMapToolTip {
    display: none;
    position: absolute;
    z-index: 1;
    background: white;
    border: 2px solid lightgrey;
    pointer-events: none;
    padding: 6px;
    max-width: 500px;
}

/* Map Toolbar */
div.maptoolbar {
    position: absolute;
    left: 3px;
    top: 3px;
    z-index: 1;
    width: 100%;
}

/* Map Toolbar Icon */
div.maptoolbaricon {
    position: absolute;
    padding: 3px;
    margin: 0px;
    height: 25px;
    width: 25px;
    background-color: white;
    border-top: 1px solid #EEEEEE;
    border-left: 1px solid #EEEEEE;
    border-bottom: 1px solid #EEEEEE;
    color: #03A9F4;
}

    div.maptoolbaricon:hover {
        background-color: lightgrey;
        cursor: pointer;
    }

.toolbar-icon {
    width: 26px;
    height: 26px;
    display: inline-block;
    border: 2px solid transparent;
    cursor: pointer;
}

/*.toolbar-active:hover {
    border: 2px solid #c1b8b8;
    cursor: pointer;
    background: #d3d3d3;
}
*/
.toolbar-pressed {
    background-color: var(--ct-primary-theme-colour);
    /*border: 2px inset lightgrey;*/
}

    .toolbar-pressed i {
        color: white;
    }

.toolbar-disabled {
    background-color: white;
    pointer-events: none;
}

    .toolbar-disabled i {
        color: #999999;
        pointer-events: none;
    }

/*.ol-zoom {
    position: absolute;
    top: 40px;
    left: 4px;
}*/

   /* .ol-zoom button {
        min-width: 30px;
        min-height: 30px;
        width: 30px;
        height: 30px;
        display: block;
        background-color: white;
    }

        .ol-zoom button span.ui-button-text {
            padding: 0;
        }

        .ol-zoom button:hover {
            background-color: lightgrey;
            cursor: pointer;
        }

.ol-zoom-in {
    border-bottom: none;
}*/

.auditalt {
    color: #FF9800;
}

#gtblLog tbody tr:hover {
    background-color: lightgrey;
    cursor: pointer;
}
/*.rowselect {*/
.rowselect, tr.rowselect {
    background-color: var(--ct-primary-light-theme-colour); /* TR added to bump up hierarchy */
}

.rowhover:hover {
    background-color: lightgrey;
    cursor: pointer;
}
/*.rowselect:hover {*/
.rowselect:hover, tr.rowselect:hover {
    background-color: var(--ct-primary-light-theme-colour)70; /* TR added to bump up hierarchy */
}

tr.inactive-record {
    color: #9E9E9E;
}

label.inputsectorlabel.inactive-record {
    background-color: #D32F2F !important;
}

div.inputsector.inactive-record {
    outline: 4px solid #D32F2F !important;
}

.mapmagnifier {
    position: absolute;
    width: 300px;
    height: 300px;
    border-radius: 150px;
    border: 2px solid grey;
    z-index: 150;
    pointer-events: none;
}

    .mapmagnifier canvas {
        border-radius: 150px;
    }

div.newlayout table.newlayouttbl {
    width: 100%;
    table-layout: fixed;
}

    div.newlayout table.newlayouttbl > tbody > tr > td {
        vertical-align: top;
        padding: 0px;
        margin: 0px;
    }


div.newlayout input[type="text"], div.newlayout input[type="password"], div.newlayout textarea, div.newlayout .inputrow button, div.newlayout label.ui-button, #IE7 div.newlayout button[type="button"], #IE8 div.newlayout button[type="button"] {
    margin-right: 0px;
}

div.newlayout .inputrow label.ui-button {
    min-height: 0px;
    height: 23px;
}

div.newlayout .inputrow .ui-button-text-only .ui-button-text {
    padding: .2em 1em;
}

div.newlayout div.labelautowidth label.ui-button {
    width: auto;
}

.gmap {
    width: 100%;
    height: 100%;
    z-index: 65;
}

.gmapclose {
    position: absolute;
    top: 100px;
    right: 0px;
    z-index: 66;
    background-color: white;
    font-size: 24px;
    height: 24px;
    width: 24px;
}

    .gmapclose:hover {
        cursor: pointer;
    }

/* Context Menu Styling */
.contextMenu {
    list-style: none;
    margin: 0;
    padding: 0;
    position: absolute;
    box-shadow: 0 12px 15px 0 rgba(0, 0, 0, 0.2);
    background-color: white;
}

    .contextMenu * {
        transition: color .4s, background .4s;
    }

    .contextMenu li {
        min-width: 150px;
        /*overflow: hidden;*/ /* GB - Removed due to Chrome62 causing massive padding issue */
        white-space: nowrap;
        padding: 0px;
        border-bottom: 1px solid #ecf0f1;
        list-style-type: none;
        background-color: white;
    }

       /* .contextMenu li.pressed {
            background-color: #E0E0E0;
            outline: 1px solid grey;
        }*/

        .contextMenu li i {
            font-size: 14px;
            padding-right: 7px;
        }

        .contextMenu li a {
            text-decoration: none;
            padding: 6px 20px 6px 10px;
            display: block;
        }

        .contextMenu li:hover {
            background-color: #ecf0f1;
            cursor: pointer;
        }

.overFlowy {
    overflow-y: scroll;
    height: 150px;
}

.contextMenu-parent > a::after {
    /*background: url("menu_right.png") no-repeat right;*/
    content: 'chevron_right';
    font-family: 'Material Symbols Outlined';
    font-weight: normal;
    font-style: normal;
    font-size: 24px;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24;
    position: absolute;
    right: 0;
    color: var(--ct-surface-grey-6);
}

.contextMenu-parent > a:hover::after {
    color: var(--ct-primary-dark-theme-colour);
}


.contextMenu-parent ul {
    display: none;
    position: absolute;
   /* padding-left: 0px;
    background-color: white;
    box-shadow: 0 12px 15px 0 rgba(0, 0, 0, 0.2);*/
}

#gdivStatus {
    overflow-x: auto;
}

    #gdivStatus i {
        font-size: 16px;
    }

    #gdivStatus td {
        padding-left: 4px;
        padding-right: 4px;
        display: table-cell;
    }

        #gdivStatus td:hover {
            background-color: lightgrey;
            cursor: pointer;
        }

    #gdivStatus i {
        vertical-align: text-bottom;
    }

    #gdivStatus span {
        margin-left: 5px;
        white-space: pre;
    }

.hideele {
    display: none;
}

#IE7 ul.topbar li.topbarheader {
    display: inline-block;
    zoom: 1;
    *display: inline;
}

/* FIX FOR BUTTONs REPLACING INPUTs */
.ui-button .ui-button-text {
    pointer-events: none;
}

.ui-button:hover {
    background-color: #EEEEEE;
    border: 1px solid #DDDDDD;
}

.ui-button:active {
    background-color: var(--ct-primary-light-theme-colour);
    color: #FFFFFF;
}

    .ui-button:active .ui-button-icon {
        background-image: url(../js/jquery-ui-1.14.1.custom/images/ui-icons_ffffff_256x240.png);
    }

.ui-button:not(.ui-checkboxradio-radio-label):active .ui-button-text {
    color: #FFFFFF;
}

/* Disable pointer events */
.disable-ui {
    pointer-events: none;
}

/* Behind Div code - used to fade/blur data behind dim layers*/
.behind-div {
    pointer-events: none;
    opacity: .90;
}

/* CHECK BOX */
input[type="checkbox"] + label {
    position: relative;
    overflow: visible;
    white-space: nowrap;
    text-align: left;
    min-width: 48px;
    padding: 0;
    margin-left: -8px;
    display: inline-block;
}

    input[type="checkbox"] + label::before {
        font-family: 'Material Icons';
        font-size: 24px; /* Preferred icon size */
        height: 1em;
        width: 1em;
        vertical-align: middle;
        border-radius: 100%;
        background-color: transparent;
        transition: .25s;
        content: 'check_box_outline_blank';
        color: #BDBDBD;
        padding: 4px;
        /* Support for all WebKit browsers. */
        -webkit-font-smoothing: antialiased;
        /* Support for Safari and Chrome. */
        text-rendering: optimizeLegibility;
        /* Support for Firefox. */
        -moz-osx-font-smoothing: grayscale;
        /* Support for IE. */
        font-feature-settings: 'liga';
    }

input[type="checkbox"]:checked + label::before {
    content: 'check_box';
    color: var(--ct-primary-theme-colour);
}

input[type="checkbox"] + label:hover::before {
    background-color: rgba(0, 0, 0, .06);
}

input[type="checkbox"] + label:active::before {
    background-color: var(--ct-loader-alt-bg);
}

input[type="checkbox"]:focus + label::before {
    background-color: var(--ct-loader-alt-bg);
}

input[type="checkbox"] {
    width: 0px;
    height: 0px;
    overflow: hidden;
    position: absolute;
}
/*
    Styles table with scrollable tbody and stationary thead e.g frmMailEnquiry - user select table
*/
.scrolltable-container {
    height: 400px;
}

.scrolltable thead tr:after {
    /*to compensate for the scrollbar width*/
    content: "";
    width: 17px;
    display: table-cell;
    background-color: var(--ct-primary-light-theme-colour);
    border: 1px solid var(--ct-primary-light-theme-colour);
}

.scrolltable {
    display: flex;
    flex-flow: column;
    height: 100%;
    width: 100%;
    max-width: 100%;
    text-align: left;
    border-collapse: collapse;
}

    .scrolltable thead {
        flex: 0 0 auto;
        width: 100%;
    }

    .scrolltable tbody {
        flex: 1 1 auto;
        display: block;
        overflow-y: scroll;
    }

        .scrolltable tbody tr {
            width: 100%;
        }

        .scrolltable thead, .scrolltable tbody tr {
            display: table;
            table-layout: fixed;
        }

    .scrolltable th {
        background-color: var(--ct-primary-light-theme-colour);
        color: white;
        height: 26px;
        text-align: left;
        border-radius: 0;
        border-spacing: 0;
        border-top: 1px solid var(--ct-primary-light-theme-colour);
        border-bottom: 1px solid var(--ct-primary-light-theme-colour);
    }

    .scrolltable tr, .scrolltable td {
        padding-top: 5px;
        padding-bottom: 5px;
        border-bottom: 1px solid lightgrey;
        -moz-border-radius: 0;
        -webkit-border-radius: 0;
        border-radius: 0;
        word-wrap: break-word;
    }

/* Lists */

div.scrolllist > div {
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    margin-left: 10px;
}

div.scrolllist input[type="checkbox"] {
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
}

div.scrolllist .scrolllist-inactiverecord {
    color: #bdbdbd !important;
}

/* Material icons in inputsector labels */

.inputsectorlabel-icon {
    color: white;
    vertical-align: middle;
}

/* File selects */

label.filelabel {
    border: 1px solid #DDDDDD;
    cursor: pointer;
    height: 24px;
    margin-top: 1px;
    padding-top: 0px;
    width: 4%;
    text-align: center;
    box-sizing: border-box;
}

/*input.filevalue {
    width: 34%;
    margin-left: -9px;
}*/

div.narrowsector2 label.filelabel {
    width: 8%;
}

div.narrowsector2 input[type="text"].filevalue {
    width: 52%;
}

/* Simple dividers */

div.divider-top {
    padding-bottom: 10px;
    border-bottom: 1px solid #DDDDDD;
    margin-bottom: 10px;
}

div.divider-bottom {
    padding-top: 10px;
    border-top: 1px solid #DDDDDD;
    margin-top: 10px;
}

/* Container for popup windows */
div.popup-container {
    background-color: transparent;
}

/* Dropdown menus - e.g. Resource Manager Record */

/* The dropdown container */
.dropdown {
    overflow: hidden;
    display: inline-block;
    vertical-align: bottom;
}

/* The dropdown button text/icon */
.dropdown-title {
    margin-left: -7px;
}

.dropdown-title-icon {
    position: absolute;
    top: 0px;
    right: 0px;
}

/* Dropdown content (hidden by default) */
.dropdown-content {
    display: none;
    position: absolute;
    background-color: var(--ct-surface-bg);
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
    z-index: 99;
    border-radius: 5px;
    border: 1px solid var(--ct-surface-grey-5);
    margin-left:-2px;
    margin-top:1px;
    padding:0px 4px 4px 4px;
}

    /* Links inside the dropdown */
    .dropdown-content div {
        float: none;
        color: var(--ct-on-surface-bg);
        padding: 12px 16px;
        text-decoration: none;
        display: block;
        text-align: left;
        border-radius: 5px;
        margin-top: 4px;
        background:var(--ct-primary-light-theme-colour);
    }


        .dropdown-content div.toolbar-disabled {
            background: var(--ct-surface-grey-3);
            color:var(--ct-surface-grey-6);
        }


        /* Add a grey background color to dropdown links on hover */
        .dropdown-content div:hover {
            background-color: #ddd;
            cursor: pointer;
        }

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {
    display: block;
}

/* Align link text with icon */
.dropdown-label {
    vertical-align: super;
    margin-left: 5px;
    cursor: pointer;
}

/* Dropdowns against a record - to be shown when opening a valid record id */
.dropdown-record {
    display: none;
}

/* Styles for the Colour Picker widget */
.mcs-colour {
    cursor: pointer;
}

.mcs-sample {
    text-align: center;
    text-transform: uppercase;
    font-size: 16px;
    font-weight: bold;
    transition: all .4s ease-in-out .1s !important;
}

.mcs-swatch {
    margin: 0 auto 0 auto;
    width: 250px;
    height: 100px;
    background-image: none;
}

.mcs-slider {
    margin: 15px auto 15px auto;
    clear: left;
    width: 250px;
}

.mcs-red .ui-slider-range {
    background: #ef2929 !important;
}

.mcs-red .ui-slider-handle {
    border-color: #ef2929;
}

.mcs-green .ui-slider-range {
    background: #8ae234 !important;
}

.mcs-green .ui-slider-handle {
    border-color: #8ae234;
}

.mcs-blue .ui-slider-range {
    background: #729fcf !important;
}

.mcs-blue .ui-slider-handle {
    border-color: #729fcf;
}

.mcs-label {
    font-size: 18px;
    padding: 6px 6px 10px 8px;
    display: block;
}

.mcs-row {
    display: table;
    width: 100%;
    table-layout: fixed;
}

.mcs-cell {
    display: table-cell;
    border: 1px solid #DDDDDD;
    width: 30%;
    vertical-align: top;
}

.mcs-basic, .mcs-custom {
    border: 1px solid #DDDDDD;
    height: 100%;
    width: 100%;
}

.mcs-custom-add, .mcs-custom-del {
    position: fixed;
    margin-top: 4px;
}

.mcs-sub-cell {
    display: table-cell;
    width: 30%;
    padding: 3px;
}

.mcs-sub-row {
    display: table;
    height: 35px;
    width: 95%;
    padding-left: 6px;
    padding-right: 6px;
    table-layout: fixed;
}

/* Audit window */
/*#region Audit window */
/*#gdivAudit {
    height: 700px;
}

    #gdivAudit > div {
        height: 100%;
        width: 100%;
        display: grid;*/
        /*Grid rows: Header, filters, buttons, table, close button */
        /*grid-template-rows: 34px auto 60px auto 60px;
    }

        #gdivAudit > div > div.divider-bottom {
            border-top: 1px solid #c0c0c0;
        }

        #gdivAudit > div > label,
        #gdivAudit > div > div {
            height: -webkit-fill-available;
            width: -webkit-fill-available;
            overflow: hidden;
            margin: 0;
            padding: 8px;
        }

            #gdivAudit > div > div label {
                width: -webkit-fill-available;
                overflow: hidden;
            }*/

.divaudit-jrnyopt {
    display: none;
}

/*#txtAuditText {
    margin-left: 8px;
    width: -webkit-fill-available;
}*/
/*#endregion Audit window */

/* Pending Jrnys */

#gTblPending {
    width: 6000px;
}

#gDivPendingContainer {
   /* width: 100%;
    overflow: auto;*/
    height: 60vh;
}

#gDivPending {
    width: 80vw;
}

#gDivPendingSrch {
    margin-top: 5px;
}

#gTblPending > thead > tr > th {
    z-index: 2;
}

#gTblPending > tbody > tr td {
    position: relative;
}

#gTblPending > tbody > tr > td > div {
    height: 5vh;
    width: 100%;
    text-overflow: ellipsis;
    overflow: hidden;
}

#gTblPending > tbody > tr.highlight {
    background: lightgrey;
    box-shadow: 0px 0px 2px 4px lightgrey;
}

    #gTblPending > tbody > tr.highlight > td > div > div {
        position: absolute;
        max-height: 20vh;
        background: lightgrey;
        z-index: 1;
        max-width: 3.7vw;
        margin-bottom: 5px;
        box-shadow: 0px 0px 2px 5px lightgrey;
    }

#gTblPending > tbody > tr.dim {
    opacity: 0.5;
}

#gDivPendingSrch > table {
    width: 100%;
    margin: 0 auto;
}

@media print {
    #gDivPending {
        width: 100vw;
        margin-left: 0px;
        left: 0;
    }
}

#gTblPending thead tr th,
#gTblPending tbody tr td {
    white-space: normal;
    overflow: visible;
    text-overflow: ellipsis;
}

#gTblPending tbody tr:hover,
#gTblPending tbody tr:hover td {
    background: lightgrey;
}



.read-only-system {
    background-color: #00FFFF !important;
}

/* Tree View List */
div.tree-view-list {
    overflow-y: scroll;
    height: 450px;
}

    div.tree-view-list tr.trParent:hover {
        background-color: lightgrey;
    }

input[type="checkbox"]:checked.tree-view-list-partial + label::before {
    content: attr(data-icon);
    color: var(--ct-primary-light-theme-colour);
    text-transform: none;
}
/* / Tree View List */

.newMail {
    animation: 1.4s newMailAlert infinite;
}

@keyframes newMailAlert {
    0% {
        background: red;
        color: white;
    }

    50% {
        background: white;
        color: var(--ct-on-surface-bg);
    }

    100% {
        background: red;
        color: white;
    }
}

/* Close button on records */
.btn-close {
    border: 2px solid #D32F2F !important;
}

.modal-close {
    cursor: pointer;
}

/*Print Destination window*/
#divPrintDestination {
    display: none;
}

#divPrintType {
    height: 305px;
}

.printOptions {
    transition: .5s;
    overflow: hidden;
    border-top: 1px solid #BDBDBD;
    border-bottom: 1px solid #BDBDBD;
    width: 50%;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

    .printOptions.selected {
        padding-top: 5px;
        padding-bottom: 5px;
        height: 100px;
        margin-top: 5px;
        margin-bottom: 5px;
    }

    .printOptions:not(.selected) {
        height: 0px;
        border: none;
    }

    .printOptions > .inputrow label.inputlabel {
        width: 26%;
    }

    .printOptions > .inputrow input[type="text"] {
        width: 60%;
    }

    .printOptions > div.inputrow select {
        width: 60%;
    }

    .printOptions > .inputrow {
        width: 100%;
        display: block;
    }

#divPrintType > label {
    display: block;
    text-align: center;
}

#divPrintType span.ui-button-text {
    width: 8vw;
}

#divPrintType input[type="radio"] + label::before {
    font-size: 35px;
}

#divPrintType input[type="radio"] + label[for="radPrint"]::before {
    content: 'print';
}

#divPrintType input[type="radio"] + label[for="radPDF"]::before {
    content: 'picture_as_pdf';
}

#divPrintType input[type="radio"] + label[for="radHTML"]::before {
    content: 'code';
}

#divPrintType input[type="radio"] + label[for="radCSV"]::before {
    content: 'assignment';
}

#divPrintType input[type="radio"]:checked + label::before {
    color: var(--ct-primary-light-theme-colour);
    text-transform: none;
}

div#gdivLinkedAbortAssociated {
    width: 55%;
    margin-left: 0 !important;
    transform: translateX(-50%);
}

input#chkAssociatedJourney {
    height: 15px;
    width: 15px;
    position: relative;
}

.pinkColour,
.blueColour,
.greenColour,
.redColour,
.orangeColour,
.purpleColour,
.lightColour,
.blackColour,
.openColours {
    height: 40px;
    width: 40px;
    text-align: center;
    margin: 5px 2px 5px 2px;
    cursor: pointer;
    line-height: 40px;
    font-weight: 600;
    font-size: 15px;
    transition: 0.5s;
    box-shadow: 2px 2px 6px #6d6d6d;
    border: 2px solid #25252525;
}

.pinkColour {
    background: var(--ct-primary-light-theme-colour);
    color: #ffffff;
    border: 2px solid black;
}

.blueColour {
    background: #2196f3;
    color: #ffffff;
}

.greenColour {
    background: #41a535;
    color: #ffffff;
}

.redColour {
    background: #ff5252;
    color: #ffffff;
}

.purpleColour {
    background: #e040fb;
    color: #ffffff;
}

.orangeColour {
    background: #ffab40;
    color: #000000;
}

.blackColour {
    background: #292929;
    color: #ffffff;
}

.lightColour {
    color: var(--ct-on-surface-bg);
    background-color: white;
}

.openColours i.material-icons {
    height: 40px;
    width: 40px;
    text-align: center;
    font-size: 40px;
    -webkit-text-stroke: 2px;
    -webkit-text-stroke-color: black;
}

#gdivUserSettings .inputsector {
    width: unset;
}

.inputrow.colourGrid {
    position: relative;
    display: inline-flex;
    grid-auto-flow: column;
    justify-content: left;
}

p.changeColourWarning,
p.changeAlertWarning {
    font-size: 11px;
    text-align: right;
    font-style: italic;
    margin-bottom: 0px;
}

.userSettingsHeader span {
    text-transform: capitalize;
}

.alertsContent {
    display: inline-flex;
    box-shadow: 2px 2px 5px #828282;
    text-align: center;
    cursor: pointer;
    margin: 5px;
}

    .alertsContent i.material-icons {
        font-size: 40px;
        text-align: center;
        background-color: transparent !important;
        display: block;
        min-width: 90px;
    }

    .alertsContent label.inputlabel {
        padding-top: 5px;
        display: inline-block;
        text-align: center;
        width: 100% !important;
    }

.custom-menu {
    display: none;
    z-index: 1000;
    position: absolute;
    overflow: hidden;
    border: 1px solid #CCCCCC;
    white-space: nowrap;
    font-family: sans-serif;
    background: #FFFFFF;
    color: #333;
    border-radius: 5px;
    padding: 0;
}

    .custom-menu li {
        padding: 8px 12px;
        cursor: pointer;
        list-style-type: none;
        transition: all .3s ease;
        user-select: none;
    }

        .custom-menu li:hover {
            background-color: #DEF;
        }

#tblMain thead {
    background: var(--ct-primary-theme-colour) !important;
}

.sorttable tbody tr.rowselect:not(.no-result),
.sorttable tbody tr.rowselect:not(.no-result) td {
    background: var(--ct-primary-light-theme-colour) !important;
}

/*Scrollbar*/
/* width */
::-webkit-scrollbar {
    width: 20px;
}

/* Track */
::-webkit-scrollbar-track {
    background: #f1f1f1;
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: #888;
}

    /* Handle on hover */
    ::-webkit-scrollbar-thumb:hover {
        background: #555;
    }

#divMainSearch {
    font-size: 16px;
    width: 790px;
    margin: auto;
    height: 44px;
    margin-bottom: 12px;
    position: relative;
    margin-top: 15px;
}

#inputMainSearch {
    background-color: #FFFFFF;
    border: none;
    border-radius: calc(0.5 * 44px);
    font-family: inherit;
    font-size: inherit;
    height: 100%;
    outline: none;
    padding-inline-end: 20px;
    padding-inline-start: 50px;
    position: relative;
    width: 100%;
    z-index: 80;
}

#iMainSearch {
    color: #616161;
    position: absolute;
    top: 13px;
    left: 16px;
    font-size: 21px;
    cursor: default !important;
    z-index: 80;
}

#divMainShortcuts {
    display: flex;
    flex-wrap: wrap;
    height: calc(var(--row-count) * var(--tile-size));
    justify-content: center;
    margin-bottom: 8px;
    overflow: hidden;
    padding: 2px;
    transition: opacity 300ms ease-in-out;
    width: 600px;
    margin: auto;
    zoom: 1.3;
    margin-top: 0px;
    padding-bottom: 20px;
    background: #FFFFFF;
    border-radius: calc(0.5 * 44px);
}

.main-shortcut {
    -webkit-tap-highlight-color: transparent;
    align-items: center;
    border-radius: 4px;
    box-sizing: border-box;
    cursor: pointer;
    display: flex !important;
    flex-direction: column;
    height: var(--tile-size);
    opacity: 1;
    outline: none;
    position: relative;
    text-decoration: none;
    transition-duration: 300ms;
    transition-property: left, top;
    transition-timing-function: ease-in-out;
    user-select: none;
    width: var(--tile-size);
}

.main-shortcut-icon {
    align-items: center;
    border-radius: 50%;
    display: flex;
    flex-shrink: 0;
    height: var(--icon-size);
    justify-content: center;
    margin-top: 16px;
    width: var(--icon-size);
}

.main-shortcut-title {
    align-items: center;
    border-radius: 12px;
    color: rgba(0, 0, 0, 1);
    display: flex;
    height: var(--title-height);
    line-height: calc(var(--title-height) / 2);
    margin-top: 6px;
    padding: 2px 8px;
    width: 90%;
    text-align: center;
}

.main-shortcut-icon i.material-icons {
    font-size: 38px;
}

.main-shortcut-title span {
    width: 100%;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    font-size: calc(var(--title-height) * 0.35);
}

.main-shortcut:hover {
    background: #f5f5f5;
}

img.badge.main-search,
img.badgesystems.main-search {
    position: fixed;
    z-index: -1;
    max-height: 148px;
    top: 46px;
    left: calc(50% + 42px);
    transform: translate(-50%);
}

#toolSearchResults.main-search {
    display: block;
    position: fixed;
    overflow: auto;
    padding: 1em;
    background: #FFFFFF;
    box-shadow: rgb(33 33 33 / 50%) 0px 0px 0px 5000px;
    opacity: 1;
    transition: .5s;
    z-index: 75;
    position: absolute;
    left: 0;
    max-width: none;
    max-height: calc(76vh - 165px);
    top: 0px;
    border-radius: calc(0.5 * 44px);
    overflow: hidden;
    padding-top: 44px;
    height: calc(76vh - 165px);
    width: 96%;
}

    #toolSearchResults.main-search ul {
        list-style: none;
        padding: 0px;
        padding-left: 3px;
        padding-right: 3px;
        background: #FFFFFF;
        height: 100%;
        overflow: hidden;
        overflow-y: auto;
        margin-left: -15px;
        padding-left: 30px;
    }

        #toolSearchResults.main-search ul.navSubSec {
            margin-top: 0px;
        }

            #toolSearchResults.main-search ul.navSubSec li.searching-match {
                top: 0px;
                margin-top: 0px;
            }

    #toolSearchResults.main-search strong::before {
        visibility: hidden;
    }

    #toolSearchResults.main-search strong {
        font-weight: 400;
    }

    #toolSearchResults.main-search a {
        font-weight: 400;
    }

    #toolSearchResults.main-search .navSubSec li:not(.searching-match) a {
        min-height: 100px;
    }

#gdivNav.main-search > div > ul > li:first-child {
    display: none;
}

#toolSearchResults.main-search.searching + #divMainSearchInput {
    box-shadow: none;
}

#divMainSearchInput {
    height: 100%;
    width: 100%;
    border-radius: calc(0.5 * 44px);
    box-shadow: 0 1px 6px 0 rgb(32 33 36 / 28%);
}

#toolSearchResults.main-search .navSubSec.nomatch li {
    left: 50%;
    top: 50%;
    position: absolute;
    transform: translate(-50%, -50%);
}

#toolSearchResults.main-search .navSubSec li {
    position: relative;
}

.main-shortcut-more {
    border-radius: 15px;
    margin-top: 5px;
    margin-right: 5px;
    color: #616161 !important;
    font-size: 16px !important;
    padding: 2px;
    position: absolute;
    top: 0;
    right: 0;
    opacity: 0;
}

:hover > .main-shortcut-more {
    opacity: 1;
}

.main-shortcut-more:hover {
    background: #E0E0E0;
}

#toolSearchResults.main-search ul::-webkit-scrollbar {
    display: inherit !important;
}

#toolSearchResults.main-search ul::-webkit-scrollbar-thumb {
    -webkit-border-radius: 10px;
    border-radius: 10px;
    background: rgba(158,158,158,0.8);
    height: 35px;
}

#toolSearchResults.main-search ul::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 3px rgb(0 0 0 / 30%);
    -webkit-border-radius: 10px;
    border-radius: 10px;
    margin-top: 52px;
    background: transparent;
}

@media (min-width: 701px) and (max-width: 900px) {
    #divMainSearch {
        width: 620px;
        margin-left: 45px;
    }

    img.badge.main-search,
    img.badgesystems.main-search {
        max-height: 118px;
        top: 66px;
    }

    #divMainShortcuts {
        width: 450px;
        margin-left: 38px;
        --tile-size: 90px !important;
    }

    .main-shortcut {
        --tile-size: 90px !important;
    }

    .main-shortcut-icon {
        --icon-size: 45px !important;
    }

    .main-shortcut-title {
        --title-height: 30px !important;
    }

    #toolSearchResults.main-search {
        width: 590px;
    }

        #toolSearchResults.main-search .navSubSec li {
            width: 122px;
        }

        #toolSearchResults.main-search .material-icons {
            font-size: 44px;
        }

        #toolSearchResults.main-search .navSubSec li:not(.searching-match) a {
            font-size: 13px;
            min-height: 80px;
        }
}

@media (max-width: 700px) {
    #divMainSearch {
        width: 480px;
    }

    img.badge.main-search,
    img.badgesystems.main-search {
        max-height: 100px;
        top: 88px;
    }

    #divMainShortcuts {
        width: 360px;
        --tile-size: 72px !important;
    }

    .main-shortcut {
        --tile-size: 72px !important;
    }

    .main-shortcut-icon {
        --icon-size: 36px !important;
    }

    .main-shortcut-title {
        --title-height: 24px !important;
    }

    #toolSearchResults.main-search {
        width: 450px;
        z-index: 80;
    }

        #toolSearchResults.main-search .navSubSec li {
            width: 100px;
        }

        #toolSearchResults.main-search .material-icons {
            font-size: 35px;
        }

        #toolSearchResults.main-search .navSubSec li:not(.searching-match) a {
            font-size: 11px;
            min-height: 70px;
        }
}

#divStartSearch {
    width: 96%;
    margin-left: 2%;
    margin-right: 2%;
    border-radius: 10px;
    background-color: #EFEFEF;
    color: #757575;
}

#divNoResults {
    width: 100%;
    text-align: center;
    padding-top: 50px;
    padding-bottom: 50px;
    color: #757575;
}

    #divNoResults .searchResultsIcon {
        width: 70px;
        height: 70px;
        margin-left: auto;
        margin-right: auto;
        background-color: #757575;
        border-radius: 50%;
    }

    #divNoResults .material-icons {
        font-size: 50px;
        line-height: 70px;
        width: 100%;
        color: #FFFFFF;
        padding-bottom: 25px;
    }

#gTblDeviceDiagnostics {
    border-collapse: collapsed;
    border-spacing: 0px;
    padding: 15px;
}

    #gTblDeviceDiagnostics td {
        padding: 10px;
        background: #efefef;
        line-height: 25px;
    }

    #gTblDeviceDiagnostics .material-icons {
        color: #ffffff;
    }

#divSettingsOpts, #divDeviceDiagnosticsOpts {
    position: absolute;
    left: 13px;
    margin-top: 2px;
}

    #divDeviceDiagnosticsOpts i.material-icons {
        padding-top: 2px;
        padding-left: 5px;
        padding-right: 5px;
        margin-right: 6px;
        padding-bottom: 3px;
    }

        #divDeviceDiagnosticsOpts i.material-icons:hover {
            background: #E0E0E0;
        }


.cds-row {
    display: flex;
    flex-wrap: wrap;
    column-gap: 7px;
    align-items: stretch;
}

.cds-row-center {
    align-items: center;
}

.cds-col {
    flex: 1;
}

.cds-col-2 {
    flex: 2;
}

.cds-col-auto {
    width: auto;
    max-width: none;
    flex: 0 0 auto;
}

.cds-mb-0 {
    margin-bottom: 0px !important;
}

.cds-mb-1 {
    margin-bottom: 5px;
}

.cds-mb-2 {
    margin-bottom: 10px;
}

.cds-mb-3 {
    margin-bottom: 15px;
}

.cds-divider {
    border-top: 1px solid #d2d2d2;
}

.cds-divider-right {
    padding-right: 10px;
    border-right: 1px solid #d2d2d2;
}

.cds-mb-1 {
    margin-bottom: 5px;
}

.cds-mb-2 {
    margin-bottom: 10px;
}

.cds-mb-3 {
    margin-bottom: 15px;
}

.cds-widget {
    border: 1px solid #CCCCCC;
    background: #EFEFEF;
    padding: 8px;
    font-size: 32px;
}

    .cds-widget h4 {
        margin: 0;
        font-size: 14px;
        padding-bottom: 8px;
    }

.cds-container {
    max-width: 96%;
    margin: 0 auto;
}

.pulse-blob {
    background: black;
    border-radius: 50%;
    box-shadow: 0 0 0 0 rgba(0, 0, 0, 1);
    margin: 10px;
    height: 20px;
    width: 20px;
    transform: scale(1);
    animation: pulse-black 2s infinite;
}

@keyframes pulse-black {
    0% {
        transform: scale(0.95);
        box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.7);
    }

    70% {
        transform: scale(1);
        box-shadow: 0 0 0 10px rgba(0, 0, 0, 0);
    }

    100% {
        transform: scale(0.95);
        box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
    }
}

.pulse-blob.orange {
    background: rgba(255, 121, 63, 1);
    box-shadow: 0 0 0 0 rgba(255, 121, 63, 1);
    animation: pulse-orange 2s infinite;
}

@keyframes pulse-orange {
    0% {
        transform: scale(0.95);
        box-shadow: 0 0 0 0 rgba(255, 121, 63, 0.7);
    }

    70% {
        transform: scale(1);
        box-shadow: 0 0 0 10px rgba(255, 121, 63, 0);
    }

    100% {
        transform: scale(0.95);
        box-shadow: 0 0 0 0 rgba(255, 121, 63, 0);
    }
}

.pulse-blob.green {
    background: rgba(51, 217, 178, 1);
    box-shadow: 0 0 0 0 rgba(51, 217, 178, 1);
    animation: pulse-green 2s infinite;
}

@keyframes pulse-green {
    0% {
        transform: scale(0.95);
        box-shadow: 0 0 0 0 rgba(51, 217, 178, 0.7);
    }

    70% {
        transform: scale(1);
        box-shadow: 0 0 0 10px rgba(51, 217, 178, 0);
    }

    100% {
        transform: scale(0.95);
        box-shadow: 0 0 0 0 rgba(51, 217, 178, 0);
    }
}

.inputsector-style2 .inputsectorlabel {
    background: #efefef;
    padding: 12px 28px;
    color: #000;
    box-shadow: unset !important;
    font-weight: 700;
}

.inputsector-style2 .inputsectorlabel-icon {
    color: var(--ct-primary-light-theme-colour) !important;
}

.pageSubHeader {
    border-bottom: 3px solid var(--ct-primary-light-theme-colour);
    padding-top: 1rem;
    padding-bottom: 1rem;
    margin-top: 50px;
}

    .pageSubHeader h1 {
        font-size: 1.2rem;
        line-height: 1rem;
    }

.ol-rotate {
    position: absolute;
    top: 40px;
    left:3px;
}

button.ol-rotate-reset {
   /* width: 28px !important;*/
    min-width: unset !important;
    width:100%;
    padding:0px;
}

    button.ol-rotate-reset .ui-button-text {
        padding: 0px !important;
        /* width: 22px !important;*/
    }

.ol-compass {
    display: block;
}

.scrolltable-container {
    border: 1px solid #EFEFEF;
}

    .scrolltable-container table {
        width: 100%;
        margin: 0px;
    }

        .scrolltable-container table thead {
            position: sticky;
            top: 0;
            z-index: 5;
        }

.missedRowSel > span, .missedRowSel > td {
    background-color: var(--ct-primary-light-theme-colour) !important;
    color:var(--ct-primary-dark-theme-colour);
    opacity:0.8;
}

.missedRowHover > span, .missedRowHover > td {
    opacity:1;
}

.ui-selectmenu-button {
    border: 1px solid transparent;
}

.ui-menu .ui-menu-item {
    padding: 0px;
}

.ui-menu .ui-menu-item-wrapper {
    padding: 6px;
    border-bottom: 1px solid #EFEFEF;
    margin: 0 2px;
}

    .ui-menu .ui-menu-item-wrapper.ui-state-active {
        background-color: #E0E0E0;
        outline: 1px solid #CCCCCC;
        border: 0px;
        color: #333333;
        font-weight: normal;
        box-shadow: unset;
    }

.actCol {
    display: inline-block;
    float: right;
    width: 25%;
}

ul.autocomplete li.inactive .actCol {
    color: #000000 !important;
}

/*#divMapContainer {
    background-color: #d5f4f8 !important;
}*/

.sticky-table-tr {
    position: sticky;
    z-index: 10;
    top: 0;
}

.marquee-warning {
    background: #FFC107;
    color: #000000;
    font-weight: 600;
    letter-spacing: 1.5px;
}

/* Marquee styles */
.marquee {
    --gap: 1rem;
    position: relative;
    flex: 1;
    overflow: hidden;
    user-select: none;
    gap: var(--gap);
}

.marquee__content {
    display: flex;
    min-width: 100%;
    margin: 0px;
    padding: 2px;
}

@keyframes scroll {
    from {
        transform: translateX(100%);
    }

    to {
        transform: translateX(-100%);
    }
}

/* Enable animation */
.enable-animation .marquee__content {
    animation: scroll 30s linear infinite;
}

.marquee__content:hover {
    animation-play-state: paused;
}
/* Reverse animation */
.marquee--reverse .marquee__content {
    animation-direction: reverse;
}

/* Pause on hover */
.marquee--hover-pause:hover .marquee__content {
    animation-play-state: paused;
}

/* Attempt to size parent based on content. Keep in mind that the parent width is equal to both content containers that stretch to fill the parent. */
.marquee--fit-content {
    max-width: fit-content;
}

/* A fit-content sizing fix: Absolute position the duplicate container. This will set the size of the parent wrapper to a single child container. Shout out to Olavi's article that had this solution 👏 @link: https://olavihaapala.fi/2021/02/23/modern-marquee.html  */
.marquee--pos-absolute .marquee__content:last-child {
    position: absolute;
    top: 0;
    left: 0;
}

/* Enable position absolute animation on the duplicate content (last-child) */
.enable-animation .marquee--pos-absolute .marquee__content:last-child {
    animation-name: scroll-abs;
}

@keyframes scroll-abs {
    from {
        transform: translateX(calc(100% + var(--gap)));
    }

    to {
        transform: translateX(0);
    }
}

.marquee__content li {
    display: inline-block;
    margin-left: 2px;
    padding: 6px;
    border-radius: 4px;
    border: 1px solid rgba(0,0,0, 0.5);
    flex: none;
}

    .marquee__content li .cds-row {
        align-items: center;
    }

.marquee_icon .material-icons {
    vertical-align: middle;
    padding: 8px;
    background: rgba(255,255,255,0.3);
    border-radius: 4px;
}

.popout-input {
    position: relative;
    z-index: 999;
}


#divAddrResults {
  /*  overflow: scroll;*/
    height: 290px;
}

#cmdAddrSearch {
    font-weight: bold;
    outline: none !important;
}

    #cmdAddrSearch.populated {
        border: 2px solid #2196f3;
    }

        #cmdAddrSearch.populated span {
            padding-top: 2px;
        }

/*#divAddressSrchInner {
    position: relative;
}*/


div.normaldiv > .inputsector {
    padding: 0px;
    margin-top: -2px;
}

#srchAddrBG {
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.2);
    position: absolute;
    top: 0;
    left: 0;
}

.addrAutoComp {
    display: none;
    max-height: unset;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 0;
    margin-top: -0.15em;
    z-index: 51;
    width: 100%;
    font-size: 12px;
    text-align: left;
    height: 400px;
    top: 121%;
    border-radius: 4px;
    border: 2px solid #a3a3a3;
    background-color: white;
}

    .addrAutoComp table {
        border-collapse: collapse;
    }


        .addrAutoComp table tr td {
            padding: 8px;
        }

        .addrAutoComp table thead {
            z-index: 1;
        }

    .addrAutoComp tbody tr:hover {
        cursor: pointer;
    }

#ifmMainCont {
    background: none;
}

#ifmHead {
    height: 10px;
    width: 100%;
    cursor: pointer;
}

#gIfrmSnapLeft {
    left: 0;
    position: absolute;
}

#gIfrmSnapRight {
    right: 0;
    position: absolute;
}

#gIfrmSnapBottom {
    bottom: 0;
    height: 550px;
    width: 1100px;
    position: absolute;
}

div.ifrm_snapcontainer {
    position: fixed;
    box-shadow: #0000004d 1px 1px 10px 0px;
    padding: 1rem;
    height: 84vh;
    width: 47vw;
    bottom: 55px;
    margin: 0.1rem;
    border-radius: 4px;
    background: #ffffffbd;
    z-index: 21;
    backdrop-filter: blur(48px);
    border: 1px solid #0000000d;
}

#gIfrmSnapBottom {
    width: 50vw;
    bottom: 55px;
    left: calc(50% - 25vw);
}

div.shortcut_snapcontainer {
    position: fixed;
    box-shadow: var(--ct-primary-light-theme-colour) 1px 1px 10px 0px;
    border-radius: 4px;
    background: var(--ct-primary-light-theme-colour)14;
    z-index: 89;
}

.toolbarDisabled {
    color: #696969 !important
}

input.invalid {
    background: rgba(255, 255, 255, 0.4) 98% 50% no-repeat url(data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='28px' viewBox='0 0 24 24' width='28px' fill='%23B00020'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Ccircle cx='12' cy='19' r='2'/%3E%3Cpath d='M10 3h4v12h-4z'/%3E%3C/svg%3E) !important;
    outline: 1px solid #b00020 !important;
    border-radius: 3px !important;
    border: 1px solid #b00020 !important;
}

div.toastCont.stacked, div.statusbar-popup {
    border: 3px solid var(--ct-primary-theme-colour) !important;
    border-left: 4px solid var(--ct-primary-theme-colour) !important;
    background: #efefef !important;
}

div.toastCont.stacked, div.statusbar-popup {
    position: fixed;
    bottom: calc(1em + 40px);
    right: 1em;
    border: 3px solid var(--ct-primary-theme-colour);
    border-left: 4px solid var(--ct-primary-theme-colour);
    border-radius: 8px;
    background: #FFFFFF;
    font-size: 1rem;
    box-shadow: 3px 3px 6px rgb(0 0 0 / 50%);
    width: 330px;
    z-index: 9999;
    height: 385px;
    overflow: visible;
    padding-top: 0px;
    cursor: grab;
    min-height: 129px;
    background: #f5f5f5;
}

.toastBadge {
    position: absolute;
    top: -25px;
    left: 5px;
    background: var(--ct-primary-dark-theme-colour);
    height: 39px;
    width: 39px;
    z-index: 10000;
    border-radius: 4px;
    opacity: 1;
    transition: opacity 0.5s;
    border: 2px solid #FFFFFF;
    display: none;
    justify-content: center;
    align-items: center;
}

#tblMain tfoot {
    background: var(--ct-surface-bg) !important;
}

    #tblMain tfoot .control-left, .toolstable .control-left {
        margin-left: 0px !important;
        text-align: left;
    }

        #tblMain tfoot .control-left label:first-child, .toolstable tfoot .control-left label:first-child {
            display: block;
            font-size: 11px;
            margin-top: -4px;
            margin-left: 8px;
            margin-bottom: 4px;
        }

input[type="checkbox"]:checked + label.ui-button, input[type="radio"]:checked + label.ui-button {
    color: var(--ct-on-surface-bg);
    background: transparent;
    box-shadow: none;
}

table.sorttable tr td:first-child::before {
    border-left: unset !important;
}

table.sorttable tr td::after {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0px;
    content: '';
    border-left: 1px solid var(--ct-surface-grey-3);
}

/* Radio/Check Kill Other UI */

input[type="checkbox"]:not(:checked) + label.ui-state-default,
input[type="radio"]:not(:checked) + label.ui-state-default {
    color: var(--ct-on-surface-bg);
    background: transparent;
    box-shadow: none;
}

input[type="checkbox"]:disabled + label {
    opacity: .5;
}

input[type="radio"]:disabled + label {
    opacity: .5;
}

input[type="checkbox"] + label.ui-button {
    border: 0;
}

input[type="radio"] + label.ui-button {
    border: 0;
}

input[type="checkbox"]:checked + label.ui-button,
input[type="radio"]:checked + label.ui-button {
    color: var(--ct-on-surface-bg);
    background: transparent;
    box-shadow: none;
}

input[type="checkbox"] + label > span.ui-button-text,
input[type="radio"] + label > span.ui-button-text {
    display: inline-block;
    padding: initial;
    padding: 0;
    margin: 0;
    vertical-align: middle;
}

input[type="checkbox"] + label > span.ui-icon,
input[type="radio"] + label > span.ui-icon {
    display: none;
}


input[type="checkbox"]:checked.tree-view-list-partial + label::before {
    content: attr(data-icon);
    color: var(--ct-primary-theme-colour);
    text-transform: none;
}

input.required,
textarea.required,
select.required {
    background: 98% 50% no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' enable-background='new 0 0 20 20' height='28px' viewBox='0 0 20 20' width='28px' fill='%23FF7B7B'%3E%3Crect fill='none' height='20' width='20'/%3E%3Cpolygon points='16.81,7.8 15.31,5.2 11.5,7.4 11.5,3 8.5,3 8.5,7.4 4.69,5.2 3.19,7.8 7,10 3.19,12.2 4.69,14.8 8.5,12.6 8.5,17 11.5,17 11.5,12.6 15.31,14.8 16.81,12.2 13,10'/%3E%3C/svg%3E");
}

required.invalid {
    background-color: rgb(255, 123, 123) !important;
}

input.invalid {
    background: rgba(255, 255, 255, 0.4) 98% 50% no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='28px' viewBox='0 0 24 24' width='28px' fill='%23B00020'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Ccircle cx='12' cy='19' r='2'/%3E%3Cpath d='M10 3h4v12h-4z'/%3E%3C/svg%3E") !important;
    outline: 1px solid #b00020 !important;
    border-radius: 3px !important;
    border: 1px solid #b00020 !important; /*tweaked so the inputs dont jump about when focusing in & out*/
}

input.valid {
    background: #FFFFFF 98% 50% no-repeat url("data:image/svg+xml;charset=UTF-8, %3csvg xmlns='http://www.w3.org/2000/svg' height='28' viewBox='0 0 24 24' width='28' fill='green'%3e%3cpath d='m9.55 19-6.725-6.725L5.25 9.85l4.3 4.325 9.225-9.225 2.425 2.4Z'/%3e%3c/svg%3e") !important;
    border: 2px solid green !important;
    border-radius: 3px !important;
}

input[disabled].invalid,
textarea[disabled].invalid,
select[disabled].invalid {
    background-color: #ffffff !important;
}

/*	Uppercase field, Short Time Special field styling.	*/
input.uppercase,
textarea.uppercase,
input.shorttimespecial,
textarea.shorttimespecial {
    text-transform: uppercase;
    text-overflow: ellipsis;
}
/*	Uppercase field, Short Time Special field styling.	*/
input.lowercase,
textarea.lowercase {
    text-transform: lowercase;
}
/* END INPUTS */

.windowTabs {
    padding: 0;
    margin: 0;
    list-style: none;
    display: flex;
    justify-content: flex-start;
    left: 96px;
    top: -5px;
    position: absolute;
    width: auto;
    max-width: calc(100vw - 500px);
    overflow: scroll;
    overflow-y: hidden;
    pointer-events: all;
}

.windowTabsFull {
    max-width: calc(100% - 380px);
}

.windowTabs::-webkit-scrollbar-track {
    background-color: transparent;
}

.windowTabs::-webkit-scrollbar {
    width: 3px;
    background-color: transparent;
}

.windowTabs::-webkit-scrollbar-thumb {
    background-color: var(--ct-primary-theme-colour);
    height: 1.5px;
    border-radius: 4px;
}

    .windowTabs::-webkit-scrollbar-thumb:hover {
        cursor: grab
    }

    .windowTabs::-webkit-scrollbar-thumb:active {
        cursor: grabbing
    }

.windowTab {
    width: 188px;
    height: 26px;
    min-width: 188px;
    border-radius: 4px;
    padding: 0.5rem;
    text-align: left;
    margin: 9px 1px 2px;
    border-bottom: 2px solid pink;
}

li.windowTab {
    position: relative;
    transition: opacity 0.3s;
}

i.material-icons.tabclose {
    position: absolute;
    opacity: 0;
    right: 3px;
    color: #FFFFFF;
    font-size: 22px;
}

    i.material-icons.tabclose:hover {
        color: #880e4f;
    }

    i.material-icons.tabclose:hover {
        color: #FFFFFF !important;
    }

li.windowTab:hover i.material-icons.tabclose {
    opacity: 1;
}

.windowTabs::-webkit-scrollbar {
    height: 8px;
}

.windowTabs:hover::-webkit-scrollbar {
    margin-top: -2px;
    height: 12px;
}

.windowTab > .material-icons {
    display: inline-block;
    vertical-align: top;
    font-size: 25px;
}

.windowTab > .ifrm_title {
    width: 150px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: inline-block;
    text-align: left;
    padding: unset;
}

.windowTab > .ifrm_close {
    font-size: 20px;
    margin-top: 1px;
}

.windowTab:hover {
    cursor: pointer;
    background: var(--ct-primary-theme-colour);
    color: #FFFFFF;
    opacity: 1;
}

    .windowTab:hover .material-icons {
        color: #FFFFFF;
    }

.windowTab > *:hover {
    cursor: pointer;
}


label .inputsectorlabel, .ui-accordion .ui-accordion-header {
    border-top-right-radius: 6px;
    border-top-left-radius: 6px;
    padding: 12px !important;
    box-shadow: none !important;
    box-sizing: border-box;
}

.ui-widget-content {
    border:unset;
    background:unset;
    color:unset;

}


.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, .ui-widget-header {
    background-color: var(--ct-surface-bg);
    color: var(--ct-on-surface-bg);
}

.control-left label.ui-button {
    margin-top: -8px;
    margin-left: 0px;
    margin-right: -0.3em;
}

#tblMain tfoot .control-left, .toolstable .control-left {
    margin-left: 0px !important;
    text-align: left;
}

/*html:not(.tools-nostickyactions) #toolSearchActions,
html:not(.tools-nostickyactions) #toolRecordActions,
html:not(.tools-nostickyactions) #toolActions {
    position: fixed;
    bottom: 0;
    left: 10px;
    width: auto;
    z-index: 10;
    background: var(--ct-surface-bg);
    border-radius: 5px;
    padding: 4px;
    box-shadow: #00000024 -1px 0px 6px 4px;
    animation: toolActionsIn 0.5s;
    z-index: 1000;
}
*/

div.centrerow {
    width: 100%;
    margin: 0 auto 0 auto;
    text-align: center;
    padding: 0;
    padding-top: .2em;
    padding-bottom: .2em;
    margin-bottom: 10px;
    margin-top: 10px;
}

/*#toolSearchActions button, #toolRecordActions button, #toolActions button {
    width: 45px !important;
    height: 45px !important;
}*/

#prevRows:hover, #nextRows:hover, #selectFields:hover, .sorttable.tblMain_th #selectFields:hover, #fullscreen:hover {
    background: var(--ct-primary-dark-theme-colour) !important;
    color: #FFFFFF !important;
}

body.full .ifrm_cont.max {
    top: 0px !important;
    height: calc(100vh - 40px) !important;
}

.fullModeTab {
    left: -11px;
    border-right: 2px solid white;
    width: 260px !important;
    border-radius: 0 !important;
    background-color: #ad1457;
}

    .fullModeTab:last-of-type {
        background-color: #ad1457;
    }

.fulltab {
    background: transparent;
    width: 60vw;
    height: 30px;
    position: absolute;
    left: 20vw;
    top: -13px;
    z-index: 9999999999;
    border-radius: 4px;
    cursor: pointer;
}

    .fulltab > div {
        width: 20px;
        height: 20px;
        transform: rotate(45deg);
        box-shadow: 3px 3px 7px 0px #00000057;
        left: 49%;
        position: absolute;
        background: #757575;
        border-radius: 4px;
    }

.ccsSelect + ul.options {
    position: absolute;
    z-index: 2;
    background: var(--ct-surface-bg);
    border: 2px solid var(--ct-primary-theme-colour);
    border-top: 0;
    border-radius: 4px;
    margin-top: 0rem;
    width: calc(100% - 47px);
    border-top: 1px solid var(--ct-primary-theme-colour);
    max-height: calc(300px - 3rem);
    overflow: auto;
}

/*.cds-col div.inputrow select {
    -webkit-transition: box-shadow 0.1s linear;
    -moz-transition: box-shadow 0.1s linear;
    transition: box-shadow 0.1s linear;
}

div.inputrow select {
    margin-top: 1px;
}
*/



.ccsSelect + ul.options li.selected {
    background: var(--ct-primary-theme-colour) !important;
    border: 1px solid var(--ct-primary-dark-theme-colour) !important;
    color: #FFFFFF !important;
}

.ccsSelect + ul.options li {
    border-radius: 4px;
    padding: 8px;
    border: 1px solid transparent;
    background: var(--ct-primary-light-theme-colour);
    color: var(--ct-primary-dark-theme-colour);
    margin: 4px;
    list-style: none;
    margin-left: -36px;
    min-height: 1rem;
    font-weight: 700;
    font-size: 0.8rem;
}

.selected, #gdivInfoRes .gdivInfoResHead {
    background-color: var(--ct-primary-light-theme-colour) !important;
}

/*#gdivMsgBox {
    background: var(--ct-surface-bg);
    border-radius: 4px;
    padding: 0rem;
    box-shadow: 0px 3px 15px rgb(0 0 0 / 20%);
    width: 600px;
    position: fixed;
    min-height: 250px;
    z-index: 99;
}
*/
    #gdivMsgBox > div {
        padding-bottom: 0px;
        background: var(--ct-surface-bg);
        box-shadow: none;
        border: none;
        border-radius: 4px;
    }

div#gdivMsgBox #gcmdMsgOK, div#gdivMsgBox .avmlinkbtn {
    background-color: #C2185B;
    color: white;
    font-weight: bold;
    border-radius: 4px;
    box-shadow: 0px 3px 15px rgb(0 0 0 / 20%);
    margin-bottom: 10px;
    padding: 0.25rem;
}

div#gdivMsgBox #gcmdMsgOK,
div#gdivMsgBox .avmlinkbtn,
#gcmdMsgYes {
    background-color: var(--ct-secondary-theme-colour) !important;
    border-color: transparent !important;
    color: var(--ct-on-secondary-theme-colour) !important;
    border-radius: 3px;
}



#gdivMsgBox .ui-accordion-content.ui-widget-content {
    background: var(--ct-surface-bg);
}


#gimgInputBoxImg {
    font-size: 42px;
}

/*#gimgMsgBoxIcon {
    color: rgb(244, 67, 54);
    padding: 1rem 0 0 0;
    font-size: 65px;
    margin-bottom: 25px;
}*/

#gtxtInputBoxText,
#gtxtInputBoxPW,
#gtxtInputBoxDT {
    padding: 12px;
    width: calc(100% - 24px);
}

/*#glblMsgBoxTitle {
    font-weight: bold;
    width: 100%;
    padding: 0;
    text-align: center;
    box-shadow: none;
    border: none;
    top: 90px;
    color: var(--ct-on-surface-bg);
    background: transparent !important;
}
*/
/*#glblMsgLbl {
    padding: 0 5rem;
    text-align: center;
    padding-top: 5vh;
    max-height: 55vh;
    overflow: auto
}*/

/*#glblMsgLbl,*/
#glblInputBoxIntruc {
    white-space: pre-wrap;
}


#gdivPageLoad svg {
    animation: epr_rotate 2s linear infinite;
    margin: auto;
    position: fixed;
    top: CALC(50% - 122px);
    left: CALC(50% - 122px);
    width: 244px;
    -webkit-transform-origin: 50% 50%;
    -moz-transform-origin: 50% 50%;
    -o-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
}

#gdivPageLoad svg {
    position: fixed;
    top: CALC(50% - 122px);
    left: CALC(50% - 122px);
    width: 244px;
    z-index: 1;
    animation: epr_rotate 1s linear infinite;
}

    #gdivPageLoad svg circle {
        stroke-dasharray: 1, 200;
        stroke-dashoffset: 0;
        animation: epr_dash 1.5s ease-in-out infinite, epr_color 6s ease-in-out infinite;
        stroke-linecap: round;
        stroke-width: 4px;
    }

    #gdivPageLoad svg circle {
        animation: epr_dash .75s ease-in-out infinite, epr_color 3s ease-in-out infinite;
    }




    div#gdivMsgBox .ui-button.ui-state-hover,
    div#gdivMsgBox a.ui-state-default.ui-state-hover {
        background-color: #EEEEEE;
    }

    div#gdivMsgBox .ui-button.ui-state-hover, div#gdivMsgBox a.ui-state-default.ui-state-hover {
        background-color: rgba(255, 255, 255, 0.7);
        color: var(--ct-on-surface-bg);
    }


div#gdivMsgBox .ui-state-active.ui-state-hover {
    background-color: var(--ct-primary-light-theme-colour);
}

div.divDatePickerContainer,
div#ui-datepicker-div {
    background-color: var(--ct-surface-bg) !important;
    border-radius: 4px;
    padding: 0rem;
    box-shadow: 0px 3px 15px rgb(0 0 0 / 20%);
    min-width: 300px;
    padding: 3px;
    font-size: 14px;
    border: 2px solid var(--ct-primary-theme-colour);
}
    div.divDatePickerContainer .ui-state-active,
    div.divDatePickerContainer .ui-widget-content .ui-state-active,
    div.divDatePickerContainer .ui-widget-header .ui-state-active,
    div.divDatePickerContainer .ui-widget-header,
    div#ui-datepicker-div .ui-state-active,
    div#ui-datepicker-div .ui-widget-content .ui-state-active,
    div#ui-datepicker-div .ui-widget-header .ui-state-active,
    div#ui-datepicker-div .ui-widget-header {
        border-radius: 4px;
        border: 1px solid transparent;
    }

        div.divDatePickerContainer .ui-state-active, div.divDatePickerContainer .ui-widget-content .ui-state-active, div.divDatePickerContainer .ui-widget-header .ui-state-active, div.divDatePickerContainer .ui-widget-header,
        div#ui-datepicker-div .ui-state-active, div#ui-datepicker-div .ui-widget-content .ui-state-active, div#ui-datepicker-div .ui-widget-header .ui-state-active, div#ui-datepicker-div .ui-widget-header,
        #gdivSetDCDP .ui-state-active, #gdivSetDCDP .ui-widget-content .ui-state-active, #gdivSetDCDP .ui-widget-header .ui-state-active, #gdivSetDCDP .ui-widget-header,
        #divDP .ui-state-active, #divDP .ui-widget-content .ui-state-active, #divDP .ui-widget-header .ui-state-active, #divDP .ui-widget-header {
            background-color: var(--ct-primary-theme-colour) !important;
            color: #FFFFFF !important;
        }

            div.divDatePickerContainer .ui-state-active, div.divDatePickerContainer .ui-widget-content .ui-state-active, div.divDatePickerContainer .ui-widget-header .ui-state-active, div.divDatePickerContainer .ui-widget-header,
            div#ui-datepicker-div .ui-state-active, div#ui-datepicker-div .ui-widget-content .ui-state-active, div#ui-datepicker-div .ui-widget-header .ui-state-active, div#ui-datepicker-div .ui-widget-header,
            #gdivSetDCDP .ui-state-active, #gdivSetDCDP .ui-widget-content .ui-state-active, #gdivSetDCDP .ui-widget-header .ui-state-active, #gdivSetDCDP .ui-widget-header,
            #divDP .ui-state-active, #divDP .ui-widget-content .ui-state-active, #divDP .ui-widget-header .ui-state-active, #divDP .ui-widget-header {
                border-radius: 4px;
                border: 1px solid transparent;
            }

    div.divDatePickerContainer  a,
    div#ui-datepicker-div a {
        border-radius: 4px !important;
        padding: 8px;
        text-align: center;
        border: 0;
        font-weight: 700 !important;
    }

/*#divSearch .inputsector label, #divRecord .inputsector label {
    border-radius: 0px;
    color: var(--ct-on-surface-bg);
    border: 1px solid transparent;
    background: var(--ct-surface-bg) !important;
    font-weight: normal;
}*/

#divSearch .inputsector, #divRecord .inputsector {
    border-radius: 0px;
    color: var(--ct-on-surface-bg);
    border: unset;
    background: transparent !important;
    font-weight: normal;
}

.ui-widget-content .ui-state-default:not(label,button) {
    background: var(--ct-surface-bg-ev2) !important;
}

.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
    border-radius: 0px;
    color: var(--ct-on-surface-bg);
    border: 1px solid transparent;
    background: transparent;
    font-weight: normal;
}

    a, a:visited, .ui-state-default a:visited, .ui-state-default a:link, .ui-state-default a, .ui-widget-content, .ui-widget-content .ui-state-default {
        color: var(--ct-on-surface-bg);
        text-decoration: none;
    }

div.divDatePickerContainer .ui-datepicker-title select,
div#ui-datepicker-div .ui-datepicker-title select {
    appearance: none;
    background: var(--ct-primary-theme-colour);
    border: 0;
    text-align: center;
    font-weight: 700;
    color: white;
    font-size: 1.1rem;
    border: 0px solid transparent;
    margin: 0 4px;
    width: auto;
    padding: 4px 8px;
    margin-top: -4px;
}

/*div#ui-datepicker-div .ui-datepicker-title select, div#ui-datepicker-div .ui-widget-header,
#gdivSetDCDP .ui-datepicker-title select, #gdivSetDCDP .ui-widget-header,
#divDP .ui-datepicker-title select, #divDP .ui-widget-header {
    background-color: var(--ct-primary-theme-colour) !important;
}*/

div.divDatePickerContainer .ui-datepicker-title,
div#ui-datepicker-div .ui-datepicker-title,
#gdivSetDCDP .ui-datepicker-title,
#divDP .ui-datepicker-title {
    padding-top: 15px;
    padding-bottom: 10px;
}

#ui-datepicker-div .ui-datepicker-header .ui-datepicker-title .ui-datepicker-month,
#ui-datepicker-div .ui-datepicker-header .ui-datepicker-title .ui-datepicker-year {
    border: 1px solid white;
}

div.divDatePickerContainer .ui-datepicker-next, .divDatePickerContainer .ui-datepicker-prev,
div#ui-datepicker-div .ui-datepicker-next, div#ui-datepicker-div .ui-datepicker-prev,
#gdivSetDCDP .ui-datepicker-next, #gdivSetDCDP .ui-datepicker-prev,
#divDP .ui-datepicker-next, #divDP .ui-datepicker-prev {
    top: 12px !important;
}

div.divDatePickerContainer .ui-datepicker-prev,
div#ui-datepicker-div .ui-datepicker-prev,
#gdivSetDCDP .ui-datepicker-prev,
#divDP .ui-datepicker-prev {
    left: 6px;
}

div.divDatePickerContainer span.ui-icon,
div#ui-datepicker-div span.ui-icon,
#gdivSetDCDP span.ui-icon,
#divDP span.ui-icon {
    background: none;
}

div.divDatePickerContainer .ui-datepicker-prev::after,
div#ui-datepicker-div .ui-datepicker-prev::after,
#gdivSetDCDP .ui-datepicker-prev::after,
#divDP .ui-datepicker-prev::after {
    content: 'arrow_back';
}

div.divDatePickerContainer .ui-datepicker-next::after,
div#ui-datepicker-div .ui-datepicker-next::after,
#gdivSetDCDP .ui-datepicker-next::after,
#divDP .ui-datepicker-next::after {
    content: 'arrow_forward';
}

div.divDatePickerContainer .ui-datepicker-next::after, div.divDatePickerContainer .ui-datepicker-prev::after,
div#ui-datepicker-div .ui-datepicker-next::after, div#ui-datepicker-div .ui-datepicker-prev::after,
#gdivSetDCDP .ui-datepicker-next::after, #gdivSetDCDP .ui-datepicker-prev::after,
#divDP .ui-datepicker-next::after, #divDP .ui-datepicker-prev::after {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 24px;
    display: inline-block;
    line-height: 1;
    text-transform: none;
    letter-spacing: normal;
    word-wrap: normal;
    white-space: nowrap;
    direction: ltr;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
    cursor: pointer;
    font-weight: 700;
    color: white;
}

/*div.divDatePickerContainer .ui-datepicker-title,
div#ui-datepicker-div .ui-datepicker-title,
#gdivSetDCDP .ui-datepicker-title,
#divDP .ui-datepicker-title {
    padding: 8px;
}
*/
div.divDatePickerContainer a:hover,
div#ui-datepicker-div a:hover,
#gdivSetDCDP a:hover,
#divDP a:hover {
    background-color: var(--ct-primary-theme-colour) !important;
    color: #FFFFFF !important;
  /*  border:0px;*/
}

div.divDatePickerContainer .ui-widget-content {
    background:unset;
    border:unset;
    color:unset;
}

div.divDatePickerContainer .ui-datepicker {
    width:100%;
    padding:unset;
}

.mapmagnifier {
    position: absolute;
    width: 300px;
    height: 300px;
    border-radius: 150px;
    border: 2px solid grey;
    z-index: 150;
    pointer-events: none;
}

    .mapmagnifier canvas {
        border-radius: 150px;
    }


.maptoolbartoolhosps .material-icons,
.maptoolbartoolresbase .material-icons,
.maptoolbartoolfirstresp .material-icons,
.maptoolbartoolstandbypos .material-icons,
.maptoolbartoolfeatures .material-icons,
.maptoolbartoolacsbase .material-icons {
    padding: 4px;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    line-height: 20px;
    text-align: center;
}

.maptoolbartoolhosps .material-icons {
    background: #FFEBEE;
    color: #961717 !important;
    font-size: 18px !important;
}

.maptoolbartoolacsbase .material-icons {
    background: #fff8eb;
    color: #966117 !important;
    font-size: 18px !important;
}

.maptoolbartoolresbase .material-icons {
    background: #EDE7F6;
    color: #311B92 !important;
    font-size: 18px !important;
}

.maptoolbartoolfirstresp .material-icons {
    background: #E0F2F1;
    color: #004D40 !important;
    font-size: 18px !important;
}

.maptoolbartoolstandbypos .material-icons {
    background: #E3F2FD;
    color: #0B3D89 !important;
    font-size: 18px !important;
}

.maptoolbartoolfeatures .material-icons {
    background: #FCE4EC;
    color: #C2185B !important;
    font-size: 18px !important;
}

ul.autocomplete {
    list-style: none;
    position: absolute;
    display: none;
    overflow-x: hidden;
    overflow-y: scroll;
    padding: 0;
    z-index: 51;
    min-height: 100px;
    max-height: 300px;
    border-radius: 4px;
    border: 2px solid var(--ct-primary-theme-colour) !important;
    margin-top: 1px;
    z-index: 85;
    background: var(--ct-surface-grey-5);
}

    ul.autocomplete li {
        border-radius: 4px;
        padding: 8px;
        border: 1px solid var(--ct-surface-grey-3);
        background: var(--ct-surface-bg);
        color: var(--ct-on-surface-bg);
        margin: 4px;
        margin-left: 15px;
        margin-right: 15px;
        cursor: pointer;
        font-size: 0.8rem;
    }

        ul.autocomplete li b {
            font-weight: 700;
        }

        ul.autocomplete li span {
            display: inline-block;
        }

        ul.autocomplete li img {
            float: left;
            display: inline;
        }

        /*	Selected item.	*/
        ul.autocomplete li.selected {
            background-color: var(--ct-primary-dark-theme-colour) !important;
            border: 1px solid var(--ct-primary-theme-colour) !important;
            color: #FFFFFF;
        }

        /*	Highlighted item.	*/
        ul.autocomplete li:hover, ul.autocomplete li.hover {
            background-color: var(--ct-primary-dark-theme-colour) !important;
            color: #FFFFFF;
            border: 1px solid var(--ct-primary-theme-colour) !important;
        }

div.inputsector.normaldiv.ui-accordion.ui-widget > div.globalcentre:last-child {
    margin-bottom: 10px;
}

input[type="radio"] + label {
    position: relative;
    overflow: visible;
    white-space: nowrap;
    text-align: left;
    min-width: 48px;
    padding: 0;
    margin-left: -8px;
    margin-right: 8px;
    display: inline-block;
    font-size: 12px;
    cursor: pointer;
}

    input[type="radio"] + label::before {
        font-family: 'Material Icons';
        font-size: 24px; /* Preferred icon size */
        height: 1em;
        width: 1em;
        vertical-align: middle;
        border-radius: 100%;
        background-color: transparent;
        transition: .25s;
        content: 'radio_button_unchecked';
        color: #BDBDBD;
        padding: 4px;
        /* Support for all WebKit browsers. */
        -webkit-font-smoothing: antialiased;
        /* Support for Safari and Chrome. */
        text-rendering: optimizeLegibility;
        /* Support for Firefox. */
        -moz-osx-font-smoothing: grayscale;
        /* Support for IE. */
        font-feature-settings: 'liga';
        display: inline-block; /* GB - Added for IE */
        text-transform: none;
        margin-top: -6px;
    }

input[type="radio"]:checked + label::before {
    content: 'check_circle';
    color: var(--ct-primary-dark-theme-colour);
    text-transform: none;
}

html.dark input[type="radio"]:checked + label::before {
    color: var(--ct-primary-light-theme-colour);
}

input[type="radio"] + label:active::before {
    background-color: rgba(0, 0, 0, .06);
}

input[type="radio"]:focus + label::before {
    background-color: rgba(0, 0, 0, .06);
}

input[type="radio"] {
    width: 0px;
    height: 0px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
}

.tooltip {
    position: relative;
}

    .tooltip button {
        padding: 0px;
    }


    .tooltip .tooltip-text {
        visibility: hidden;
        width: 120px;
        background-color: var(--ct-secondary-theme-colour) !important;
        color: #FFFFFF;
        text-align: center;
        padding: 5px 0;
        border-radius: 6px;
        /* Position the tooltip text */
        position: absolute;
        z-index: 1;
        top: 135%;
        left: 50%;
        margin-left: -60px;
        /* Fade in tooltip */
        opacity: 0;
        transition: opacity 0.3s;
        display: none;
    }


        .tooltip .tooltip-text::after {
            content: "";
            position: absolute;
            bottom: 100%;
            left: 50%;
            margin-left: -5px;
            border-width: 5px;
            border-style: solid;
            border-color: transparent transparent #f50057 transparent;
        }

        .tooltip .tooltip-text::after {
            border-color: transparent transparent var(--ct-secondary-theme-colour) transparent;
        }



    .tooltip:hover .tooltip-text {
        visibility: visible;
        opacity: 1;
        display: block;
    }

    .tooltip span.tooltip-text.tooltip-right {
        margin-left: -148px;
    }

        .tooltip span.tooltip-text.tooltip-right::after {
            left: 104%;
            top: 30%;
            transform: rotate(90deg);
        }

    .tooltip span.tooltip-text.tooltip-left {
        top: 15% !important;
        margin-left: 25px;
    }

        .tooltip span.tooltip-text.tooltip-left::after {
            left: -4%;
            top: 30%;
            transform: rotate(270deg);
        }

    .tooltip span.tooltip-text.tooltip-bottom {
        top: 0%;
    }

        .tooltip span.tooltip-text.tooltip-bottom::after {
            bottom: -10px;
            transform: rotate(180deg);
        }

div.smalldiv {
    background-color: var(--ct-surface-bg);
    z-index: 85;
    position: fixed;
    min-width: 450px;
    width: 800px;
    left: 50% !important;
    top: 0px;
    margin-left: -400px;
}


    div.smalldiv > div {
        border: none;
    }

#gdivMsgBox {
    background: var(--ct-surface-bg);
    border-radius: 4px;
    padding: 0rem;
    box-shadow: 0px 3px 15px rgb(0 0 0 / 20%);
    width: 600px;
    position: fixed;
    z-index: 99;
    padding:1rem;
}

#gimgMsgBoxIcon {
    text-align: center;
    
    display: block;
    font-size: 4rem;
}

#glblMsgBoxTitle {
    background:var(--ct-surface-bg) !important;
    margin-bottom:10px;
}

#gdivInputBoxBtns {
 margin-top:1rem;
}

#glblMsgLbl {
    padding: 0 5rem;
}

    #glblMsgLbl:has(#toolApp_selectFields) {
        padding: 0 1.5rem;
    }

    #glblMsgLbl,
    #glblInputBoxIntruc {
        white-space: pre-wrap;
    }

#toolApp_selectFields {
    display: grid;
    grid-template-columns: repeat(auto-fit, 175px);
    justify-content: center;
    max-height: 370px;
    overflow-y: scroll;
}

.tblMain_headers_all {
    cursor: pointer;
}

    .tblMain_headers_all + .tblMain_headers_all {
        margin-left: 10px;
    }

/*#glblMsgLbl {
    padding: 0 5rem;
    text-align: center;
    padding-top: 1vh;
    max-height: 55vh;
    overflow: auto;
}
*/
div#gdivMsgBox a {
    box-shadow: none !important;
    border: 1px solid transparent;
    color: var(--ct-on-surface-bg);
    border-radius: 3px;
    /*background: var(--ct-surface-grey-4) !important;
    padding: 0.25rem;*/
    margin-bottom:10px;
}



div#gdivMsgBox #gcmdMsgOK, div#gdivMsgBox .avmlinkbtn, div#gdivMsgBox #gcmdMsgYes {
    background-color: var(--ct-secondary-theme-colour) !important;
    border-color: transparent !important;
    color: var(--ct-on-secondary-theme-colour) !important;
    border-radius: 3px;
}

div#gdivMsgBox #gcmdMsgOK, div#gdivMsgBox .avmlinkbtn {
    background-color: #C2185B;
    color: white;
    font-weight: bold;
    border-radius: 4px;
    box-shadow: 0px 3px 15px rgb(0 0 0 / 20%);
    margin-bottom: 10px;
    padding: 0.25rem;
}



#gdivMsgBox .ui-accordion-content.ui-widget-content {
    background: var(--ct-surface-bg);
}

#gdivMsgBox > div {
    padding-bottom: 0px;
    background: var(--ct-surface-bg);
    box-shadow: none;
    border: none;
    border-radius: 4px;
}

/*#gimgMsgBoxIcon {
    color: rgb(244, 67, 54);
    padding: 1rem 0 0 0;
    font-size: 65px;
    margin-bottom: 0px;
}*/

/*#gdivMsgBox {
    background: var(--ct-surface-bg);
    border-radius: 4px;
    padding: 0rem;
    box-shadow: 0px 3px 15px rgb(0 0 0 / 20%);
    width: 600px;
    position: fixed;
    min-height: 250px;
    z-index: 99;
}*/

    #gdivMsgBox > div {
        padding-bottom: 0px;
        background: var(--ct-surface-bg);
        box-shadow: none;
        border: none;
        border-radius: 4px;
    }

div#gdivMsgBox #gcmdMsgOK, div#gdivMsgBox .avmlinkbtn {
    background-color: #C2185B;
    color: white;
    font-weight: bold;
    border-radius: 4px;
    box-shadow: 0px 3px 15px rgb(0 0 0 / 20%);
    margin-bottom: 10px;
    padding: 0.25rem;
}

div#gdivMsgBox #gcmdMsgOK,
div#gdivMsgBox .avmlinkbtn,
#gcmdMsgYes {
    background-color: var(--ct-secondary-theme-colour) !important;
    border-color: transparent !important;
    color: var(--ct-on-secondary-theme-colour) !important;
    border-radius: 3px;
}



#gdivMsgBox .ui-accordion-content.ui-widget-content {
    background: var(--ct-surface-bg);
}


#gimgInputBoxImg {
    font-size: 42px;
}

/*#gimgMsgBoxIcon {
    color: rgb(244, 67, 54);
    padding: 1rem 0 0 0;
    font-size: 65px;
    margin-bottom: 25px;
}*/

#gtxtInputBox {
    width: 95%;
    min-width: 400px;
    /*margin: 1em;*/
    min-height: 4em;
    min-height: 10em;
    z-index: 99;
}


#gtxtInputBoxText,
#gtxtInputBoxPW,
#gtxtInputBoxDT {
    padding: 12px;
    width: calc(100% - 24px);
}

/*#glblMsgLbl {
    padding: 0 5rem;
    text-align: center;
    padding-top: 1vh;
    max-height: 55vh;
    overflow: auto
}
*/
/*#glblMsgLbl,*/
#glblInputBoxIntruc {
    white-space: pre-wrap;
}


#gdivPageLoad svg {
    animation: epr_rotate 2s linear infinite;
    margin: auto;
    position: fixed;
    top: CALC(50% - 122px);
    left: CALC(50% - 122px);
    width: 244px;
    -webkit-transform-origin: 50% 50%;
    -moz-transform-origin: 50% 50%;
    -o-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
}


/*div.inputrow select {
    margin-top: 1px;
}*/

div.inputrow input[type=text], div.inputrow input[type=password], div.inputrow input[type=number], div.inputrow textarea, input[type=text], input[type=password], textarea {
    background-color: var(--ct-input-bg);
    color: var(--ct-on-input-bg);
}

.cds-input-btn-end a, .cds-input-btn-end button {
    position: absolute !important;
    top: 9px !important;
    right: 4px;
    height: 39px !important;
    line-height: 52px !important;
    width: 42px !important;
    text-align: center !important;
    border-top-right-radius: 3px !important;
    border-bottom-right-radius: 3px !important;
    margin-right: 4px !important;
    border-top-left-radius: 0px !important;
    border-bottom-left-radius: 0px !important;
    border: 0px !important;
    opacity: 1 !important;
    color: #FFFFFF !important;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
}

/*.inputrow select {
    font-size: 14px;
    padding-top: 16px !important;
}*/

/*.ui-widget-content:not(.mcs-swatch) {
    border: none !important;
    background: transparent !important;
}*/

table.sorttable tbody tr.rowhover {
    cursor: pointer !important;
}

.sorttable:not(.no-row-hover) tbody:not(.stack-list) tr:hover
, .sorttable:not(.no-row-hover) tbody:not(.stack-list) tr:not(.no-result):hover td {
    background: var(--ct-primary-light-theme-colour) !important;
    color: var(--ct-primary-dark-theme-colour) !important;
}

/*TOAST STYLES*/
/*#region Toast Styles*/
.toastDiv {
    position: fixed;
    z-index: 9999;
    min-width: 230px;
    transition: opacity 1s ease-in-out;
    border: 2px solid var(--ct-primary-dark-theme-colour);
    border-left: 10px solid var(--ct-primary-dark-theme-colour);
    opacity: 0;
    border-radius: 8px;
    background: var(--ct-surface-bg);
    font-size: 1rem;
    box-shadow: 3px 3px 6px rgb(0 0 0 / 50%);
}

    .toastDiv .toastIcon i {
        color: var(--ct-primary-dark-theme-colour) !important;
    }

    .toastDiv .toastIcon {
        display: flex;
        align-items: center;
    }

    .toastDiv > .toastText {
        padding-right: 1rem;
        font-size: 1.25rem;
    }

    .toastDiv .toastExit {
        font-size: 1.25rem;
        color: #424242;
        cursor: pointer;
    }

    .toastDiv .toastText .toastHeader {
        font-weight: bold;
        margin-bottom: 0.25rem;
        padding-right: 5.5rem;
    }

    .toastDiv .toastText .toastContent {
        color: #424242;
        font-size: 1rem;
        max-width: 230px;
        text-overflow: ellipsis;
        white-space: pre-line; /* GB - added for notification.js.showCallScript to use \r & \n */
        overflow: auto;
        max-height: 200px;
    }

.toastActions {
    margin: 12px 0;
}

div.toastIcon > i {
    font-size: 2.5rem;
    padding-right: 10px;
}

.toastDiv.active {
    opacity: 1;
    transition: opacity 1s ease-out;
}

div.toastCont:not(.forcestack):not(.active) {
    display: none;
}

#spanAlertCount {
    margin-left: 0px !important;
}

div.toastCont.stacked, div.statusbar-popup {
    position: fixed;
    bottom: calc(1em + 40px);
    right: 1em;
    border: 3px solid var(--ct-primary-theme-colour);
    border-left: 4px solid var(--ct-primary-theme-colour);
    border-radius: 8px;
    background: #FFFFFF;
    font-size: 1rem;
    box-shadow: 3px 3px 6px rgb(0 0 0 / 50%);
    width: 330px;
    z-index: 9999;
    height: 385px;
    overflow: visible;
    padding-top: 0px;
    cursor: grab;
    min-height: 129px;
    background: #f5f5f5;
}

div.toastCont.stacked {
    right: 4em;
    height: 70vh;
}

div.toastCont.stacked, div.statusbar-popup {
    border: 3px solid var(--ct-primary-theme-colour) !important;
    border-left: 4px solid var(--ct-primary-theme-colour) !important;
    background: #efefef !important;
}


div.toastCont.heighttest {
    opacity: 0 !important;
    display: block !important;
}

.toastCont.toastLeft.stacked {
    left: 1em;
    right: initial;
}

.toastDiv.toastRemove {
    transition: opacity 0.5s !important;
}

.toastExit:hover {
    color: var(--ct-primary-theme-colour);
}

div.toastCont.stacked .ui-resizable-handle {
    z-index: 9999 !important;
    width: 100%;
    background: transparent;
    height: 15px;
}

div.toastDisplay {
    max-height: calc(100% - 38px);
    overflow-y: auto;
    overflow-x: hidden;
    margin-top: 22px;
    margin-bottom: 4px;
    padding: 6px;
}

    div.toastDisplay::-webkit-scrollbar-thumb {
        background: var(--ct-gray-400) !important;
        border: 3px solid #efefef !important;
        border-radius: 10px !important;
    }

    div.toastDisplay::-webkit-scrollbar-track {
        background: #efefef;
    }

div.toastCont.stacked .toastDiv {
    position: relative;
    bottom: initial !important;
    right: initial !important;
    box-shadow: none !important;
    border-radius: 3px;
    border: 2px solid transparent !important;
    border-bottom: 2px solid #f5f5f5 !important;
    width: calc(100% - 4px);
    margin-bottom: 4px;
}

    div.toastCont.stacked .toastDiv .toastHeader {
        padding-right: 0px;
    }

    div.toastCont.stacked .toastDiv div.toastIcon > i {
        padding-left: 10px;
    }

div.toastCont.forcehide {
    display: none;
}

div.toastCont.forcemax {
    height: 514px !important;
}

div.toastCont.forcemin {
    height: 140px !important;
}

div.toastCont.stacked .toastDiv .toastText .toastContent {
    max-width: 230px;
}

.toastBadge > i.material-icons {
    font-size: 30px;
    color: #FFFFFF;
}

.toastBadge > div {
    font-size: 21px;
    font-weight: bold;
    color: #FFFFFF;
}

.toastBadge {
    position: absolute;
    top: -25px;
    left: 5px;
    background: var(--ct-primary-dark-theme-colour);
    height: 39px;
    width: 39px;
    z-index: 10000;
    border-radius: 4px;
    opacity: 1;
    transition: opacity 0.5s;
    border: 2px solid #FFFFFF;
    display: none;
    justify-content: center;
    align-items: center;
}

.toastCont.stacked .toastBadge {
    display: none;
}

    .toastCont.stacked .toastBadge.active {
        display: flex !important;
    }

.toastBadge.toastDelete {
    left: 87px;
    opacity: 0;
}

.toastBadge.toastHistory {
    left: 46px;
    opacity: 0;
}

.toastCont.history .toastBadge.toastHistory {
    opacity: 1;
    background: #f57c00;
}

.toastCont.history .toastBadge.toastTotal {
    opacity: 1;
    background: #f57c00;
}

.toastCont.history .toastBadge.toastDelete {
    background: #f57c00;
}

.toastBadge.toastDelete:hover, .toastBadge.toastHistory:hover {
    background: var(--ct-primary-theme-colour);
}

.toastBadge.toastConfirm:hover {
    background: #025102;
}

.toastBadge.toastCancel:hover {
    background: #a90707;
}

.toastCont:hover .toastBadge {
    opacity: 1;
}

.toastTime {
    position: absolute;
    font-size: 9px;
    bottom: 6px;
    color: #757575;
}

.toastCont.stacked .toastTime {
    margin-top: 4px;
    bottom: 5px;
}

.toastModal {
    display: none;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    overflow: hidden;
}

    .toastModal.active {
        display: block;
    }

.toastCont.active {
    display: block;
}

.toastCont.stacked .toastModalWrapper {
    position: absolute;
    width: 60%;
    height: 50%;
    top: 50%;
    left: 50%;
    z-index: 10000;
    transform: translate(-50%, -50%);
    border-radius: 6px;
    box-shadow: #ffffffb8 0px 0px 1px 2px, rgb(33 33 33 / 50%) 0px 0px 0px 500px;
    background: linear-gradient(320deg, rgb(233 30 99 / 80%) 0%, rgb(233 30 99 / 80%) 22%, rgb(233 30 129 / 90%) 100%);
    backdrop-filter: blur(2px);
}

.toastModalBottom {
    width: 100%;
    height: 50%;
}

.toastModalTop {
    width: 100%;
    height: 50%;
}

.toastBadge.toastConfirm {
    display: none;
    left: 87px;
    background: #27ba2d;
}

.toastBadge.toastCancel {
    display: none;
    left: 128px;
    background: #ed1818;
}

.toastBadge.toastMinimise {
    opacity: 0;
    left: 271px;
    height: 25px;
    width: 30px;
    top: -17px;
}

.toastList:empty:after {
    content: 'No alerts found';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 20px;
    color: #757575;
    width: 100%;
    height: calc(100% - 8px);
    display: flex;
    justify-content: center;
    align-items: center;
    background: #fafafa;
}

.toastList:empty:after {
    background: unset;
}


.toastListHistory:empty:after {
    content: 'No historic alerts found';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 20px;
    color: #757575;
    width: 100%;
    height: calc(100% - 8px);
    display: flex;
    justify-content: center;
    align-items: center;
    background: #fafafa;
}

.toastModalBottom > div {
    display: block;
    color: #FFFFFF;
    width: 50%;
    padding: 2px;
    border: 2px solid #ffffffb8;
    border-radius: 8px;
    text-align: center;
    margin: auto;
    margin-bottom: 6%;
    padding-top: 5px;
    padding-bottom: 5px;
    background: linear-gradient(320deg, rgb(204 8 75 / 85%) 0%, rgb(172 0 59 / 85%) 22%, rgb(127 3 63 / 85%) 100%);
    cursor: pointer;
}

    .toastModalBottom > div:hover {
        background: rgb(233 30 129 / 90%);
        color: #FFFFFF;
    }

    .toastModalBottom > div:hover {
        background: #FFFFFF;
        color: #830530;
        border: 2px solid #830530;
    }

.toastModalBottom {
    padding: 0px;
    width: 100%;
    position: relative;
    margin: 0px;
}

.toastModalText {
    color: #FFFFFF;
    text-align: center;
    padding-top: 10px;
    font-size: 24px;
}

.toastListHistory {
    display: none;
}

.toastCont.history .toastListHistory {
    display: block;
}

.toastCont.history .toastList {
    display: none;
}

.toastListHistory i.material-icons {
    color: #f57c00 !important;
}

.toastListHistory .toastDiv {
    background: #fffde7 !important;
}
/*#endregion Toast Styles*/

.inifrm .toastCont {
    display: none !important;
}

#divRecord, #divMain {
    max-width: 98%;
    margin: 0px auto;
    text-align: unset;
}

#gdivSelectList {
    z-index: 999 !important;
}

#gdivSelectListData {
    overflow-y: scroll;
    height: 300px;
}

#gdivSelectListNewSub {
    overflow-y: scroll;
    height: 268px;
}

#gcmdNav, .me-iframe #gcmdNav {
    display: none;
}

.loader,
.loader:after {
    border-radius: 50%;
    width: 10em;
    height: 10em;
}

.loader {
    margin: 60px auto;
    font-size: 10px;
    position: relative;
    text-indent: -9999em;
    border-top: 1.1em solid var(--ct-loader-alt-bg);
    border-right: 1.1em solid var(--ct-loader-alt-bg);
    border-bottom: 1.1em solid var(--ct-loader-alt-bg);
    border-left: 1.1em solid var(--ct-loader-bg);
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-animation: load8 1.1s infinite linear;
    animation: load8 1.1s infinite linear;
    display: block;


    border-top: 1.1em solid var(--ct-loader-alt-bg);
    border-right: 1.1em solid var(--ct-loader-alt-bg);
    border-bottom: 1.1em solid var(--ct-loader-alt-bg);
    border-left: 1.1em solid var(--ct-loader-bg);
}

@-webkit-keyframes load8 {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

#gdivSubmitting {
    position: fixed;
    width: 300px;
    z-index: 9999999;
    background: rgba(255, 255, 255, 0.8);
    border-radius: 10px;
    text-align: center;
    user-select: none;
    overflow: hidden;
}

#gdivSubmitting {
    background: rgba(255, 255, 255, 0.8);
}

#gdivSubmitting h2 {
    color: var(--ct-primary-theme-colour);
}

#gdivSubmitting h2 {
    margin-top: -35px;
    margin-bottom: 35px;
    color: var(--ct-primary-dark-theme-colour);
    font-size: 18px;
    font-weight: 800;
    text-align: center;
}

html.dark #gdivSubmitting h2 {
    color: var(--ct-primary-light-theme-colour);
}


#gdivSubmittingInt {
    margin: 0 auto;
    overflow: hidden;
}

    #gdivSubmittingInt svg,
    #gdivPageLoad svg {
        animation: epr_rotate 2s linear infinite;
        margin: auto;
        position: fixed;
        top: CALC(50% - 122px);
        left: CALC(50% - 122px);
        width: 244px;
        -webkit-transform-origin: 50% 50%;
        -moz-transform-origin: 50% 50%;
        -o-transform-origin: 50% 50%;
        transform-origin: 50% 50%;
    }

    #gdivSubmittingInt p.progress-bar {
        font-weight: 900;
        font-size: 32px;
        padding-top: 40px;
        position: relative;
    }

#gdivPageLoad svg {
    position: fixed;
    top: CALC(50% - 122px);
    left: CALC(50% - 122px);
    width: 244px;
    z-index: 1;
    animation: epr_rotate 1s linear infinite;
}

    #gdivSubmittingInt svg circle,
    #gdivPageLoad svg circle {
        stroke-dasharray: 1, 200;
        stroke-dashoffset: 0;
        animation: epr_dash 1.5s ease-in-out infinite, epr_color 6s ease-in-out infinite;
        stroke-linecap: round;
        stroke-width: 4px;
    }

    #gdivPageLoad svg circle {
        animation: epr_dash .75s ease-in-out infinite, epr_color 3s ease-in-out infinite;
    }

@keyframes epr_rotate {
    100% {
        transform: rotate(360deg);
    }
}

@keyframes epr_dash {
    0% {
        stroke-dasharray: 1, 200;
        stroke-dashoffset: 0;
    }

    50% {
        stroke-dasharray: 89, 200;
        stroke-dashoffset: -35px;
    }

    100% {
        stroke-dasharray: 89, 200;
        stroke-dashoffset: -124px;
    }
}

@keyframes epr_color {
    100%, 0% {
        stroke: #F44336;
    }

    40% {
        stroke: var(--ct-primary-theme-colour);
    }

    66% {
        stroke: #9C27B0;
    }

    80%, 90% {
        stroke: #673AB7;
    }
}

.mcs-nav {
    position: absolute;
    margin-left: 165px;
    margin-top: 5px;
}

    .mcs-nav > a {
        color: #BDBDBD;
    }

.mcs-row .toolbar-disabled {
    background-color: #FAFAFA;
}

.mcs-hex {
    text-align: center;
    font-size: 16px !important;
    line-height: 30px;
    position: absolute;
    width: 83px;
    height: 30px;
    transform: translate(-50%, -115%);
    left: 50%;
    text-shadow: -1px -1px 0 #FFFFFF, 1px -1px 0 #FFFFFF, -1px 1px 0 #FFFFFF, 1px 1px 0 #FFFFFF;
    background: none;
    border: none;
}

.mcs-opacity-icon {
    position: absolute;
    left: 50%;
    transform: translate(-50%);
    margin-top: 7px;
}

input.mcs-rgb {
    width: 40px;
    position: absolute;
    margin-top: 7px;
    margin-left: 20px;
    border: 1px solid #e0e0e0;
    text-align: center;
}

.mcs-opacity-icon > img {
    width: 150px;
    max-width: 150px;
    margin-top: 10px;
    max-height: 105px;
}



.mcs-icon {
    position: absolute;
    z-index: 99;
    width: 50px;
    height: 50px;
}

.mcs-nav > a.active {
    color: var(--ct-primary-theme-colour);
}

select.colourpickerSample {
    padding: 11px !important;
}

.colourpickerSample {
    text-align: center;
    text-transform: uppercase;
    font-size: 14px;
    max-width: 50%;
    margin-top: 15px !important;
}

.colourpickerSample {
    max-width: unset;
}

.mcs-colour-label {
    top: 23px !important;
    color: #FFFFFF !important;
    background: #00000087 !important;
    padding: 12.5px !important;
    left: 8px !important;
    border-top-left-radius: 2px !important;
    border-bottom-left-radius: 2px !important;
    min-width: 15% !important;
    text-align: center !important;
    line-height: 14px;
    position: absolute !important;
}


.cds-col .mcs-colour-label {
    top: 17px !important;
    left: 2px !important;
}

html.dyslexic .mcs-colour-label {
    padding: 13.5px !important;
}

.mcs-colour {
    cursor: pointer;
    color: rgba(0,0,0,0) !important;
    text-align: center;
    margin-top: 15px !important;
}

    .mcs-colour.mcs-empty {
        color: var(--ct-on-surface-bg) !important;
    }

.mcs-sample {
    text-align: center;
    text-transform: uppercase;
    font-size: 16px !important;
    font-weight: bold;
    transition: all .4s ease-in-out .1s !important;
}

.mcs-thumbnail {
    display: list-item;
    border: 1px solid #E0E0E0;
    background-color: #FFFFFF;
    min-height: 13px;
}


.mcs-swatch {
    margin: 0 auto 0 auto;
    width: 250px;
    height: 120px;
    background-image: none;
    position: relative;
}

.mcs-slider {
    margin: 11px 0px 10px 24px;
    clear: left;
    width: 185px;
    display: inline-block;
}

.mcs-red .ui-slider-range {
    background: #ef2929;
}


.mcs-red .ui-slider-handle {
    border-color: #ef2929;
}

.mcs-green .ui-slider-range {
    background: #8ae234;
}

.mcs-green .ui-slider-handle {
    border-color: #8ae234;
}

.mcs-blue .ui-slider-range {
    background: #729fcf;
}

.mcs-blue .ui-slider-handle {
    border-color: #729fcf;
}

.mcs-alpha .ui-slider-range {
    background: #BDBDBD;
}

.mcs-alpha .ui-slider-handle {
    border-color: #BDBDBD;
}

.mcs-label {
    font-size: 18px;
    padding: 6px 6px 10px 8px;
    display: block;
}

.mcs-row {
    display: table;
    width: 100%;
    table-layout: fixed;
}

.mcs-cell {
    display: table-cell;
    border: 1px solid var(--ct-surface-grey-4);
    width: 30%;
    vertical-align: top;
    padding-bottom: 6px;
}

.mcs-basic, .mcs-custom {
    border: 1px solid rgb(189, 189, 189);
    height: 100%;
    width: 100%;
}

.mcs-sub-cell {
    display: table-cell;
    width: 30%;
    padding: 3px;
}

.mcs-sub-row {
    display: table;
    height: 44px;
    width: 95%;
    padding-left: 6px;
    padding-right: 6px;
    table-layout: fixed;
}

.mcs-contrast > .material-icons {
    vertical-align: middle;
}

.mcs-custom-active {
    outline: 2px solid var(--ct-primary-theme-colour);
}


.blueflag {
    background: #0461ab !important;
    color: #FFFFFF !important;
}

.ui-slider.ui-widget-content .ui-state-default.ui-slider-handle {
    background-color: var(--ct-surface-bg) !important;
    border:1px solid var(--ct-surface-grey-6);
    width:10px;
    border-radius:4px;
    cursor: pointer;
}

    .ui-slider.ui-widget-content .ui-state-default.ui-slider-handle:focus {
        outline:0;
    }

    button:focus:not(.ct-tab-link),
    input:focus {
        outline-color: var(--ct-primary-theme-colour) !important;
        border: 1px solid var(--ct-surface-bg) !important;
    }

.ui-widget-content {
    background-color: var(--ct-surface-bg);
    color: var(--ct-on-surface-bg);
    border-radius: 0px;
}

    .ui-widget-content .ui-state-default:not(label,button) {
        background: var(--ct-surface-bg-ev2) !important;
    }

.ui-state-active,
.ui-widget-content,
#gdivSesExpiry {
    box-shadow: 0 0 0 transparent;
}

    .ui-state-default,
    .ui-widget-content .ui-state-default,
    .ui-widget-header .ui-state-default {
        border-radius: 0px;
        color: var(--ct-on-surface-bg);
        border: 1px solid transparent;
        background: transparent;
        font-weight: normal;
    }

        .ui-state-default .material-icons,
        .ui-widget-content .ui-state-default .material-icons,
        .ui-widget-header .ui-state-default .material-icons {
            color: rgba(0, 0, 0, 0.7);
        }

    .ui-state-active,
    .ui-widget-content .ui-state-active,
    .ui-widget-header .ui-state-active,
    .ui-widget-header {
        background-color: var(--ct-surface-bg);
        color: var(--ct-on-surface-bg);
    }

.ui-button.ui-state-hover,
a.ui-state-default.ui-state-hover {
    background-color: var(--ct-surface-grey-3);
}

.ui-state-active.ui-state-hover {
    background-color: var(--ct-primary-light-theme-colour);
}

a.ui-state-default.ui-state-highlight {
    background-color: #FFF59D;
    color: grey;
}

.systemModeFilter, .stackFilters, .ifrmHeaderBtn, .ifrmHead-toggleSwitch {
    float: right;
    padding-top: 4px;
}

    .ifrmHeaderBtn button.selected {
        background-color: var(--ct-primary-bg-100) !important;
        border-radius: 5px !important;
    }

        .ifrmHeaderBtn button.selected span {
            color: var(--ct-primary-theme-colour) !important;
        }

        .systemModeFilter .switch-container, .ifrmHead-toggleSwitch .switch-container {
            border: 1px solid #ffffff8a;
            padding: 2px;
            padding-left: 5px;
            border-radius: 24px;
            height: 20px;
            float: left;
            display: block;
            margin-right: 10px;
        }

        .systemModeFilter .switch-container .switch-label, .ifrmHead-toggleSwitch .switch-container .switch-label {
            float: left;
            line-height: 22px;
            margin-right: 5px;
            font-weight: 700;
        }

            .systemModeFilter .switch-container .switch-label .material-icons, .ifrmHead-toggleSwitch .switch-container .switch-label .material-icons {
                font-size: 16px;
                vertical-align: middle;
                line-height: 22px;
            }

    .systemModeFilter .cds-toggle-switch, .ifrmHead-toggleSwitch .cds-toggle-switch {
        height: 20px;
    }

    .systemModeFilter .cds-toggle-slider:before, .ifrmHead-toggleSwitch .cds-toggle-slider:before {
        position: absolute;
        content: "";
        height: 14px;
        width: 14px;
        left: 4px;
        bottom: 2px;
        background-color: white;
        -webkit-transition: .4s;
        transition: .4s;
    }


.ui-tooltip.ui-widget-content {
    background: var(--ct-surface-bg) !important;
    color: var(--ct-on-surface-bg) !important;
}

#divMultiJrnySelHead {
    position: sticky;
    top: -12px; /* Padding from .custom-modal class */
}

#divMultiJrnySelHead table {
    margin: 0px;
}

#divMultiJrnySelHead th {
    border-right: 1px solid var(--ct-primary-theme-colour)
}

#divMultiJrnySel {
    max-width: min-content;
}

#tblMultiJrnySel {
    height: 400px;
    font-size: 12px;
}

.ifrm_cont.collapsed_head {
    padding-top: 0px;
}

    .ifrm_cont.collapsed_head .ifrm_head {
        height: 0px;
        overflow: hidden;
    }

div.ifrm_cont.snappedleft {
    inset: auto auto auto auto !important;
    position: absolute;
    width: 50vw !important;
    height: 88vh !important;
    top: 70px !important;
    left: 78px !important;
    box-shadow: none !important;
}

body.navoff div.ifrm_cont.snappedleft {
    left: 0px !important;
}

div.ifrm_cont.snappedright {
    inset: auto auto auto auto !important;
    position: absolute;
    width: calc(50vw - 2px) !important;
    height: 88vh !important;
    top: 70px !important;
    right: 1px !important;
    box-shadow: none !important;
}

div.ifrm_cont.snappedresize {
    top: 52px !important;
    width: unset;
    height: unset !important;
}



.inputtable {
    width: 100%;
    border-collapse: collapse;
}

    .inputtable thead {
        position: sticky;
        top: 0;
    }

    .inputtable tbody tr td {
        padding: 0px;
    }

    .inputtable input[type="text"] {
        padding: 5px !important;
        border: 0px;
      /*  background: unset;*/
        width: calc(100% - 10px);
        margin-bottom: 0px;
        border-radius:0px;
    }

        .inputtable input[type="text"]:focus {
            outline-width: 0px !important;
            border-width: 0px !important;
            background: var(--ct-yellow-50);
        }



    .inputtable th {
        border-width: 1px;
        border-style: solid;
        border-color: var(--ct-surface-grey-4);
        padding: 3px;
        font-size: 0.8rem !important;
        font-weight: normal !important;
    }

    .inputtable td {
        border: 1px solid var(--ct-surface-grey-4);
    }

        .inputtable td.strong-right-border, .inputtable th.strong-right-border, .inputtable tr.strong-right-border, td.strong-right-border, tr.strong-right-border, th.strong-right-border {
            border-right-width: 2px;
            border-style: solid;
            border-color: var(--ct-surface-grey-4);
        }

        .inputtable td.strong-top-border, .inputtable th.strong-top-border, .inputtable tr.strong-top-border, tr.strong-top-border, th.strong-top-border, td.strong-top-border {
            border-top-width: 2px;
            border-style: solid;
            border-color: var(--ct-surface-grey-4);
        }


table.cell-bordered tr td, table.cell-bordered tr th {
    border: 1px solid var(--ct-surface-grey-4);
}

table.cell-bordered tr th {
    border-color: var(--ct-primary-dark-theme-colour);
}

#gdivAudit {
    top:unset !important;
    left:unset !important;
}


.sorttable tbody tr.no-result, .sorttable tbody tr.no-result:hover, .sorttable tbody tr.no-result td, .sorttable tbody tr.no-result:hover td {
    background: var(--ct-surface-bg-ev1) !important;
    border-bottom:0px !important;
}
.sorttable tbody tr.no-result {
    border-left: 1px solid var(--ct-surface-grey-3);
    border-right: 1px solid var(--ct-surface-grey-3);
}
table.sorttable tbody tr {
    outline: 1px solid transparent;
}

#tblMain tfoot td, #tblMain tfoot tr, #tblMain tfoot {
    background: var(--ct-surface-bg);
    color: var(--ct-on-surface-bg);
    padding: 8px 0px;
    height: 42px;
    border: 1px solid var(--ct-surface-grey-3);
}

table#tblMain {
    box-shadow:unset !important;
}

#tblMain tfoot .control-left label:first-child, .toolstable tfoot .control-left label:first-child {
   margin-bottom:9px !important;
}

#prevRows:hover, #nextRows:hover, #selectFields:hover, .sorttable.tblMain_th #selectFields:hover, #fullscreen:hover {
    background: var(--ct-primary-dark-theme-colour) !important;
    color: #FFFFFF !important;
}

#prevRows, #nextRows, #selectFields, #fullscreen {
    cursor: pointer;
    background: var(--ct-body-bg) !important;
    border-radius: 100%;
    border: 1px solid var(--ct-surface-grey-3) !important;
    font-size: 18px !important;
    padding: 6px !important;
}


#divSearch > .inputsector > .inputsectorlabel {
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
}

#divRecord {
    text-align:unset !important;
}

.sorttable #rowsperpagecustom {
    width: 40px;
    height: 28px !important;
    padding: 0;
    vertical-align: text-bottom;
    margin-top: -8px;
    margin-left: 10px;
    margin-right: -10px;
}

.scrolllist-showselected, .scrolllist-showall {
    top: 16px;
    right: 6px;
}


/* Map Toolbar */


div.maptoolbar {
    position: absolute;
    left: 3px;
    top: 3px;
    z-index: 1;
    right: 3px;
}

.maptoolbarmenu {
    /* MUST show overflow for sub context menus */
    overflow: visible !important;
}

.ol-streetview {
    position: absolute;
    right: 3px;
    bottom: 80px;
}

.ol-onenetopts {
    position: absolute;
    right: 3px;
    bottom: 120px;
}

.ol-zoom {
    position: absolute;
    right: 6px;
    bottom: 6px;
}

/* Map Toolbar Icon */
.ol-rotate-reset {
    padding:0;
    background:0;
    border-radius:0;
}

.ol-onenetopts,
.ol-streetview,
div.maptoolbaricon,
.ol-zoom-in,
.ol-zoom-out,
.ol-rotate {
    position: absolute;
    padding: 3px;
    margin: 0px;
    height: 25px;
    width: 25px;
    background-color: var(--ct-surface-bg);
    border: 1px solid var(--ct-surface-grey-3);
    border-radius: 4px;
    cursor: pointer;
}

    div.maptoolbaricon:hover, .ol-zoom-in:hover, .ol-zoom-out:hover {
        background-color: var(--ct-surface-grey-3);
    }

button[type="button"].ol-zoom-in, button[type="button"].ol-zoom-out {
    border-radius: 4px;
    cursor: pointer;
    border: 1px solid var(--ct-surface-grey-3);
    width: 35px;
    height: 35px;
    padding: 3px;
    right: 0;
    color: var(--ct-surface-bg);
    position:absolute;
}

.ol-zoom-in {
    bottom: 37px;
}

.ol-zoom-out {
    bottom: 0px;
}

    .ol-zoom-in:before, .ol-zoom-out:before, .ol-streetview button[type="button"]:before, .ol-onenetopts button[type="button"]:before {
        position: absolute;
        left: 5px;
        top: 3px;
        font-family: 'Material Icons';
        font-weight: normal;
        font-style: normal;
        font-size: 24px;
        display: inline-block;
        line-height: 28px;
        text-transform: none;
        letter-spacing: normal;
        word-wrap: normal;
        white-space: nowrap;
        direction: ltr;
        -webkit-font-smoothing: antialiased;
        text-rendering: optimizeLegibility;
        -moz-osx-font-smoothing: grayscale;
        font-feature-settings: 'liga';
        cursor: pointer;
        font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24;
        color: var(--ct-primary-theme-colour);
    }

html.dark .ol-zoom-in:before, html.dark .ol-zoom-out:before {
    color: var(--ct-primary-light-theme-colour);
}

.ol-zoom-out:before {
    content: 'remove'
}

.ol-zoom-in:before {
    content: 'add'
}



tr.trParent.rowcollapse {
    background:var(--ct-surface-grey-4) !important;
}

#gIfrmFocusBG {
    position: absolute;
    top: 0px;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    content: '';
    display: none;
    z-index: 21;
    pointer-events: none;
}

tr.tblBlankState td {
    background: var(--ct-primary-light-theme-colour);
    color: var(--ct-primary-dark-theme-colour);
    text-align: center;
}

    tr.tblBlankState td i {
        font-size: 3rem;
        margin-top: 2rem;
    }

html.dark tr.tblBlankState td i {
    color: var(--ct-primary-theme-colour);
}

tr.tblBlankState td div.cds-fs-h5 {
    margin-bottom: 2rem;
}

div.div-inputgroup-primary,
div.div-inputgroup-primary.outline {
    border: 2px solid var(--ct-primary-theme-colour);
    border-radius: 8px;
}
    .div-inputgroup-primary > label:first-child {
        background: var(--ct-primary-theme-colour);
        color: #FFF;
    }
    .div-inputgroup-primary > h3:first-child {
        background: var(--ct-primary-theme-colour) !important;
        color: #FFF;
        
    }

.fadein {
    -webkit-animation: fadein 1s; /* Safari, Chrome and Opera > 12.1 */
    -moz-animation: fadein 1; /* Firefox < 16 */
    -ms-animation: fadein 1s; /* Internet Explorer */
    -o-animation: fadein 1s; /* Opera < 12.1 */
    animation: fadein 1s;
}
.fadeout {
    -webkit-animation: fadeout 1s; /* Safari, Chrome and Opera > 12.1 */
    -moz-animation: fadeout 1; /* Firefox < 16 */
    -ms-animation: fadeout 1s; /* Internet Explorer */
    -o-animation: fadeout 1s; /* Opera < 12.1 */
    animation: fadeout 1s;
}

@keyframes fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}
/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes fadeout {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
    }
}
/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadeout {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
    }
}


#gnavOrgLogo {
    position: fixed;
    right: 10px;
    bottom: 70px;
    z-index: 100;
    background: #FFF;
    border-radius: 5px;
    box-shadow: #0000004f 0px 0px 7px 0px;
    padding: 5px;
    border: 2px solid var(--ct-primary-dark-theme-colour);
    outline: 1px solid var(--ct-primary-light-theme-colour);
    display: none;
}

.ifrm_cont div.ui-resizable-e {
    width: 8px !important;
}

.pulseRed {
    background: var(--ct-red-700) !important;
    box-shadow: 0 0 0 0 rgba(255, 82, 82, 1);
    animation: pulse-red 2s infinite;
    color:#FFF !important;
}

@keyframes pulse-red {
    0% {
        /* transform: scale(0.95);*/
        box-shadow: 0 0 0 0 rgba(255, 82, 82, 0.7);
    }

    70% {
        /* transform: scale(1);*/
        box-shadow: 0 0 0 10px rgba(255, 82, 82, 0);
    }

    100% {
        /*transform: scale(0.95);*/
        box-shadow: 0 0 0 0 rgba(255, 82, 82, 0);
    }
}

.inputrow.hasInputHelper label.inputlabel::after {
    content: 'info';
    font-family: 'Material Icons';
    vertical-align: middle;
    color: red;
    font-size: 14px;
    z-index: 999;
}

.inputrow.hasInputHelper label.inputlabel {
    z-index: 50;
}

.inputHelper {
    position: absolute;
    padding: 6px;
    border-radius: 4px;
    border: 1px solid var(--ct-surface-bg);
    outline: 1px solid var(--ct-surface-grey-6);
    z-index: 79;
    font-size: 0.7rem;
    background: var(--ct-surface-bg);
    color: var(--ct-on-surface-bg);
    top: 5px;
}

    .inputHelper div {
        max-height: 40vh;
        overflow: auto;
    }

    .inputHelper h1 {
        font-size: 18px !important;
    }

    .inputHelper h2 {
        font-size: 16px !important;
    }

    .inputHelper h3, .inputHelper h4, .inputHelper h5 {
        font-size: 14px !important;
    }

    .inputHelper p {
        font-size: 12px !important;
    }

    .inputHelper::before {
        content: '';
        position: absolute;
        left: -8px;
        top: 6px;
        width: 7px;
        height: 14px;
        background: var(--ct-surface-grey-6);
        border-right: 0px;
        clip-path: polygon(100% 0, 0 46%, 100% 100%);
    }

    input::-ms-reveal,
    input::-ms-clear {
        display: none;
    }

    .toggle-eye {
        position: absolute;
        right: 10px;
        top: 50%;
        transform: translateY(-25%);
        cursor: pointer;
        font-size: 22px;
        user-select: none;
    }

        .required + .toggle-eye {
            right: 40px;
        }



label,
input,
td,
th,
button,
.inputsectorlabel {
    font-family: var(--font) !important;
}