/*theme from the Innovise Colour Palette
/*theme from the Innovise Colour Palette

InnoviseBlue1 #1B345A
InnoviseBlue2 #405684
InnoviseBlue3 #36526c
InnoviseBlue4 #006bb6
InnoviseBlue5 #0d97f2
InnoviseGreen #85b92f
InnoviseGrey1 #404040
InnoviseGrey2 #173531
InnoviseGrey3 #121D29
InnoviseGrey4 #666666
InnoviseGrey5 #f0f0f0
InnoviseGrey6 #5b5b5b

'not from the proper theme!
InnoviseOrange #FF8A00
InnoviseBurgundy #880015

*/
/*
	TimegateBlue = #1B345A
	TimegateGreen = #83af4e
	TimegateGreenHiglight = #e6ffe0

*/

::-webkit-scrollbar {
    width: 6px !important;
    height: 14px !important;
}

::-webkit-scrollbar-thumb {
    background-color: #ccc;
    border-radius: 5px;
}

::-webkit-scrollbar-track {
    background: #eee;
}

BODY {
    background-color: White;
    font-family: "Segoe UI","Trebuchet MS",Candara,Tahoma, Verdana, Arial,sans-serif;
    font-size: .8em;
    font-weight: 400;
    letter-spacing: normal;
    text-transform: none;
    word-spacing: normal;
    overflow: hidden;
    overflow-x: hidden;
    overflow-y: hidden;
    width: 100%;
    height: 100%;
    margin: 0;
}

html {
    overflow: hidden;
    overflow-x: hidden;
    overflow-y: hidden;
    width: 100%;
    height: 100%;
}

h2 {
    font-weight: normal;
    text-align: center;
    color: #585858;
}

td {
    white-space: nowrap;
}

.Link {
    text-decoration: underline;
    color: blue !important;
    cursor: pointer;
}

.Clickable {
    cursor: pointer;
}

.TDNormalWrap {
    white-space: -moz-pre-wrap !important; /* Mozilla, since 1999 */
    white-space: -webkit-pre-wrap; /*Chrome & Safari */
    white-space: -pre-wrap; /* Opera 4-6 */
    white-space: -o-pre-wrap; /* Opera 7 */
    white-space: pre-wrap; /* CSS3 */
    white-space: normal !important;
}

.TDBlockWrap {
    display: block;
    width: 500px;
    word-break: break-all;
    white-space: normal !important;
}

.TDEllipsis {
    width: 140px;
    border: 0 solid LightGrey !important;
    display: block !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.TDEllipsisMVC {
    border: 0 solid LightGrey !important;
    display: block !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.TabBody {
    background-color: White;
    overflow: hidden;
    overflow-x: hidden;
    margin: 0;
}

.RightToolbarIcon {
    margin-left: 8px;
    height: 30px;
    width: 30px;
    background: #fff;
    margin-top: 7px;
    padding: 8px;
}

.ProductLogo {
    margin-top: 25px;
    margin-left: 8px;
    width: 190px;
}

    .ProductLogo:hover {
        cursor: pointer;
    }

.DialogBody {
    background-color: White;
    overflow: visible;
    margin: 0;
}

.LeftFrame {
    overflow: visible;
    width: auto;
}

.MainFrame {
    background-color: White;
    overflow: auto;
    overflow-x: auto;
    width: 100%;
    height: 100%;
    margin: 0;
}

.MainContainer {
    position: relative;
    height: 100%;
    margin: 10px 20px 10px 20px;
    overflow: auto;
    overflow-x: auto;
    white-space: nowrap;
}

.InfoFrame {
    background-color: #1B345A;
    overflow: visible;
    margin: 0;
}

.ToolbarFrame {
    background-color: #1B345A;
    margin-top: 7px;
    overflow: visible;
    height: 100px;
}

.loadingOverlay {
    top: 35px;
    height: 100%;
    width: 100%;
    position: absolute;
    left: 0;
    z-index: 9999;
}

/*--------------------------------Toolbar-----all z-index should be >50 and <100--------------------------------*/
.unselectable {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.TimegateLogo {
    height: 30px;
    margin-top: 3px;
    display: inline;
}

.overlayScreen {
    background: transparent;
    position: absolute;
    z-index: 52;
    width: 99%;
    height: 99%;
}
/*Breadcrumbs*/
.navigation {
    position: relative;
    height: 36px !important;
    overflow: visible;
    z-index: 80;
    font-family: "Segoe UI";
    font-weight: normal;
    color: white;
    display: block;
    background-color: #1B345A;
    width: 100%;
    padding: 0;
    white-space: nowrap;
}

.topLeft {
    font-size: 20px;
    height: 36px;
    top: 0;
    position: relative;
    border: none;
    width: 150px;
    display: inline-block;
    padding: 0 5px;
}

.topLeftHighlight {
    background-color: #dddddd;
    color: #1B345A;
}

.breadcrumbs {
    position: absolute;
    top: 0;
    font-size: 16px;
    border: none;
    height: 36px;
    width: 70%;
    width: -webkit-calc(100% - 450px);
    width: -moz-calc(100% - 450px);
    width: calc(100% - 450px);
    display: inline-block;
}

.rightToolbar {
    position: absolute;
    right: 0px;
    float: left;
    font-size: 14px;
    border: none;
    display: inline-block;
    white-space: normal;
}

.breadcrumb {
    display: inline-block;
    margin-left: 0;
    padding: 0 10px;
    height: 36px !important;
    transition: 0.4s all ease;
}

    .breadcrumb:hover {
        cursor: pointer;
        color: #1B345A;
        background-color: #dddddd;
    }

.breadcrumbText {
    position: relative;
    top: 5px;
    text-transform: capitalize;
    padding-left: 5px;
}

.breadcrumbArrow {
    position: relative;
    top: 5px;
    font-size: 10px;
}

/*Search on the toolbar*/
.MenuSearch {
    display: inline-block;
    height: 36px !important;
    margin-left: 0;
    padding: 0 10px;
    position: relative;
}

.SearchBox {
    position: relative;
    top: 7px;
    padding: 3px;
    border: 0 solid #DE3432;
    background: white;
}

.SearchTextbox {
    position: relative;
    top: -1px;
    margin: 0 2px;
    border: 0 solid green;
    background: white;
}

    .SearchTextbox:focus {
        outline: none;
    }

.SearchImageButton {
    cursor: pointer;
    position: relative;
    top: 2px;
    margin: 0;
    padding: 0 1px;
    width: 16px;
    height: 16px;
    opacity: 0.6;
    border: 0px solid blue;
    background: white;
}

.AdvSearchOptions {
    position: absolute;
    top: 29px;
    left: 10px;
    width: 90%;
    background: white;
    z-index: 100;
    border: 1px solid grey;
    box-shadow: 7px 7px 8px -6px #999;
}

    .AdvSearchOptions ul {
        list-style-type: none;
    }

        .AdvSearchOptions ul li {
            display: block;
        }

            .AdvSearchOptions ul li span {
                margin: 0 10px;
            }



/*Ribbon options */
.ribbon {
    background-color: #ddd;
    border: none;
    color: white;
    font-family: "Segoe UI";
    padding: 5px;
    overflow-x: auto;
    overflow-y: hidden;
    position: relative;
    z-index: 51;
    height: 80px;
    white-space: nowrap;
    margin: 0 20px;
}

.ribbonhidescroll {
    border: 2px white solid;
    background-color: white;
    height: 15px;
    position: relative;
    margin-top: -17px;
    z-index: 55;
}

.recentlyViewedList {
    border: 2px white solid;
    background-color: white;
    height: 37px;
    position: relative;
    margin-top: -17px;
    margin-bottom: 5px;
    z-index: 56;
    box-shadow: 0 7px 8px -6px #999;
    padding-left: 22px;
    overflow-y: hidden;
    overflow-x: hidden;
}

.recentlyViewedContainer {
    padding: 0;
    margin: 0;
    overflow-y: hidden;
    overflow-x: hidden;
}

#leftarrow {
    cursor: pointer;
    background-color: #ddd;
    width: 20px;
    height: 85px;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 1;
    z-index: 54;
}

#rightarrow {
    cursor: pointer;
    background-color: #ddd;
    width: 20px;
    height: 85px;
    position: absolute;
    right: 0;
    top: 0;
    opacity: 1;
    z-index: 54;
}

#menu {
    height: 100px;
    width: 2200px;
}

.navOption {
    cursor: pointer;
    display: inline-block;
    position: relative;
    height: 35px;
    width: 150px;
    padding: 10px;
    margin: 4px;
    border: 0px solid;
    overflow: hidden;
}

.navOptionDiv {
}

.navOptionText {
    vertical-align: top;
    line-height: 32px;
    margin-left: 5px;
    color: white;
}

.navOptionExpand {
    position: absolute;
    top: 10px;
    right: 0;
    width: 30px;
    height: 35px;
    border-left: 1px solid;
    transition: all 0.4s ease;
}

    .navOptionExpand span {
        font-size: 16px;
        margin: 5px;
        top: 10px;
        position: relative;
    }

.navOptionExpandHighlight {
    background-color: rgb(200, 200, 200);
    background-color: rgba(200, 200, 200, 0.3);
    padding-top: 10px;
    padding-bottom: 10px;
    top: 0;
}

.recentlyViewedIcon {
}

.navOptionImage {
    font-size: 32px;
    height: 32px;
    width: 32px;
    border: 0 solid transparent;
    margin-bottom: 5px;
    display: table-cell;
}

.navOptionTextDiv {
    top: -10px;
    width: 90px;
    height: 32px;
    display: table-cell;
    vertical-align: middle;
    padding-left: 10px;
    white-space: normal;
}

.imageRV img {
    position: absolute;
    top: 5px;
    right: 5px;
    height: 20px;
    width: 20px;
    border: 0 solid white;
    margin-bottom: 5px;
    opacity: 0.6;
    display: inline-block;
}

.rvScrollArrow {
    position: absolute;
    top: 0;
    cursor: pointer;
    color: gray;
    padding: 1em 0.5em;
    background: white;
    z-index: 999;
}

.navGroup {
    display: inline-block;
    white-space: nowrap;
}

.navOptionList {
    height: 100px;
}

#subribbon {
    height: 80px;
    margin-top: -20px;
    border-bottom: 1px solid #ccc;
    background: white;
    box-shadow: 0 7px 6px -6px #999;
    padding: 4px;
    z-index: 52;
    position: relative;
}

.outerRibbon {
    width: 100%;
    margin-top: -200px;
    position: absolute;
    top: 36px;
    z-index: 70;
}

.rvOption {
    cursor: pointer;
    position: relative;
    width: 140px;
    padding: 5px;
    height: 20px;
    color: white;
    display: inline-block;
    margin: 2px 5px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}


.ToolbarDiv {
    margin-top: 7px;
    position: relative;
    margin-left: 120px;
    width: 80%;
    width: -webkit-calc(100%-300px);
    width: -moz-calc(100%-300px);
    width: calc(100%-300px);
}

.ToolbarMainMenu {
    width: 650px;
    position: relative;
    white-space: nowrap;
    margin: auto;
}

    .ToolbarMainMenu li {
        display: inline;
    }

        .ToolbarMainMenu li div {
            overflow: hidden;
            height: 30px;
            width: 30px;
            background: #83af4e;
            margin-left: 8px;
            float: left;
            white-space: normal;
            text-align: center;
            padding: 8px;
        }

            .ToolbarMainMenu li div img, .ToolbarMainMenu li div input {
                padding-bottom: 8px;
            }

        .ToolbarMainMenu li:hover div img, .ToolbarMainMenu li:hover div input {
            margin-top: -50px;
            -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50);
            filter: alpha(opacity=0);
            -moz-opacity: 0;
            -khtml-opacity: 0;
            opacity: 0;
        }

        .ToolbarMainMenu li div span {
            margin-top: 10px;
            color: white;
            font-size: 10px;
            margin-left: -3px;
        }

.ToolbarFontIcon {
    font-size: 16px;
    position: relative;
    top: 3px;
}

.DisabledToolbarOption, .DisabledToolbarOption:hover {
    opacity: 0.2 !important;
    pointer-events: none;
}


.RightToolbarFrame {
    background-color: #1B345A;
    margin-top: 7px;
    overflow: visible;
    height: 100px;
    min-width: 250px;
}


.UserDescriptionButton {
    border-collapse: separate;
    table-layout: fixed;
    border-spacing: 15px 0px;
    line-height: 120%;
}

    .UserDescriptionButton:hover {
        background-color: #dddddd;
        color: #1B345A;
    }

._topToolbar {
    overflow: visible;
    height: 100%;
    padding-top: 5px;
    margin: auto;
}

._toolbarDiv {
    position: relative;
    width: 550px;
    margin: auto;
}

._topRight {
    overflow: visible;
    height: 100%;
    width: 240px;
    float: right;
    padding-top: 6px;
}

.disableToolButton {
    opacity: 0.30;
    cursor: default;
    text-decoration: none;
}

/*-----------------------------------End Toolbar-----------------------------------------*/

._bottom {
    position: relative;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    height: 95%;
    height: -webkit-calc(100% - 36px);
    height: -moz-calc(100% - 36px);
    height: calc(100% - 36px);
}

._leftFrame {
    margin-left: 0;
    position: relative;
    float: left;
    top: 0;
    height: 100%;
    width: 200px;
    padding-left: 10px;
    box-shadow: 0 0 8px -1px #999;
    overflow: visible;
    /*overflow-x: hidden;*/
}

.leftFrame table {
    margin-left: 0;
}

.slide {
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
}

.slowSlide {
    -webkit-transition: all .5s ease-in-out !important;
    -moz-transition: all .5s ease-in-out !important;
    -o-transition: all .5s ease-in-out !important;
    transition: all .5s ease-in-out !important;
}

.btnExpandContainer {
    position: absolute;
    top: 0;
    right: -25px;
    z-index: 26;
    background-color: #fff;
    border-radius: 0 0 5px 0;
    border: 0 solid #999;
    box-shadow: 3px 3px 8px -1px #999;
}

.btnExpand {
    position: relative;
    height: 16px;
    width: 16px;
    background: transparent !important;
    padding: 5px;
    opacity: 0.6;
}

    .btnExpand:focus {
        outline: none;
        border: 0;
    }

.rotate {
    -webkit-transform: rotateY(180deg);
    -moz-transform: rotateY(180deg);
    -ms-transform: rotateY(180deg);
    -o-transform: rotateY(180deg);
    transform: rotateY(180deg);
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
}

.rotateZ {
    -webkit-transform: rotateZ(180deg);
    -moz-transform: rotateZ(180deg);
    -ms-transform: rotateZ(180deg);
    -o-transform: rotateZ(180deg);
    transform: rotateZ(180deg);
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
}

.TGTable {
    display: table;
    width: auto;
    border-spacing: 5px;
}

.TGTableRow {
    display: table-row;
    width: auto;
    clear: both;
}

.TGTableCell {
    display: table-cell;
    padding-left: 5px;
    padding-right: 5px;
}


.rotatePanelHeader {
    position: absolute;
    -ms-transform-origin: -13%;
    -webkit-transform-origin: left 80%;
    -moz-transform-origin: -23% 100% 0;
    transform: rotate(90deg);
    transition: all .2s;
}

.showHidePanelButton {
    cursor: pointer;
}

/*Used as section to the right of the left panel*/
._mainFrame {
    position: relative;
    float: right;
    height: 100%;
    width: -webkit-calc(100% - 236px);
    width: -moz-calc(100% - 236px);
    width: calc(100% - 236px);
    overflow: auto;
    border: 1px solid #fff;
    padding: 0 10px;
}



/*Used as section with no left panel*/
.mvcMainContainer {
    height: 100%;
    overflow: auto;
    padding: 0;
    margin: auto;
}

.body-content {
    margin: 0;
    overflow: auto;
}

/*Used as entire section under Timegate menu (blue bar)*/
._main {
    height: 95%;
    height: -webkit-calc(100% - 63px);
    height: -moz-calc(100% - 63px);
    height: calc(100% - 63px);
    position: relative;
}

._topLeft {
    overflow: visible;
    float: left;
    width: 200px;
    padding-top: 5px;
    margin: 0;
}


.LogonPanel {
    position: absolute;
    margin-left: -275px;
    left: 50%;
    margin-top: -220px;
    top: 50%;
    border: 2px solid #1B345A;
    padding: 20px;
}

.imgLogo {
    width: 450px;
    margin: 0 25px;
}

.logonTable td {
    margin-top: -20px;
    padding: 2px 4px;
}

.ToDoList {
    position: relative;
    background-color: White;
    top: 2%;
    width: 80%;
    min-width: 500px;
    margin: auto;
    height: 90%;
}

    .ToDoList tr {
        border: none !important;
    }

    .ToDoList td {
        border-radius: 10px;
        border: 4px solid white !important;
        text-align: left;
        margin-top: 4px;
        background: #777 !important;
        -webkit-transition: all .2s ease-in-out;
        -moz-transition: all .2s ease-in-out;
        -o-transition: all .2s ease-in-out;
        transition: all .2s ease-in-out;
        padding: 20px;
    }

        .ToDoList td:hover {
            padding-left: 40px;
            padding-right: 0;
            margin-top: 4px;
            background: #83af4e !important;
        }

        .ToDoList td a {
            text-decoration: none !important;
            color: white;
            padding: 0 20px;
        }

.InlineFormPanelContainer {
    max-width: 1000px;
    font-size: 10pt;
    overflow: visible;
    margin: 5px;
    padding: 5px 10px 15px 10px;
    border: none;
    box-shadow: 1px 1px 4px #ccc;
    border-radius: 5px;
    transition: all 0.4s ease;
    position: relative;
    background: white;
}

.Panel {
    font-size: 10pt;
    overflow: visible;
    margin: 5px;
    padding: 5px 10px 15px 10px;
    border: none;
    box-shadow: 1px 1px 4px #ccc;
    border-radius: 5px;
    transition: all 0.4s ease;
    position: relative;
    background: white;
}

    .Panel fieldset legend {
        font-size: 14pt;
        color: #444;
    }

    .Panel fieldset {
        border: none;
        padding: 0;
    }

.FormContainer {
    max-width: 500px;
    width: 380px;
}

.FormRow {
    margin: 7px 10px 7px 10px;
}

.FormLabelCell {
    display: inline-block;
    width: 105px;
    vertical-align: top;
}

    .FormLabelCell .LabelStatic {
        white-space: normal;
    }

.FormInputCell {
    display: inline-block;
    width: 210px;
    white-space: normal;
}

.IncidentCommentFrame {
    border-left: solid 4px #83af4e;
    border-right: solid 4px #83af4e;
    border-bottom: solid 4px #83af4e;
}

.leftSidePanelTableWrapper {
    margin-top: 10px;
    overflow: auto;
    height: calc(100% - 160px);
}


.PnlSiteView {
    overflow: auto;
    margin: 10px;
    padding: 10px;
}

.PanelScroll {
    position: relative;
    overflow-x: auto;
    overflow-y: visible;
    margin: 5px;
    padding: 5px;
    padding-top: 15px;
    border: none;
    box-shadow: 1px 1px 5px #aaa;
}

.legend {
    font-size: 14pt;
    color: #444;
}

.subLegend {
    font-size: 12pt;
    color: #444;
}

.PanelScroll fieldset {
    border: none;
    margin-top: 20px;
}


.PanelScroll.Vertical {
    overflow-y: auto !important;
}

.PanelScroll.UDF {
    overflow: inherit !important;
    overflow-x: inherit;
}

.pnlLog {
    overflow: auto;
}


.Tiny {
    width: 20px !important;
    height: 18px !important;
}

SELECT.Tiny, .Button.Tiny {
    width: 22px !important;
    height: 20px !important;
}

.Smallest {
    width: 40px !important;
    height: 18px !important;
}

SELECT.Smallest, .Button.Smallest {
    width: 42px !important;
    height: 20px !important;
}

.Smaller {
    width: 60px !important;
    height: 18px !important;
}

SELECT.Smaller, .Button.Smaller {
    width: 62px !important;
    height: 20px !important;
}

.SmallMed {
    width: 68px !important;
    height: 20px !important;
}

SELECT.SmallMed, .Button.SmallMed {
    width: 70px !important;
    height: 24px !important;
}

.Small {
    width: 90px !important;
    height: 18px !important;
}

SELECT.Small, .Button.Small {
    width: 92px !important;
    height: 20px !important;
}

.MedSmall {
    width: 100px !important;
    height: 18px !important;
}

SELECT.MedSmall, .Button.MedSmall {
    width: 102px !important;
    height: 20px !important;
}

.NavBarSmall {
    width: 130px !important;
    height: 15px !important;
}

SELECT.NavBarSmall, .Button.NavBarSmall {
    width: 132px !important;
    height: 20px !important;
}

.Medium {
    width: 160px !important;
    height: 18px !important;
}

SELECT.Medium, .Button.Medium {
    width: 162px !important;
    height: 20px !important;
}

.NavBarMedium {
    width: 180px !important;
    height: 18px !important;
}

SELECT.NavBarMedium, .Button.NavBarMedium {
    width: 182px !important;
    height: 20px !important;
}

.Large {
    width: 200px !important;
    height: 18px !important;
}

SELECT.Large, .Button.Large {
    width: 202px !important;
    height: 20px !important;
}

.Largest {
    width: 240px !important;
    height: 18px !important;
}

.ExtraLarge {
    width: 350px !important;
    height: 18px !important;
}

SELECT.Largest, .Button.Largest {
    width: 242px !important;
    height: 20px !important;
}

.MultiLine {
    white-space: normal;
    width: 100% !important;
    height: 120px !important;
}

.MultiPreLine {
    white-space: pre-line;
}

.Textbox {
    width: 160px;
    height: 18px;
    font-size: 10pt;
    color: #444;
    border-right: solid 0px #D3D3D3;
    border-top: solid 1px transparent; /*This is to help firefox render the textboxes aligned.*/
    border-left: solid 0px #D3D3D3;
    border-bottom: solid 1px #D3D3D3;
    background-color: #FFF;
    transition: all 0.4s;
    padding: 2px !important;
}


    .Textbox:focus {
        border-bottom: black solid 1px;
        color: black;
    }

.TimeTextbox {
    width: 35px;
}

input[type=date] {
    font-family: "Segoe UI", Candara, "Bitstream Vera Sans", "DejaVu Sans", "Trebuchet MS", Verdana, "Verdana Ref", sans-serif;
    width: 120px !important;
    height: 18px !important;
}

/*LR This is because firefox doesn support the pseudo elements https://stackoverflow.com/questions/42803095/html5-input-date-dont-want-the-cross-sign*/
input[type="date"][readonly="readonly"] {
    clip-path: inset(0 17px 0 0);
}

TEXTAREA, INPUT[type=text] {
    font-family: Tahoma, Verdana, Helvetica, sans-serif;
}

    TEXTAREA.Textbox {
        white-space: pre-wrap;
        border-right: 1px solid lightgrey;
        height: 50px;
        margin-top: 8px;
    }

        TEXTAREA.Textbox:focus {
            white-space: pre-wrap;
            border-bottom: black solid 1px;
            border-right: black solid 1px;
            color: black;
        }

    .Textbox:disabled, input[type=text][disabled=disabled], input[type=text]:disabled {
        background-color: #ddd;
        border: none;
        cursor: default;
    }

input[type="date"] {
    font-family: "Segoe UI","Trebuchet MS",Candara,Tahoma, Verdana, Arial,sans-serif;
}

.camoTextbox {
    color: inherit;
    background: transparent;
    font-size: inherit;
    border: 1px solid transparent;
}

    .camoTextbox:focus, .camoTextbox:hover {
        color: Black;
        border: solid 1px #D3D3D3;
        background-color: #FFF;
    }

.Dropdown {
    width: 160px;
    height: 20px;
    font-size: 10pt;
    font-weight: 400;
    color: #444;
    border-right: none;
    border-top: none;
    border-left: none;
    border-bottom: solid 1px #D3D3D3;
}

    .Dropdown:focus {
        border-bottom: black solid 1px;
        color: black;
    }

    .Dropdown:disabled, select[disabled=disabled], select:disabled {
        background-color: #ddd;
        border: none;
        /*color: #555;*/
        cursor: default;
    }

.Image {
    cursor: pointer;
}

.LabelData {
    width: 160px;
    height: 20px;
    font-size: 14px;
    color: #444;
    font-weight: 400;
    padding: 1px 5px 1px 0px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ErrorLabel {
    font-size: 10pt;
    color: #DE3432;
    margin: 10px;
}

.WarningLabel {
    font-size: 10pt;
    color: #8D710C;
    margin: 10px;
}

.ConfirmationMessage {
    padding: 10px;
    color: #85B92F;
}

.Button {
    height: 20px;
    font-size: 12px;
    cursor: pointer;
    font-weight: normal;
    color: white;
    border: none;
    background-color: #1B345A;
    padding: 3px 8px;
    text-align: center;
    transition: all 0.2s;
    text-transform: uppercase;
    border-radius: 3px;
}

    .Button:active {
        background-color: #347;
    }

    .Button::-moz-focus-inner {
        border: 0;
    }

    .Button:disabled, input[type=button][disabled=disabled] {
        background-color: #585858;
        color: #FFF;
        border: none;
        cursor: not-allowed;
        text-shadow: grey 0 0 !important;
    }

.ButtonLogon {
    float: right;
    font-size: 14px;
    cursor: pointer;
    color: white;
    border: none;
    margin-top: 3px;
    background-color: #1B345A;
    padding: 5px 20px;
    text-transform: uppercase;
    border-radius: 2px;
}

    .ButtonLogon:Active {
        background-color: #347;
    }

.Checkbox {
    background-color: Transparent;
    font-size: 10pt;
}

.RadioButton {
    background-color: Transparent;
    font-size: 10pt;
    font-weight: 400 !important;
}


.LabelStatic {
    width: 160px;
    height: 20px;
    background-color: Transparent;
    font-size: 10pt;
    font-weight: 400 !important;
    color: #1B345A;
    white-space: nowrap;
}

.LabelSplashVersion {
    position: relative;
    float: right;
    margin-top: -25px;
    background-color: Transparent;
    font-size: 16pt;
    color: #AAA;
}

.LabelSubHeading {
    background-color: Transparent;
    font-size: 10pt;
    font-weight: 700;
    color: #1B345A;
}

.InputStyleLabel {
    opacity: 0.6;
    font-size: 8pt;
}

.DataGrid, .DataGridTable, .BasicDataGrid {
    font-family: "Segoe UI", Candara, "Bitstream Vera Sans", "DejaVu Sans", "Bitstream Vera Sans", "Trebuchet MS", Verdana, "Verdana Ref", sans-serif;
    background-color: white;
    border: 0px solid lightgrey;
    color: #585858;
    margin: 10px 0;
    border-collapse: collapse;
    transition: all 0.4s;
}

    .DataGridHeader, .DataGridHeader td, .DataGridHeader th, .DataGrid th {
        background-color: #FFFFFF;
        font-size: 14px;
        font-weight: 400;
        color: #585858;
        text-align: center;
        text-decoration: none !important;
        border: none;
        border-top: 0px solid lightgrey;
        border-bottom: 1px solid lightgrey;
        vertical-align: bottom;
    }

        .DataGridHeader td a, .DataGridHeader th a, .DataGrid th a {
            text-decoration: none;
            cursor: pointer;
            font-size: 14px;
            font-weight: 400;
            color: #585858;
            border: none;
        }

.DataGridFirstDayInWeek {
    border-top: 2px solid lightgrey !important;
}

.DataGridContractTimesHeader {
    text-decoration: none;
    font-size: 10pt;
    font-weight: 400;
    color: #585858;
    border: none;
    text-align: center;
}

.DataGridPager, .DataGridPager, .DataGridPager td {
    background-color: White;
    font-size: 10pt;
    font-weight: 400;
    color: white;
    border: none;
    border-top: 1px solid lightgrey !important;
    text-align: center;
    text-decoration: none;
    margin: auto;
    /*This is to stop highlighting*/
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

    .DataGridPager td a {
        color: blue;
        text-align: center;
        text-decoration: underline;
        margin: auto;
        padding: 2px 5px;
        cursor: pointer;
        transition: all 0.4s;
    }

    .DataGridPager td table {
        margin: auto;
    }

    .DataGridPager td span {
        text-decoration: none;
        color: #585858;
    }

.DataGridRowLarge {
    background-color: white;
    font-size: 20pt;
    border: none;
}

.numberCell {
    white-space: nowrap;
    max-width: inherit;
}

.DataRow, .DataGridRowAlt, .DataGridRow td, .DataGridRowAlt td, .DataGrid td {
    font-size: 14px;
    border: none;
    text-align: center;
    padding: 4px;
    word-wrap: break-word;
}

    .DataGridRow td, .DataGridRowAlt td {     
        text-overflow: inherit;
        vertical-align: middle;
    }

.DataGridRowAlt, .DataGrid tr:nth-child(2n+3) {
    background-color: #f5f5f5;
    border: none;
}

    .DataRow td a, .DataGridRow td a, .DataGridRowAlt td a {
        color: inherit;
        text-decoration: none;
        text-decoration: inherit;
        cursor: pointer;
    }


.DataGridRowAltLarge {
    background-color: #eee;
    font-size: 20pt;
    border: none;
}

.DataGridRowForSelection, .DataGridRowWithHighlight {
    transition: all 0.4s;
}

.DataGridRowForSelection {
    cursor: pointer;
    text-align: center;
}

    .DataGridRowForSelection:hover, .DataGridRowWithHighlight:hover {
        background-color: #F0F9FE !important; /*#d6faaa !important;*/
    }



.NumberedGridPager {
    border-top: 1px solid #d3d3d3 !important;
    background-color: white !important;
}

    .NumberedGridPager td span {
        text-decoration: underline;
        padding: 0 3px 0 3px;
        cursor: pointer;
        color: blue;
    }

        .NumberedGridPager td span.GridSelectedPage {
            cursor: default;
        }


.NumberedListPager {
    border-top: 1px solid #d3d3d3 !important;
    background-color: white !important;
    text-align: center;
}

    .NumberedListPager span {
        text-decoration: underline;
        color: blue;
        padding: 0 3px 0 3px;
        cursor: pointer;
    }

        .NumberedListPager span.ListSelectedPage {
            text-decoration: none;
            cursor: default;
        }

.InfiniteScrollFooter {
    height: 80px;
    background-color: transparent !important;
}

    .InfiniteScrollFooter td span {
        display: none;
    }

.Inactive {
    opacity: 0.6;
    font-style: italic;
}

.RowHidden {
    display: none;
}

.tblMonth {
    border: 1px solid LightGrey;
    width: 90%;
    height: 90%;
    margin: auto;
}

.tblMonthCellDiv {
    min-width: 100px !important;
    min-height: 60px !important;
    overflow: hidden;
    white-space: normal;
}

.tblDay {
    border: 1px solid LightGrey;
    width: 50%;
    height: 100%;
}

.HierarchyGridFirstTier {
    border: 1px solid #FFF;
    background-color: #FFF;
    white-space: nowrap;
}

    .HierarchyGridFirstTier td {
        background-color: #FFF;
        border: 1px solid #FFF;
        white-space: nowrap;
        font-size: 8pt;
    }

.HierarchyGridSecondTier {
    border: 1px solid #FFF;
    background-color: #eee;
    white-space: nowrap;
}

    .HierarchyGridSecondTier td {
        background-color: #eee;
        border: 1px solid #eee;
        white-space: nowrap;
        font-size: 8pt;
    }

.HierarchyGridThirdTier {
    border: 1px solid #FFF;
    background-color: #ccc;
    white-space: nowrap;
}

    .HierarchyGridThirdTier td {
        background-color: #ccc;
        border: 1px solid #ccc;
        white-space: nowrap;
        font-size: 8pt;
    }


    .HierarchyGridFirstTier th, .HierarchyGridSecondTier th, .HierarchyGridThirdTier th {
        background-color: transparent;
        border: 1px solid transparent;
        border-right: none;
        color: #585858;
        white-space: nowrap;
        font-size: 8pt;
    }

.DataGridHighlight, .DataGridRow:hover, .DataGridRowAlt:hover {
    background-color: #F0F9FE !important;
    font-size: 8pt;
    border: none;
    cursor: pointer;
}

.DataGridRowUnselectable:hover {
    cursor: default;
}

.DataGridHighlight td {
    text-align: center;
    padding: 4px;
}

/*Used for rotating the header 90degrees*/
.rotatedHeader {
    font-size: 8pt;
    margin: auto;
    margin-bottom: 5px;
    margin-top: 100px;
    max-width: 20px;
    overflow: visible;
    -ms-transform: rotate(-90deg);
    -ms-transform-origin: 50% 50% 0;
    -webkit-transform: rotate(-90deg);
    -webkit-transform-origin: 50% 50% 0;
    -moz-transform: rotate(-90deg);
    -moz-transform-origin: 50% 50% 0;
    transform: rotate(-90deg);
    transform-origin: 50% 50% 0;
    white-space: nowrap;
}


/*---------------------------------SiteView-------------------------------------------*/
.siteViewNavBtn {
    width: 16px;
    height: 16px;
    opacity: 0.6;
}

.SiteViewSD {
    background-image: url(../../graphics/SiteViewSD.png);
    background-repeat: no-repeat;
    background-position: right center;
}

.SiteViewSDF {
    background-image: url(../../graphics/SiteViewSDF.png);
    background-repeat: no-repeat;
    background-position: right center;
}

.SiteViewIR {
    background-image: url(../../graphics/SiteViewIR.png);
    background-repeat: no-repeat;
    background-position: right center;
}

.SiteViewFR {
    background-image: url(../../graphics/SiteViewFR.png);
    background-repeat: no-repeat;
    background-position: right center;
}

.SiteViewIN {
    background-image: url(../../graphics/SiteViewIN.png);
    background-repeat: no-repeat;
    background-position: right center;
}

.SiteViewFR_IN {
    background-image: url(../../graphics/SiteViewFR_IN.png);
    background-repeat: no-repeat;
    background-position: right center;
}

.SiteViewSD_FR {
    background-image: url(../../graphics/SiteViewSD_FR.png);
    background-repeat: no-repeat;
    background-position: right center;
}

.SiteViewSDF_FR {
    background-image: url(../../graphics/SiteViewSDF_FR.png);
    background-repeat: no-repeat;
    background-position: right center;
}

.SiteViewSD_FR_IN {
    background-image: url(../../graphics/SiteViewSD_FR_IN.png);
    background-repeat: no-repeat;
    background-position: right center;
}

.SiteViewSDF_FR_IN {
    background-image: url(../../graphics/SiteViewSDF_FR_IN.png);
    background-repeat: no-repeat;
    background-position: right center;
}

.SiteViewSD_IR {
    background-image: url(../../graphics/SiteViewSD_IR.png);
    background-repeat: no-repeat;
    background-position: right center;
}

.SiteViewSDF_IR {
    background-image: url(../../graphics/SiteViewSDF_IR.png);
    background-repeat: no-repeat;
    background-position: right center;
}

.SiteViewSD_IR_IN {
    background-image: url(../../graphics/SiteViewSD_IR_IN.png);
    background-repeat: no-repeat;
    background-position: right center;
}

.SiteViewSDF_IR_IN {
    background-image: url(../../graphics/SiteViewSDF_IR_IN.png);
    background-repeat: no-repeat;
    background-position: right center;
}

.SiteViewIR_IN {
    background-image: url(../../graphics/SiteViewIR_IN.png);
    background-repeat: no-repeat;
    background-position: right center;
}

.SiteViewFC {
    background-image: url(../../graphics/SiteViewFC.png);
    background-repeat: no-repeat;
    background-position: right center;
}

.SiteViewFC_AutoOff {
    background-image: url(../../graphics/SiteViewFC_AutoOff.png);
    background-repeat: no-repeat;
    background-position: right center;
}

.SiteViewFC_Onsite {
    background-image: url(../../graphics/SiteViewFC_Onsite.png);
    background-repeat: no-repeat;
    background-position: right center;
}

.SiteView_AutoOff {
    background-image: url(../../graphics/SiteView_AutoOff.png);
    background-repeat: no-repeat;
    background-position: right center;
}

.SiteView_Onsite {
    background-image: url(../../graphics/SiteView_Onsite.png);
    background-repeat: no-repeat;
    background-position: right center;
}

.SiteViewUnSelected {
    background-color: White;
    border: solid 1px black;
}

.DataCellParentContainerDiv {
    border: 2px solid transparent;
    position: relative;
    top: 0;
    left: 0;
    height: 50px;
    width: 122px;
    text-decoration: inherit;
}

.DataCellContainerDiv {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 122px;
    text-decoration: inherit;
}

.DataCellContainerDivReadOnly {
    position: absolute;
    top: -2px;
    left: -2px;
    height: 100%;
    width: 100%;
    display: none;
    text-decoration: inherit;
}

.DataCellLeftDiv {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 90px;
    text-overflow: ellipsis;
    overflow: hidden;
    text-decoration: inherit;
}

.SiteTeamDataCellCenterDiv {
    display: block;
    font-size: 14px;
    position: absolute;
    top: 0;
    right: 18px;
    height: 100%;
    width: 16px;
    overflow: visible;
    opacity: 0.6;
}

.SiteTeamDataCellRightDiv {
    display: block;
    font-size: 14px;
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    width: 16px;
    overflow: visible;
    opacity: 0.6;
}

.DataCellCenterDiv {
    display: block;
    position: absolute;
    top: 10px;
    right: 10px;
    height: 100%;
    max-width: 60px;
    overflow: visible;
    color: black;
}

.DataCellRightDiv {
    display: block;
    position: absolute;
    top: 10px;
    right: 10px;
    height: 100%;
    width: 16px;
    overflow: visible;
    opacity: 0.6;
}

/*dragdrop specific ASPX SiteView*/
.DataCellContainerDiv.ui-draggable {
    z-index: 10;
}

    .DataCellContainerDiv.ui-draggable.ui-draggable-dragging {
        background: white !important;
        border: 1px solid #bbb;
        z-index: 20;
        transform: rotate(5deg);
    }

.activeDroppableAreaSiteView .DataCellParentContainerDiv {
    border: 2px dashed #ddd !important;
}

.hoverDroppableAreaSiteView .DataCellParentContainerDiv {
    border: 2px solid grey !important;
}

/*dragdrop specific SiteView now on SiteView.css*/



/*----------------------------------------------Context Menu----------------------------------------------*/
.CustomContextMenu {
    padding: 3px;
    display: none;
    position: fixed;
    border: 1px solid grey;
    width: 200px;
    background: #f5f5f5;
    box-shadow: 1px 1px 1px grey;
    z-index: 80; /*this is to make sure it is above drag drop*/
    text-align: left;
    font-size: 8pt;
}

.Items {
    list-style: none;
    padding: 0;
    font-size: 8pt;
    margin: 0;
}

.ContextMenuOption {
    color: #222;
    list-style: none;
    padding: 3px;
    border: #f5f5f5 1px solid;
}

    .ContextMenuOption:hover {
        background: #F0F9FE;
        color: #111;
        border-radius: 2px;
        cursor: pointer;
        border: #D3D3D3 1px solid;
    }

.ContextMenuDivider {
    border-bottom: 1px solid #999;
    margin: 5px 5px;
}

.ContextMenu_Graphic {
    opacity: 0.55;
    margin-right: 10px;
    margin-bottom: -4px;
}

span.ContextMenu_Graphic {
    font-size: 10pt;
}

.ContextMenuOption.OptionDisabled {
    color: #585858;
    cursor: default;
}

    .ContextMenuOption.OptionDisabled:hover {
    }

/*----------------------------------------------SiteCardBudgetReview----------------------------------------------*/
.DataTable {
    border: 1px solid #808080;
    -webkit-user-select: none; /* Chrome all / Safari all */
    -moz-user-select: none; /* Firefox all */
    -ms-user-select: none; /* IE 10+ */
    /* No support for these yet, use at own risk */
    -o-user-select: none;
    user-select: none;
}

.ReviewHeaderRow {
    border-bottom: #808080 solid 2px;
    border-top: #808080 solid 2px;
    height: 25px;
}

    .ReviewHeaderRow td, .ReviewHeaderRow th {
        padding: 5px;
    }

.ReviewHeaderDiv {
    color: #585858;
    cursor: pointer;
    font-size: 10pt;
    font-weight: 400;
    text-decoration: none;
    padding-left: 5px;
    width: 80px;
}


.ReviewCaptionCell {
    background-color: #e6fae6;
    text-align: left !important;
}

.ReviewDataCell {
    border-left: 1px solid lightgrey;
    text-align: right;
}

.ReviewDataDiv {
    text-align: right;
}

.ReviewDataRow td {
    padding: 5px;
}

.ReviewDutyDivParent {
    width: 95%;
    height: 25px;
    position: relative;
}

.ReviewDutyDiv {
    width: 100%;
    height: 18px;
    border: transparent 2px solid;
    padding: 2px 1px;
    top: 0;
    left: 0;
}

.ReviewDutyDivReadOnly {
    padding: 2px 1px;
    border: transparent 2px solid;
    display: none;
    position: absolute;
    top: 0;
    left: 0;
}

.ReviewDutyRow {
    border-left: 1px solid #808080;
}

    .ReviewDutyRow:nth-child(even) {
        background: #F5F5F5;
    }

    .ReviewDutyRow:nth-child(odd) {
        background: #FFF;
    }

    .ReviewDutyRow:hover {
        background-color: #e6fae6;
    }

    .ReviewDutyRow td {
        border-right: 1px solid lightgrey;
        padding: 1px;
    }

        .ReviewDutyRow td:last-child {
            border-right: 1px solid #808080;
        }

.FlowRight {
    position: relative;
    float: right;
    font-size: 18pt;
    margin-top: -8px;
    margin-right: 5px;
    font-style: normal !important;
    font-weight: normal !important;
}

.ToggleImageDiv {
    width: 14px;
    position: relative;
    float: left;
    top: 50%;
    margin-top: 6px;
    opacity: 0.4;
}

/*dragdrop specific*/
.ReviewDutyDiv.ui-draggable {
    z-index: 10;
}

    .ReviewDutyDiv.ui-draggable.ui-draggable-dragging {
        background: white !important;
        border: 1px solid #bbb;
        z-index: 20;
        transform: rotate(5deg);
    }

.activeDroppableArea {
    border: 2px dashed grey !important;
}

.hoverDroppableArea {
    border: 2px solid grey !important;
}

/*----------------------------------------------ToolbarMenu--------------------------------------------------------*/

.ToolbarMenu {
    margin-left: -20px;
    width: 100%;
    margin-top: 10px;
    white-space: nowrap;
}

    .ToolbarMenu li {
        list-style-type: none;
        display: inline;
        width: auto;
        margin: 2px;
        padding: 0;
    }

        .ToolbarMenu li ul {
            list-style-type: none;
            display: inline;
            width: auto;
            background: transparent;
            padding: 5px 1px;
        }

            .ToolbarMenu li ul li {
                list-style-type: none;
                display: inline;
                width: auto;
                margin: 0 1px;
                color: #000;
                position: relative;
                cursor: pointer;
            }

    .ToolbarMenu span, .ToolbarMenu label {
        cursor: pointer;
    }

    .ToolbarMenu li ul li a, .ToolbarMenu li ul li > span {
        padding: 2px;
        text-decoration: none;
        color: #000;
        opacity: 0.6;
        transition: all 0.2s ease;
        cursor: inherit;
        border-radius: 5px;
    }

        .ToolbarMenu li ul li a:hover, .ToolbarMenu li ul li > span:hover {
            background-color: #F0F9FE;
            height: 20px;
            padding-bottom: 4px;
            opacity: 0.8;
            cursor: inherit;
        }


.ToolbarDropDown {
    background: white;
    width: 200px;
    position: absolute;
    display: none;
    top: 25px;
    right: -90px;
    border: 1px solid lightgrey;
    box-shadow: 3px 3px 8px -1px #999;
    z-index: 1;
}

.ToolbarDropDownOption {
    color: #555;
    padding: 10px;
    cursor: pointer;
    transition: all 0.2s ease;
    text-overflow: ellipsis;
    overflow: hidden;
}

    .ToolbarDropDownOption:hover {
        background: #eee;
        color: #222;
    }

.Toolbar_Graphic {
    position: relative;
    width: 16px;
    margin-bottom: -4px;
}

.Toolbar_Divider {
    border-radius: 0 !important;
    background-color: #fff !important;
    position: relative;
    left: 0;
    border-right: 1px solid #83af4e;
    margin: 0 2px !important;
    padding: 0;
}

/*-------------------------Dialog---------------------------------------------------*/
.m_Dialog {
    display: none;
}

.m_Dialog_Background {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 110%;
    background-color: black;
    z-index: 998;
    -moz-opacity: 0.5;
    opacity: .50;
    filter: alpha(opacity=50);
}

.m_Dialog_Window {
    position: fixed;
    width: 100%;
    top: 50%;
    left: 0;
    z-index: 999;
}

.m_Dialog_Table {
    margin-left: auto;
    margin-right: auto;
    background-color: White;
    border: #1B345A 1px solid;
}

.dialogCloseImg {
    cursor: hand;
    height: 16px;
    width: 16px;
}

.m_Dialog_Table .Header_Row {
    height: 30px;
    background-color: #1B345A;
}

.m_Dialog_Table .Header_Caption_Cell {
    text-align: center;
    font-size: 12px;
    margin-left: 20px;
    font-weight: 700;
    color: white;
    border-bottom: #1B345A 1px solid;
}

.m_Dialog_Table .Header_Close_Cell {
    width: 20px !important;
    text-align: right;
    border-bottom: #1B345A 1px solid;
    padding-right: 4px;
}
/*For chrome being silly*/
.Header_Close_Cell {
    width: 20px !important;
}

.Header_Row {
    cursor: pointer;
}


.m_Dialog_Table .Spacer_Cell {
    height: 0;
}
/*----------------------------------Tabs--------------------------------------------------*/
.Tab_Background {
    width: auto;
    min-width: 600px;
}

.TabMenu {
    border-bottom: 0px solid transparent;
    margin: 4px 4px 4px -15px;
    padding: 4px 2px 0 20px;
}

    .TabMenu li {
        display: inline-block;
        margin-bottom: 1px;
        margin-top: 3px;
        margin-left: -3px;
        text-transform: capitalize;
    }

.SelectedTab a, .SelectedTab_Middle a, .Tab a {
    border: 1px solid #fff;
    font-weight: normal;
    font-size: 1em;
    text-align: center;
    padding: 1px 4px;
    font-size: 12px;
    font-weight: bold;
}

.SelectedTab a, .SelectedTab_Middle a, /*This is to pick up the jquery class*/ .ui-tabs-active.ui-state-active a {
    background-color: White !important;
    color: #777 !important;
    border-top: 1px solid #fff !important;
    border-bottom: 2px solid white !important;
}

.Tab a {
    background-color: #fff;
    color: #bbb;
    text-decoration: none;
    text-transform: capitalize;
}

.TabMenu li a:hover {
    background-color: white;
    color: black;
    cursor: pointer;
}

.divTabsMenu {
    height: 30px;
    margin-left: 1em;
}

/*Selects all child elements*/
.fakeHidden * {
    position: relative;
    z-index: 0;
    opacity: 0;
    visibility: hidden;
}

.fakeHidden .Panel {
    position: absolute;
    z-index: 0;
    opacity: 0;
    visibility: hidden;
    padding: 0;
    margin: 0;
}

.fakeShow {
    position: relative;
    z-index: 2;
}

.tabSelected {
    color: #777777 !important;
}


/*----------------------------------Tables--------------------------------------------------*/
.default {
    border-right-color: #DCDCDC;
}

.noThick_Bot_Blue {
    border-bottom-color: black;
    border-right-color: #DCDCDC;
    background-color: #F0F9FE;
    border-top-color: #DCDCDC;
}

.noThick_Bot_White {
    border-bottom-color: black;
    border-top-color: #DCDCDC;
    background-color: white;
    border-right-color: #DCDCDC;
}

.noThick_Bot_Gray {
    border-bottom-color: Gray;
    border-top-color: #DCDCDC;
    background-color: #DCDCDC;
    border-right-color: #DCDCDC;
}

.tblData tr td.Thick_Top2_Blue {
    background-color: #F0F9FE;
    border-color: Gray Gray #DCDCDC Gray;
    border-style: solid;
    border-width: 2px;
}

.tblData tr td.Thick_Top2_White {
    border-color: Gray Gray #DCDCDC Gray;
    border-style: solid;
    border-width: 2px;
}

.tblData tr td.Thick_Top2_Gray {
    background-color: #DCDCDC;
    border-color: Gray Gray #DCDCDC Gray;
    border-style: solid;
    border-width: 2px;
}

.tblData tr td.Thick_TopL_Blue {
    background-color: #F0F9FE;
    border-color: Gray #DCDCDC #DCDCDC Gray;
    border-style: solid;
    border-width: 2px;
}

.tblData tr td.Thick_TopL_White {
    border-color: Gray #DCDCDC #DCDCDC Gray;
    border-style: solid;
    border-width: 2px;
}

.tblData tr td.Thick_TopL_Gray {
    background-color: #DCDCDC;
    border-color: Gray #DCDCDC #DCDCDC Gray;
    border-style: solid;
    border-width: 2px;
}

.tblData tr td.Thick_TopR_Blue {
    background-color: #F0F9FE;
    border-color: Gray Gray #DCDCDC #DCDCDC;
    border-style: solid;
    border-width: 2px;
}

.tblData tr td.Thick_TopR_White {
    border-color: Gray Gray #DCDCDC #DCDCDC;
    border-style: solid;
    border-width: 2px;
}

.tblData tr td.Thick_TopR_Gray {
    background-color: #DCDCDC;
    border-color: Gray Gray #DCDCDC #DCDCDC;
    border-style: solid;
    border-width: 2px;
}

.tblData tr td.Thick_Bot_Blue {
    background-color: #F0F9FE;
    border-color: #DCDCDC Gray Gray Gray;
    border-style: solid;
    border-width: 2px;
}

.tblData tr td.Thick_Bot_White {
    border-color: #DCDCDC Gray Gray Gray;
    border-style: solid;
    border-width: 2px;
}

.tblData tr td.Thick_Bot_Gray {
    background-color: #DCDCDC;
    border-color: #DCDCDC Gray Gray Gray;
    border-style: solid;
    border-width: 2px;
}

.noThick_Top2_Blue, .noThick_TopL_Blue, .noThick_TopR_Blue {
    border-bottom-color: #DCDCDC;
    border-right-color: #DCDCDC;
    background-color: #F0F9FE;
}

.noThick_Top2_White, .noThick_TopL_White, .noThick_TopR_White {
    border-bottom-color: #DCDCDC;
    border-right-color: #DCDCDC;
}

.noThick_Top2_Gray, .noThick_TopL_Gray, .noThick_TopR_Gray {
    border-bottom-color: #DCDCDC;
    border-top-color: Gray;
    background-color: #DCDCDC;
    border-right-color: #DCDCDC;
}


.tblData {
    font-family: Tahoma;
    font-size: 7pt;
    border-collapse: collapse;
    border-color: Gray;
    border-style: Solid;
    border-width: 1px;
}

.bottomGrayRightBlack {
    background-color: #F0F9FE;
    border-bottom-color: #DCDCDC;
    border-right-color: Gray;
}

.bottomBlackRightBlack {
    border-bottom-color: Gray;
    border-right-color: Gray;
}

/*----------------------------------Reports--------------------------------------------------*/
.reportInformation {
    width: 650px;
    border: 2px solid #83af4e;
    margin: 20px auto;
    padding: 10px;
}

.reportMain {
    overflow: auto;
    height: 320px;
    margin: 20px auto;
    padding: 10px;
}

.reportControls {
    width: 650px;
    margin: 10px auto;
    padding: 10px;
}

.reportInfoMain {
    width: 630px;
    border: 1px solid #83af4e;
    margin: 10px auto;
    padding: 5px;
}

/*----------------------------------Fields--------------------------------------------------*/
.inline {
    display: inline-block;
}

.hidden {
    display: none;
}

.disabledField {
    font-size: 8pt;
    color: Gray;
    background-color: ButtonFace;
}

.enabledField {
    font-size: 8pt;
    color: Black;
    border-color: Black;
}

.DiaryDayTableDiv {
    float: right;
    height: 60px;
    width: 380px;
    overflow-y: auto;
    overflow-x: hidden;
    border: 1px solid LightGray;
}

.ajax__calendar_container {
    z-index: 3;
}

#MaintenanceTopDiv {
    margin-top: 10px;
}

#MaintenanceMiddleDiv {
    margin-top: 10px;
    display: inherit;
}

#MaintenanceleftDiv {
    float: left;
    width: 50%;
    display: inline;
}

#MaintenanceRightDiv {
    float: right;
    width: 50%;
    display: inline;
}

.HelpDeskButtonColourPanel {
    float: left;
    margin-top: 2px;
    margin-right: 2px;
}


.page, #aspnetForm {
    height: 100%;
}

.RightToolbarIcon:hover, .ToolbarMainMenu li:hover {
    cursor: pointer;
    display: inline;
}

._leftFrame SELECT, ._leftFrame TABLE, ._leftFrame .Button, ._leftFrame .Textbox, #MaintenanceTopDiv, #MaintenanceCenterDiv {
    margin-top: 10px;
}

.Panel fieldset legend, .Panel .legend, .PanelScroll .legend {
    font-weight: normal;
}

.Button:Active, .Toolbar_Graphic:hover {
    cursor: pointer;
}

.HelpDeskAcceptableStatusList, .HelpDeskAvailableStatusList {
    height: 100px;
    min-width: 200px;
}
/*----------------------------------Fake Accordion--------------------------------------------------*/
/*Just apply fakeAccordion to the div*/
.fakeAccordion {
    display: block;
    cursor: pointer;
    position: relative;
    margin-top: 5px;
    line-height: 1.3;
    font-family: Verdana,Arial,sans-serif;
    font-size: 12pt;
    padding: .5em .5em .5em .7em;
    background: #7b7b7b;
    font-weight: normal;
    color: white;
    margin-bottom: 0;
    padding-right: 1em; /*center alignment issues*/
}

    .fakeAccordion:hover, .fakeAccordion:focus {
        background: #999;
        font-weight: normal;
        color: #fff;
    }
/*----------------------------------Media queries--------------------------------------------------*/
@media all and (min-width:1176px) {
}

@media all and (max-width:1240px) {

    .navigation {
        min-width: 1100px;
        overflow: visible;
    }

    .UserDescription {
        display: none !important;
    }

    .rightToolbar {
        overflow: visible !important;
        width: 80px !important;
    }
}

/*----------------------------------Holiday Manager Css -------------------------------------------------*/

.PivotTableDateData {
    text-align: left;
    height: 25px;
}


.PivotTableData {
    color: #585858;
}


.PivotTableCaption {
    margin-bottom: 5px;
}

.HolidayHighlightColor {
    background-color: lightgrey !important;
}

/*-------------------------Notifications----------------------------------------------------*/
.notificationText {
    font-weight: bold;
    text-decoration: underline !important;
    margin-right: 5px !important;
    cursor: pointer !important;
}

.notificationLabel {
    font-weight: bold;
    margin-right: 5px !important;
}

.imgNotificationNav {
    margin-right: 5px;
    height: 20px;
    width: 20px;
}

.notificationNavSection {
    position: relative;
    /*float: right;*/
    margin-right: 5px;
    display: block;
    top: 0;
    margin-bottom: 10px;
    width: 150px;
    display: inline-block;
}

.notificationNavArrows {
    position: relative;
    /*float: right;*/
    margin-right: 5px;
    display: block;
    top: 5px;
    margin-bottom: 10px;
    width: 50px;
    display: inline-block;
}

.notificationsSection {
    z-index: 20 !important;
    display: block;
    background: #B60000;
    /*height: 40px;*/
}

.notificationDetails {
    /*float:left;*/
    position: relative;
    color: white !important;
    width: calc(100% - 230px);
    top: 5px;
    display: block;
    margin-right: 10px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: inline-block;
}

.notificationFont {
    font-size: 10pt !important;
    overflow: hidden;
    color: white !important;
}

.LabelData.notificationFont {
    font-weight: bold;
    color: white !important;
}

.SspAbsenceGridCell {
    border-style: none;
    padding: 4px;
}

.BranchSelectList {
    text-align: left !important;
}

.SelectedRow {
    background-color: #F0F9FE;
}

.DtoGridCell {
    border-style: none;
    padding: 4px;
}

.ArbitrationSettings_CheckBox {
    top: -10px;
    position: relative;
}

.CallMonitorSettings_Col1 {
    width: 175px;
}

.DutyApprovalSettings_Col1 {
    width: 185px;
}

.GeneralSettings_Col1 {
    width: 275px;
}

.PasswordSettings_Col1 {
    width: 250px;
}

.SchedulingSettings_Col1 {
    width: 325px;
}

.PortalNotificationSettings_Col1 {
    width: 125px;
}

.RateGenerationSettings_Col1 {
    width: 250px;
}

.AbsenceGeneralSettings_Col1 {
    width: 350px;
}

.AuditCommentSettings_Col2 {
    width: 200px;
    text-align: center;
}

.AuditSettings_Col1 {
    width: 297px;
}

.EmployeePortalSettings_Col1 {
    width: 325px;
}

.DtoErrorMessage {
    padding: 0 !important;
}


.MailMergeButton {
    top: 2px;
    position: relative;
}

.AlignTop {
    vertical-align: top;
}

/* Validation
_____________________________________________*/
.ValidationError {
    position: relative;
    color: #DE3432 !important;
}

.ValidationSummary {
    color: #DE3432;
    font-size: 8pt;
    width: inherit;
}

.input-validation-error, .customError {
    border-bottom: 1px solid #DE3432 !important;
    color: #DE3432 !important;
}

.FrameworkSingleSelector.input-validation-error,
.FrameworkSelectorValuesContainer.input-validation-error,
.FrameworkFlagContainer .FrameworkFlagLabel.input-validation-error {
    border: none !important;
    color: #DE3432 !important;
}

.FrameworkSelectorButton.customError,
.FrameworkClearButton.customError {
    border: none !important;
}

select.input-validation-error, select.customError {
    color: black !important;
}

[type=button].input-validation-error, [type=button].customError {
    border: 1px solid #DE3432 !important;
}

.field-validation-error {
    color: #DE3432;
    font-size: 9pt;
    font-weight: 400 !important;
}

.field-validation-valid {
    color: #006400; /*Dark green*/
    font-size: 9pt;
    font-weight: 400 !important;
}

.qualification-inactive {
    color: #ffa500 !important;
}

/*MVC validation*/
.validation-summary-errors {
    color: #DE3432;
    font-size: 9pt;
    /*margin-top: -10px;*/
    /*margin-bottom: -15px;*/
}

.validation-summary-container {
    padding-left: 10px;
    padding-right: 10px;
}

    .validation-summary-container ul {
        list-style: none;
        margin: 0px 0px 0px -35px;
    }

        .validation-summary-container ul li:empty {
            display: none;
        }

.LabelRequired:after {
    content: '*';
}

.OverridableCheckFailure {
    color: #8D710C;
}

/*#region AjaxFileUpload Overide*/

.ajax__fileupload {
    padding: 4px;
    border: #DE3432 10px solid;
    overflow: auto;
}

.ajax__fileupload_selectFileButton, .ajax__fileupload_uploadbutton {
    width: 80px !important;
    height: 20px !important;
    font-size: 11px !important;
    cursor: pointer !important;
    font-weight: normal !important;
    color: black !important;
    border: 1px solid lightgrey !important;
    background-color: #eeeeee !important;
    padding: 1px 10px !important;
    display: inline !important;
}

    .ajax__fileupload_selectFileButton:hover {
        background-color: #F0F9FE !important;
    }

    .ajax__fileupload_selectFileButton:disabled, input[type=button][disabled=disabled] {
        background-color: grey !important;
        color: #444 !important;
        border: 1px solid grey !important;
        cursor: default !important;
        text-shadow: grey 0 0 !important;
    }

.ajax__fileupload_selectFileContainer {
    overflow: initial !important;
}

.ajax__fileupload_footer {
    height: 24px !important;
}

.ajax__fileupload_fileItemInfo {
    font-size: 8pt !important;
}

    .ajax__fileupload_fileItemInfo .pendingState {
        color: #808080 !important;
    }

.ajax__fileupload_dropzone {
    display: none;
}

/*#endregion AjaxFileUpload Overide*/


/*Duty Classes*/
.DutyOpenPost {
    color: #DE3432;
    border-left: 2px solid #DE3432;
    border-radius: 0px 5px 5px 0px;
}

.DutyArbitration {
    color: #C000C0;
}

.DutyConfirmed {
    font-weight: bold;
}

.DutyTemporary {
    font-style: italic;
}

.DutyDeleted {
    color: #C8C8C8;
    text-decoration: line-through;
}

.DutyHistoricalArbitrated {
    color: #000000;
}

.DutyCheckFailures {
    border-left: 2px solid darkorange;
    border-radius: 0px 5px 5px 0px;
}

.DutyIconGreen {
    color: #008000;
    font-size: 16px;
}

.DutyIconRed {
    color: #DE3432;
    font-size: 16px;
}

.DutyIconGrey {
    color: #585858;
    font-size: 16px;
}

.FaintIcon {
    opacity: 0.6;
}

/*------Events----------------------------------------*/

#divEventSection {
    height: calc(100% - 100px);
    overflow: auto;
}

.truncate {
    display: inline-block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.EventHeaderText {
    position: relative;
    border-top: 0.1em solid #444;
    border-bottom: 0.1em solid #444;
    text-align: center;
    margin: 10px 0;
    padding: 5px;
}

    .EventHeaderText [data-header] {
        margin: 0 10px;
    }

        .EventHeaderText [data-header], .EventHeaderText [data-header] a, .EventHeaderText [data-header] span {
            color: #1B345A;
            font-size: 11pt;
            display: inline-block;
        }

#divEventInfo {
    display: none;
    margin: 15px 5px 5px 5px;
}

    #divEventInfo label {
        margin-right: 20px;
    }


/*---------------------------------CSS Spinner----------------------------*/

/*LR> Ajax Spinner ensure that the Div has position:relative*/
.mustBeRelative {
    position: relative !important;
}

@keyframes spinner {
    to {
        transform: rotate(360deg);
    }
}

@-webkit-keyframes spinner {
    to {
        -webkit-transform: rotate(360deg);
    }
}

.spinner {
    min-width: 48px;
    min-height: 48px;
}

    .spinner:hover {
        cursor: wait;
    }

    .spinner:before {
        content: 'Loading�';
        position: absolute;
        top: 50%;
        left: 50%;
        width: 32px;
        height: 32px;
        margin-top: -30px;
        margin-left: -20px;
    }

    .spinner:not(:required):before {
        content: '';
        border-radius: 50%;
        border-top: 4px solid #555;
        border-right: 4px solid #bbb;
        border-bottom: 4px solid #bbb;
        border-left: 4px solid #bbb;
        animation: spinner .6s linear infinite;
        -webkit-animation: spinner .6s linear infinite;
        opacity: 1;
        z-index: 5;
    }

.spinnerOverlay {
    background: #fff;
    height: 100%;
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0.6;
}


/*---------------------------------Input File----------------------------*/

/*PD> Replaces standard input file*/

.inputfile {
    position: fixed;
    right: 100%;
    bottom: 100%;
}

    .inputfile + label {
        border: 1px solid;
        display: inline-block;
        cursor: pointer;
        opacity: 0.7;
        font-size: 1em;
        margin: 0.3em;
        padding: 0.2em 1em;
        width: 130px;
        overflow: hidden;
        text-overflow: ellipsis;
    }

        .inputfile:focus + label,
        .inputfile.has-focus + label,
        .inputfile + label:hover {
            opacity: 1;
        }






#SelectedEntityNames {
    display: inline-block;
    vertical-align: top;
}

    #SelectedEntityNames td:nth-child(2) {
        width: 30px;
    }

.m_Dialog_Table .DataGrid td:nth-child(1) span.icon-checkmark {
    display: none;
}


.DataGrid tr.DataRowSelected td:nth-child(1) span.icon-checkmark {
    display: inline-block;
}

.DataRowSelected {
    background-color: #d3d3d3 !important;
}

.HiddenCustomer, .HiddenSiteGroup, .HiddenSite, .HiddenEntity {
    display: none;
}

.ResultListSelectedEntity {
    font-weight: bold;
}

div.cke_textarea_inline {
    border: 1px solid #ccc;
    border-left: none;
}

.EntityNameContainer {
    padding-left: 7px;
    font-size: 14pt;
    color: #585858;
}

.TooltipList {
    list-style: none;
    padding-left: 5px;
}

.Time {
    font-family: "Segoe UI","Trebuchet MS",Candara,Tahoma, Verdana, Arial,sans-serif;
}

.ActionIcon {
    cursor: pointer;
    text-decoration: none;
    font-size: 16px;
    color: #000;
    opacity: 0.6;
}

.TelephoneTableCell {
    color: -webkit-link;
    cursor: pointer;
    text-decoration: underline;
}

.Url {
    color: blue;
    text-decoration: underline;
}

.TGTable {
    display: table;
    width: auto;
    border-spacing: 5px;
}

.TGTableRow {
    display: table-row;
    width: auto;
    clear: both;
}

.TGTableCell {
    display: table-cell;
    padding-left: 5px;
    padding-right: 5px;
}

.ContactLink {
    color: blue !important;
    text-decoration: underline !important;
}

.TableWrap > tbody > tr > th,
.TableWrap > tbody > tr > td {
    white-space: normal;
}

.FormInstructions {
    opacity: 0.6;
    font-style: italic;
    font-size: 8pt;
}

.pull-right {
    float: right;
}

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

.UserDescription {
    text-align: right;
    vertical-align: top;
    position: relative;
    font-size: 9pt;
    width: 120px;
    color: White;
    line-height: 35px;
    margin-right: 4px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    float: left;
}

.EmployeeGeneralDocuments_Col1 {
    width: 189px;
}