: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: #FFF;
    --ct-on-input-bg: #000;

    --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: #FFF;
    --ct-primary-dark-theme-colour: #880E4F;
    --ct-on-primary-dark-theme-colour: #FFF;
    --ct-primary-light-theme-colour: #FCE4EC;
    --ct-on-primary-light-theme-colour: #880E4F;
    --ct-secondary-theme-colour: #E91E63;
    --ct-on-secondary-theme-colour: #FFF;
    --ct-secondary-dark-theme-colour: #880E4F;
    --ct-on-secondary-dark-theme-colour: #FFF;
    --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);
}


.dark:root {
    --ct-on-surface-bg: #FFF;
    --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: #000;
    --ct-on-input-bg: #FFF;
}


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

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%;
    letter-spacing: .75px;
    /*overflow: auto;*/
    margin: 0;
}

img.badge {
    position: absolute;
    display: block;
    z-index: 77;
    height: 52px;
    right: 7px;
    top: 9px;
    color: var(--ct-primary-theme-colour);
    background-color: #FFFFFF;
    border-radius: 4px;
    left: unset;
    padding: 2px 2px;
}


.cadw img.badge,
.me-iframe img.badge {
    display: none !important;
}

img.badgesystems {
    position: fixed;
    top: .5rem;
    right: .5rem;
    z-index: -1;
    max-height: 88px;
    padding: 8px 24px;
    background: #FFF;
    border: 1px solid #EEE;
}

img.badge:not(.sitelogo) {
    display: inline !important;
    left: initial !important;
    bottom: 35px !important;
    right: 2em !important;
    height: 60px !important;
    transform: none !important;
    max-height: initial !important;
    max-width: initial !important;
    border: none !important;
    opacity: 0.6;
}


img.ccs {
    position: fixed;
    right: 1em;
    bottom: 1em;
    background: #ffffff;
    border: 1px solid #EEEEEE;
    z-index: 0 !important;
    border-radius: 4px;
    display: none;
}

a.training {
    position: fixed;
    right: 0px;
    margin: 5px;
    font-size: 14px;
    margin-top: 6px;
    z-index: 91;
    color: white;
    position: absolute;
    left: 238px;
    top: 130px;
    opacity: 0.85;
}

#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: #FFFFFF;
    font-size: 16px;
    padding-top: 10px;
    padding-bottom: 10px;
}



.embedded body {  background: transparent !important;}

/* NEAS CAD Online */
html.client2_cado body { margin-top: 78px; }

::-webkit-input-placeholder {
    font-size: 11px;
    font-weight: normal;
}

hr {
    border-style: outset;
}

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


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;
}

button.waves-effect {
    overflow: hidden !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;
}

button.waves-effect:active:after {
    transform: scale(0, 0);
    opacity: .2;
    transition: 0s;
}


button:focus:not(.ct-tab-link),
input:focus {
    outline-color: var(--ct-primary-theme-colour) !important;
    border: 1px solid var(--ct-surface-bg) !important;
}

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;
}

.icon32 {
    font-size: 32px;
}

a img { border: 0; }

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

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

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

.pagetitle {
    font-size: 18px;
    line-height: 48px;
    vertical-align: top;
    color: rgba(0, 0, 0, 0.7);
}

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

.hideele {
    display: none;
}

html.desktop #gdivInputBox {
    background: var(--ct-surface-bg) !important;
}



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

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

div.normaldiv {
    width: 800px;
    border: 0px;
    position: fixed;
    height: auto;
    background-color: #FAFAFA;
    box-shadow: 0 0 1em #CCCCCC;
    z-index: 89;
    max-height: 95vh !important;
    padding: 0px;
    margin-left: 0px;
    border: solid 2px #D81B60;
}

    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;
}

div.iframediv {
    position: fixed;
    background-color: var(--ct-surface-bg);
    z-index: 89;
    left: 50%;
    width: 1100px;
    margin-left: -550px;
    min-height: 550px;
    height: 100%;
    border: none;
}

iframe.normaldiv {
    left: 50%;
    width: 1100px;
    margin-left: -550px;
    min-height: 550px;
    height: 100%;
    background-color: var(--ct-surface-bg);
    z-index: 100;
    position: absolute;
}

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

    div.smalldiv > .pagehead.globalcentre {
        margin-left: -2px;
        margin-right: -3px;
    }


#divSaveWarning {
    text-align: center !important;
    font-weight: normal !important;
    font-size: 0.8rem;
    padding: 1rem;
}

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

    #gdivInfoMain table {
        background: var(--ct-surface-bg-ev1) !important;
    }

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

#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;
}

    .modalContainer.hideele {
        display: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;
    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;
    position: fixed;
    min-height: 250px;
    z-index: 99;
}


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

#glblMsgBoxTitle {
    font-weight: bold;
    padding: 0 5rem 1rem;
    text-align: center;
    box-shadow: none;
    border: none;
    position: absolute;
    transform: translate(-50%, -50%);
    left: 50%;
    top: 118px;
    color: var(--ct-on-surface-bg);
    background:transparent !important;
}

#glblMsgLbl {
    padding: 0 5rem;
    text-align: center;
    padding-top: 1vh;
    max-height: 55vh;
    overflow: auto
}

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

#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;
}

html.dark #gdivSubmitting {
    background: rgba(0, 0,0, 0.8);
}


    #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;
    }
}

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;
}

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

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

label.inputsectorlabel, .ui-accordion .ui-accordion-header {
    font-size: 16px;
    display: block;
    padding: 4px 4px 4px 5px;
    border-radius: 0px;
}

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;
}

    label.inputlabel + button {
        margin-left: 1px;
    }

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

    label.inputlabelhelp:hover {
        cursor: pointer;
    }

div.inputlabeltip {
    background-color: var(--ct-surface-bg);
}

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

.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;
}

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

.ui-button .ui-button-text {
    pointer-events: none;
}

.disable-ui {
    pointer-events: none;
}

/* Behind Div code - used to fade/blur data behind dim layers*/
.behind-div {
    pointer-events: none;
    opacity: .26;
    -webkit-filter: blur(1px);
    filter: blur(1px);
}


/* 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;
    padding-top: 40px;
    top: 0px;
    left: 0px;
    width: 85px;
    height: 100%;
    background-color: white;
    box-shadow: 0 0 20px rgba(0,0,0,0.3);
}

    #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: absolute;
        display: none;
        margin-left: 82px;
        width: 320px;
        height: auto;
        background-color: white;
        padding: 5px;
        box-shadow: 0 0 20px rgba(0,0,0,0.3);
        z-index: 99;
    }

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


#gdivNavBG {
    background-color: rgb(33 33 33 / 50%);
    position: absolute;
    width: 100%;
    top: 0px;
    bottom: 0px;
    left: 0px;
    padding: 0px;
    margin: 0px;
    z-index: 89;
}

.cadw #gdivNavBG {
    opacity: 1 !important;
    top: 0px;
    bottom: 55px;
    height: unset !important;
    background-color: #00000030;
}

html:not(.cadw) #gcmdNav, #spnSettings > i {
    z-index: 91;
    font-size: 50px;
    position: fixed;
    left: 4px;
    top: 9px;
    color: var(--ct-primary-dark-theme-colour);
    background-color: var(--ct-primary-light-theme-colour);
    border: 3px solid var(--ct-gray-200);
    border-radius: 4px;
    padding: 0px 15px;
}

#spnSettings > i {
    left: unset;
    right: 156px;
    line-height: unset;
    font-size: 42px;
    cursor: pointer;
    position:absolute;
}

    #spnSettings > i.material-icons {
        
    }

    .cadw #gcmdNav, .me-iframe #gcmdNav {
        display: none;
    }


#gcmdNav:hover,
#toolSearchResults:hover {
    cursor: pointer;
    opacity: 1;
}

html:not(.cadw) #gdivNav {
    position: fixed;
    z-index: 90;
    top: 0px;
    left: 0px;
    width: 88px;
    height: 100%;
    background-color: var(--ct-primary-dark-theme-colour);
    -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;
    padding-top: 50px;
}

.cadw #gdivNav {
    position: fixed;
    z-index: 90;
    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;
    overflow: hidden;
    border-radius: 4px;
}





#gdivNav .menu-right {
    background-image: none !important;
}

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

#toolSearchText::-webkit-input-placeholder {
    font-size: 24px;
}

#gdivNav ul {
    background-color: var(--ct-primary-dark-theme-colour);
    max-width: 556px;
}

.cadw #gdivNav ul {
    background-color: transparent;
}

#gdivNav ul li .material-icons {
    font-size: 28px;
}

#gdivNav ul li ul {
    display: none;
}

#gdivNav .material-icons, #toolSearchResults .material-icons {
    font-size: 48px;
    display: block;
}

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

#gdivNav a,
#toolSearchResults a {
    display: block;
    text-overflow: ellipsis;
    font-weight: 700;
    border-radius: 8px;
}





.cadw #toolSearchResults a {
    font-weight: 500 !important;
}

#gdivNav .menu-right::after {
    content: '+';
    position: absolute;
    top: 4px;
    right: 4px;
    font-size: 20px;
}

#gdivNav .navSubSec .menu-right::after {
    opacity: .54;
    top: 2px;
    right: 16px;
}

#gdivNav ul ul .menu-right > i.material-icons,
#toolSearchResults .good-match i.material-icons {
    color: var(--ct-primary-theme-colour);
}

#gdivNav a,
#toolSearchResults a {
    cursor: pointer;
}

html:not(.cadw) #gdivNav > div.globalcentre > ul > li > a i.material-icons {
    color: #FFFFFF;
}

.cadw #gdivNav > div.globalcentre > ul > li > a i.material-icons {
    color: var(--ct-on-primary-dark-theme-colour) !important;
}

html:not(.cadw) #gdivNav > div.globalcentre > ul > li:not(.navTab) > a:hover {
    background: var(--ct-primary-theme-colour);
}

.cadw #gdivNav > div.globalcentre > ul > li:not(.navTab) > a:hover {
    background: transparent;
}

#gdivNav .navSubSec li a:hover,
#toolSearchResults li a:hover {
    background: #E0E0E0;
}



#togjfx.jqfxenb {
    background-color: transparent;
}

    #togjfx.jqfxenb > i {
        background-color: transparent !important;
    }

#gdivNav .navSubSec {
    position: fixed;
    display: none;
    margin-left: 108px;
    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);
}

.cadw #gdivNav .navSubSec {
    margin-left: 100px;
    border-color: var(--ct-primary-dark-theme-colour);
    background: var(--ct-surface-bg);
}




#gdivNav .navSubSec li,
#toolSearchResults .navSubSec li {
    display: inline-block;
    width: 132px;
    vertical-align: top;
    text-align: center;
    transition: height .125s, width .25s, opacity 1.5s;
    background: transparent !important;
}

.cadw #gdivNav .navSubSec li {
    width: 128px;
}

#gdivNav .navSubSec li a {
    margin: 4px;
    min-height: 76px;
    text-overflow: ellipsis;
    font-weight: 500;
    padding: 5px;
    border-radius: 8px;
    color: var(--ct-on-surface-bg);
    position: relative;
}

.cadw #gdivNav .navSubSec li a:hover, .cadw #toolSearchResults li a:hover {
    background: var(--ct-surface-bg-ev2) !important;
}

.cadw #gdivNav .navSubSec li a.middle-select, .cadw #toolSearchResults li a.middle-select {
    background: var(--ct-primary-light-theme-colour) !important;
    color: var(--ct-primary-dark-theme-colour) !important;
}




#toolSearchResults .navSubSec li a,
#gdivNav .navSubSec li a {
    border: 2px solid transparent;
}

.navBack i {
    color: black;
}

#gdivNav hr,
#toolSearchResults hr {
    border: 0;
    border-top: 1px solid rgba(0,0,0,0.1);
    margin: 1em;
}



#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;
}

.cadw #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;
}

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

.cadw 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;
}

.cadw 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;
}

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

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


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

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

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



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

.cadw #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;
}

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




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


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

html:not(.cadw) #toolSearchResults ul.navSubSec {
    zoom: 125%;
}

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

.ui-nosecurity {
    opacity: 0.2;
    pointer-events: none;
}


#gdivNav .material-icons.ui-nosecurity:after,
#toolSearchResults .material-icons.ui-nosecurity:after {
    position: absolute;
    float: right;
    color: rgb(224, 208, 162);
    font-size: 16px;
    font-weight: 700;
    margin-left: -4px;
    content: 'lock_outline';
}

.cadw #toolSearchResults ul.navSubSec li.searching-match, .cadw #toolSearchResults ul.navSubSec li.searching-match mark {
    font-size: unset;
}

#toolSearchResults ul.navSubSec li.searching-match {
    position: sticky;
    top: -1em;
    margin: 1em;
    margin-left: -.5em;
    margin-right: -.5em;
    padding: 1em;
    background: var(--ct-surface-bg) !important;
    text-align: left;
    display: block;
    color: var(--ct-on-surface-bg);
    width: auto;
    font-size: 12px;
    pointer-events: none;
    border-bottom: 2px solid var(--ct-primary-theme-colour);
    z-index: 2;
    font-weight: 700;
}




#toolSearchResults ul.navSubSec li.searching-match mark {
    color: var(--ct-primary-theme-colour);
    background: transparent;
    font-size: 11px;
}

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

#toolSearchResults strong {
    position: relative;
}

    #toolSearchResults strong::before {
        position: absolute;
        height: 100%;
        width: 100%;
        margin-left: -.25em;
        margin-top: -.25em;
        background: #F06292;
        padding: .25em;
        border-radius: 8px;
        opacity: .2;
        content: '';
    }

.cadw #toolSearchResults strong::before {
    background: var(--ct-secondary-theme-colour);
}



#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;
}

a.training {
    font-weight: 700;
    font-size: 1.5rem;
}

.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;
}

.cadw #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;
}

.cadw #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;
}

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

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

html:not(.cadw) #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;
}

.cadw #gdivNav ul.navSubSec {
    box-shadow: unset;
}











#divMySettingsList {
    overflow: auto;
    height: 90%;
}

div#gDivMySettingsContainer {
    overflow-y: hidden !important;
}

.mysetting-subheader {
    font-size: 16px;
    text-indent: 8px;
    line-height: 2em;
}

    .mysetting-subheader.single {
        font-size: 1.5em;
        text-indent: 0px;
        font-weight: bold;
    }


.mysetting-setting {
    padding: 8px;
    height: 2em;
    display: grid;
    grid-template-columns: 33% 67%;
    grid-gap: 1em;
    box-sizing: initial;
}

.mysetting-header {
    margin-top: 6px;
    margin-left: 6px;
    font-size: 18px;
}

    .mysetting-header > span {
        font-size: 18px;
        font-weight: 700;
        color: #000;
    }

    .mysetting-header.single {
        display: none;
    }

.mysetting-value {
    border: 1px solid #616161;
    padding: 6px;
    border-radius: 4px;
    background: #fff;
    position: relative;
    font-size: 16px;
    height: 1.3em;
    cursor: pointer;
    transition: box-shadow 200ms cubic-bezier(0.4, 0, 0.2, 1);
    box-sizing: initial;
}

    .mysetting-value * {
        cursor: pointer;
    }

.mysetting-edit {
    position: absolute;
    top: -7px;
    left: -10px;
    font-size: 30px;
    opacity: 0;
    transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1);
}

.mysetting-value:hover {
    border: 1px solid var(--ct-primary-theme-colour);
    box-shadow: 0px 0px 4px 0px;
}

    .mysetting-value:hover .mysetting-edit {
        opacity: 1;
    }

.mysetting-data {
    overflow: hidden;
    height: 100%;
    width: 100%;
    display: flex;
    justify-content: center;
}

.mysetting-page {
    padding: 6px;
    margin: 16px;
    border-radius: 4px;
    margin-left: 0px;
    padding-bottom: 12px;
}

#gDivMySettingsEditValue {
    width: 100%;
    height: 30vh;
}

#divMySettingsSearch {
    text-align: right;
    padding-right: 33px;
}

#gDivMySettingsWrapper {
    margin-top: 10px;
}

#inputMySettingsSearch {
    width: 30%;
    border: 2px solid rgb(224, 224, 224);
    height: 30px;
    padding: 2px;
    margin: 2px;
}

.mysetting-deleteicon {
    vertical-align: text-top;
    margin-left: 10px;
    opacity: 0;
    cursor: pointer;
    transition: opacity 400ms cubic-bezier(0.4, 0, 0.2, 1);
}

.mysetting-header:hover .mysetting-deleteicon {
    opacity: 1;
}

#divMySettingsList.empty:after {
    content: 'No results found!';
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    color: #616161;
}

.mysetting-match {
    text-shadow: 0 0 5px var(--ct-primary-theme-colour);
}

#divMySettingsSearch * {
    font-size: 16px;
    vertical-align: middle;
}

#gDivMySettings > div > div {
    height: 60vh;
}


i.material-icons.address_section,
li.address_section a i.material-icons,
#gdivNav ul ul li.address_section a.menu-right > i.material-icons,
#toolSearchResults .good-match i.material-icons.address_section {
    color: #4CAF50;
}

i.material-icons.calls_section,
li.calls_section a i.material-icons,
#gdivNav ul ul li.calls_section a.menu-right > i.material-icons,
#toolSearchResults .good-match i.material-icons.calls_section {
    color: #9C27B0;
}

i.material-icons.miscellaneous_section,
li.miscellaneous_section a i.material-icons,
#gdivNav ul ul li.miscellaneous_section a.menu-right > i.material-icons,
#toolSearchResults .good-match i.material-icons.miscellaneous_section {
    color: #00695c;
}

i.material-icons.treatmentcentre_section,
li.treatmentcentre_section a i.material-icons,
#gdivNav ul ul li.treatmentcentre_section a.menu-right > i.material-icons,
#toolSearchResults .good-match i.material-icons.treatmentcentre_section {
    color: #03A9F4;
}

i.material-icons.resources_section,
li.resources_section a i.material-icons,
#gdivNav ul ul li.resources_section a.menu-right > i.material-icons,
#toolSearchResults .good-match i.material-icons.resources_section {
    color: #FFC107;
}

i.material-icons.security_section,
li.security_section a i.material-icons,
#gdivNav ul ul li.security_section a.menu-right > i.material-icons,
#toolSearchResults .good-match i.material-icons.security_section {
    color: #0026ff;
}

i.material-icons.supervisortools_section,
li.supervisortools_section a i.material-icons,
#gdivNav ul ul li.supervisortools_section a.menu-right > i.material-icons,
#toolSearchResults .good-match i.material-icons.supervisortools_section {
    color: #FF9800;
}

i.material-icons.staff_section,
li.staff_section a i.material-icons,
#gdivNav ul ul li.staff_section a.menu-right > i.material-icons,
#toolSearchResults .good-match i.material-icons.staff_section {
    color: #607d88;
}

i.material-icons.statusplan_section,
li.statusplan_section a i.material-icons,
#gdivNav ul ul li.statusplan_section a.menu-right > i.material-icons,
#toolSearchResults .good-match i.material-icons.statusplan_section {
    color: #795548;
}

i.material-icons.pathways_section,
li.pathways_section a i.material-icons,
#gdivNav ul ul li.pathways_section a.menu-right > i.material-icons,
#toolSearchResults .good-match i.material-icons.pathways_section {
    color: #f44336;
}

i.material-icons.cms_section,
li.cms_section a i.material-icons,
#gdivNav ul ul li.cms_section a.menu-right > i.material-icons,
#toolSearchResults .good-match i.material-icons.cms_section {
    color: #00B8D4;
}

i.material-icons.patientindex_section,
li.patientindex_section a i.material-icons,
#gdivNav ul ul li.patientindex_section a.menu-right > i.material-icons,
#toolSearchResults .good-match i.material-icons.patientindex_section {
    color: #00C853;
}

i.material-icons.safeguarding_section,
li.safeguarding_section a i.material-icons,
#gdivNav ul ul li.safeguarding_section a.menu-right > i.material-icons,
#toolSearchResults .good-match i.material-icons.safeguarding_section {
    color: #1A237E;
}

i.material-icons.enquiries_section,
li.enquiries_section a i.material-icons,
#gdivNav ul ul li.enquiries_section a.menu-right > i.material-icons,
#toolSearchResults .good-match i.material-icons.enquiries_section {
    color: #f44336;
}


i.material-icons.back_button,
a i.material-icons.back_button {
    color: #484848 !important;
}

/* temp style to disable nav links */
.navSubSec li .disabled {
    opacity: 0.2;
}

#gnavOrgLogo {
    position: fixed;
    right: 10px;
    bottom: 10px;
    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;
}

.cadw #gnavOrgLogo {
    bottom: 70px;
}

.navIcon_extra {
    font-weight: 700;
    color: var(--ct-primary-theme-colour);
    display: block;
}

.nav-undev a {
    background: var(--ct-red-200);
    opacity: 0.7 !important;
}

#gdivNav .menu-sub + .navSubSec {
    margin-left: 100px;
    margin-top: -59px;
}


/* BEGIN INPUTS */

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

.cds-col div.inputrow select {
    width: calc(100% - 12px);
    -webkit-transition: box-shadow 0.1s linear;
    -moz-transition: box-shadow 0.1s linear;
    transition: box-shadow 0.1s linear;
}

.centrerow input[type="text"] {
    max-width: 50% !important;
}

input[type="text"],
input[type="password"],
textarea,
select {
    padding: 17px 4px 4px 5px !important;
    border-radius: 4px;
    border: 1px solid var(--ct-blue-gray-300);
    margin-bottom: -4px;
    font-size: 0.8rem;
   /* font-family: 'Roboto', Lucida Grande,Lucida Sans,Arial,sans-serif;*/
}


html.dark input[type="text"],
html.dark input[type="password"],
html.dark textarea,
html.dark select {
    border-color:var(--ct-surface-grey-4);
}

select,
input[type="text"],
input[type="password"],
textarea {
    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;
    /*resize: none;
    letter-spacing: .75px;*/
    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"],
textarea,
.textselect {
    -webkit-user-select: text;
    -moz-user-select: text;
    -ms-user-select: text;
    user-select: text;
}


/* select,
div.inputrow select {
    height: 40px;
    font-size: unset;
    width: 100%;
    border-radius: 4px;
}

div.newlayout .inputrow select {
    width: calc(100% - 5px);
} */

.inputrow.nolabel input.ccsSelect, 
.inputrow.nolabel input {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}

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

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

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


select > option {
    background-color: #FAFAFA;
    color: #000;
    font-weight: 700;
    font-size: 0.8rem;
}

div.inputrow input[type="checkbox"],
div.inputrow .groupmulti {
    margin-left: 31.5%;
    margin-right: auto;
    margin-bottom: .5em;
}

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

#frm input[disabled],
#frm textarea[disabled] {
    background: var(--ct-surface-grey-4);
}

html.dark #frm input[disabled],
html.dark #frm textarea[disabled] {
    background: var(--ct-surface-grey-2);
}

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

/*div.inputrow input[type=checkbox] + label.ui-button {
    width: unset;
    font-size: unset;
    margin-top: 12px;
}

[data-scrolllist] div.inputrow input[type=checkbox] + label.ui-button {
    margin-top: 0px;
}*/

input[type="checkbox"] + label {
    /* position: relative;
    overflow: visible;
    white-space: nowrap;*/
    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;
}

.inputrow input[type="checkbox"] + label {
    margin-top: 7px;
    height: 42px;
}

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

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: var(--ct-blue-gray-300);
   /* 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';
    text-transform: none;
    font-weight: normal;
    font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

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

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

html.dark .sorttable tbody:not(.stack-list) tr.rowselect input[type="checkbox"]:checked + label::before,
html.dark .sorttable tbody:not(.stack-list) tr:hover .material-icons, html.dark .navIcon_extra,
html.dark .sorttable tbody:not(.stack-list) tr:hover input[type="checkbox"]:checked + label::before,
html.dark .sorttable tbody:not(.stack-list) tr:not(.no-result):hover td input[type="checkbox"]:checked + label::before {
    color: var(--ct-primary-dark-theme-colour);
}


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


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

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

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;
}

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;
    line-height: 24px;
}

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


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

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;
}
 

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


/*#frm input[disabled].disabledVisible, 
#frm textarea[disabled].disabledVisible {
    color: #000 !important;
    background: #FFF !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 */



/* BEGIN AUTOCOMPLETES */

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: #FFF;
    }

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


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



/*.ui-accordion-content ul.autocomplete {
    position: fixed;
}*/
/* END AUTOCOMPLETES */
/* BEGIN TABLES */
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;
}

.inifrm table.sorttable {
    width: 100%;
    margin-left: 0px;
    margin-right: 0px;
}

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

table.sorttable tr th {
    font-size: 11px;
    background-color: var(--ct-primary-theme-colour) !important;
    color: #FFF;
    height: 26px;
    text-align: left;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius: 0;
    /*border: none !important;*/
    border:1px solid var(--ct-primary-dark-theme-colour);
    padding: 6px;
}

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 td::after {
        position: absolute;
        top: 0;
        bottom: 0;
        right: 0px;
        content: '';
        border-left: 1px solid var(--ct-surface-grey-3);
    }

    table.sorttable tr td:first-child::before {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0px;
        content: '';
        border-left: 1px solid lightgrey;
    }

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

    table.sorttable tr.no-result td::after,
    table.sorttable tr td:last-of-type::after {
        content: none;
    }

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

    table.sorttable tbody tr.rowhover {
        cursor:pointer;
    }

    table.sorttable tbody tr.rowhover.rowselect:not(.no-result) {
        border: #C2185B solid 1px;
    }

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

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

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

.sorttable.tblMain_th #selectFields {
    color: #FFF !important;
    background-color: var(--ct-primary-dark-theme-colour) !important;
}

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

    table.sorttable tbody tr.rowhover.rowselect:not(.no-result) td {
        border: 0px !important;
        background: var(--ct-primary-light-theme-colour);
        color: var(--ct-primary-dark-theme-colour);
    }

.sorttable tbody tr.rowselect:not(.no-result), .sorttable tbody tr.rowselect:not(.no-result) td {
    background: var(--ct-primary-light-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);
        color: var(--ct-primary-dark-theme-colour);
    }

.sorttable tbody:not(.stack-list) tr:hover, .sorttable 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);
    /*cursor: pointer;*/
}

.sorttable tbody tr.rowhover.rowselect:not(.no-result, .stack-list) {
    outline: 1px solid var(--ct-primary-dark-theme-colour) !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 {
    /*border: 0px !important;*/
    background: var(--ct-surface-bg-ev1) !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.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) ;
}

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

table#tblMain {
    box-shadow: unset !important;
}

#tblMain .parent, #tblMain .child {
    background: var(--ct-surface-bg-ev3) !important;
}

#tblMain > tbody > tr > td {
    -moz-user-select: text;
    -khtml-user-select: text;
    -webkit-user-select: text;
    -ms-user-select: text;
    user-select: text;
}

#gtblLog tbody tr:hover {
    background-color: lightgrey;
    cursor: pointer;
}

.rowselect, tr.rowselect {
    background-color: #F8BBD0; /* TR added to bump up hierarchy */
}

.rowhover:hover {
    background-color: var(--ct-body-bg);
    cursor: pointer;
    transition: background .4s;
}

.rowhoverforce:hover {
    background-color: lightgrey !important;
    cursor: pointer;
}

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

.rowalt {
    background: var(--ct-surface-bg-ev2) !important;
}

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

tr.rowcollapse .iconexpand {
    display: none;
}

tr.rowexpand .iconcollapse {
    display: none;
}

.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;
    }

        .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: bold !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);
        }


[data-sort="True"] i.material-icons.rowicon {
    color: #43a047;
}

[data-sort="False"] i.material-icons.rowicon {
    color: #ef5350;
}

i.material-icons.rowicon {
    font-weight: bold;
    pointer-events: none;
}

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

td.rowselect, table.cell-bordered tr td.rowselect {
    border: 1px solid var(--ct-primary-theme-colour) !important;
    background: var(--ct-primary-light-theme-colour);
    color: var(--ct-primary-dark-theme-colour) !important;
}

tr.rowselect, tr.rowsel {
    border-color: var(--ct-primary-dark-theme-colour) !important;
    outline-color: var(--ct-primary-dark-theme-colour) !important;
    background-color: var(--ct-primary-light-theme-colour) !important;
}

table.ccsResizeTable {
    min-width: unset !important;
    max-width: unset !important;
    table-layout: fixed !important;
    text-wrap: nowrap;
}

    table.ccsResizeTable th, table.ccsResizeTable td {
        text-overflow: ellipsis;
        overflow: hidden;
    }

/* END TABLES */


/* 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;
    left: 25%;
    width: 50%;
    margin-left: 0px;
    margin-right: 25%;
}

    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: #FFFFFF;
            -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;
}

#gdivHead {
    position: absolute;
    position: fixed;
    top: 0;
    left: 52px;
    right: 0;
    z-index: 150;
    padding: 3px;
    padding-right: 52px;
    background: #FFF;
    border-bottom: 1px solid #BBB;
    text-align: center;
    vertical-align: middle;
}
#gspnHeadAlert {
    display: inline-block;
    line-height: 43px;
    height: 43px;
    width: 300px;
    border: 1px solid lightgrey;
    font-size: 20px;
}
#gtblNEASHead {
    font-size: 18px;
    width: 800px;
    margin: 0 auto;
}
    #gtblNEASHead th {
        font-size: 16px;
        text-align: center;
        padding: 1px;
        height: auto;
    }

    #gtblNEASHead td {
        padding: 1px;
    }

/* Iframe CSS */
#ifmMainWrap {
    position: relative;
    width: 100%;
    height: 100%;
}

    #ifmMainWrap iframe {
        width: 100%;
        height: 100%;
    }

#ifmMainClose {
    position: absolute;
    z-index: 200;
    right: -40px;
    top: 5px;
    min-height: 30px;
    min-width: 30px;
    height: 30px;
    width: 30px;
}


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

.topbarheader > a {
    color: #FFFFFF;
}

.topbarheader:hover > a {
    color: black;
}

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

#OLDIE ul.topbar {
    position: absolute;
    bottom: auto;
    top: expression(eval(document.documentElement.scrollTop));
}

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;
    }

#OLDIE ul.topbar ul {
    padding: 0;
    margin: 0;
    list-style: none;
}

ul.topbar li ul {
    position: absolute;
    display: none;
    padding-left: 0;
    background: #FFF;
    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;
}

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

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

#OLDIE ul.topbar ul {
    padding: 0;
    margin: 0;
    list-style: none;
}

#OLDIE ul.topbar li {
    float: left;
    position: relative;
    width: 10em;
    margin: 0px;
    margin-top: -0.2em;
}

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

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

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

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

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

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

li.mailunread {
    background-color: rgb(255, 123, 123);
}

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


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

.alertdialog {
    position: fixed;
    z-index: 200;
    box-shadow: 0px 0px 10px 1px rgba(166,166,166,1);
    background: white;
}

.alerttitle {
    position: relative;
    color: white;
    background: var(--ct-primary-theme-colour);
    padding: 3px;
    font-size: 14px;
}

.alerttitleicon {
    position: absolute;
    right: 0px;
    color: white;
    top: 0px;
}

    .alerttitleicon:hover {
        font-weight: bold;
        cursor: pointer;
    }

.alertbody {
    padding: 3px;
    min-height: 90px;
}

.alertbodyicon {
    float: left;
    font-size: 40px;
}

.alertbodycb:hover {
    font-weight: bold;
    cursor: pointer;
}

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: 50px;
            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;
}

#gdivSelectListData {
    overflow-y: scroll;
    height: 300px;
}

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

#gtblSelectListData tr:hover {
    cursor: pointer;
}

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 {
    -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 i.material-icons {
    font-size: 48px;
}

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

tr.rowcollapse {
    background: url("minus.png") no-repeat right white;
}

tr.rowexpand {
    background: url("plus.png") no-repeat right white;
}

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;
}

.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;
    right: 3px;
}

.maptoolbarmenu {
    /* MUST show overflow for sub context menus */
    overflow: visible !important;
}

.ol-streetview {
    position: absolute;
    right: 3px;
    bottom: 80px;
}

.ol-zoom {
    position: absolute;
    right: 3px;
    bottom: 3px;
}

/* Map Toolbar Icon */
.ol-streetview,
div.maptoolbaricon,
.ol-zoom-in,
.ol-zoom-out {
    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);
}

.ol-zoom-in {
    bottom: 37px;
}

.ol-zoom-out {
    bottom: 0px;
}

    .ol-zoom-in:before, .ol-zoom-out:before, .ol-streetview 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'
}

.ol-streetview button[type="button"]:before {
    content: 'streetview';
    font-size: 18px;
    text-align: center;
    width: 20px;
}

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

.toolbar-active:hover {
    border: 2px outset grey;
    cursor: pointer;
}

.toolbar-pressed {
    background-color: var(--ct-primary-theme-colour);
    border: 2px inset lightgrey;
}

.toolbar-pressed i {
    color: #FFFFFF;
}

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

.toolbar-disabled i,
.toolbar-disabled a {
    color: lightgrey;
    pointer-events: none;
}

.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 {
    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;
}

.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;
}

.clusterCtxMultiHeader {
    font-size: 0.8rem;
    padding-left: 4px;
    position: sticky;
    top: -2px;
    margin-top: -2px;
    background: var(--ct-surface-bg);
    padding: 6px !important;
    border-bottom: 1px solid var(--ct-gray-300) !important;
    border-radius: 0 !important;
}


.auditalt {
    color: #FF9800;
}




/* New Page Layout CSS >>> */
div.newlayout div.inputsector, #divTopTbr {
    width: 1000px;
}

div.newlayout .ui-accordion .ui-accordion-content {
    padding: 3px;
    /*overflow: hidden;*/
    overflow:visible;
    background: var(--ct-surface-bg) !important;
}
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;
}

div.newlayout table.newlayouttbl tr td button[type=button] {
    height: 25px;
    min-height: 0px;
    vertical-align: inherit;
    padding: 0px;
}

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

.inputrow .ui-button-text-only .ui-button-text,
div.newlayout .inputrow .ui-button-text-only .ui-button-text {
    padding: 3px;
    vertical-align: middle;
}
div.newlayout div.labelautowidth label.ui-button {
    width: auto;
}

div.newlayout .colspan3 {
    width: 866px;
    height: 40px;
}

div.newlayout .colspan2 {
    width: 536px;
    height: 40px;
}
/* <<< New Page Layout CSS */


.lognotes {
    max-height: 125px;
    overflow: auto;
}

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

.gmapclose {
    position: absolute;
    top: 0px;
    right: 0px;
    z-index: 66;
    background-color: #FFFFFF;
    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: #FFFFFF;
    overflow-y: auto;
}

    .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;
    }

        .contextMenu li.pressed {
            background-color: #E0E0E0;
            outline: 1px solid grey;
        }
        .contextMenu li.disabled {
            pointer-events: none;
            opacity: 0.7;
        }

        .contextMenu li i {
            font-size: 14px;
            padding: 1px 3px;
            border-radius: 3px;
            margin-right: 3px;
        }

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

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

.contextMenu-parent > a {
    background: url("menu_right.png") no-repeat right;
}

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

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

#gdivStatus td {
    padding: 2px 8px 4px 8px;
}

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

#gdivStatus i.material-icons {
    position: absolute;
    margin-top: -2px;
    font-size: 20px;
}

#gdivStatus span {
    margin-left: 28px;
    white-space: pre;
    line-height: 0;
}

div.srchlistdiv {
    width: 500px !important;
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
    margin-left: unset !important;
}


/* Address Auto-Complete */
.addrAutoComp {
    position: absolute;
    display: none;
    max-height: unset;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 0;
    margin-top: 1px;
    border: 2px solid var(--ct-primary-dark-theme-colour);
    z-index: 51;
    width: 70vw;
    background: var(--ct-gray-100);
    font-size: 11px;
    text-align: left;
    box-shadow: unset;
    font-size: 12px;
    height: 300px;
    border-radius: 4px;
}
    .addrAutoComp table {
        table-layout:auto;
        width:100%;
        border-collapse:collapse;
    }

    .addrAutoComp th {
        position: -webkit-sticky;
        position: sticky;
        top: 0px;
        background: white;
        border-bottom: 1px solid grey;
    }

    .addrAutoComp tbody tr:hover {
        background: #d7ebf9;
        cursor: pointer;
    }

    .addrAutoComp td {
        padding-top: 2px;
        padding-bottom: 2px;
    }

    .addrAutoComp table tbody tr td {
        padding: 8px;
        background: var(--ct-surface-bg);
        border-right: 1px solid var(--ct-gray-100);
    }

    .addrAutoComp table tbody tr td {
        padding: 8px;
        background: var(--ct-surface-bg);
        border-right: 1px solid var(--ct-gray-100);
    }

    .addrAutoComp table tbody tr:nth-child(2n+1) td {
        background: var(--ct-primary-light-theme-colour);
    }

    .addrAutoComp table tr th {
        background-color: var(--ct-primary-dark-theme-colour);
        color: #FFF;
        padding: 8px;
    }

    .addrAutoComp tbody tr:hover {
        background: var(--ct-primary-light-theme-colour);
        color: var(--ct-primary-dark-theme-colour);
        cursor: pointer;
    }


/*audit tweaks*/
#gdivAudit {
    padding: 0px;
    overflow-x: hidden;
}

    #gdivAudit > div:nth-child(2) {
        margin-bottom: 10px;
        overflow: auto !important;
        margin-left: 2%;
        margin-right: 1%;
    }

#gtblAudit {
    margin-left: auto !important;
    width: auto;
    min-width: 750px;
}

#gdivAudit > div > div label:not(:nth-child(1)) {
    width: 118px;
}

#gdivAudit > div > div label:nth-child(1) {
    width: 172px;
}

.divaudit-jrnyopt {
    display: none;
}

#txtAuditText {
    margin-left: 8px;
    width: 329px;
}

#gtblAudit div, #gtblAudit object {
    float: left;
    line-height: 25px;
    margin-right: 10px;
}

#gtblAudit .tblAuditDetails object {
    height: 25px;
    border: 1px solid #EFEFEF;
    border-radius: 5px;
    background: #FFFFFF;
    padding: 2px;
    border: 1px solid #CCCCCC;
}

    #gtblAudit .tblAuditDetails object:hover {
        cursor: pointer;
    }

#gtblAudit .auditDataColour {
    float: left;
    width: 25px;
    height: 25px;
    border-radius: 5px;
    border: 1px solid #CCCCCC;
    -webkit-box-shadow: 2px -2px 15px -5px rgba(0,0,0,0.57);
    box-shadow: 2px -2px 15px -5px rgba(0,0,0,0.57);
}

/* Styles for the Colour Picker widget (ModColourSelect) */
.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 #FFF, 1px -1px 0 #FFF, -1px 1px 0 #FFF, 1px 1px 0 #FFF;
    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: #FFF !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: black !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: #FFF !important;
}


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

/*.toastCont.toastLeft {
    box-shadow: -3px 5px 6px rgb(0 0 0 / 50%);
}
*/

.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: #FFF;
    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;
}

.cadw div.toastCont.stacked, .cadw 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: #fff;
}

.toastBadge > div {
    font-size: 21px;
    font-weight: bold;
    color: #fff;
}

.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 #FFF;
    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;
}

.cadw .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: #fff;
    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: #fff;
    }

    .toastModalBottom > div:hover {
        background: #fff;
        color: #830530;
        border: 2px solid #830530;
    }

.toastModalBottom {
    padding: 0px;
    width: 100%;
    position: relative;
    margin: 0px;
}

.toastModalText {
    color: #fff;
    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;
}

.inifrm .toastCont {
    display: none !important;
}



[data-sort="True"] i.material-icons {
    color: #43a047;
}

[data-sort="False"] i.material-icons {
    color: #ef5350;
}

div#gdivInfoPat .inputlabel {
    font-weight: 700;
}

#divSearch > div.inputsector.ui-accordion.ui-widget.ui-helper-reset > div {
    overflow: visible; /* stop dropdown lists being hidden in search divs */
    border-top-left-radius: 0px;
    border-top-left-radius: 0px;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
}

.inputsectorlabel.ui-accordion-header {
    margin-top: 0px;
}

    .inputsectorlabel.ui-accordion-header > a > i.material-icons {
        margin-top: 0px;
    }

.notouchselect {
    -webkit-user-select: none !important;
    -webkit-touch-callout: none !important;
    -webkit-text-size-adjust: none !important;
    -webkit-user-select: none !important;
}

.listSelectedCount {
    line-height: 42px;
}


.realTime-Pulse {
    /* used to indicate date is refreshing in real time */
    background: black;
    border-radius: 50%;
    box-shadow: 0 0 0 0 rgba(0, 0, 0, 1);
    height: 20px;
    width: 20px;
    transform: scale(1);
    animation: pulse-black 2s infinite;
    display: inline-block;
}

    .realTime-Pulse.smallPulse {
        width: 10px;
        height: 10px;
    }


/*.listSelectedCount {
    line-height:42px;
}


.realTime-Pulse {*/
/* used to indicate date is refreshing in real time */
/*background: black;
    border-radius: 50%;
    box-shadow: 0 0 0 0 rgba(0, 0, 0, 1);
    height: 20px;
    width: 20px;
    transform: scale(1);
    animation: pulse-black 2s infinite;
    display: inline-block;
}

    .realTime-Pulse.smallPulse {
        width: 10px;
        height: 10px;
    }*/



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

.pulseWhite {
    background: white;
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 1);
    animation: pulse-white 2s infinite;
}

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

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

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

.pulseRed {
    background: rgba(255, 82, 82, 1) !important;
    box-shadow: 0 0 0 0 rgba(255, 82, 82, 1);
    animation: pulse-red 2s infinite;
}

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

.pulseOrange {
    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);
    }
}

.pulseYellow {
    background: rgba(255, 177, 66, 1) !important;
    box-shadow: 0 0 0 0 rgba(255, 177, 66, 1);
    animation: pulse-yellow 2s infinite;
}

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

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

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

.pulseBlue {
    background: rgba(52, 172, 224, 1);
    box-shadow: 0 0 0 0 rgba(52, 172, 224, 1);
    animation: pulse-blue 2s infinite;
}

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

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

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

.pulseGreen {
    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);
    }
}

.pulsePurple {
    background: rgba(142, 68, 173, 1);
    box-shadow: 0 0 0 0 rgba(142, 68, 173, 1);
    animation: pulse-purple 2s infinite;
}

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

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

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


.gHoverShowText_item {
    border: 1px solid var(--ct-gray-400);
}

.showShortcutKeys .hasShortcut::before {
    content: '';
    position: absolute;
    top: 2px;
    left: 2px;
    font-size: 14px;
    color: #ebebeb;
    background: #252525f0;
    border: 1px solid #b3aeae;
    outline: 1px solid #00000094;
    border-radius: 3px;
    width: 22px;
    font-family: revert;
    height: 22px;
    line-height: 22px;
    z-index: 77;
    font-weight: normal;
    text-align: center;
}

#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: #fff;
}

#gDivExpandImage {
    padding-top: 30px;
    padding-bottom: 30px;
    background-color: transparent !important;
    border: 0px !important;
    text-align: center;
    box-shadow: 0 0 0 0 !important;
}

    #gDivExpandImage img {
        max-width: 600px;
    }

    #gDivExpandImage #gcmdExpandImageClose {
        top: 0px;
        right: 0px;
        position: fixed;
    }

        #gDivExpandImage #gcmdExpandImageClose .material-icons {
            color: #FFFFFF;
            font-size: 3rem;
        }

/* Feature Discovery */
div.feature-host {
    position: absolute;
    display: inline-block;
}

div.feature-host {
    position: absolute;
    width: 50vmax;
    top: 50vmax;
    border-radius: 100%;
    background: var(--ct-primary-theme-colour) !important;
    color: #FFF !important;
    box-shadow: 0 0 3em #777;
}

div.feature-discovery {
    position: absolute;
    top: 0;
    left: 0;
    height: 0;
    width: 0;
    margin-left: 0;
    margin-top: 0;
    padding-left: 0;
    padding-top: 0;
    border-radius: 100%;
    background: var(--ct-primary-theme-colour);
    color: #FFF;
    opacity: 0;
    pointer-events: none;
    transition: 1s;
    z-index: 85;
}

    div.feature-discovery div.feature {
        position: absolute;
        top: 50%;
        left: 50%;
        height: 0;
        width: 0;
        margin-left: 0;
        margin-top: 0;
        border-radius: 100%;
        background: #FFF;
        transition: 0;
    }

    div.feature-discovery > * {
        display: block;
        top: 0;
        left: 0;
        width: 0;
        height: 0;
        overflow: hidden;
        white-space: nowrap;
        transition: .25s;
    }

    div.feature-discovery div.feature * {
        position: static;
    }

    div.feature-discovery.show-feature {
        height: 40vmax;
        width: 40vmax;
        margin-left: -40vmax;
        margin-top: -40vmax;
        padding-left: 40vmax;
        padding-top: 40vmax;
        opacity: .87;
        transition: 1s;
    }

        div.feature-discovery.show-feature > * {
            top: auto;
            left: auto;
            width: auto;
            height: auto;
            zoom: 1;
            transition: .25s;
        }

        div.feature-discovery.show-feature div.feature {
            height: 10vmax;
            width: 10vmax;
            margin-left: -5vmax;
            margin-top: -5vmax;
        }

    div.feature-discovery > :first-child {
        position: fixed;
        left: 50%;
        top: 50%;
        color: #FFFFFF;
        transform: translate(-50%, -50%);
        padding: 16px;
        margin: 0 !important;
        background: #C2185B;
        border-radius: 8px;
        z-index: 1;
        border: solid;
        transition: .25s;
        text-align: center;
    }

    div.feature-discovery.show-feature > :first-child {
        opacity: .87;
    }
/* Feature Dicovery */


/*
    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-theme-colour);
    border: 1px solid var(--ct-primary-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-theme-colour);
        color: #FFFFFF;
        height: 26px;
        text-align: left;
        border-radius: 0;
        border-spacing: 0;
        border-top: 1px solid var(--ct-primary-theme-colour);
        border-bottom: 1px solid var(--ct-primary-theme-colour);
    }

    .scrolltable > thead > tr > th:last-child {
        outline: none;
        border: none;
    }

    .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 !important;
    margin-right: 0px !important;
    margin-bottom: 0px !important;
    /*    margin-left: 10px;*/
}

div.scrolllist input[type="checkbox"] {
    margin: 0px;
}

div.scrolllist div.inputrow input[type="checkbox"] + label {
    height:unset;
    margin:0;
}


div.paging-table.scrolllist div.inputrow > a > p {
    text-decoration: none;
    position: relative;
}

    div.paging-table.scrolllist div.inputrow > a > p:hover {
        color: #000;
    }

    div.paging-table.scrolllist div.inputrow > a > p:before {
        content: "";
        position: absolute;
        width: 100%;
        height: 2px;
        bottom: 0;
        left: 0;
        background-color: var(--ct-primary-theme-colour);
        visibility: hidden;
        -webkit-transform: scaleX(0);
        transform: scaleX(0);
        -webkit-transition: 0.8s ease-in-out 0.1s;
        transition: all 0.8s ease-in-out 0.1s;
        transform-origin: 0 50%;
    }

    div.paging-table.scrolllist div.inputrow > a > p:hover:before {
        visibility: visible;
        -webkit-transform: scaleX(1);
        transform: scaleX(1);
    }

/* Material icons in inputsector labels */

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

label.inputsectorlabel i {
    padding-left: 10px;
    padding-right: 10px;
}


/* File selects */

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

input.filevalue {
    width: 34%;
    margin-left: -9px;
    text-overflow: ellipsis;
}

input.fileinput {
    display: none;
}

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

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

a.fileopenbtn {
    position: absolute;
}

img.fileimg {
    max-height: 100%;
    max-width: 100%;
    width: auto;
    height: auto;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}

div.filepreview {
    width: 38.5%;
    height: 200px;
    display: inline-block;
    margin-top: 1px;
    position: relative;
    text-align: center;
    outline: 2px solid #e0e0e0;
    margin-top: 5px;
    margin-bottom: 2px;
    margin-left: 2px;
}

audio.fileaudio {
    max-width: 100%;
    margin: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

div.filepreview.filepreviewaudio {
    min-height: 55px;
    height: auto;
}

/* Simple dividers */

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

div.divider-top {
    border-color: var(--ct-surface-grey-4) !important;
}



div.divider-bottom {
    padding-top: 10px;
    border-top: 1px solid var(--ct-surface-grey-4);
    margin-top: 10px;
}

div.ui-accordion-content:not(.inputsector) > .centrerow.divider-bottom {
    margin-bottom: 0px;
}


div.inputsector.normaldiv.ui-accordion.ui-widget > div.globalcentre:last-child {
    margin-bottom: 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: #f9f9f9;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 99;
}

    /* Links inside the dropdown */
    .dropdown-content div {
        float: none;
        color: black;
        padding: 12px 16px;
        text-decoration: none;
        display: block;
        text-align: left;
    }

        /* 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 image viewer widget */
#divImageViewer {
    z-index: 9999 !important;
    width: 100vw !important;
    height: calc(100vh - 25px) !important;
    margin-top: -11px;
}

.miv-div > .inputsector {
    height: 100%;
}

.miv-container {
    height: 100%;
    box-sizing: border-box;
    padding: 0px !important;
}

.miv-toolbar {
    position: absolute;
    border: 1px solid #e0e0e0;
    width: 94px;
    height: 87.7%;
    margin-top: 10px;
    z-index: 999;
    margin-left: 10px;
    height: 830px;
    background: #FFF;
}

#miv-exit {
    right: 20px !important;
    position: absolute !important;
    top: 10px !important;
}

    #miv-exit > i {
        position: absolute !important;
        top: 0 !important;
        margin-top: 0px !important;
        right: 0 !important;
        color: #EC407A !important;
        vertical-align: middle !important;
        cursor: pointer;
        z-index: 999;
        font-size: 30px;
    }

.miv-shortcut {
    margin-top: 20px;
    padding: 5px;
    width: 67px;
    font-size: 16px;
    font-weight: bold;
    height: 31px;
    cursor: pointer;
    display: inline-block;
    text-align: center;
    margin-right: 14px;
    border-radius: 4px;
    border: 2px solid var(--ct-primary-theme-colour);
    background: #fff;
}

    .miv-shortcut:hover {
        background-color: var(--ct-primary-theme-colour);
        color: #fff;
    }

.miv-tool {
    padding: 23px;
    cursor: pointer;
}

.miv-sliderval {
    position: absolute;
    text-shadow: -1px -1px 0 #FFF, 1px -1px 0 #FFF, -1px 1px 0 #FFF, 1px 1px 0 #FFF;
    font-family: 'roboto';
    font-size: 16px;
    color: #880E4F;
    font-weight: 700;
    margin-top: 8px;
    width: 42px;
    text-align: center;
}

.miv-tool > i.material-icons {
    font-size: 40px;
    color: #880E4F;
    padding: 3px;
}

.miv-tool.miv-active > i.material-icons {
    transform: translateY(1px);
    filter: saturate(200%);
    box-shadow: 1px 1px 1px 1px;
    border-radius: 4px;
}

.miv-image {
    height: 100%;
    width: 100%;
    margin: 0 auto;
    overflow: hidden;
    z-index: 99;
}

#miv-reset .miv-sliderval {
    display: none;
}

#miv-reset.miv-active .miv-sliderval {
    display: block;
}

.miv-image > object {
    display: block !important;
    object-fit: contain !important;
    /*min-width: 100% !important;*/
    max-width: 100% !important;
    /*min-height: 100% !important;*/
    max-height: 100% !important;
    border: none !important;
    box-shadow: none !important;
    margin: 0 !important;
    cursor: initial !important;
}

.miv-image.expand > object {
    min-width: 100% !important;
    min-height: 100% !important;
    max-width: initial !important;
    max-height: initial !important;
}

.miv-slider .ui-slider-handle {
    border: 2px solid var(--ct-primary-theme-colour);
    border-radius: 4px;
}

.miv-slider-container {
    position: absolute;
    width: 200px;
    margin-top: -37px;
    right: -195px;
    background: white;
    padding: 10px;
    box-shadow: 1px 1px 1px 1px;
    color: #880E4F;
    filter: saturate(200%);
    display: none;
    padding-left: 19px;
    padding-right: 15px;
    z-index: 999;
    background: #f5f5f5;
}

.miv-active > .miv-slider-container {
    display: block !important;
}

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

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


/*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;
    background: #F5F5F5;
    border: 1px solid #E0E0E0;
}

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

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

    .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: 200px;
    text-align: left;
}

#divPrintType input[type="checkbox"] + label > span.ui-button-text {
    padding-top: 6px;
}

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

#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-theme-colour);
    text-transform: none;
}

tr.settingrow > td {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

#lblMySettings {
    box-shadow: none;
    border-bottom: none;
}

.settingstable > thead > tr {
    outline: none !important;
    top: -2px !important;
}

.settingstable thead tr, .settingstable thead tr th {
    top: -2px !important;
}

tr.settingrow > td {
    width: 1%;
    font-size: 14px;
    white-space: nowrap;
    padding: 10px 5px;
    border-style: solid;
    border-width: 1px;
    overflow: hidden;
    word-break: normal;
    border: none;
    color: #333;
    text-overflow: ellipsis;
}

.settingstable {
    border-collapse: collapse;
    background: white;
    box-shadow: rgb(204, 204, 204) 0px 0px 16px 0px;
}


    .settingstable > thead > tr > th {
        outline: none !important;
        text-indent: 3px;
        padding-top: 2px;
        padding-bottom: 2px;
        border: none;
        overflow: hidden;
        word-break: normal;
        background: var(--ct-primary-theme-colour) !important;
        font-size: 17px;
        color: #fff;
        font-weight: unset;
    }

    .settingstable tbody tr:nth-child(even) {
        background-color: #f5f5f5;
    }

    .settingstable tbody tr, .settingstable tbody tr td {
        font-size: 15px;
        color: #000;
        line-height: 1.2;
        font-weight: normal;
        height: 50px;
        vertical-align: top;
        border-bottom: none;
    }

#gDivMySettings {
    width: 1000px;
    overflow: hidden;
}

.ui-resizable-handle {
    position: absolute;
    z-index: auto !important;
}


.ui-resizable.ui-resizable-resizing {
    /*border: 2px dashed var(--ct-primary-theme-colour) !important;*/
    outline: 3px dashed var(--ct-primary-theme-colour) !important;
}

.ui-resizable.ui-resizable-resizing {
    outline: 3px dashed var(--ct-primary-theme-colour) !important;
}

.ui-resizable-helper {
    opacity: .84;
    background: #880E4F;
    color: #880E4F;
    border: 2px solid #FFFFFF !important;
    line-height: 100%;
}

/* GB 22/08/2024 - added so resize elements don't overlap scrollbars */
.ui-resizable-e {
    right: -7px;
}

.ui-resizable-w {
    left: -7px;
}

.ui-resizable-s {
    bottom: -7px;
}

.ui-resizable-n {
    top: -7px;
}

.ui-resizable-se {
    width: 14px;
    height: 14px;
    right: -7px;
    bottom: -7px;
}

.ui-resizable-ne {
    width: 14px;
    height: 14px;
    right: -7px;
    top: -7px;
}

.ui-resizable-sw {
    width: 14px;
    height: 14px;
    left: -7px;
    bottom: -7px;
}

.ui-resizable-nw {
    width: 14px;
    height: 14px;
    left: -7px;
    top: -7px;
}

#gDivMySettingsWrapper {
    margin-top: 30px;
    box-shadow: none;
}

#gDivMySettingsInputsector {
    background: #FAFAFA;
    /*height: 555px;*/
}

#gDivMySettings > div > div {
    height: 435px;
    padding-top: 0px;
    padding-bottom: 30px;
}

#gDivMySettings #divClose {
    border: none;
    z-index: 99;
    background: white;
    position: relative;
    bottom: 0;
    width: 100%;
    left: 50%;
    transform: translate(-50%);
    padding-bottom: 10px;
    height: 33px;
    margin-top: 0px;
    padding-top: 10px;
    box-sizing: content-box;
}

table.settingstable.empty::after {
    position: absolute;
    content: 'NO SETTINGS FOUND!';
    top: 50%;
    transform: translate(-50%);
    left: 50%;
}

i.settingaction {
    padding: 3px;
    margin-top: 10px;
}

tr.settingrow > td > div {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-top: 15px;
}

    tr.settingrow > td > div.expand {
        white-space: normal;
        word-break: break-all;
        user-select: text;
    }

.settingstable > tbody > tr > td:first-child,
.settingstable > thead > tr > th:first-child {
    padding-left: 10px;
}

#gTblMySettings > thead > tr > th:first-child {
    width: 215px !important;
}

#gTblMySettings > thead > tr > th:nth-child(3) {
    width: 425px !important;
}

#gTblMySettings > thead > tr > th:last-child {
    width: 85px !important;
}

.settingstable .mcs-sub-cell {
    width: 37px;
}

#importSettingsFile {
    visibility: hidden;
    position: absolute;
    bottom: 0;
}

#cmdMySettingsExport, #cmdDeviceDiagnosticsExport, #cmdDeviceDiagnosticsPrint {
    color: #388E3C;
}

#cmdMySettingsImport {
    color: #1976D2;
}

#cmdMySettingsClearAll {
    color: #D32F2F;
}

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

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

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


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

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

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

#gDivMyProfile {
    width: 1000px;
    overflow: hidden;
}

#gDivMyProfileContainer {
    height: 400px;
    padding-top: 0px;
    overflow-y: hidden;
}

#gTblMyProfile {
    height: 130%;
    overflow: hidden;
}

    #gTblMyProfile > object {
        width: 100%;
        height: 100%;
        overflow: hidden;
    }

        #gTblMyProfile > object > #gdivMsgBox {
            top: 22.5%;
            left: 5%;
        }

input.datepick {
    position: static !important;
    z-index: 10 !important;
}


#divMain.main-search {
    margin-left: 85px;
}

#h4Main {
    font-size: 30px;
    margin-left: 85px;
    text-indent: -85px;
    visibility: hidden;
    margin-bottom: 138px;
}

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

#inputMainSearch {
    background-color: #FFF;
    border: 2px solid transparent;
    border-radius: 4px;
    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: 25px;
    padding-bottom: 20px;
    background: #FFF;
    border-radius: 4px;
    border: 1px solid #EFEFEF;
    border-bottom: 2px solid #EFEFEF;
}

.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;
    /*background-color: rgba(241, 243, 244, 1);*/
    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: 40px;
    font-size: var(--icon-size) !important;
}

.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;
    height: 148px;
    top: 46px;
    left: calc(50% + 42px);
    transform: translate(-50%);
    border: none;
}

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

    #toolSearchResults.main-search ul {
        list-style: none;
        padding: 0px;
        padding-left: 3px;
        padding-right: 3px;
        background: #FFF;
        height: 100%;
        overflow: hidden;
        overflow-y: auto;
        /*margin-right: -30px;*/
        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;
                /*margin-left: -30px;*/
            }

    #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;
}*/

input#inputMainSearch:not(.searching):focus {
    border: 2px solid var(--ct-primary-theme-colour);
}

input#inputMainSearch:focus + i#iMainSearch {
    color: #000;
}

#toolSearchResults.searching {
    box-shadow: rgb(33 33 33 / 50%) 0px 0px 0px 5000px;
}

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

.searching + #divMainSearchInput > input#inputMainSearch {
    left: 2px;
    top: 2px;
}

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

#divMainSearchInput {
    height: 100%;
    width: 100%;
    border-radius: 4px;
    border: 1px solid #E0E0E0;
    border-bottom: 2px solid #E0E0E0;
}

#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;
}

#toolSearchResults.adding-shortcut + #divMainSearchInput::after {
    content: 'Add Shortcut';
    position: absolute;
    width: 100%;
    height: 100%;
    top: -57%;
    right: 35%;
    z-index: 81;
    color: #fff;
    border-radius: 13px;
    font-size: 1.5em;
    text-shadow: -1px -1px 0 #212121, 1px -1px 0 #212121, -1px 1px 0 #212121, 1px 1px 0 #212121;
    text-align: center;
}

#toolSearchResults.adding-shortcut {
    box-shadow: var(--ct-primary-theme-colour) 0px 0px 1px 8px, rgb(33 33 33 / 50%) 0px 0px 0px 5000px;
}


@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;
        /*left: -32px;*/
        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;
        }
}


/*New settings styles 30092021*/

#gTblMySettings th, #gTblMySettings td {
    border-right: 1px solid #e0e0e0;
}

#gDivMySettings #divClose {
    margin: 0px;
}

table#gTblMySettings {
    border: 1px solid #e0e0e0;
    width: 100%;
    margin: 0px;
    box-shadow: none;
    margin-top: -2px;
}

#gTblMySettings > thead > tr {
    cursor: pointer;
}

#gTblMySettings .sorticon {
    color: #fff !important;
}

#gTblMySettings > tbody > tr > td:last-child {
    text-align: center;
}

div#gDivMySettingsContainer {
    overflow: hidden;
    height: 100%;
    overflow-y: auto;
    border-bottom: 1px solid #e0e0e0;
}

#gDivMySettingsWrapper {
    overflow: hidden;
    border: none;
    padding-bottom: 5px !important;
    margin-top: 20px;
}


/*styles for modFeatureTour*/

.mft-tooltip-container {
    position: absolute;
    background-color: #FFF;
    border-radius: 4px;
    /* box-shadow: 0 0 1em #eeeeee; */
    visibility: visible;
    width: 300px;
    /* border: 2px solid #616161; */
    padding: 0;
    opacity: 0.88;
}

.mft-tooltip-anchor {
    z-index: 1000000;
    position: absolute;
    visibility: hidden;
    background-color: transparent;
}

.mft-active {
    z-index: 999999;
}

.mft-window {
    box-shadow: rgb(33 33 33 / 80%) 0px 0px 1px 2px, rgb(33 33 33 / 50%) 0px 0px 0px 5000px;
    position: absolute;
    z-index: 999998;
    opacity: 1;
    border-radius: 4px;
}

.mft-overlay {
    position: fixed;
    cursor: pointer;
    z-index: 99999;
    opacity: 0;
    inset: 0px;
}

.mft-tooltip-content {
    /*padding: 10px;*/
    font-size: 14px;
    padding-bottom: 0px;
}

.mft-tooltip-footer {
    text-align: center;
    padding: 8px;
}

.mft-button.mft-button-next {
    background: var(--ct-primary-theme-colour);
    /*    border: 1px solid #ad7e8e;*/
    float: right;
    color: white;
}

.mft-button.mft-button-back {
    float: left;
}

.mft-button.mft-button-next:hover {
    background: #fce4ec;
    color: #616161;
}

.mft-button {
    background: #eeeeee;
    border: 1px solid #e0e0e0;
    display: inline-block;
    padding: 4px;
    border-radius: 4px;
    cursor: pointer;
    font-size: 14px;
    min-width: 56px;
    text-align: center;
}

    .mft-button:hover {
        background: #616161;
        color: #fff;
        box-shadow 1px 1px 1px 1px;
    }

    .mft-button.disabled {
        visibility: hidden !important;
        cursor: default !important;
    }

    .mft-button.mft-button-page {
        pointer-events: none;
        border: 1px solid transparent;
        background: transparent;
        color: #616161;
        letter-spacing: -0.5px;
    }

.mft-component {
    opacity: 0;
}

.mft-tooltip-arrow {
    border: 5px solid transparent;
    content: "";
    position: absolute;
}

.mft-icon {
    position: absolute;
}

    .mft-icon.mft-icon-exit {
        right: 0;
    }

        .mft-icon.mft-icon-exit i {
            color: #9e9e9e;
            font-size: 16px;
            padding: 7px;
            padding-top: 5px;
        }

.mft-tooltip-arrow.bottom {
    top: -10px;
    left: 10px;
    border-bottom-color: #fff;
}

.mft-tooltip-arrow.bottomright {
    top: -10px;
    right: 10px;
    border-bottom-color: #e91e65;
}

.mft-tooltip-arrow.right {
    top: 10px;
    left: -10px;
    border-right-color: #e91e65;
}

.mft-tooltip-arrow.left {
    top: 10px;
    right: -10px;
    border-left-color: #e91e65;
}

.mft-tooltip-arrow.top {
    bottom: -10px;
    left: 10px;
    border-top-color: #fff;
}

.mft-tooltip-arrow.topright {
    bottom: -10px;
    right: 10px;
    border-top-color: #fff;
}

.mft-component, .mft_component * {
    transition: all .4s ease-in-out .1s !important;
}

    .mft-component.mft-tooltip-anchor, .mft_component.mft-tooltip-anchor * {
        transition: all .3s ease-in-out .1s !important;
    }

.mft-tooltip-content-inner {
    margin-top: 5px;
    letter-spacing: 0.11px;
    margin-bottom: 5px;
    padding: 0.5rem 1rem;
}

.mft-tooltip-content-header {
    font-weight: normal;
    font-size: 16px;
    color: var(--ct-primary-theme-colour);
    margin-top: 0px;
    padding-bottom: 5px;
    background-color: var(--ct-primary-theme-colour);
    color: white;
    /* padding-top: 0.5rem; */
    padding: 0.5rem 1rem;
}

.mft-tooltip-header > .mft-icon-exit > .material-icons {
    color: #FFFFFF;
    padding: 0.65rem;
}

.mft-tooltip-content-bullet:before {
    content: " ";
    border-radius: 18px;
    background: #424242;
    width: 6px;
    height: 6px;
    margin-right: 8px;
    display: inline-block;
    vertical-align: top;
    margin-top: 6px;
}

.mft-help {
    position: fixed;
    bottom: -5.5px;
    right: -15px;
    margin-bottom: 30px;
    margin-right: 15px;
    background: white;
    border-radius: 4px 0 0 0;
    padding: 0px;
    height: 40px;
    z-index: 99;
    border-bottom: none;
    border-left: 1px solid #BBB;
    border-top: 1px solid #BBB;
}

    .mft-help > i {
        font-size: 40px;
        color: var(--ct-primary-theme-colour);
        opacity: 0.5;
    }

        .mft-help > i:hover {
            opacity: 1;
        }

.mft-tooltip-content-inner i {
    color: var(--ct-primary-theme-colour) !important;
}


#tblMain > tbody > tr.menu-open {
    z-index: 1000;
    box-shadow: var(--ct-primary-theme-colour) 0px 0px 1px 2px, rgb(33 33 33 / 50%) 0px 0px 0px 5000px;
}


/*NEW STYLES 29102021 */
.pagehead.globalcentre {
    position: sticky;
   /* background-size: 125px;*/
   /* top: -130px;*/
    left: 0;
    right: 0;
    height: 75px;
    z-index: 12;
   /* margin-top: -30px;*/
    margin-bottom: 1rem;
    background-color: var(--ct-primary-dark-theme-colour); 
}

    .pagehead.globalcentre i.material-icons {
        /*position: absolute;
        left: 100px;
        top: 8px;*/
        /* font-size: 7rem;*/
       /* border: 3px solid var(--ct-gray-200);
        background: var(--ct-primary-theme-colour);
        text-shadow: none;
        cursor: initial;*/
        color: var(--ct-on-primary-dark-theme-colour);
       /* padding: 1rem;*/
        font-size: 3rem;
        /*border-radius:5px;*/
        line-height:75px;
    }




#gcmdNav, #gdivNav {
    z-index: 999999;
    border: 0;
}

#gdivNav {
    z-index: 999998;
}

img.shadowborder {
    z-index: 999998;
}

/*#divSearchMinimise:not(.cadw) {
    top: 40px;
    position: absolute;
    right: 185px;
}*/

#divSearchMinimise:not(.cadw) .material-icons {
    color: var(--ct-primary-dark-theme-colour);
    font-size: 2rem;
}

.pagetitle {
   /* position: absolute;
    left: 198px;
    top: 14px;*/
    font-size: 2rem;
    font-weight: 700;
    color: var(--ct-on-primary-dark-theme-colour);
   /* text-align: left;*/
   line-height:75px;
}

#gcmdMsgCancel, #gcmdMsgAVMCancel {
    background-color: #fff;
    color: black;
    font-weight: bold;
    border-radius: 4px;
    box-shadow: 0px 3px 15px rgb(0 0 0 / 20%);
    margin-bottom: 10px;
    padding: 0.25rem;
    border: 1px solid #C2185B;
}

.pageSubHeader {
    margin-left: 2%;
    margin-right: 2%;
    background-color: var(--ct-primary-theme-colour);
    padding: 1rem;
    color: white;
    font-size: 1rem;
}

.incident_header {
    background-image: url(../img/header_images/imgs_new/incident_amb.jpg) !important;
    background-position-y: 59%;
}

.patientDetails_header {
    background-image: url(../img/header_images/imgs_new/patient_details.jpg) !important;
    background-position-y: 2.5%;
}

.primarySurvey_header {
    background-image: url(../img/header_images/imgs_new/primary_survey_tablet.jpg) !important;
    background-position-y: 56%;
}

.observations_header {
    background-image: url(../img/header_images/imgs_new/observations_spo2.jpg) !important;
    background-position-y: 66%;
}

.acuteMedicalAssessmentSection_header {
    background-image: url(../img/header_images/imgs_new/acute_medical_assessment.jpg) !important;
    background-position-y: 17%;
}

.secondarySurvey_header {
    background-image: url(../img/header_images/imgs_new/secondary_survey_tablet.jpg) !important;
    background-position-y: 20%;
}

.medicalAssessment_header {
    background-image: url(../img/header_images/imgs_new/medical_assessment.jpg) !important;
    background-position-y: 21%;
}

.traumaAssessment_header {
    background-image: url(../img/header_images/imgs_new/trauma_assessment.jpg) !important;
    background-position-y: 39%;
}

.interventionAssessment_header {
    background-image: url(../img/header_images/imgs_new/intervention_assessment.jpg) !important;
    background-position-y: 19%;
}

.drugs_administered_header {
    background-image: url(../img/header_images/imgs_new/drugs_admin.jpg) !important;
}

.disposition_header {
    background-image: url(../img/header_images/imgs_new/disposition_tablet.jpg) !important;
    background-position: center;
}

.exceptions_header {
    background-image: url(../img/header_images/imgs_new/exceptions_cuff.jpg) !important;
    background-position-y: 75%;
}

.destinations_header {
    background-image: url(../img/header_images/imgs_new/destinations_amb.jpg) !important;
    background-position-y: 40%;
}

div#ui-datepicker-div {
    background-color: var(--ct-body-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#ui-datepicker-div a {
        border-radius: 4px;
        padding: 8px;
        text-align: center;
        border: 0;
        font-weight: 700;
    }

        div#ui-datepicker-div a.ui-state-default.ui-state-highlight {
            background-color: var(--ct-secondary-theme-colour) !important;
            color: #FFF;
        }

div#ui-datepicker-div a:hover {
    background: #880E4F !important;
    color: white !important;
}

.ui-datepicker-inline td a {
    height: 27px;
    text-align: center;
    line-height: 27px;
    border-radius: 4px;
}

.ui-datepicker-inline .ui-datepicker-prev::after, .ui-datepicker-inline .ui-datepicker-next::after {
    background: none;
    content: 'arrow_back_ios';
    font-family: 'Material Icons';
    line-height: 35px;
    display: block;
    font-size: 1rem;
    padding-left: 5px;
    color: var(--ct-secondary-dark-theme-colour);
}

.ui-datepicker-inline .ui-datepicker-next::after {
    content: 'arrow_forward_ios';
}

.ui-datepicker-inline.ui-widget-content .ui-state-default:not(label) {
    background-color: var(--ct-surface-bg-ev1) !important;
    border-radius: 4px;
}

    .ui-datepicker-inline.ui-widget-content .ui-state-default:not(label).ui-state-highlight {
        color: var(--ct-secondary-dark-theme-colour) !important;
        background-color: var(--ct-secondary-light-theme-colour) !important;
        font-weight: 700 !important;
    }



.ui-datepicker-inline .ui-datepicker-prev .ui-icon, .ui-datepicker-inline .ui-datepicker-next .ui-icon {
    background: none !important;
}

.ui-datepicker-inline .ui-datepicker-prev, .ui-datepicker-inline .ui-datepicker-next {
    background: none !important;
    border-color: transparent !important;
}

.ui-datepicker-inline th {
    font-weight: 700 !important;
}

.ui-datepicker-inline .ui-datepicker-header {
    color: var(--ct-secondary-dark-theme-colour);
    background: var(--ct-secondary-light-theme-colour);
    border: 0px;
    padding: 6px;
    border-radius: 4px;
}


div#ui-datepicker-div a:hover {
    background-color: var(--ct-primary-theme-colour) !important;
    color: #FFF !important;
}

.ui-datepicker-inline.ui-widget-content {
    background: var(--ct-surface-bg) !important;
}



.ui-datepicker-inline {
    width: 100%;
}

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#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 {
    background-color: var(--ct-primary-theme-colour) !important;
    color: #FFF !important;
}

div#ui-datepicker-div .ui-datepicker-title {
    padding: 8px
}

    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 {
        background-color: var(--ct-primary-theme-colour) !important
    }

        div#ui-datepicker-div .ui-datepicker-title select > option {
            background-color: #FAFAFA;
            color: #000;
            font-weight: 700;
            font-size: 1rem;
        }


div#ui-datepicker-div span.ui-icon {
    background: none;
}

div#ui-datepicker-div .ui-datepicker-next {
    right: 6px;
}

div#ui-datepicker-div .ui-datepicker-prev {
    left: 6px;
}

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

    div#ui-datepicker-div .ui-datepicker-next::after,
    div#ui-datepicker-div .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#ui-datepicker-div .ui-datepicker-next::after {
        content: 'arrow_forward';
    }

    div#ui-datepicker-div .ui-datepicker-prev::after {
        content: 'arrow_back';
    }

/*#cmdEditSubmit span,
#cmdUpdateSubmit span,
#cmdSrchList1Confirm span,
#cmdSendNewMsg span,
#cmdGroupSave span,
#cmdSubmitSearch span,
#cmdSubmitRecord span {
    padding-left: 1.9rem;
}*/


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


    #cmdEditSubmit::before,
    #cmdUpdateSubmit::before,
    #cmdSrchList1Confirm::before,
    #cmdGroupSave::before,
    #cmdSendNewMsg::before,
    #cmdSubmitSearch::before,
    #cmdSubmitRecord::before {
        position: absolute;
        /*margin-left: -3rem;*/
        left: 9px;
        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;
    }


    #cmdSrchList1Confirm::before,
    #cmdEditSubmit::before {
        content: 'check_circle';
    }

    #cmdSendNewMsg::before {
        content: 'send';
    }

    #cmdUpdateSubmit::before,
    #cmdGroupSave::before,
    #cmdSubmitRecord::before {
        content: 'save';
    }

    #cmdSubmitSearch::before {
        content: 'search';
    }


#cmdDeleteRecord::before {
    content: 'delete'
}

#cmdDocuments::before {
    content: 'description'
}


#gdivInfoMain {
    overflow: auto !important;
    padding-bottom: 1rem;
}

#gdivInfo {
    overflow-x: hidden !important;
}

    #gdivInfo > :nth-child(4), #gdivInfo > :nth-child(5) {
        margin-bottom: 0px;
    }

div#gdivMsgBox a {
    box-shadow: none !important;
    background: #fafafa;
    border: 1px solid #C2185B;
    margin-bottom: 0px !important;
}

div#gdivMsgBox a {
    background-color: #efefef;
    border: 1px solid #efefef;
    color: var(--ct-on-surface-bg);
    border-radius: 3px;
}

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.imdialog {
    position: fixed;
    z-index: 200;
    -webkit-box-shadow: 0px 0px 0px 0px;
    -moz-box-shadow: 0px 0px 0px 0px;
    box-shadow: 0px 0px 0px 0px;
    border-radius: 10px;
    border: 2px solid var(--ct-primary-theme-colour);
}

    div.imdialog .imhistitmrcv {
        background-color: #fce4ec !important;
        padding: 15px !important;
        border-top-left-radius: 10px;
        border-bottom-right-radius: 10px;
        border-top-right-radius: 10px;
        font-size: 0.9rem;
    }

    div.imdialog .imhistitmrpy {
        border-top-left-radius: 10px;
        border-bottom-left-radius: 10px;
        border-top-right-radius: 10px;
        padding: 15px !important;
        background-color: var(--ct-primary-theme-colour) !important;
        color: #FFF;
        font-size: 0.9rem;
    }

    div.imdialog .ui-dialog-content {
        padding: 0px !important;
    }

    div.imdialog .ui-widget-content {
        box-shadow: 0 0 0 !important;
    }

    div.imdialog .ui-dialog-titlebar {
        background-color: #FFF;
        border: none;
        padding: 15px;
        color: #000;
    }

    div.imdialog .ui-dialog-titlebar-close {
        margin-right: 5px;
    }

    div.imdialog .ui-resizable-se, div.imdialog .ui-resizable-ne {
        background: none !important;
    }

    div.imdialog .ui-resizable-e {
        width: 3px;
        border-radius: 10px;
        background: #e3a4c0 !important;
    }

        div.imdialog .ui-resizable-e:hover {
            background: #e3a4c0 !important;
        }


    div.imdialog div.imhistdiv {
        height: calc(90px - 30px);
        width: calc(100% - 30px);
        padding: 15px;
        vertical-align: top;
        overflow-y: scroll;
        border-top: 2px solid #EFEFEF;
        border-bottom: 2px solid #EFEFEF;
    }

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



        div.imdialog div.immsgdiv textarea {
            border-radius: 10px;
            height: 41px;
            margin-top: 8px;
            margin-left: 7px;
            width: calc(100% - 84px);
            resize: none;
            float: left;
            display: inline;
        }

        div.imdialog div.immsgdiv button {
            border-radius: 100%;
            margin-top: 7px;
            margin-right: 7px;
            width: 50px;
            height: 50px;
            background-color: var(--ct-primary-theme-colour);
            color: #FFF;
            float: right;
            display: inline;
            border: 0px !important
        }

        div.imdialog div.immsgdiv .material-icons {
            color: #FFFFFF;
        }

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

    div.imdialog div.imhistdiv div.imhistitminprog {
        background: linear-gradient(-45deg, #FFE082, #fbbcd2, #ffc7da, #FFE082);
        background-size: 400% 400%;
        animation: workingGradient 5s ease infinite;
    }


    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: white;
    }



@keyframes workingGradient {
    0% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0% 50%;
    }
}


/*#spnSettings > i {
    position: fixed;
    right: 14px;
    left: unset;
    background-color: rgba(233, 30, 99, 0.47);
    border: none;
    color: #fff;
    padding: 12px !important;
}

    #spnSettings > i:hover {
        background-color: var(--ct-primary-theme-colour);
    }*/

.inifrm > body {
    margin: 0px;
}

.inifrm div#divMain {
    margin: 10px;
    margin-top: 0px;
}




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




#ulSave {
    width: 255px;
}

    #ulSave li a {
        background: #c2185b;
        color: #fff;
        padding: 6px;
        font-weight: bold;
        display: flex;
        justify-content: center;
        align-items: center;
        cursor: pointer;
        transition: opacity 0.5s;
        border-radius: 4px;
        margin: 11px;
        margin-bottom: 0px;
        width: 86%;
        text-indent: 20px;
        border-bottom: 1px solid transparent;
        font-size: 14px;
    }

        #ulSave li a:hover {
            background: #000;
            opacity: 0.59;
        }

    #ulSave br {
        display: none;
    }

    #ulSave li a:last-child {
        margin-block: 5px;
    }

    #ulSave li a i {
        color: #fff;
        position: absolute;
        left: 0px;
        font-size: 20px;
    }

.inifrm .pagehead.globalcentre i.material-icons {
    font-size: 1.5rem;
    padding: .5rem;
    top: 5px;
    left: 10px;
    border-width: 2px;
    border-style: solid;
    border-color: #FFF;
}

.inifrm .pagetitle {
    font-size: 1rem;
    left: 62px;
    top: 12px;
    font-weight: 800;
    max-width: calc(100% - 100px);
    color: #FFF;
}



#divHead {
    height: 60px;
    background-color: var(--ct-primary-theme-colour);
    margin-top: 0px !important;
    padding: 0.5rem;
    margin-bottom: 4rem;
    position: fixed;
    top: 0px;
    width: 845px;
    right: 0;
    z-index: 89;
    transition: opacity 0.3s, width 1s;
    -webkit-transition: opacity 0.3s, width 1s;
    pointer-events: none;
}

#imgBadge {
    position: fixed;
    max-height: 88px;
    display: none;
    z-index: 90;
    height: 50px;
    color: var(--ct-primary-theme-colour);
    background-color: #FFFFFF;
    border-radius: 4px;
    bottom: 35px !important;
    right: 20px !important;
    opacity: 0.6;
    left: initial;
}

#spnTime {
    display: block;
    padding: 2px;
    position: fixed;
    right: 0;
}

label#lblTime {
    float: right;
    width: 160px;
    letter-spacing: 0.05rem;
    padding-left: 0px;
}

#spnSkills, #spnDesks {
    float: right !important;
    margin-top: 4px;
    margin-left: 4px;
}

#spnDesks {
    margin-right: 4px;
}

.winitembtns {
    display: grid;
    grid-gap: 6px;
    margin: 4px;
    grid-template-columns: 1fr 1fr;
    text-align: center;
    margin-bottom: 7px;
    border-bottom: 1px solid #e0e0e0;
    padding-bottom: 7px;
    margin-left: 15px;
    margin-right: 15px;
    margin-top: 7px;
}

.winitembtn {
    background: #c2185b;
    color: #fff;
    padding: 6px;
    font-weight: bold;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    transition: opacity 0.5s;
    border-radius: 4px;
}

    .winitembtn:hover {
        background: #000;
        opacity: 0.59;
    }

span#spnRight {
    float: right;
    width: 845px;
    position: relative;
    pointer-events: all !important;
}

    span#spnRight button {
        margin: 0px;
        opacity: 1;
        height: 46px !important;
    }

div#divHead {
    width: 100vw;
    margin-left: 130px;
    background-color: #333333;
    padding-bottom: 0px;
    height: 44px;
}

ul.windowTabs.windowTabsFull {
    transition: opacity 0.3s, max-width 1s;
}


#spnRight > button > span > i {
    font-size: 2rem !important;
    color: white;
}


#spnSkills button, #spnDesks button {
    background-color: var(--ct-primary-theme-colour);
    color: white;
    height: auto !important;
    padding: 0.25rem;
}

#spnSkills > button > span > i {
    font-size: 2rem !important;
    color: white;
}

#spnDesks > button > span > i {
    font-size: 2rem !important;
    color: white;
}

#spnSkills button .ui-button-text, #spnDesks button .ui-button-text {
    padding: 0px;
}

#spnSkills img, #spnDesks img {
    height: 16px !important;
}

#collapseNavMenu {
    transition: opacity 5s;
}

div#divHead.trayClosed {
    width: 240px;
}

#divHead.trayOpen {
    transition: none !important;
}

#divSearch.newlayout div.inputsector {
    width: auto;
    margin: 0 10px;
}

#divMenu, #divNav {
    top: 110px;
}

.navBreak {
    border: 2px solid #950B32;
    position: relative;
    top: 67px;
    z-index: 20;
    box-shadow: 0px 7px 2em #212121;
}


.navToolsContainer {
    position: fixed;
    background-color: green;
    width: 250px;
    right: 0;
    top: 76px;
    padding: 1rem;
    border-radius: 0 0 0 4px;
}

.autoSaveWorkspace {
    animation: blinker 3s linear infinite;
    position: fixed;
    bottom: 30px;
    left: 10px;
    font-weight: bold;
    letter-spacing: 0.04rem;
    display: none;
}

@keyframes blinker {
    50% {
        opacity: 0;
    }
}


#divNavSecs {
    position: relative;
    width: 1094px;
    margin-left: auto;
    margin-right: 15px;
    top: 3px;
}

    #divNavSecs > button {
        min-width: unset;
        width: 90px;
        height: 40px;
        font-size: 11px;
        margin-bottom: 4px;
    }


#divFoot {
    height: 180px !important;
    left: 129px !important;
    right: 100px !important;
    bottom: 55px !important;
    background: #fff !important;
    border-top: 1px solid var(--ct-surface-grey-4) !important;
    width: 89%;
    padding: 0.25rem !important;
}

#divTabRes {
    height: 100% !important;
}

#divFootTabs {
    text-align: left;
}

    #divFootTabs > button {
        font-size: 0.7rem;
        padding: 0px;
        background-color: #ad1457;
        border-radius: 4px 4px 0 0;
        border: none !important;
        margin: 0rem 0px !important;
        position: relative;
        width: 10px;
        color: white;
        min-width: 90px !important;
        height: 35px;
        font-weight: 400;
    }

.tabSecTbl {
    height: 100%;
    overflow: auto;
    border: 1px solid grey;
    border-top: none !important;
    background: white;
    display: inline-table;
}



.v2divMain {
    margin-left: 135px !important;
}

    .v2divMain > .inputsector {
        padding-top: 0;
        margin: 0 !important;
        width: 100% !important;
    }

#divNavSecs > button {
    font-size: 0.7rem;
    padding: 0px !important;
    background-color: #ad1457;
    border-radius: 4px 4px 0 0 !important;
    border: none !important;
    margin: 0rem 0px !important;
    position: relative;
    width: 80px !important;
    color: white;
    min-width: 85px !important;
    height: 35px;
    font-weight: 400;
    margin: 0.1rem !important;
    text-overflow: ellipsis;
}

#divNavSecs span {
    padding: 0px;
    word-break: break-word;
    text-align: center;
    text-overflow: ellipsis;
    padding: 0px 5px !important;
    white-space: nowrap;
    overflow: hidden;
}

.v2divMain > div > label {
    box-shadow: none;
}



.focused-label {
    color: var(--ct-primary-theme-colour) !important;
    font-weight: 700;
    z-index: 86 !important;
}

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

.focused-label-checkbox {
    outline: none !important;
}


.scrolllist-inputrow {
    height: 300px;
    /*overflow: hidden;*/
}

.scrolllist-sub {
    overflow-y: scroll;
    /*margin-left: -22px !important;
    width: calc(100% + 22px) !important;*/
    height: 100%;
}

.scrolllist-footer {
    padding-top: 15px;
}

/*.scrolllist-sub input[type="checkbox"] + label::before {
    color: #989697;
}*/

.custom-modal {
    background-color: transparent !important;
    border: none !important;
    box-shadow: 0 0 5em #656565 !important;
    overflow: visible !important;
}

.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;
}

@-webkit-keyframes load8 {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

.label {
    font-size: 12px;
    font-weight: 700;
}





.tool-menu {
    z-index: 1000;
    position: absolute;
    border: 1px solid #9E9E9E;
    white-space: nowrap;
    font-family: sans-serif;
    background: #FFF;
    color: #333;
    list-style-type: none;
    margin-block-start: 0px;
    margin-block-end: 0px;
    padding-inline-start: 0px;
    box-shadow: 3px 3px 4px 0px #616161;
    padding: 0px;
}

.tool-menu-header {
    cursor: default;
    background-color: var(--ct-primary-theme-colour);
    color: #FFFFFF;
}

.tool-menu.offscreeny {
    bottom: 10px !important;
    top: inherit !important;
}

.tool-menu.offscreenx {
    right: 10px !important;
    left: inherit !important;
}

.tool-menu li {
    padding: 8px 12px;
    cursor: pointer;
    border-bottom: 1px solid #E0E0E0;
    font-weight: 700;
}

    .tool-menu li:not(.tool-menu-header):hover {
        background-color: #DEF;
    }

    .tool-menu li * {
        vertical-align: middle;
        padding-right: 5px;
        margin-top: -5px;
    }

.tool-menu-submenu-icon {
    margin-top: -3px !important;
    padding-left: 5px;
    float: right;
    padding-right: 0px !important;
}

#tblMain > tbody > tr.menu-open {
    background: #E0E0E0 !important;
    color: #212121 !important;
}

#tblMain > tbody > tr.menu-closed {
    opacity: 0.5 !important;
}

.tool-menu-submenu:hover > .tool-menu-submenu-content {
    display: block;
}

.tool-menu-submenu {
    position: relative;
    padding-right: 5px !important;
}

ul.tool-menu-submenu-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 160px;
    box-shadow: 3px 3px 4px 0px #616161;
    z-index: 99;
    list-style-type: none;
    padding-left: 0px;
    right: 0px;
    transform: translate(100%);
    top: 4px;
    border: 1px solid #9E9E9E;
    padding-right: 0px !important;
}

.tool-menu-submenu-content > li {
    margin-top: 0px !important;
}

.ifrm_cont.ontop:not(.min) {
    border: 1px solid var(--ct-gray-700);
}

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

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




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

    tr.rowcollapse .iconexpand {
        display: none;
    }

    tr.rowexpand .iconcollapse {
        display: none;
    }



.dot-collision {
    position: relative;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background-color: #9880ff;
    color: #9880ff;
}

    .dot-collision::before, .dot-collision::after {
        content: "";
        display: inline-block;
        position: absolute;
        top: 0;
    }

    .dot-collision::before {
        left: -30px;
        width: 30px;
        height: 30px;
        border-radius: 50%;
        background-color: #9880ff;
        color: #9880ff;
        animation: dot-collision-before 2s infinite ease-in;
    }

    .dot-collision::after {
        left: 30px;
        width: 30px;
        height: 30px;
        border-radius: 50%;
        background-color: #9880ff;
        color: #9880ff;
        animation: dot-collision-after 2s infinite ease-in;
        animation-delay: 1s;
    }

@keyframes dot-collision-before {
    0%, 50%, 75%, 100% {
        transform: translateX(0);
    }

    25% {
        transform: translateX(-15px);
    }
}

@keyframes dot-collision-after {
    0%, 50%, 75%, 100% {
        transform: translateX(0);
    }

    25% {
        transform: translateX(15px);
    }
}

.selected-label {
    color: var(--ct-primary-theme-colour) !important;
}
html.dark .selected-label {
    color: var(--ct-primary-light-colour) !important;
}


.map {
    background: #e4f4f7;
}

.systemModeFilter, .stackFilters, .ifrmHeaderBtn, .ifrmHead-toggleSwitch {
    float: right;
    padding-top: 4px;
}

    .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;
    }



/* Cad Web */
button span img {
    vertical-align: middle;
}

button:disabled {
    opacity: 0.5 !important;
}

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


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

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



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

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

.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;
}


.normaldiv .inputsector .inputrow input[type="checkbox"] + label {
    margin-right: 0px;
}

input[type="text"].colourpickerSample {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}

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

.ui-accordion .ui-accordion-header,
.ui-accordion-content.ui-widget-content {
    background: var(--ct-surface-bg) !important;
}

div:not(.normaldiv) .ui-accordion-content.ui-widget-content {
	overflow:visible;
}


.mcs-contrast {
    margin-top: 5px;
    font-size: 0.7rem;
}

.mcs-sample-label {
    display: none !important;
}

.mcs-thumbnail {
    border-radius: 4px;
}

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

label.disabled-labled {
    color: #9e9e9e;
}

input::-webkit-input-placeholder {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.4px;
}

input.mcs-sample {
    width: 50% !important;
}

.ui-accordion-content {
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
    border: 0px solid transparent;
}

.paging-table .inputrow input[type="checkbox"] + label {
    margin-left: 0px !important;
}


select {
	height: 44px;
}

/* select {
    appearance: none;
    border: 0;
    text-align: left;
    font-weight: 700;
    width: auto;
    padding: 4px 8px;
    margin-top: -4px;
}

    select > option {
        background-color: #FAFAFA;
        color: #000;
        font-weight: 700;
        font-size: 0.8rem;
    } */

.scrolllist-showselected .material-icons, .scrolllist-showall .material-icons {
    line-height: 48px;
}

#divSearchMinimise {
    margin: 14px auto 0px auto;
}

    #divSearchMinimise > i {
        line-height: 0px;
        /*font-size: 25px;*/
    }

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

#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;
}

#iMinimiseSearch {
    color: var(--ct-on-surface-bg) !important;
}



#divSearch > .inputsector {
    border-radius: 4px;
}



.cadw #toolSearchActions,
.cadw #toolRecordActions,
.cadw #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;
}

html.dark #toolSearchActions,
html.dark #toolRecordActions,
html.dark #toolActions {
    box-shadow: #00000087 -1px 0px 4px 3px;
    border: 1px solid var(--ct-surface-grey-2);
}

html:not(.cadw) #toolSearchActions, html:not(.cadw) #toolRecordActions {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background: rgb(255 255 255 / 88%);
    margin: 0;
    padding: 10px 0;
    z-index: 1;
    border-top: 1px solid var(--ct-gray-300);
}



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

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



@keyframes toolActionsIn {
    from {
        opacity: 0;
        bottom: -20px;
    }

    to {
        opacity: 1;
        bottom: 0;
    }
}

.cadw #toolSearchActions button,
.cadw #toolRecordActions button,
.cadw #toolActions button {
    width: 45px;
    height: 45px;
}

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

#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;
}

#toolRecordActions button.cds-btn-icon-loader.cds-btn-icon::before {
    top: 5px;
}

#divRecord {
    max-width: 98%;
    margin: 0 auto;
    text-align: unset !important;
    margin-bottom: 70px;
}

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

        #divRecord .inputsector .inputsectorlabel,
        .inputsector.toolinputsector .inputsectorlabel {
            border-top-left-radius: 5px;
            border-top-right-radius: 5px;
        }

        #divRecord .inputsector .ui-accordion-content,
        .inputsector.toolinputsector .ui-accordion-content {
            border-bottom-left-radius: 5px;
            border-bottom-right-radius: 5px;
            overflow: visible;
        }


.inifrm #gdivFooter {
    border: none;
}

.embedded .bottombar
.embedded #cmdSubmitRecord,
.embedded #cmdResetRecord {
    display: none;
}

.embedded #divRecord {
    max-width: 100%;
    margin-bottom: 0px;
}


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

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

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

/* Pause animation when reduced-motion is set */
@media (prefers-reduced-motion: reduce) {
    .marquee__content {
        animation-play-state: paused !important;
    }
}

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

input[type="radio"] + label[for^="theme"]::before {
    height: 22px;
    width: 23px;
    line-height: 22px;
    text-indent: 0px;
    margin-right: 5px;
}


.ccsSelect {
    top: 1.75rem;
    left: 8px;
    right: 8px;
    bottom: 0px;
    z-index: 0;
    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");
}

    .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;
    }



.normaldiv .ccsSelect + ul.options {
    position: fixed;
}

.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;
}

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


.ccsSelect + ul.options li.hover {
    background: var(--ct-primary-dark-theme-colour);
    border: 1px solid transparent;
    cursor: pointer;
    color: #FFF;
}

.tooltip {
    position: relative;
}

    .tooltip button {
        padding: 0px;
    }


    .tooltip .tooltip-text {
        visibility: hidden;
        width: 120px;
        background-color: var(--ct-secondary-theme-colour) !important;
        color: #FFF;
        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);
        }

.btnSelect {
    font-weight: bold;
    background: var(--ct-primary-dark-theme-colour) !important;
    color: #FFF !important;
    opacity: 1 !important;
}

    .btnSelect .material-icons {
        color: #FFF !important;
    }

.ui-slider-horizontal .ui-slider-handle {
    height: 18px;
    border-radius: 3px !important;
    width: 10px;
}

.ui-slider.ui-widget-content .ui-state-default.ui-slider-handle {
    background-color: var(--ct-primary-theme-colour) !important;
    cursor: pointer;
}

.ui-widget-content .cds-secondary-bg.ui-state-default {
    background-color: var(--ct-secondary-theme-colour) !important;
}

.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;
    }
}

.ui-progressbar-value {
    background: var(--ct-primary-theme-colour) !important;
    padding: 12px;
}


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


/* Responsive */
@media screen and (max-width: 1000px) {
    .nosmallscreen {
        display: none;
    }
}

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




.winitemifrm:hover {
    background: var(--ct-primary-theme-colour);
    color: #fff;
    cursor: pointer;
}

#divWinList {
    font-size: 14px;
    box-shadow: 0px 3px 14px #0000007d;
    border: none;
}

    #divWinList .winitemifrm {
        padding: 5px;
        padding-left: 20px;
    }

    #divWinList .winitemwin {
        padding: 5px;
        margin: 4px;
    }

#divWinListInner {
    max-height: calc(78vh - 72px - 84px);
    overflow-y: auto;
}

/* iFrame styling */
.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 {
    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_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 {
        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 {
    float: right;
    cursor: pointer;
}

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

.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: #FFF;
}

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;
}

.windowTabsFull-tabsRight {
    right: 344px !important;
}

#ifrm_tabsright {
    right: 940px;
    border-left: solid 4px black
}

.scrollableNavTabs {
    display: flex;
    width: 50%;
    left: 90px;
    overflow-y: hidden;
    overflow-x: scroll;
    position: relative;
}

    .scrollableNavTabs > .ifrm_cont {
        position: relative;
    }

.ifrm_cont.pin {
    z-index: 83 !important;
}

body:not(.focusmode) div.ifrm_cont.ontop:not(.min) {
    box-shadow: 1px 3px 7px 0px rgb(77 77 77 / 46%);
}

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

.ifrm_min.active > i {
    background: #EC407A;
    color: #fff;
    line-height: 4px;
    padding-bottom: 15px;
    margin-top: 3px;
    border-radius: 3px;
}

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


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

body.focusmode .ifrm_cont.min {
    z-index: 20 !important;
}



div#divWinList {
    border-radius: 4px;
    z-index: 100;
    right: 308px;
    top: 57px;
}

div#divDeskList {
    border-radius: 4px;
    z-index: 99;
    right: 508px;
    top: 57px;
}

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;
}




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

.ifrm_head .ifrm_head_icon {
    height: 19px;
}


.ifrm_head > button:hover,
.ifrm_head > .ifrm_min > i:hover,
.ifrm_head > .ifrm_max > i:hover,
.ifrm_head > .ifrm_close > i:hover {
    background: var(--ct-red-900);
}

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



.ifrm_cont.collapsed_head {
    padding-top: 0px;
}

    .ifrm_cont.collapsed_head .ifrm_head {
        height: 0px;
        overflow: hidden;
    }

.ifrm_head > i {
    color: white;
    vertical-align: super;
    display: none;
}

#gIfrmSnapLeft {
    left: 0;
}

#gIfrmSnapRight {
    right: 0;
}

#gIfrmSnapBottom {
    bottom: 0;
}

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


#gIfrmSnapBottom {
    height: 12vh;
    width: 50vw;
    bottom: 0px;
    left: calc(50% - 25vw);
}


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

#shortcutsSnapBottom {
    height: 44px;
    bottom: 5px;
}

#shortcutsSnapRight {
    width: 44px;
    right: 5px;
}

#systemShortcutsPanel.shortcutsbottom {
    inset: auto auto auto auto;
    height: 32px !important;
    bottom: 5px !important;
    top: auto !important;
    right: auto !important;
}

#systemShortcutsPanel.shortcutsright {
    inset: auto auto auto auto;
    width: 32px !important;
    right: 5px !important;
    bottom: auto !important;
    left: auto !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;
}

body.focusmode #divHead > span > * {
    z-index: 21 !important;
    opacity: 0.3;
}

    body.focusmode #divHead > span > *:hover {
        opacity: 1;
    }

#tabViewTabContainer {
    background-color: rgba(173, 20, 87, 1);
    position: absolute;
    display: inline-block;
    color: #FFFFFF;
    list-style: none;
    padding: 1rem 1rem 0;
    position: sticky;
    margin-top: 88px;
}

    #tabViewTabContainer > li {
        padding: 0.85rem;
        font-size: 1rem;
        position: relative;
        display: inline-block;
        padding-top: 18px;
        border-right: 2px solid white;
        margin: 0 0.25rem;
    }

        #tabViewTabContainer > li:hover {
            cursor: pointer;
            background-color: var(--ct-primary-theme-colour);
            border-radius: 4px 4px 0 0;
            border-right: 2px solid var(--ct-primary-theme-colour);
        }

        #tabViewTabContainer > li:last-child {
            background-color: var(--ct-primary-theme-colour);
            border-radius: 4px 4px 0 0;
            border-right: none;
        }

        #tabViewTabContainer > li > span {
            color: #FFF;
            font-size: 1rem;
            vertical-align: top;
            padding-left: 5px;
        }


.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;
    }

.ifrm_tab_window {
    pointer-events: auto;
    position: fixed;
    width: 100%;
    height: 771px;
    top: 70px;
    left: 0;
}

.activeWindowTab > .fullModeTab {
    background-color: #ad1457 !important;
}

ul.windowTabs:empty {
    display: none;
}

.windowTabs::-webkit-scrollbar-thumb {
    background-color: #c2185b !important;
}

div.ifrm_tabscroll > i.material-icons {
    border-radius: 4px;
    box-shadow: 0px 2px 2px 0px #aaaaaa !important;
    zoom: 0.85;
    top: 14px !important;
}

#ifrm_tabsleft > i {
    width: 60px !important;
    left: 123px !important;
}


body.full div#divHead {
    pointer-events: all;
}

.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;
}

span#spnRight.tray_closed {
    width: 250px;
}

.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;
    }

.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: #FFF;
    font-size: 22px;
}

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

    i.material-icons.tabclose:hover {
        color: #FFF !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: #FFF;
    opacity: 1;
}

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

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


/* Make text bigger when zoomed out */

html.zoomFix .cds-text-overline,
html.zoomFix label.inputlabel {
    font-size: 12px !important;
}


html.zoomFix .cds-text-subtitle-2,
html.zoomFix div.inputrow input[type=checkbox] + label.ui-button,
html.zoomFix input[type="checkbox"] + label,
html.zoomFix .cds-inputgroup-label,
html.zoomFix .ifrm_head > .ifrm_title,
html.zoomFix .ct-tab-link {
    font-size: 16px !important;
}


html.zoomFix .contextMenu li a,
html.zoomFix #divMenu > button,
html.zoomFix .embedtable table.sorttable tr td,
html.zoomFix .embedtable table.sorttable tr th,
html.zoomFix ul.autocomplete li,
html.zoomFix input[type="text"],
html.zoomFix input[type="password"],
html.zoomFix textarea {
    font-size: 14px !important;
}

html.screenShareHide {
    visibility:hidden;
}

    html.screenShareHide::before {
        position:fixed;
        visibility:visible;
        width:100%;
        height:100%;
        background:black;
        content: 'A Screen Sharing Participant does not have permission to view this page';
        color:#FFF;
        text-align:center;
        font-family: var(--font), Lucida Grande,Lucida Sans,Arial,sans-serif;
        line-height:45;
    }


.inputrow.hasInputHelper label.inputlabel::after {
    content: 'info';
    font-family: 'Material Icons';
    vertical-align: middle;
    color: var(--ct-surface-grey-6);
    font-size:14px;
}

.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::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%);
    }