/* apply this css to pages only (not print and email) */

:root {
    /*Text*/
    --primary-text-color: #495057;
    --primary-text-secondary-color: #495057;
    --primary-text-success-color: #bbe7ca;
    --primary-text-info-color: #afdff3;
    --primary-text-warning-color: #f4d7af;
    --primary-text-error-color: #eeb6b4;
    --primary-text-highlight-color: #3F80EA;
    /*BG*/
    --background-color-default: #e7ebed;
    --background-color-paper: #ffffff;
    --background-color-appbar: #ffffff;
    /**/
    --primary-border-color: #e0e0e0;
    --primary-widget-background-color: #c5d1e7;
    --secondary-widget-background-color: #fafcff; /*#dbe2ef; DBE3EE*/
    --circle-widget-background-color: #c5d1e7;
    /*Icons*/
    --primary-success-color: #4bbf73;
    --primary-info-color: #1f9bcf;
    --primary-warning-color: #e5a54b;
    --primary-error-color: #d9534f;
    /*SideNav*/
    --stat-icon-color: #ffffff;
    --sidenav-background-color: #293042;
    --sidenav-primary-text-color: #bfc1c6;
    --sidenav-primary-text-highlight-color: #E8EAED;
    --sidenav-width: 300px;
}



html, body {
    color: var(--primary-text-color);
    /* background-color: var(--background-color-default); */
    margin: 0px;
}

a {
    color: var(--primary-text-color);
}

    a:link {
        color: var(--primary-text-color);
    }

    a:hover {
        color: var(--primary-text-highlight-color);
    }

.nav-icon {
    color: var(--primary-text-color);
}

    .nav-icon:hover {
        color: var(--primary-text-highlight-color);
    }

.sidenav-icon {
    color: var(--sidenav-primary-text-color) !important;
}

    .sidenav-icon:hover {
        color: var(--sidenav-primary-text-highlight-color) !important;
    }

@font-face {
    font-family: '"Poppins",-apple-system,BlinkMacSystemFont,"Segoe UI","Helvetica Neue",Arial,sans-serif';
}

@media screen {
    /* hide all IE10 cross buttons*/
    ::-ms-clear {
        width: 0px !important;
        height: 0px !important;
        display: none !important;
    }

    .FieldName {
        font-weight: bold;
        text-align: left;
    }

    .NotesPanel {
        font-size: small !important;
        color: #f0f0f0 !important;
        padding: 3px;
        border: 1px solid #996600;
        background-color: #FFE882;
        text-align: left;
        border-radius: 5px 5px 5px 5px;
        -moz-border-radius: 5px 5px 5px 5px;
        -webkit-border-radius: 5px 5px 5px 5px;
    }

    .InfoPanel {
        font-size: small;
        color: #404040 !important;
        padding: 3px;
        border: 1px solid #404040;
        background-color: #FFFFFF;
        text-align: left;
        border-radius: 5px 5px 5px 5px;
        -moz-border-radius: 5px 5px 5px 5px;
        -webkit-border-radius: 5px 5px 5px 5px;
    }

    .modalBackground {
        background-color: Gray;
        filter: alpha(opacity=70);
        filter: alpha(opacity=50);
        opacity: 0.5;
    }

    .Grooved {
        border-width: thin;
        border-style: groove;
    }

    /* LAYOUT */

    .fullWidth {
        width: 100%;
    }

    .FillScreen {
        width: 100%;
        top: 0px;
        bottom: 0px;
        right: 0px;
        left: 0px;
        position: absolute;
        height: 100%;
    }

    /* CONTROLS */
    .FullWidthCombo .ajax__combobox_inputcontainer {
        width: 100%;
    }

    .FullWidthCombo .ajax__combobox_textboxcontainer {
        width: 100%;
    }

        .FullWidthCombo .ajax__combobox_textboxcontainer input {
            width: 100%;
        }

    .FullWidthCombo .ajax__combobox_buttoncontainer {
        width: 15px;
        height: 15px;
    }

        .FullWidthCombo .ajax__combobox_buttoncontainer button {
            background-position: center;
            background-repeat: no-repeat;
            border-color: ButtonFace;
            height: 15px;
            width: 15px;
        }

    .FullWidthCombo .ajax__combobox_itemlist {
        margin: 0px;
        padding: 0px;
        cursor: default;
        list-style-type: none;
        text-align: left;
        border: solid 1px ButtonShadow;
        background-color: Window;
        color: WindowText;
    }

        .FullWidthCombo .ajax__combobox_itemlist li {
            white-space: nowrap;
            width: 100%;
            padding: 0 3px 0 2px;
        }

    .ajax__calendar_container {
        z-index: 1000;
    }

    /* Stops calendar rendering issues with missing days */
    .ajax__calendar_body table tr td {
        border-style: none;
        padding: 0px;
    }

    .touchButton {
        height: 35px;
    }


    /* TABLES */
    .GeneralTable {
        border: 1px solid #999999;
        text-align: center;
        background-color: #FFFFFF;
        -moz-border-radius: 10px;
        border-radius: 10px;
        padding: 2px;
    }

        .GeneralTable th {
            border: 1px solid #A1BF2F;
            color: #FFFFFF;
            text-align: left;
            background-image: url('Images/StaticMenuItemBack.gif');
            border-top-left-radius: 10px;
            border-top-right-radius: 10px;
            padding: 3px;
        }

    .BorderlessTable {
        border-style: none;
    }

        .BorderlessTable th {
            border-style: none;
            border-width: 0px;
        }

        .BorderlessTable tr {
            border-style: none;
            border-width: 0px;
        }

        .BorderlessTable td {
            border-style: none;
            border-width: 0px;
        }

    .BorderTable {
        border-width: 1px;
        border-color: #000000;
        border-style: solid;
    }

    /* MISC */
    .MessageBar {
        color: var(--primary-text-color);
        background-color: var(--sidenav-background-color);
        border: 1px #FFFFFF solid;
        padding: 6px 10px 6px 10px;
        border-radius: 4px;
        font-size: 14px;
        margin-bottom: 10px;
    }

    .InfoMessage {
        color: var(--primary-text-info-color);
        border-color: var(--primary-info-color);
    }

    .WarningMessage {
        color: var(--primary-text-warning-color);
        border-color: var(--primary-warning-color);
    }

    .ErrorMessage {
        color: var(--primary-text-error-color);
        border-color: var(--primary-error-color);
    }

    .SuccessMessage {
        color: var(--primary-text-success-color);
        border-color: var(--primary-success-color);
    }

    .InfoIconColor {
        color: var(--primary-info-color);
    }

    .SuccessIconColor {
        color: var(--primary-success-color);
    }

    .WarningIconColor {
        color: var(--primary-warning-color);
    }

    .ErrorIconColor {
        color: var(--primary-error-color);
    }

    .PanelHeader {
        border-style: outset;
        border-width: 2px;
        background-color: #0099CC;
        color: #FFFFFF;
        font-weight: bold;
        height: 20px;
        vertical-align: middle;
        text-align: left;
    }

    .MenuPanelHeader {
        border-style: outset;
        border-width: 2px;
        background-color: #0099CC;
        color: #FFFFFF;
        font-weight: bold;
        top: 0px;
        bottom: 0px;
        width: 20px;
        height: 20px;
        position: relative;
    }

    .tabs {
        position: relative;
        top: 1px;
        left: 5px;
    }

    .tab {
        border-style: solid solid none solid;
        border-width: 1px;
        border-color: black;
        background-color: #eeeeee;
        padding: 2px 10px;
        -moz-border-top-left-radius: 10px;
        -moz-border-top-right-radius: 10px;
        border-top-left-radius: 10px;
        border-top-right-radius: 10px;
    }

    .selectedTab {
        background-color: white;
        border-bottom: solid 1px white;
        background-image: url('../Default/Images/TabSelectedBG.gif');
        background-repeat: repeat-x;
        -moz-border-top-left-radius: 10px;
        -moz-border-top-right-radius: 10px;
        border-top-left-radius: 10px;
        border-top-right-radius: 10px;
    }

    .tabContents {
        border: solid 1px black;
        padding: 10px;
        background-color: white;
    }

    .ButtonSeparator {
        width: 50px;
    }


    .TAField {
        font-size: small;
        color: #5D6F73;
        font-weight: bold;
        text-align: left;
    }





    #header {
        clear: both;
    }

    #footer {
        clear: both;
        float: left;
        height: 26px;
        margin-top: -40px;
        text-align: center;
        vertical-align: top;
        width: 100%;
    }

    #content {
        position: relative;
        height: auto !important;
        height: 100%;
        min-height: 100%;
    }

    #page {
        clear: both;
        width: 730px;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 6em;
    }

    .PrintPage {
        background-color: #FFFFFF;
    }


    /* USED */
    .padded {
        padding: 10px;
    }

    /* USED */
    .margined {
        margin: 15px;
    }

    /* USED */
    .left {
        text-align: left;
    }

    .floatRight {
        float: right;
    }

    .pagerButton {
        width: 50px;
        height: 50px;
        text-align: center;
        vertical-align: middle;
    }

    .pagerPageNumber {
        width: 50px;
        height: 50px;
        font-size: x-large;
        text-align: center;
        vertical-align: middle;
    }

    a:link {
        color: #335C6D;
    }

    a.GridLink {
        color: #335C6D;
    }

    .GridLabel {
        color: black;
    }

    .dxeBase_R18Dark {
        color: black;
    }

    /* Alternate class - used for when a devexpress theme has a different colour background */
    .alternate {
        color: #335C6D;
    }
}