:root {
    --primary: #4F5050;
    --primary-text: var(--primary);
    --warning: #ffc107;
    --secondary: #6c757d;
    --success: #28a745;
    --danger: #dc3545;
    --info: #17a2b8;
    --dark: #343a40;
    --light: #f8f9fa;
    --cancel: #cccccc;
    --background: #f2f2f2;
    --primary-hover: #97daf8;
    --primary-border: #00b6e1;
    --data-div-background: #f7f7f7;
    --alt-row-background: #f2f2f2;
    --alt-row-sorted-background: #e9e9e9;
    --input-background: #ffffff;
    --arrow-background: #f9f9f9;
    --progress-background: #f9f9f9;
    --edit-row-background: #cdcdcd;
    --filter-background: #e1e1e1;
    --frame-background: #efefef;
    --splitter-background: #cdcdcd;
    --text: #000000;
    --text-2: #333333;
    --button-text: #ffffff;
    --ts-button-text: var(--primary);
    --input-text: #404040;
    --command-text: #999999;
    --command-text-hover: #555555;
    --grid-text: #767676;
    --footer-text: #666666;
    --menu-item: #ffffff;
    --menu-item-hover: rgba(151, 218, 248, 0.3);
    --menu-item-expanded: #10b5e4;
    --page-hover: #e8e8e8;
    --page-active: #25a0da;
    --button-colour: #23b7e5;
    --button-background: #ffffff;
    --button-background-b: #97DAF8;
    --dropdown-border: #cdcdcd;
    --primary-rgba: rgba(151, 218, 248, 0.3);
    --primary-rgba-b: rgba(151, 218, 248, 1);
    --primary-rgba-track: rgba(15, 15, 15, 0.1);
    --primary-blue: #3cc4e3;
    --tabstripborder: #e5e5e5;
    --filterpanel-border: #e5e5e5;
    --wizard-tab-background: #ffffff;
    --wizard-signalr-text: #222;
    --primary-border: #a9a9a9;
}

/*************** DARK MODE ***************/
body.dark-mode {
    --primary: #4f5050;
    --primary-blue: #4f5050;
    --primary-text: var(--text);
    --cancel: #999999;
    --background: #222222;
    --primary-border: #666;
    --data-div-background: #1f1f1f;
    --input-background: #404040;
    --alt-row-background: #373737;
    --alt-row-sorted-background: var(--alt-row-background);
    --arrow-background: var(--input-background);
    --progress-background: var(--input-background);
    --edit-row-background: #404040;
    --filter-background: #282828;
    --frame-background: #232323;
    --splitter-background: var(--primary);
    --text: #f7f7f7;
    --text-2: #f2f2f2;
    --input-text: #eeeeee;
    --command-text: #97daf8;
    --command-text-hover: #d2d2d2;
    --grid-text: #f2f2f2;
    --footer-text: #efefef;
    --menu-item: #2e2e2e;
    --menu-item-hover: #000000;
    --menu-item-expanded: #242424;
    --page-hover: var(--menu-item-hover);
    --dropdown-border: var(--page-hover);
    --textarea: #2b2b2b;
    color: white;
    --tabstripborder: #404040;
    --filterpanel-border: var(--alt-row-background);
    --wizard-tab-background: #171717;
    --wizard-signalr-text: var(--text-2);
}

body.dark-mode ::-webkit-scrollbar {
    width: 8px;
}

    body.dark-mode ::-webkit-scrollbar-thumb,
    body.dark-mode ::-webkit-scrollbar-track {
        border-radius: 10px;
        width: 8px;
    }

body.dark-mode ::-webkit-scrollbar-thumb {
    background: linear-gradient(45deg, #4d4d4d, #4d4d4d);
}

body.dark-mode ::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(45deg, #999999, #999999);
}

body.dark-mode ::-webkit-scrollbar-track {
    background: linear-gradient(45deg, #2e2e2e, #2e2e2e);
}

body.dark-mode ::-webkit-scrollbar-button {
    display: none;
}

body.dark-mode ul.rmVertical.rmGroup.rmLevel2::-webkit-scrollbar {
    color: var(--background);
}

body.dark-mode img[src="../Images/transparent.png"] {
    opacity: 0.0;
}

body.dark-mode .ScheduleHeader .DimCell{
    opacity: 0.7;
}


body.dark-mode .SchTimeRowContent .ScheduleHeader td, 
body.dark-mode .ScheduleHeader td{
        background-color: var(--primary);
        background-image: unset;
}

body.dark-mode .SchContainer .SchTimeRowHeader,
body.dark-mode .SchFooterRowContent .FooterTable td,
body.dark-mode .k-grid-header th.k-header {
    /* background-color: var(--frame-background); */
    background-color: var(--primary);
    background-image: unset;
}

body.dark-mode .RadSplitter_T2W input.rspCollapseBarHorizontalExpand,
body.dark-mode .RadSplitter_T2W input.rspCollapseBarHorizontalCollapse {
    background-color: unset;
}

body.dark-mode .listLayout, body.dark-mode .rtsLevel {
    background-color: var(--menu-item-hover);
}

body.dark-mode .descriptionSpan{
    color: black;
}

body.dark-mode input[type="text"]::placeholder {
    color: var(--text);
}

body.dark-mode .rbClearButton .rbText {
    color: var(--command-text);
}

body.dark-mode .validationPanel .error-close {
    color: var(--text);
}

body.dark-mode .validationPanel ul li {
    font-weight: 700;
}

    body.dark-mode input[type="image"], body.dark-mode .rgPagePrev, body.dark-mode .rgPageNext,
    body.dark-mode .rgPageFirst, body.dark-mode .rgPageLast, body.dark-mode .rcCalPopup, body.dark-mode div.rmDropMenuIcon,
    body.dark-mode .RadInput_T2W a, body.dark-mode .RadComboBox_T2W .rcbArrowCell a,
    body.dark-mode .rmMenuIcon, body.dark-mode .wizWand, body.dark-mode .rtPlus,
    body.dark-mode .rddtIcon, body.dark-mode .rtMinus, body.dark-mode .RadMenu a:not(.exportMenuItem) img,
    body.dark-mode .RadMenu ::before, body.dark-mode .img-retailer-approval,
    body.dark-mode .SchPageToolBar img:not([src="../Images/schedule-icon-daily.png"]),
    body.dark-mode .RadColorPicker_T2W .rcpIcon a, body.dark-mode .RadSplitter_T2W input.rspCollapseBarHorizontalExpand,
    body.dark-mode .RadSplitter_T2W input.rspCollapseBarHorizontalCollapse, body.dark-mode .rcTimePopup,
    body.dark-mode .sgce, body.dark-mode .rgFilter, body.dark-mode .rgMasterTable img[src="../Images/schedule-nav-allocation.png"],
    body.dark-mode .rgMasterTable img[src="../Images/schedule-nav-requirement.png"],
    body.dark-mode .RadMultiPage_T2W .userDDSearch,
    body.dark-mode span.RadButton_T2W.RadButton span.rbSplitRight {
        filter: invert(100%);
    }

        body.dark-mode .item-image img, body.dark-mode .radImage, body.dark-mode fr .rmLeftImage,
        body.dark-mode #imgUser, body.dark-mode .rtsImg, body.dark-mode .default-action, body.dark-mode #cog img,
        body.dark-mode .pinImage, body.dark-mode .rmLink .exportMenuItem img, body.dark-mode .rmDropMenuIcon:hover,
        body.dark-mode img[src="../Images/Delete.png"], body.dark-mode input[type="image"][src="../Images/Delete.png"],
        body.dark-mode .DvContainer .SchDayViewExpand, body.dark-mode .DvContainer .SchDayViewCollaps,
        body.dark-mode .tabStripSearch input[type="image"], body.dark-mode .SchGroupHeader input[type="image"],
        body.dark-mode img[src="../Images/Checked.png"], body.dark-mode img[src="../Images/schedule-icon-sheet.png"],
        body.dark-mode input[type="image"][src="../Images/schedule-icon-publish.png"],
        body.dark-mode input[type="image"][src="../Images/pin_on.png"], body.dark-mode img[src="../Images/reapplytraining.png"],
        body.dark-mode img[src="../Images/Delete3.png"], body.dark-mode img[src="../images/delete3.png"],
        body.dark-mode img[src="../Images/scorecard_launch.png"], body.dark-mode img[src="../Images/scorecard_review.png"],
        body.dark-mode img[src="../Images/scorecard_results.png"], body.dark-mode img[src="../Images/icon_reject_24.png"],
        body.dark-mode img[src="../Images/ResetLeave_32.png"], body.dark-mode input[src="../Images/ResetLeave_32.png"],
        body.dark-mode img[src="../images/export_excel.png"], body.dark-mode img[src="../images/export_csv.png"],
        body.dark-mode img[src="../images/export_word.png"], body.dark-mode img[src="../images/export_pdf.png"],
        body.dark-mode input[src="../Images/icon_approve.png"], body.dark-mode img[src="../Images/schedule-icon-requirement-sheet.png"],
        body.dark-mode img[src="../Images/icon_approve_24.png"], body.dark-mode input[src="../Images/schedule-icon-working-delete.png"]{
            filter: none !important;
        }

body.dark-mode .k-input-button, body.dark-mode .k-input-button.k-button, body.dark-mode .dayRow,
body.dark-mode .rbText, body.dark-mode span, body.dark-mode .k-grid-content,
body.dark-mode .ShiftTable span, body.dark-mode .k-grid-header th.k-header{
    color: white;
}

body.dark-mode .clear-image-button span,
body.dark-mode .DivActivity span,
body.dark-mode .NameSection span{
    color: unset;
}

body.dark-mode .RadWindow .rwPopupButton span {
    color: var(--button-text);
    background-color: var(--primary);
}

body.dark-mode .k-alt, body.dark-mode .dayRow:hover, body.dark-mode .k-master-row:hover, body.dark-mode .rtTop, body.dark-mode .rtMid, body.dark-mode .rddtCheckAll, body.dark-mode .rddtHeader, body.dark-mode .rtUL, body.dark-mode .rtBot {
    background-color: #292929 !important;
}

body.dark-mode .SchSpanRowContent {
    background-color: #4d4d4d !important;
}

body.dark-mode #shiftMenu, body.dark-mode #tsaScheduleMenu, body.dark-mode #userMenu, body.dark-mode [role=rowgroup], body.dark-mode .k-item .k-menu-item .k-first .k-hover {
    background-color: var(--alt-row-background) !important;
    color: white;
}

body.dark-mode #userMenu, body.dark-mode #shiftMenu {
    border: unset;
}

body.dark-mode textarea, body.dark-mode .k-grid .k-pager-wrap, body.dark-mode .rddtInner {
    background-color: var(--textarea);
}

body.dark-mode .reContentCell.reNoBorder{
    background-color:var(--input-background);
}

body.dark-mode .k-multiselect.k-input.RadListBox.RadListBox_T2W.k-input-solid.k-input-md.k-rounded-md{
    background-color: var(--input-background);
}

/*body.dark-mode .k-chip.k-chip-md.k-rounded-md.k-chip-solid.k-chip-solid-base{
    border: 1px solid var(--input-text);
    border-radius:7px;
}*/

body.dark-mode .k-list .k-list-content {
    background-color: var(--input-background);
}

body.dark-mode .k-list ul {
    background-color: var(--input-background);
}

body.dark-mode .k-list .k-list-item {
    background: var(--input-background);
}

body.dark-mode .riTextBox.riDisabled {
        background-color: var(--input-background) !important;
}

body.dark-mode .k-list .k-list-content .k-list-item:hover {
    background-color: var(--menu-item-hover);
}

body.dark-mode .k-no-data{
    background-color:var(--input-background);
}

body.dark-mode .k-link:hover {
    background-color: var(--menu-item-hover) !important;
}

body.dark-mode .k-input-inner.k-readonly{
    color:var(--input-text);
}

body.dark-mode .k-input-values.k-selection-multiple.k-chip-list.k-chip-list-md{
    color:var(--input-text);
}

body.dark-mode .k-link.k-state-active {
    background-color: var(--menu-item-hover) !important;
}
    body.dark-mode .riTextBox.riDisabled {
        background-color: var(--input-background) !important;
    }

body.dark-mode .wizard-step-description{
    color: var(--text);
}

body.dark-mode .rwzDisabled > rwzLink{
    background-color: #171717 !important;
}

body.dark-mode .clocking_authoriseTextBox{
    color: var(--dark) !important;
}

/********************************************/
/* WV: Added not functions to preserver report formatting */
* {
    /*font-family: "Source Sans Pro",sans-serif;*/
    font-family: "Roboto",sans-serif;
}

pre.ace_editor * {
    font: 15px/normal 'Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', 'source-code-pro', monospace !important;
}

div.trv-report-page > *, .RadForm.rfdTextbox input[type="text"].rfdDecorated, .RadForm.rfdTextbox input[type="password"].rfdDecorated, .RadForm.rfdTextarea textarea, .RadForm.rfdTextarea textarea[disabled].rfdDecorated:hover, .RadForm.rfdTextbox input[disabled][type="text"].rfdDecorated:hover, .RadForm.rfdTextbox input[disabled][type="password"].rfdDecorated:hover, .RadForm.rfdLabel label, .RadForm .rfdDecorated, .RadForm .rfdCheckboxChecked, .RadForm .rfdInputDisabled.rfdCheckboxChecked:hover, .RadForm .rfdCheckboxUnchecked, .RadForm .rfdInputDisabled.rfdCheckboxUnchecked:hover, .RadForm.rfdLabel .rfdAspLabel, .RadForm .rfdRadioUnchecked, .RadForm .rfdInputDisabled.rfdRadioUnchecked:hover, .RadForm .rfdRadioUnchecked:hover, .RadForm .rfdRadioChecked, .RadForm .rfdInputDisabled.rfdRadioChecked:hover, .RadForm .rfdRadioChecked:hover, .RadForm .riTextBox, .RadForm .rfdValidationSummaryControl, .RadForm .rfdLoginControl, .RadForm.rfdFieldset legend {
    font-family: "Roboto",sans-serif !important;
}

/*
    Rapid Activity
-------------------------------------------------------------------------- */
.non-contextual-rapid-activity-options td:first-child {
    text-align: right;
}

    .non-contextual-rapid-activity-options td:first-child label {
        margin-right: 2px !important;
    }

.non-contextual-rapid-activity-options .RadDropDownList.RadDropDownList_T2W span,
.rddlItem {
    color: #404040;
}

.RadDropDownList.RadDropDownList_T2W .rddlInner {
    padding: 4px 1px;
}

/*
*:not(.trv-page-container):not(.rnvMore):not(.k-icon)
:not(.rtbImage):not(.p-icon):not(.radIcon):not(.t-icon):not(.rssIcon):not(.rmLeftImage):not(.rlbButtonIcon)
{
    font-family: "Source Sans Pro",sans-serif !important;
}
*/
*:not(div) {
    font-weight: 300;
}

.RadWindow .rwDialogText {
    font-family: "Roboto",sans-serif !important;
    font-weight: 300;
    color: var(--primary-text);
}

*:focus {
    outline: none;
}


html, form {
    margin: 0;
    padding: 0;
}

    html.htmlCss {
        width: 100%;
        height: 100%;
    }

body, .popup-body {
    margin: 0;
    border: 0;
    padding: 0;
    height: 100%;
    max-height: 100%;
    min-height: 100%;
    /*all except IE6*/
    /*
    overflow:scroll;
	overflow-y: scroll;
*/
    overflow: hidden;
    background-color: var(--background);
}

.RadSplitter .rspSlideContent {
    background-color: var(--background) !important;
}

/* Need scrolling on the radEditor IFrame content!!! */
body[contenteditable=true] {
    overflow: scroll;
}

/* for internet explorer */
* html body {
    padding: 120px 0 70px;
}

a img {
    /* fix IE link image border issues */
    border: none;
}

/*--------------------------------------------------------------*/
/*	===DRY Classes===
/*--------------------------------------------------------------*/
.fl {
    float: left;
}

.fr {
    float: right;
}

.alignleft {
    text-align: left;
}

.alignright {
    text-align: right;
}

/*--------------------------------------------------------------*/
/*	===Headings===
/*--------------------------------------------------------------*/
h1, h2, h3, h4, h5, h6 {
    margin: .5em 0px 1.5em 0px;
    font-weight: 300;
    font-family: "open sans",sans-serif;
}

h1 {
    font-size: 26px;
}

h2 {
    font-size: 21px;
}

h3 {
    font-size: 15px;
    text-align: center;
    background-color: var(--input-background);
    padding: 15px;
}

h4, h5, h6 {
    font-size: 1em;
}

/*--------------------------------------------------------------*/
/*	===Buttons===
/*--------------------------------------------------------------*/


/*active color #4F5050 */


.rbSkinnedButton{
    padding:0 !important;
}

.RadButton_T2W.cancel-button:active .rbDecorated {
    background-color: #FFFFFF !important;
    transform: translate(-0.3px,0) !important;
    /*border: 1px solid #4F5050 !important;*/
    /*width:70px !important;*/
}

.RadButton_T2W.command-button:active .rbDecorated {
    background-color: #FFFFFF !important;
}
   
.RadButton.RadButton_T2W.rbSkinnedButton.command-button > .rbSplitRight:active {
    /*background-color: #97DAF8 !important;*/
    background-color: #FFFFFF !important;
}

.RadButton.RadButton_T2W.rbSkinnedButton.save-button > .rbSplitRight:active {
    background-color: #97DAF8 !important;
}

.RadButton.RadButton_T2W.rbSkinnedButton.save-button:active .rbDecorated {
    background-color: #97DAF8 !important;
    border: 1px solid #97DAF8 !important;
}

/*end active color*/


.rbSkinnedButton{
    height:44px !important;
    min-width:100px;
}

input.action-button.rbHovered, button.action-button.rbHovered, span.action-button.rbHovered, .RadButton.RadButton_T2W.action-button.rbHovered {
    width: 80px !important;
}

span.RadButton_T2W.RadButton span.rbSplitRight,
span.RadButton_T2W.RadButton span.rbSplitLeft,
span.RadButton_T2W.RadButton span.rbSplitRight.rbHovered,
span.RadButton_T2W.RadButton span.rbSplitLeft.rbHovered {
    color: var(--primary) !important;
    background-position: -11px -53px !important;
    /*background-position: 0 !important;
    background-repeat:no-repeat repeat;*/
}

#ctl00_ctl00_cphContent_cphContent_btnRetrieve_btn_btnRetrieve {
    transform:translate(100px,-25px);
    background: var(--button-background-b) !important;
    border: 1px solid var(--button-background-b) !important;
}

#ctl00_ctl00_cphContent_cphContent_frmCriteria_btnRetrieve_btn_btnRetrieve {
    transform: translateY(-15px);
    background: var(--button-background-b) !important;
    border: 1px solid var(--button-background-b) !important;
}

#ctl00_ctl00_cphContent_cphContent_btnRetrieve_btn_btnRetrieve:active, #ctl00_ctl00_cphContent_cphContent_frmCriteria_btnRetrieve_btn_btnRetrieve:active {
    background: #97DAF8 !important;
}

    #ctl00_ctl00_cphContent_cphContent_frmEdit_btnReset span.rbSplitRight {
        background-position: -11px -53px !important;
    }

span.RadButton_T2W .rbDecorated.rbSecondary {
    padding-right: 41px;
}


.RadButton {
    font-family: 'Roboto', sans-serif !important;
}

.RadButton.RadButton_T2W {
    line-height: 27px !important;
    margin-right: 0;
}


/*span.RadButton_T2W .rbDecorated,*/
.save-button-panel .RadButton.RadButton_T2W.cancel-button,
.save-button-panel .RadButton.RadButton_T2W.save-button,
.RadButton.RadButton_T2W.approve-button,
.RadButton.RadButton_T2W.reject-button,
.save-button-panel .RadButton.RadButton_T2W.return-button {
    min-width: 100px !important;
    height: 44px !important;
    padding: 5px 16px;
    color: #4F5050 !important;
}

span.RadButton_T2W.action-button .rbDecorated {
    font-size: 14px !important;    
    height: 44px !important;
    padding: 5px 10px;    
}

.rbSkinnedButton.rbHovered .rbDecorated {
    background-position: 0 0 !important;    
}

.RadButton_T2W.save-button, .RadButton_T2W.cancel-button, span.RadButton_T2W .rbDecorated {
    font-size: 16px !important;
}

    .RadButton_T2W.save-button .rbDecorated {
        color: var(--primary);
    }

span.RadButton_T2W.rbSkinnedButton .rbDecorated {
    height: 100% !important;
}

.RadButton_T2W.cancel-button .rbDecorated {
    color: var(--primary) !important;
}

input.success-button, button.success-button, span.success-button {
    background: #27C24C !important;
}

input.save-button, button.save-button, span.save-button, .prompt-confirm-button {
    background: var(--button-background-b) !important;
    border: 1px solid var(--button-background-b) !important;
    float: right;
}

input.action-button, button.action-button, span.action-button, .RadButton.RadButton_T2W.action-button {
    background: var(--button-background-b) !important;
    border: 1px solid var(--button-background-b) !important;
    float: none !important;
    height: 35px !important;
    width: 80px !important;
}


input.command-button, button.command-button, span.command-button,
input.cancel-button, button.cancel-button, span.cancel-button {
    margin: 0 4px;
}

input.command-button, button.command-button, span.command-button {
    background: var(--input-background) !important;
    border: 1px solid var(--button-background-b) !important;
    height: 35px;   
}

input.cancel-button, button.cancel-button, span.cancel-button {
    background: var(--button-background) !important;
    border: 1px solid var(--button-background-b) !important;
    height: 44px;
    color: var(--primary) !important;
}

.prompt-cancel-button {
    background: var(--button-background) !important;
    border: 1px solid #97DAF8 !important;
    color: var(--primary) !important;
    font-family: "Roboto", sans-serif !important;
}


input.return-button, button.return-button, span.return-button {
    background: var(--button-background-b) !important;
    border: 1px solid var(--button-background-b) !important;
    height: 30px;
}

input.add-button, button.add-button, span.add-button {
    background: purple !important;
}

input.approve-button, button.approve-button, span.approve-button {
    background: #8cc53f !important;
    float: right;
    height: 30px;
}

input.reject-button, button.reject-button, span.reject-button {
    background: #f2695e !important;
    float: right;
    height: 30px;
}

input.button, button.button, span.button {
    background: transparent !important;
}

.light {
    color: #fff !important;
}

.dark {
    color: #404040 !important;
}

.RadButton.RadButton_T2W.rbLinkButton.backToList {
    color: var(--text);
    text-align: center;
    font-weight: 200;
    background-color: transparent;
    border: none;
    /*
      JBaker - this Z-index is conflicting with the "auto" z-indez of the
      rad menu (see .page-menu-container .RadMenu) and causing the back button
      to appear above the user settings drop down menu....
  z-index: 99;
  */
    float: right;
    vertical-align: top; /* WV - Fix alignment of Back to List button */
    top: 3px; /*        as it wasn't displayed on most pages. */
}

.Radgrid_T2W .rgWrap {
    line-height: 29px !important;
}




/*dropdown input button*/

/*.RadMenu_Context.RadMenu.splitButton ul.rmGroup, .RadMenu_Context.RadMenu_T2W.splitButton ul.rmGroup {
    background: #FFFFFF !important;
    margin-top: 1px;
    padding: 7px;
    font-weight: 300;
    font-size: 15px;
    box-shadow: 4px 4px 4px rgb(79,80,80,0.25);
}*/
/*.RadMenu_Context.RadMenu.splitButton ul.rmGroup, .RadMenu_Context.RadMenu_T2W.splitButton ul.rmGroup {
    background: #FFFFFF !important;
    box-shadow: 4px #4F5050 !important;
    font-weight: 300;
    font-size: 14px;
}*/
/*end dropdown button*/
/*--------------------------------------------------------------*/
/*	===Login Screen===
/*--------------------------------------------------------------*/
/* Working method */
.tinted-image {
    /*
	background:
    linear-gradient(rgba(10,31,43,0.9),rgba(10,31,43,0.9)),url(../Images/login-bg.jpg);
	*/
    background-color: #19232e;
    background: url("../Images/logon/nimbus_login_background_image_small.jpg");
    background-size: cover;
    background-repeat: no-repeat;
}

.logonTableMain {
    height: 100%;
    width: 100%;
    border: 0;
    border-spacing: 0;
    border-collapse: separate;
}

    .logonTableMain td {
        padding: 0;
        vertical-align: middle;
    }



    .logonTableMain img {
        border-radius: 3px;
    }

.logonTableLoginTable {
    width: 325px;
    border: 0;
    border-spacing: 0;
    border-collapse: separate;
}

    .logonTableLoginTable td {
        padding: 0;
    }

.logonTableLoginBox {
    background: none;
    color: #a8a9ac;
    height: 97px;
    width: 350px;
    padding: 10px;
}

    .logonTableLoginBox td {
        padding: 10px;
    }

        .logonTableLoginBox td.rememberPassword {
            font-size: 13px;
            padding: 3px 10px;
        }

.logonTableLoginBoxTextBox {
    background: none repeat scroll 0 0 transparent;
    padding: 10px !important;
    width: 100%;
    border: none;
    font-size: 1em;
    font-weight: lighter;
    color: #f4f4f4;
}

/* Form Inputs */
input.logonTableLoginBoxTextBox {
    border-bottom: 1px solid #fff;
}

    input.logonTableLoginBoxTextBox::-webkit-input-placeholder {
        color: #fff;
    }

    input.logonTableLoginBoxTextBox:-moz-placeholder {
        /* Firefox 18- */
        color: #fff;
    }

    input.logonTableLoginBoxTextBox::-moz-placeholder {
        /* Firefox 19+ */
        color: #fff;
    }

    input.logonTableLoginBoxTextBox:-ms-input-placeholder {
        color: #fff;
    }

    input.logonTableLoginBoxTextBox:focus {
        border-bottom: 1px solid #3DC4E4;
    }

.rememberPassword label {
    color: #ffffff;
    opacity: 0.5;
    font-size: 13px;
    font-weight: 400;
}

/* Error Messages */

/*  #logonErrorRow{
            padding:10px;
            width: 95%;
            background-color:#DB3E1F;
            opacity:0.5;          
            color: #4F5050; 
            font-family: 'Roboto', sans-serif;
            font-size: 14px;
            font-weight: 300;    
            position:relative;
            z-index:1;
  }*/

.logonTableErrorCell {
    border: 0 none;
    color: #fff;
    border-radius: 3px;
    text-align: center;
    background: RGBA(202,6,18,0.75);
    display: inline-block;
    width: 100%;
    margin-top: 50px;
}

.logonTableErrorText {
    color: var(--primary);
    padding: 5px;
}

.logonTableErrorMore {
    color: var(--primary);
    padding: 5px;
    text-align: left;
    font-size: 12px;
    float: left;
}

.logonTableErrorForgot {
    color: var(--primary);
    padding: 5px;
    text-align: right;
    font-size: 12px;
    float: right;
}



/* Login Button */
.login {
    width: 100%;
    height: 54px;
}

.RadButton .rbDecorated {
    width: 100% !important;
    /* margin: 0; */
    padding: 0 10px;
    border: 0;
    outline: 0;
    font: inherit;
    color: inherit;
    text-align: center;
    overflow: visible;
    -webkit-border-radius: 0;
    -webkit-appearance: none;
}


.rmVertical.rmGroup .rmItem .rmLink:hover {
    background-color: rgba(151, 218, 248, 0.3) !important;
}


/*.login .rbDecorated {*/
span.RadButton_T2W.rbSkinnedButton.login .rbDecorated {
    /* border-bottom: 2px solid #3dc4e4 !important; */
    display: block;
    /*background-color: rgba(151, 218, 248, 0.3) !important;*/
    background-color: #97DAF8 !important;
    width: 90% !important;
    margin: 20px auto !important;
    color: #2f3030 !important;
    font-size: 19px !important;
    font-weight: 600 !important;
    height: 54px !important;
    transition: all 0.4s ease-in-out !important;
    /* margin: auto 22% !important; */
    /* width: 50% !important; */
}

    /*.login .rbDecorated:hover {*/
span.RadButton_T2W.rbSkinnedButton.login .rbDecorated:hover{
    transform: translateY(-2px) !important;
    box-shadow: 3px 3px 9px #9c9fa1 !important;
    background-color: #aadff7 !important;
}

input [type="Submit"] {
    font-size: 29px !important;
    font-weight: lighter;
    height: 50px;
    border-bottom: 1px solid #3DC4E4;
}

/*--------------------------------------------------------------*/
/*	===Layout Containers===
/*--------------------------------------------------------------*/
* html .container {
    height: 100%;
    width: 100%;
}

.container {
    overflow: visible;
    height: 100%;
    width: 100%;
}

* html .page-container {
    height: 100%;
}

.page-container {
    position: relative;
    height: 100%;
    overflow: auto;
    background: #fff;
    text-align: center;
    padding-top: 10px;
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 40px;
}

.page-header-container {
    background: none repeat scroll 0 0 var(--background);
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
}


.page-title-container {
    background: none repeat scroll 0 0 #C00;
    left: 0;
    right: 0;
    top: 0;
}



.page-body-container {
    background: none repeat scroll 0 0 #f0f3f4;
    background-color: var(--background);
    bottom: 40px;
    left: 0;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 10px 12px 4px 12px;
    position: absolute;
    right: 0;
    top: 110px !important;
}

.page-body-container-modal-form {
    background-color: var(--background);
}

/*
.page-body-container
{
	background:none repeat scroll 0 0 #f0f3f4;
	bottom:auto;
	left:auto;
	padding:24px;
	right:auto;
	top:auto;
}
*/

* html .page-footer-container {
    height: 40px;
    overflow: hidden;
}

.page-footer-container {
    background: none repeat-x scroll 0 0 #4F5050;
    bottom: 0;
    color: #FFFFFF;
    height: 40px;
    left: 0;
    overflow: auto;
    position: fixed;
    text-align: center;
    width: 100%;
    color: #FFF;
    padding-left: -20px;
    font-size: 14px;
    overflow-y: hidden;
}

* html .page-content-container {
    height: 100%;
    width: 100%;
}

.page-content-container {
    overflow: hidden;
    position: relative;
    height: 100%;
    box-sizing: border-box;
}

* html .page-list-container {
    height: 100%;
}

.page-list-container {
    overflow: hidden;
    position: relative;
    height: 100%;
}

.wizard-step-content {
    overflow: auto;
    height: 100%;
    width: 100%;
}

.page-list-container-popup {
    position: absolute;
    height: auto;
    bottom: 0px;
    top: 0px;
    left: 0px;
    right: 0px;
}

* html .page-edit-container {
    height: 100%;
}

.page-edit-container {
    overflow-x: hidden;
    overflow-y: hidden;
    position: relative;
    height: 100%;
}

.page-edit-container-popup {
    position: absolute;
    height: auto;
    bottom: 0px;
    top: 0px;
    left: 0px;
    right: 0px;   
    overflow: scroll;
}

.popup-body-container-toppad {
    height: 18px;
    background-color: var(--input-background);
    display: block;
}

.popup-body-container {
    display: block;
    position: absolute;
    height: auto;
    bottom: 0px;
    top: 0px;
    left: 0px;
    right: 0px;
}

.editform-content-container {
    overflow: auto;
    position: absolute;
    top: 40px;
    bottom: 0;
    left: 0;
    right: 0;
    /*background-color: var(--background);*/
}

.scrollfilled-content-container {
    overflow: auto;
    position: absolute;
    top: 0px;
    bottom: 0;
    left: 0;
    right: 0;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-right: 16px;
    /*background-color: var(--background);*/
}

/* Don't think this one is required anywhere.... */
.editform-content {
    overflow: auto;
    position: absolute;
    top: 0px;
    bottom: 0;
    left: 0;
    right: 0;
    padding-top: 10px;
    padding-bottom: 10px;
}

.tabstrip-content-container {
    /*overflow:auto;*/
    position: absolute;
    top: 43px;
    bottom: 0;
    width: 100%;
}

/*
.RadTabStrip.NotificationTabStrip {
  top: -6px;
    position: relative;
}
*/

.tabstrip-content-container-popup {
    display: block;
    position: absolute;
    height: auto;
    bottom: 0px;
    top: 50px;
    left: 0px;
    right: 0px;
    /* JB - scroll bars on normal edit screens... */
    overflow: auto;
}

/* JB - next two fix the Compose button location */
.NotificationTabStrip span.add-button {
    position: relative;
    /* top:-40px; WV - This caused the Compose button to display above tabstrip and behind breadcrumb in Notification List. */
    height: 40px;
}

    .NotificationTabStrip span.add-button .rbDecorated {
        height: 40px !important;
    }

.tabstrip-content-substrip {
    /*overflow:auto;*/
    position: absolute;
    /* JB = modified to match lower padding on user leave tab */
    top: 0px; /* WV = Modified to align with top of grid User Employment * Leave tabs */
    left: 5px;
    bottom: 0px;
    width: 140px;
}

    /* JB - fixed width of left side sub tab strip... */
    .tabstrip-content-substrip > .RadTabStripVertical, .tabstrip-content-substrip > .RadTabStripVertical > .rtsLevel, .tabstrip-content-substrip > .RadTabStripVertical > .rtsLevel > .rtsUL {
        width: 140px;
    }

.tabstrip-content-subcontainer {
    overflow: auto;
    position: absolute;
    top: 0px;
    /* JB = modified to match lower padding on user leave tab */
    /* WV = Modified to equal left padding and width on .tabstrip-content-substrip (5 + 140 px) + 3px Margin */
    left: 148px;
    bottom: 0px;
    right: 0px;
}


    .tabstrip-content-subcontainer.tab-strip-wide {
        left: 235px;
    }

.user-detail-read {
    background-color: var(--background);
}

.user-detail-update {
    background-color: var(--background);
}

.popup-content-container {
    padding: 1em;
    display: block;
    position: absolute;
    height: auto;
    bottom: 0px;
    top: 0px;
    left: 0px;
    right: 0px;
}

table {
    display: table;
    border-collapse: separate;
    border-spacing: 0px !important;
    border-color: gray;
    /*
  JB - not sure what this is for!!!
      certainly shouldn't be standard on all tables!!!
  white-space: nowrap;	
  */
}

tr.rwFooterRow {
    background-color: var(--input-background);
}

/*--------------------------------------------------------------*/
/*	===Top Bar / Navigation===
/*--------------------------------------------------------------*/
.page-menu-container .main-navigation .rbImageButton, .page-menu-container .profile-navigation .rbImageButton {
    padding: 12px;
    background-repeat: no-repeat;
    background-position: center;
}

img.profile-navigation {
    border-radius: 50%;
    margin: 7px;
}

.page-menu-container span {
    font-weight: 100;
    font-size: 15px;
    color: var(--button-text);
    text-decoration: none;
}

    .page-menu-container span.RadButton_T2W.RadButton.rbLinkButton {
        text-decoration: none;
        height: auto;
        line-height: 18px;
        min-height: 0;
        padding: 12px;
        border-left: 0px solid #000 !important;
        border-right: 0px solid #000 !important;
        margin-right: 40px;
    }



.page-menu-container .fr, .page-menu-container .fl {
    line-height: 0;
}

.RadMenu_T2W ul li a.side-menu {
    display: block;
    width: 30px;
    height: 30px;
    padding: 12px !important;
    /* JB - remove hamburger fixed background 
    background-color:#3BB6D2;
    background-image: linear-gradient();
	*/
    background: url(../Images/hamburger.png) no-repeat center;
}

.RadMenu_T2W ul li a.rmLink:hover {
    background-color: var(--primary-rgba);
}

img#userImage, img.userAvailImage {
    width: 34px !important;
    height: 34px !important;
    vertical-align: middle;
    margin: 8px;
    border-radius: 50%;
    background-color: var(--input-background);
}

div.userAvailImage {
    float: left;
}

td.userImage img {
    width: 28px !important;
    height: 28px !important;
    vertical-align: middle;
    border-radius: 50%;
}

.userAvailText {
    padding-left: 42px;
}

#lblInbox, #lblUsername {
    line-height: 2.4;
    text-align: center;
    font-weight: 300;
    font-size: 15px;
    color: var(--button-text);
    background-color: var(--primary-blue);
    padding-top: 10px;
    position: relative;
    top: 0px;
}

#lblInbox {
    border-right: 0px solid #000;
    background-color: var(--primary-blue);
}

    #lblInbox.menu-inbox.nav-top-right {
        background-color: none;
        width: 85px !important;
        font-size: 15px;
    }

#lblUsername.menu-username.nav-top-right {
    background-color: none;
    width: 100px !important;
    margin-top: 0px;
    font-size: 15px;
}



.page-menu-container {
    background-color: var(--primary);
    color: var(--button-text) !important;
    display: inline-block;
    font-weight: lighter;
    width: 100%;
    box-sizing: border-box;
    font-weight: 300;
    vertical-align: middle;
}

.menu-middle {
    overflow: hidden;
    width: 100%;
}

.menu-button {
    padding-left: 2px;
    padding-bottom: 5px;
    margin: 14px 0px -13px 6px;
    border: 0 !important;
    text-decoration: none;
}

.menu-username {
    color: var(--button-text) !important;
}

.menu-button-img {
    padding: 0px;
    margin: 14px 0px -13px 6px;
    border: 0 !important;
    vertical-align: middle;
}

    .menu-button-img:hover, .menu-button-img:active, .menu-button-img:focus {
        border: 0 !important;
        background-color: transparent !important;
    }

.menu-settings {
    padding-top: 15px !important;
    padding-right: 20px !important;
}

/* header sections */
.page-header-line {
    border-top: 0px solid #5c5d5f;
    border-bottom: 0px solid #ababab;
}

.page-header-mainnav {
    height: 50px;
}

.page-header-subnav {
    height: 40px;
}

/* page-mainnav */
.page-mainnav {
    display: inline-block;
    height: 50px;
}

    .page-mainnav ul {
        list-style-type: none;
        margin: 0;
        padding: 0;
    }

        .page-mainnav ul li {
            display: inline;
            margin: 0;
            float: left;
        }

.page-mainnav-tab {
    font-weight: 600;
    text-decoration: none;
    color: var(--button-text);
    padding: 20px;
    line-height: 60px;
}

.page-mainnav-tab:hover {
    -moz-box-shadow: inset 0 0 20px #555;
    -webkit-box-shadow: inset 0 0 20px #555;
    box-shadow: inset 0 0 20px #555;
    background-image: url(../Images/page-header-bg-active.png);
    background-color: var(--input-background);
}

/* page-mainnav-right */
.page-mainnav-right {
    display: inline-block;
    height: 60px;
    right: 0;
    position: fixed;
}

    .page-mainnav-right ul {
        list-style-type: none;
        margin: 0;
        padding: 0;
    }

        .page-mainnav-right ul li {
            display: inline;
            margin: 0 4px;
            float: left;
        }

.page-mainnav-right ul li a {
    line-height: 60px;
    padding: 20px 10px;
    text-decoration: none;
    font-weight: 800;
    color: var(--button-text);
}

/* page-nav-sub */
.page-subnav {
    display: inline-block;
    height: 60px;
    top: 60px;
    position: fixed;
}

    .page-subnav ul {
        list-style-type: none;
        margin: 0;
        padding: 0;
    }

        .page-subnav ul li {
            display: inline;
            margin: 0 4px;
            float: left;
        }

.page-subnav ul li a {
    line-height: 40px;
    padding: 10px;
    text-decoration: none;
    font-weight: 800;
    color: var(--text);
}

.page-subnav ul li a:hover {
    background-color: var(--cancel);
}

/* Loading Panel */
.loading-panel {
    position: absolute;
    /* DF: RadWindowManager's dialogs - radaler, radprompt, radconfirm and the popups opened with radopen automatically take the z-Index of the RadWindowManager. 
        Its value is set to 3001 by default. set loading panel's z-index to 3000 so that rad window is on top of the loading.*/
    z-index: 3000;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    opacity: .5;
    background: center no-repeat;
}

/* RadMenu */
.menu-wrapper {
    background-color: var(--menu-item);
    bottom: 40px;
    color: var(--button-text);
    overflow: auto;
    position: fixed;
    top: 60px;
    width: 300px;
    left: 0;
}

.page-menu-container .RadMenu {
    /* JB - remvoed as totally messing up the pop-up context menu.... 
	z-index:auto!important;
    */
    /* WV - added back and target menu on main page header - was beign drawn on top of modal popups.... */
    z-index: auto !important;
}

.RadMenu .rmRootGroup {
    position: relative;
    /*width:100%;*/
}

/*changes line height for the root menu items*/
.RadMenu .rmHorizontal .rmRootLink span.rmText {
    height: 20px !important;
}

/*changes height for the child menu items */
.RadMenu .rmVertical .rmText, .RadMenu .rmHorizontal .rmVertical .rmText {
    height: 20px !important;
    line-height: 18px;
}


/* Breadcrumbs */
.breadcrumb {
    clear: both;
}

    .breadcrumb .RadSiteMap {
        padding-right: 9px;
        margin-top: 23px;
    }

    .breadcrumb .page-title {
        padding: 12px;
        margin: 0;
    }

.listTitle, .editTitle {
    color: #383637;
    font-size: 25px;
    font-weight: 400;
}

.listGrid {
    margin-top: 0;
    position: absolute;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
    margin-bottom: 52px !important;
}

.tabGrid {
    height: 99% !important;
}

.notificationGrid {
    /*
    margin-bottom:52px;
    margin-top:0px;
    position:absolute;
    top: 12px;
    bottom: 0px;
    left: 0px;
    right: 0px;
    */
    height: 99%;
}

.radTabStrip {
    width: 100%;
    position: relative;
    top: 0;
    left: 0;
    right: 0;
}

* html .tab-container {
    height: 100%;
    width: 100%;
}

.tab-edit-container {
    position: absolute;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
}

/*
.tab-edit-container
{
	height:100%;
	width:100%;
}

* html .tab-edit-container
{
	height:100%;
	width:100%;
}

.page-content-container .editForm tbody
{
}
*/

.editForm td {
    vertical-align: middle;
}

    .editForm td.CellHeight {
        line-height: 37px !Important;
    }

.editForm-popup td {
    line-height: 34px;
}

    .editForm-popup td.CellHeight {
        line-height: 37px !Important;
    }

.editForm td.comments, .scrollfilled-edit-container td.comments, td.comments, .comments {
    vertical-align: top !important;
}

.editTitle {
    font-weight: 300;
    font-size: 19px;
    color: #00b6e1;
}

.editForm {
    border-width: 0;
    width: 100%;
    min-width: 600px;
    background-color: var(--background);
}

.editTable {
    margin-top: 2px;
}



rgPagerLabel {
    padding-top: 50px;
}

.rgWrap.rgAdvPart {
    padding-top: 1px !important;
}

.multiPageEdit {
    background: none repeat scroll 0 0 var(--background);
    margin: 12px 12px 0px 12px;
    overflow: auto;
}

    .multiPageEdit.fitted {
        overflow: hidden;
    }


.multiScrollPageEdit {
    background: none repeat scroll 0 0 var(--background);
    margin: 12px 12px 0px 12px;
    overflow: auto;
    bottom: 0;
    left: 0;
    right: 1px;
    top: 0;
    position: absolute;
}


/* 
    JB - this fixes the position of multi-page edits in the user management... 
    required to ensure that the content fills the window top-bottom and left, right...
    WV - Also add for security role & security key
    WV - Also add for integration list
*/
.user-list .multiPageEdit, .security-role-list .multiPageEdit, .security-key-list .multiPageEdit, .integration-list .multiPageEdit {
    bottom: 0;
    left: 0;
    right: 1px;
    top: 0;
    position: absolute;
}

/* 
    JB - this fixes the position of multi-page edits in the popup window... 
    required to ensure that the content fills the window top-bottom and left, right...
*/
.popup-content-container .multiPageEdit {
    bottom: 0px;
    left: 0px;
    right: 0px;
    top: 0px;
    /* JB - absolute seems to cause issue with pop-up shift editor width....
    position:absolute;
	*/
}

.multiPageEdit-popup {
    background: none repeat scroll 0 0 var(--background);
    bottom: 0;
    left: 0;
    padding: 1em;
    right: 1px;
    top: 0;
    overflow: auto;
}


.edit-tab-strip {
    float: left;
}

.user-list .edit-tab-strip {
    margin-top: 0 !important;
    position: absolute;
}

.error-close {
    float: right;
    font-size: 8px;
}

.validationPanel {
    position: absolute;
    right: 5px;
    top: 5px;
    z-index: 999;
    opacity: .9;
    width: 33%;
}

.rfdValidationSummaryControl {
    border-width: 1px !important;
    border-radius: 5px !important;
    /*
    JB - causes issues with busy forms (like contractual hours)
    min-width: 300px;
    */
}

.comboBox {
    max-width: 1000px;
    white-space: nowrap;
}


    .comboBox .RadComboBox {
        float: left;
    }

/* WV: stop combobox and required field validator appearing on separte lines */
.postComboBoxPanel {
    display: inline-block;
}

.social-share {
    border-width: 0 !important;
    padding: 0 !important;
    zoom: .7 !important;
    height: 38px !important;
}

.footer-table {
    width: 100%;
    height: 100%;
}

.footer-cell-left {
    vertical-align: middle;
    text-align: left;
    float: left;
    opacity: 70%;
}

.footer-cell-middle {
    vertical-align: middle;
    text-align: left;
}

.footer-cell-right {
    vertical-align: middle;
    text-align: right;
    overflow: hidden;
    padding-right: 20px;
    opacity: 70%;
}

.footer-button {
    color: var(--button-text) !important;
    background-color: transparent !important;
    height: 20px !important;
    border-width: 0 !important;
    min-height: 20px !important;
    padding: 0 !important;
    margin-left: 20px !important;
    font-size: 14px !important;
    vertical-align: top !important;
}


/* DF: setup the save panel using text-align:right so that Save and Cancel btns are in the right order. (save first then cancel)*/
.save-button-panel {
    z-index: 99;
    width: 97%;
    text-align: right;
    height: 60px;
    margin-bottom: 10px;
}

    .save-button-panel .RadButton.RadButton_T2W.save-button {
        font-size: 16px !important;
    }

    .save-button-panel .RadButton.RadButton_T2W.cancel-button, .save-button-panel .RadButton.RadButton_T2W.save-button, .RadButton.RadButton_T2W.approve-button, .RadButton.RadButton_T2W.reject-button, .save-button-panel .RadButton.RadButton_T2W.return-button {
        float: none !important;
        margin: 0px;
    }


.RadPanelBar .rpSlide {
    position: static !important;
}

.RadPanelBar, .RadPanelBar .rpSlide, .RadPanelBar .rpGroup, .RadPanelBar .rpItem, .RadPanelBar .rpTemplate {
    overflow: visible !important;
}


.RadGrid .rgPager .RadComboBox {
    margin: -3px 4px 0 0;
    vertical-align: top;
}

/*
    Edit Windows
*/
.edit-form {
    width: 100%;
}

.edit-panel {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 35px;
    right: 0;
    overflow: auto;
    background: var(--input-background);
    padding-top: 10px;
    padding-left: 20px;
    padding-right: 20px;
    width: 100%;
}

.edit-footer {
    position: absolute;
    bottom: 0;
    height: 35px;
    left: 0;
    right: 0;
    overflow: auto;
    color: var(--button-text);
    text-align: right;
    color: #B4BBC2;
    font-size: 14px;
    padding-top: 5px;
    padding-bottom: 5px;
}

.edit-validationPanel {
    position: absolute;
    right: 20px;
    top: 5px;
    z-index: 999;
    opacity: .9;
}

.rbClearButton, .rbClearButton:hover {
    background-color: transparent !important;
    border: none !important;
    color: var(--grid-text) !important;
}

    .rbClearButton:hover {
        border: none !important;
        opacity: 1 !important;
    }

span.RadButton_T2W.rbClearButton.rbAddRecord span.rbPrimaryIcon {
    left: -13px;
    top: -3px;
}

span.RadButton_T2W.rbClearButton.rbAddRecord span.rbPrimary.rbText {
    left: -20px;
}

.userDetailItem {
    padding-left: 8px;
    padding-right: 7px;
    padding-top: 4px;
    padding-bottom: 3px;
}

    .userDetailItem td {
        border: none;
        padding-left: 7px;
        padding-right: 7px;
        padding-top: 4px;
        padding-bottom: 3px;
    }

/* Schedule Pages */


.publishing-options table.radio-button-list {
    width: 600px;
    font-size: 30px;
}




tr {
    vertical-align: top !important;
}


/*--------------------------------------------------------------*/
/*	=== Visual Editor Overides ===
/*--------------------------------------------------------------*/
div.popup-body-container .rfdTable {
    border: 0 !important;
}

/*--------------------------------------------------------------*/
/*	===Form Inputs===
/*--------------------------------------------------------------*/

.RadForm.rfdTextbox input.rfdDecorated[type="text"], .RadForm.rfdTextbox input.rfdDecorated[type="password"], .RadForm.rfdTextbox input.rfdDecorated[type="search"], .RadForm.rfdTextbox input.rfdDecorated[type="url"], .RadForm.rfdTextbox input.rfdDecorated[type="tel"], .RadForm.rfdTextbox input.rfdDecorated[type="email"] {
    padding: 5px 5px !important; /* DF - reduce to 5px, so that it is same as hover style (no more blinking) */
    background-color: var(--input-background);
    /*
        JB - yet again more SOD crap which causes issues...
        margin-right:30px;
	*/
}

.rgDataDiv {
    background-color: var(--background);
}

/*
    JBAKER - removed this no properties actually used and padding unneceesary
.SchPageToolBar .ActionDiv{
	
	float: right;
  min-width: 300px;
  padding-right: 30px;
  padding-top:10px;
}
*/

.rnvSlide .rnvPopup {
    min-width: 160px;
}

.rnvLink .radImage {
    margin: 0 13px 0 4px !important;
    display: inline-block;
    vertical-align: top;
    border: 0px;
}

.rnvLink, .rnvLink .rnvText {
    display: inline-block;
    vertical-align: middle !important;
    cursor: pointer !important;
}

.RadNavigation .rnvRootLink {
    background-color: var(--primary) !important;
}

.RadNavigation .rnvRootGroupWrapper {
    background-color: var(--primary) !important;
}

.RadNavigation .notificationWrapper {
    position: absolute;
    right: 0;
    top: 0;
}

.RadNavigation a.notificationWrapper {
    position: absolute;
    right: 0;
    top: 11px;
    text-decoration: none;
}

.notificationWrapper .radImage {
    position: relative;
    top: -1px;
}

#divNotification {
    z-index: 400;
    float: left;
    position: relative;
    left: 32px;
    top: 1px;
    color: white;
    font-size: 10px;
    font-weight: bold;
    background-color: #f96b57;
    width: 15px;
    height: 15px;
    align-content: center;
    text-align: center;
    border-radius: 15px;
}

#divNotificationBadge {
    position: relative;
    top: -1px;
    left: 0.35px;
    font-size: 11px !important;
}

/*--------------------------------------------------------------*/
/*	===Blanket element styles===
/*--------------------------------------------------------------*/
rcbFocused {
    width: 100px !important;
}

.rwzButton {
    padding: 12px 16px;
    background-color: rgba(60,196,277,0.8);
    color: white;
    font-family: "Roboto",sans-serif !important;
    font-size: 12px;
}

    .rwzButton:hover {
        padding: 12px 16px;
        background-color: rgba(60,196,277,1);
        color: white;
    }

/*--------------------------------------------------------------*/
/*	===Grid System===
/*--------------------------------------------------------------*/

/* Grid
–––––––––––––––––––––––––––––––––––––––––––––––––– */

.wizbg {
    background: var(--background);
}

.whitebg {
    background: var(--input-background);
}

.column,
.columns {
    width: 50%;
    /*
      JBaker - removed this as causing an issue with user image/moves to overlap upper line....
  float: left;
  */
    box-sizing: border-box;
}

/* For devices larger than 400px */
@media (min-width: 400px) {
    .container {
        width: 85%;
        padding: 0;
    }
}

/* For devices larger than 550px */
@media (min-width: 550px) {
    .container {
        width: 80%;
    }

    .column,
    /*
    JB - causes an issue with wizard alignment!!
    .columns {
    margin-left: 4%; }
  */
    .column:first-child,
    .columns:first-child {
        margin-left: 0;
    }

        .column:last-child,
        .columns:last-child {
            margin-right: 0;
        }

    .one.column,
    .one.columns {
        width: 4.66666666667%;
    }

    .two.columns {
        width: 13.3333333333%;
    }

    .three.columns {
        width: 22%;
    }

    .four.columns {
        width: 30.6666666667%;
    }

    .five.columns {
        width: 39.3333333333%;
    }

    .six.columns {
        width: 48%;
        background-color: var(--background);
    }

    .seven.columns {
        width: 56.6666666667%;
    }

    .eight.columns {
        width: 65.3333333333%;
    }

    .nine.columns {
        width: 74.0%;
    }

    .ten.columns {
        width: 82.6666666667%;
    }

    .eleven.columns {
        width: 91.3333333333%;
    }

    .twelve.columns {
        width: 100%;
        margin-left: 0;
    }

    .one-third.column {
        width: 30.6666666667%;
    }

    .two-thirds.column {
        width: 65.3333333333%;
    }

    .one-half.column {
        width: 48%;
    }

    /* Offsets */
    .offset-by-one.column,
    .offset-by-one.columns {
        margin-left: 8.66666666667%;
    }

    .offset-by-two.column,
    .offset-by-two.columns {
        margin-left: 17.3333333333%;
    }

    .offset-by-three.column,
    .offset-by-three.columns {
        margin-left: 26%;
    }

    .offset-by-four.column,
    .offset-by-four.columns {
        margin-left: 34.6666666667%;
    }

    .offset-by-five.column,
    .offset-by-five.columns {
        margin-left: 43.3333333333%;
    }

    .offset-by-six.column,
    .offset-by-six.columns {
        margin-left: 52%;
    }

    .offset-by-seven.column,
    .offset-by-seven.columns {
        margin-left: 60.6666666667%;
    }

    .offset-by-eight.column,
    .offset-by-eight.columns {
        margin-left: 69.3333333333%;
    }

    .offset-by-nine.column,
    .offset-by-nine.columns {
        margin-left: 78.0%;
    }

    .offset-by-ten.column,
    .offset-by-ten.columns {
        margin-left: 86.6666666667%;
    }

    .offset-by-eleven.column,
    .offset-by-eleven.columns {
        margin-left: 95.3333333333%;
    }

    .offset-by-one-third.column,
    .offset-by-one-third.columns {
        margin-left: 34.6666666667%;
    }

    .offset-by-two-thirds.column,
    .offset-by-two-thirds.columns {
        margin-left: 69.3333333333%;
    }

    .offset-by-one-half.column,
    .offset-by-one-half.columns {
        margin-left: 52%;
    }
}

/* JB - Next 5 all Required for shcedule wizard shift selector arrows to appear */
.treeview-shifts > .RadTreeView_T2W {
    padding: 0px 20px;
}

.wizard-step-options-cycles {
    padding-left: 20px;
}

.wizard-step-options-availability {
    padding-left: 20px;
}

.publishing-options .radio-button-list {
    padding-left: 20px;
}

.form-publishing {
    padding-left: 20px;
}

/* JB - Next 5 all Required for shcedule wizard publish date seletor appear 
No - that messes up big time in Chrome.....
.form-publishing-pubdate .RadPicker {
    position:relative;
    left:-70px;
    top:-15px;
}
*/

.ul-image-wrap {
    width: 450px;
    height: 150px;
}

.ul-image-preview {
    float: left;
    width: 150px;
    height: 100%;
    border-radius: 50px;
}


    .ul-image-preview > img {
        float: right;
        width: 150px;
        height: 100%;
        border-radius: 50px;
    }

.ul-image-cancel {
    width: 300px;
    height: 50px;
    float: left;
}

.ul-image-upload {
    width: 300px;
    height: 50px;
    float: left;
}

.ul-image-info {
    width: 300px;
    height: 50px;
    float: left;
}

.rgDetailTable .rgNoRecords .rgExpandCol {
    background-color: var(--data-div-background) !important;
}

.RadWizard .rwzContent {
    position: fixed;
    top: 232px;
    bottom: 100px;
    left: 20px;
    right: 20px;
}

.rwzNav {
    position: fixed;
    bottom: 50px;
    width: 100%;
}

.wizard-step-content {
    overflow: hidden;
}


/* JB - following all control the user and skill image uploads */
.clear-image-button {
    background-image: url(../Images/cancel_button.png);
    background-repeat: no-repeat;
    background-color: transparent !important;
    color: transparent !important;
    position: relative !important;
    left: -215px !important;
    width: 42px !important;
    height: 50px !important
}

.ul-image-upload {
    background-image: url(../Images/upload_image_70_opacity.png);
    background-repeat: no-repeat;
    background-color: transparent !important;
    color: transparent !important;
    position: relative !important;
    left: -110px !important;
    top: 18px !important;
    width: 110px !important;
}

div.ul-image-upload div.RadUpload .ruBrowse {
    /*
  background-color:#23B7E5 !important;
  color: #ffffff;
*/
    background-color: transparent !important;
    color: transparent !important;
    margin-left: 4px;
}


.ulsquare .clear-image-button {
    background-image: url(../Images/upload-cancel_square.png);
    background-repeat: no-repeat;
    background-color: transparent !important;
    color: transparent !important;
    position: relative !important;
    left: -230px !important;
    width: 42px !important;
    height: 50px !important;
    top: -1px;
}

.ulsquare .ul-image-upload {
    background-image: url(../Images/upload_new_square_no_text.png);
    background-repeat: no-repeat;
    background-color: transparent !important;
    /*
        color: transparent !important;
    */
    position: relative !important;
    left: -110px !important;
    top: 30px !important;
    width: 110px !important;
    height: 30px;
}

.ulsquare div.ul-image-upload div.RadUpload .ruBrowse {
    /*
  background-color:var(--button-colour) !important;
  color: #ffffff;
*/
    background-color: transparent !important;
    color: var(--button-text) !important;
    margin-left: 4px;
    position: relative;
    left: -109px;
    top: -4px;
}

.ulsquare .ul-image-preview > img {
    float: right;
    width: 150px;
    height: 100%;
    border-radius: 0px;
}

.ulsquare .ul-image-info {
    position: relative;
    top: 32px;
    left: -111px;
}

.SkillImageWH, .SkillImageWindow img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
}

/* JBaker added to shift the "uploading" progress bar across
   there is an existing padding of 20 but this is insufficient
   Note: Setting the left shifts the "click" zone of the button
    so the overlap image is no longer clickable - that is bad...
*/
.RadUpload .ruFileWrap {
    padding-left: 120px !important;
}

.ulsquare .RadUpload .ruRemove {
    top: -30px;
}

.RadNotification_T2W.rnNoTitleBar .rnTitleBar {
    display: block !important;
    height: 0px !important;
    padding: 0px !important;
}

    .RadNotification_T2W.rnNoTitleBar .rnTitleBar .rnTitleBarIcon {
        display: none;
    }

    .RadNotification_T2W.rnNoTitleBar .rnTitleBar .rnCloseIcon {
        position: relative;
        top: -2px;
    }

.RadNotification_T2W.rnNoTitleBar .rnCommands .rnCloseIcon a, .RadNotification_T2W.rnNoTitleBar .rnCommands .rnCloseIcon a:hover {
    /* background-position: -161px -1911px; */
    background-position: -212px -1911px;
}

.rnNoTitleBar.RadNotification_T2W.versionnotification .rnTitleBar {
    width: 420px;
}


/* Added to make the image on the notification popup round... */
.rnContentIconClip.rnCustomIcon img {
    border-radius: 50%;
    width: 50px;
    height: 50px;
}



/*
    JB - added to shift user image upload inline with fields
*/
.ul-image-wrap {
    position: relative;
    left: 44px;
}

.map .clear-image-button, .map .clear-image-button .rbHovered, .map .clear-image-button .rbDecorated {
    background-position: 0px 0px;
    background-image: url('../Images/upload-cancel_square.png');
    background-repeat: repeat-y;
    background-color: transparent !important;
    color: transparent !important;
    position: relative !important;
    left: 3px !important;
    width: 30px !important;
    height: 30px !important;
    top: 0px;
    z-index: 2;
}

    .map .clear-image-button input {
        background-repeat: none !important;
        background-image: none !important;
    }

.map .leaflet-container.withClear {
    top: -30px;
}

/* JB added to overcome edit image position move when an item is "open"  */
.RadGrid .rgEditRow > td [type='image'] {
    vertical-align: top !important;
}

.VersionNumber {
    color: var(--button-text);
    font-size: 12px;
    position: absolute;
    bottom: 10px;
    right: 10px;
}

.paGenerateProgress {
    width: 500px;
    height: 230px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -250px;
    margin-top: -115px;
}

div.RadMenu.RadMenu_T2W.mnuUser {
    z-index: 9000 !important;
    color: transparent; /*fixes issue with spreadsheet colour adding border */
}

    div.RadMenu.RadMenu_T2W.mnuUser .rmRootGroup {
        border-width: 0px;
    }

    div.RadMenu.RadMenu_T2W.mnuUser .rmRootGroup {
        border-width: 0px;
    }

.mnuUser {
    margin-top: -1px;
    z-index: 9000 !important;
}

    .mnuUser .menu-button-img.menu-settings {
        position: relative;
        top: -4px;
    }

        .mnuUser .menu-button-img.menu-settings .rmToggle .rmIcon {
            position: relative;
            top: 10px;
            margin-top: -19px;
        }

.mnuTenantName {
    text-align: right;
    position: absolute;
    right: 90px;
    top: 46px;
    font-size: 0.7em !important;
}

/* Report Viewer */

.report-tab-container {
    position: absolute;
    left: 0;
    right: 0;
    top: 45px;
    bottom: 0;
}

    .report-tab-container .reportViewer .trv-report-viewer .trv-parameters-area {
        display: none;
    }

    .report-tab-container .reportViewer .trv-report-viewer .trv-pages-area {
        position: absolute !important;
        bottom: 2px !important;
        top: 2px !important;
        left: 2px !important;
        right: 2px !important;
    }

/* Font Awesome is required for toolbar fonts*/
.reportViewer .trv-report-viewer * .trv-nav * {
    font-family: FontAwesome !important;
}

.reportViewer .trv-report-viewer .k-link .k-icon {
    font-family: WebComponentsIcons !important;
}

/* Font Awesome is required for toolbar fonts*/
.reportViewer .trv-report-viewer * .trv-nav span,
.reportViewer .trv-report-viewer * .trv-nav .k-animation-container {
    font-family: "Roboto" !important;
}

/* Force left alignment on the logo picture box */
.trv-report-viewer .trv-pages-area .trv-page-container .trv-report-page .logoPictureBox {
    text-align: left;
}

/* For some reason Chrome get the images from somewhere else....thise defines where.... */
@media screen and (-webkit-min-device-pixel-ratio:0) {
    .reportViewer * input.trv-parameter-editor-boolean {
        padding-right: 2px !important;
        width: 10px !important;
    }
}

/*
    Hyperlink in RadGrid CommandCell.
*/
.rgCommandCell .hyperlink-action {
    padding: .08333em 1em .16667em !important; /* Same as .rbLinkButton*/
    line-height: 24px !important; /* Same as .rbLinkButton*/
}

    .rgCommandCell .hyperlink-action img {
        padding-right: 10px;
    }

/* Dashboard */

* html .dashboard-container {
    height: 100%;
    width: 100%;
}

.dashboard-container {
    overflow: auto;
    height: 100%;
    width: 100%;
}

    .dashboard-container .dbPageLayout {
        min-width: 300px;
    }

        .dashboard-container .dbPageLayout .t-col {
            padding-left: 0px;
            padding-right: 5px;
        }

.RadHtmlChart svg text {
    fill: var(--text);
}

.DashBoardPanel {
    height: 100%;
    width: 100%;
}

    .DashBoardPanel .dbChart {
        height: 100%;
        width: 100%;
        padding-bottom: 10px;
    }

    .DashBoardPanel .DashBoardWidget {
        width: 100%;
    }

    .DashBoardPanel .DashBoardPanelBar {
        overflow: auto !important;
        width: 100%;
        margin-top: 5px;
        background-color: transparent;
    }

    .DashBoardPanel .RadPanelBar_T2W .rpItem {
        font-size: 14px;
        line-height: 34px;
    }

        .DashBoardPanel .RadPanelBar_T2W .rpItem .rpText {
            padding-top: 5px;
        }

        .DashBoardPanel .RadPanelBar_T2W .rpItem .rpImageText {
            padding-left: 0px;
        }

        .DashBoardPanel .RadPanelBar_T2W .rpItem .rpHeaderPanel {
            width: 100%;
            background-color: var(--progress-background);
        }

        .DashBoardPanel .RadPanelBar_T2W .rpItem .rpImage {
            padding-top: 5px;
            width: 24px;
            height: 24px;
        }

        .DashBoardPanel .RadPanelBar_T2W .rpItem .rpHeaderText {
            display: inline-block;
        }

    .DashBoardPanel .RadPanelBar_T2W .rpExpandable .rpExpandHandle {
        margin-top: 2px;
        margin-bottom: 2px;
    }

    .DashBoardPanel .RadPanelBar_T2W .rpExpanded .rpExpandHandle {
        background-position: -11px -11px;
    }

div.DashBoardPanel .RadPanelBar_T2W .rpRootGroup .rpExpandable {
    background-color: var(--page-hover);
}

div.DashBoardPanel .RadPanelBar_T2W .rpItem .rpGroup .rpSelected {
    background-color: var(--page-hover);
}

div.DashBoardPanel .RadPanelBar_T2W .rpItem .rpGroup .rpExpanded {
    background-color: var(--page-hover);
}

.DashBoardPanel .RadPanelBar_T2W .rpExpanded.rpLink,
.DashBoardPanel .RadPanelBar_T2W .rpExpanded.rpHeaderTemplate {
    background-color: var(--page-hover);
    color: var(--text);
}

.DashBoardPanel .RadPanelBar_T2W .rpItem .ItemLabel {
    margin-left: 5px;
}

.DashBoardPanel .RadPanelBar_T2W .rpItem .ItemDetailLabel {
    font-size: 11px;
    width: 250px;
}

.DashBoardPanel .RadPanelBar_T2W .rpItem .ItemReasonPanel {
    display: inline-block;
    margin-left: 5px;
}

.DashBoardPanel .RadPanelBar_T2W .rpItem .ItemReasonLabel {
    font-size: 12px;
    font-weight: bold;
    margin-left: 5px;
    width: 40px;
    text-align: right;
}


.DashBoardPanel .dbLocationComboBox {
}

    .DashBoardPanel .dbLocationComboBox .RadComboBox {
        /*position: absolute;
    right: 10px;
    top: 10px;*/
        width: 100% !important;
        padding-left: 30px;
        box-sizing: border-box;
    }

.dbLocationComboBoxDropDown {
    min-width: 250px !important;
}

.dbComboBoxFooter {
    height: 34px;
}

    .dbComboBoxFooter .dbOKButton {
        margin-top: 2px;
        height: 30px;
    }

.DashBoardPanel .RadButton.RadButton_T2W.dbTitleLink {
    float: none !important;
    background-color: transparent !important;
    margin-left: 20px;
}

.DashBoardPanel .RadLabel.RadLabel_T2W.dbTitleLink {
    float: none !important;
    background-color: transparent !important;
    margin-left: 25px;
    padding-left: 8px;
    color: var(--text);
    text-transform: uppercase;
    font-weight: 400;
    font-size: 14px;
}

.DashBoardPanel .dbTitleLink .rbDecorated {
    color: var(--text);
    text-transform: uppercase;
    font-weight: 400;
}

.DashBoardPanel .DashboardLoadingPanel {
    z-index: 999; /* Not above menu */
}

.DashBoardPanel .DashboardInitLoadingPanel {
    z-index: 999; /* Not above menu */
}

    .DashBoardPanel .DashboardInitLoadingPanel .raColor {
        background-color: transparent;
    }

div.rule, span.rule {
    font-size: 15px;
    padding-top: 5px;
    display: flex;
}

div.rule-action {
    width: 170px;
    display: inline-block;
    float: left;
}

/*
    Running plan
*/

.running-plan-edit .description-text {
    width: 100% !important;
    max-width: 350px;
}

.running-plan-edit .frequency-col1 {
    min-width: 110px;
}

.running-plan-edit .frequency-monthly-col2 {
    min-width: 540px;
}

.running-plan-edit .daily-frequency-col1 {
    min-width: 145px;
}

.running-plan-edit .daily-frequency-col2 {
    min-width: 220px;
}

.running-plan-edit .daily-frequency-col3 {
    min-width: 90px;
}

.running-plan-edit .daily-frequency-col4 {
    min-width: 180px;
}

.running-plan-edit .duration-col3 {
    min-width: 120px;
}

.running-plan-edit .summary-text {
    width: 100% !important;
    max-width: 600px;
    height: 75px;
}

/*
    Report Scheduler
*/

.report-scheduler-edit .editForm td {
    vertical-align: top;
    padding: 5px;
}

.report-scheduler-edit .report-scheduler-col1 {
    min-width: 100px;
}

.report-scheduler-edit .RadComboBox {
    min-width: 250px;
}

.report-scheduler-edit .description-text {
    width: 100% !important;
    max-width: 350px;
}

.report-scheduler-edit .message-text {
    width: 100% !important;
    max-width: 350px;
    height: 75px;
}

/*
    Report List
*/

.report-edit .ruInputs li:not(:last-child) {
    display: none;
}

.report-edit li.ruUploading {
    display: none;
}

div.report-edit .RadUpload .ruFileWrap {
    margin-top:2px !important;
    padding-left: 5px !important
}

div.report-edit .RadUpload .ruBrowse {
    width: 122px !important;
    height: 44px !important;
    color:var(--primary-color);
}

.report-edit .command-button {
    margin-top: 1.5px;
}

.report-edit .editForm td {
    vertical-align: top;
}

.report-edit .title-text {
    width: 90% !important;
    max-width: 350px;
}

.report-edit .description-text {
    width: 90% !important;
    max-width: 500px;
    height: 50px;
}

.report-edit .reference-text {
    width: 100% !important;
    max-width: 350px;
}

.report-edit .report-def-text {
    width: 100% !important;
    height: 250px;
}

/* JB - new styles for notifications */
.left-tab-strip {
    background-color: var(--input-background);
    color: var(--primary-hover);
    width: 110px;
    height: 100%;
    float: left;
    display: block;
}

/*
.left-tab-strip,
.left-tab-strip .RadTabStrip_T2W,
.left-tab-strip .RadTabStrip_T2W .rtsLevel {
    border-radius: 10px;
}

.left-tab-strip .rtsLevel .rtsFirst {
    border-radius: 10px 10px 0 0;
}

.left-tab-strip .rtsLevel .rtsLast {
    border-radius: 0 0 10px 10px;
}
*/

.lefttabstrip-content-container {
    position: absolute;
    top: 0px;
    left: 120px;
    bottom: 0;
    right: 0px;
}

.lefttabstrip-content-container-half {
    width: 50%;
    float: left;
    height: 100%;
}

.mail-header {
    color: var(--button-text);
    background-color: var(--primary-hover);
    height: 60px;
}

td.mail-header {
    padding-left: 20px;
    font-weight: bold;
}

.mail-body {
    background-color: var(--input-background);
    color: var(--text);
    height: 100%;
}

.left-tab-strip .rtsImg {
    display: block;
}

.left-tab-strip.tab-strip-wide .rtsImg {
    display: inline-block;
}

/*
Needs to be important otherwise other styles are overriding the left icon menu text postions (see notifications)
*/
.NotificationTabStrip a.rtsLink {
    text-align: center !important;
}

.NotificationTabStrip.left-tab-strip.tab-strip-wide a.rtsLink {
    text-align: left !important;
}

html .RadTabStrip_T2W.left-tab-strip .rtsLevel1 .rtsLink {
    border-width: 0px;
    width: 70px;
}

html .RadTabStrip_T2W.left-tab-strip.tab-strip-wide .rtsLevel1 .rtsLink, .left-tab-strip.tab-strip-wide, .tab-strip-wide .rtsLevel, .tab-strip-wide .rtsLink {
    border-width: 0px;
    width: 235px;
}

html .RadTabStrip_T2W.NotificationTabStrip.left-tab-strip.tab-strip-wide .rtsLink {
    padding: 0px !important;
}

.notificationGrid .RadGrid td.rgPagerCell {
    width: 50%;
    height:22px;
}

.msgView {
    height: 100%;
}

/* JB - prevent label wraps on edit form....*/
.rgEditForm label {
    white-space: nowrap;
}

.floatleft > div {
    float: left;
}

/* Release notes pop-up */
.versionnotification, .versionnotification .rnContent {
    padding: 0px !important;
    left: -50px;
    font-size: 11px;
}

    .versionnotification .rnContentIconClipIn {
        display: none;
    }

    .versionnotification.RadNotification_T2W {
        background-color: transparent;
        border-width: 0px;
    }

    .versionnotification .RadXmlHttpPanel {
        background-color: #faffb9;
        position: relative;
        bottom: 44px;
        border: 1px solid silver;
    }

    .versionnotification .rnContentWrapper {
        position: relative;
        top: 42px;
    }

    .versionnotification .versionText {
        position: absolute;
        top: 0px;
        left: 0px;
        padding: 7px;
    }

/*Timesheet Approval prefered screen notification*/
.timesheetScreennotification, .timesheetScreennotification .rnContent {
    padding: 0px !important;
    left: -50px;
    font-size: 13px;
}

    .timesheetScreennotification .rnContentIconClipIn {
        display: none;
    }

    .timesheetScreennotification.RadNotification_T2W {
        background-color: transparent;
        border-width: 0px;
    }

    .timesheetScreennotification .RadXmlHttpPanel {
        background-color: #fdfea0;
        position: relative;
        bottom: 44px;
        border: 1px solid silver;
    }

    .timesheetScreennotification .rnContentWrapper {
        position: relative;
        top: 42px;
        text-align: center;
    }

    .timesheetScreennotification .versionText {
        position: absolute;
        top: 0px;
        left: 0px;
        padding: 7px;
    }


/*License notification*/
.licenseNotification, .licenseNotification .rnContent {
    padding: 0px !important;
    left: -50px;
    font-size: 13px;
    color: red;
}

    .licenseNotification .rnContentIconClipIn {
        display: none;
    }

    .licenseNotification.RadNotification_T2W {
        background-color: transparent;
        border-width: 0px;
    }

    .licenseNotification .RadXmlHttpPanel {
        /*background-color: #fdfea0;*/
        background-color: white;
        position: relative;
        bottom: 44px;
        border: 1px solid silver;
    }

    .licenseNotification .rnContentWrapper {
        position: relative;
        top: 42px;
    }

    .licenseNotification .versionText {
        position: absolute;
        top: 0px;
        left: 0px;
        padding: 7px;
    }


.zoom-image-button, .zoom-image-button:hover {
    background-position: 0px 0px !important;
    background-image: url('../Images/zoom_square.png');
    background-repeat: repeat !important;
    background-color: transparent !important;
    color: transparent !important;
    position: relative !important;
    left: -152px !important;
    width: 29px !important;
    height: 27px !important;
    top: -1px;
}

    .zoom-image-button > input {
        display: none;
    }

.webCal, .webCal td > a {
    text-decoration: none;
}

    .webCal, .webCal td > div > div > a {
        text-decoration: none;
    }

.hidden {
    display: none;   
}

.ModalWindow .rwContentRow .rwCorner, .ModalWindow .rwContentRow .rwWindowContent,
.ModalWindow .rwStatusbarRow .rwCorner, .ModalWindow .rwStatusbarRow .rwStatusbar,
.ModalWindow .rwFooterRow .rwFooterCenter, .ModalWindow .rwFooterRow .rwCorner {
    background: var(--input-background) !important;
}

.HiddenElement {
    visibility: hidden;
    display: none;
}

.userDDSearch {
    position: relative;
    left: 3px;
}

.tabStripSearch {
    width: 33px;
    height: 33px;
    margin-left: 3px;
    margin-right: 3px;
    border-radius: 16px;
    background-color: var(--primary-hover);
    display: inline-table;
    position: relative;
    top: -8px;
}

.tabStripSearchCell .tabStripSearch {
    top: 3px;
}

.tabStripSearch input {
    position: relative;
    top: 3px;
    left: 2px;
}

.tabStripPostSearch {
    display: inline-table;
}

.hiddenSlider, .hiddenSplitterSlider td.rspPaneHorizontal {
    border-bottom: 0px;
}

    .hiddenSlider .rspPaneTabContainer {
        display: none;
    }

.hiddenSlider .rspTabsContainer {
    background-color: var(--input-background);
    border-top: 1px solid var(--edit-row-background);
}

span.CycleDayShiftCell {
    width: 100%;
    padding: 15px 3px 15px 3px;
    line-height: 55px;
}

.rbExportData {
    float: left !important;
    padding-right: 6px;
}

    .rbExportData .RadButton_T2W.RadButton.rbImageButton {
        width: 15px;
        height: 20px;
        background-repeat: no-repeat;
        float: left !important;
        top: 8px;
    }
/*////////////////////////////////////////////clocking/////////////////////////////////////////*/

.Adhering {
    color: green;
}

.not_Adhering {
    color: red;
}

.shiftTableLabelCol {
    width: 80px;
}

.shiftTableControlCol {
    width: 150px;
    margin-left: 5px;
}

.shiftCreateMessage {
    margin-top: 10px;
    margin-bottom: 10px;
    font-size: large;
    font-weight: 400;
}

.tableHeader {
    background-color: #e8dfdf;
}

.confirmDateCol {
    width: 150px !important;
}

.confirmScheduledTimeCol {
    width: 250px !important;
}

.confirmClockedTimeCol {
    width: 200px !important;
}

.confirmPaidHoursCol {
    width: 200px !important;
}

.ackDayCol {
    width: 150px !important;
}

.ackClockedTimeCol {
    width: 250px !important;
}

.ackHoursCol {
    width: 200px !important;
}

.ackPaidCol {
    width: 200px !important;
}

.approvalTableContainer {
    margin-bottom: 20px;
}

/*Below are styles for Clocking page*/
.clocking_message_panel {
    Height: 150px;
    width: 500px;
    background-color: var(--background);
    border: solid;
    border-width: 1px;
    border-color: #bef2ff;
}

.clocking_hyperlink {
    border: solid;
    width: 500px;
    border-width: 1px;
    border-color: #bef2ff;
}


.clocking_section_title {
    margin-bottom: 5px;
    margin-top: 15px;
}

.clocking_summary_container {
    /*max-height: 150px;
    overflow: auto;*/
}

.clocking_comments_textbox {
    height: 130px;
    width: 330px !important;
    overflow: auto;
    margin-bottom: 20px !important;
    margin-right: 0px !important;
    resize: none;
}

.clocking_leftAlign {
    display: inline-block;
    left: 0px;
    margin-top: 0px;
}

.clocking_positive_button {
    background-color: #8cc53f !important;
    height: 30px;
    border: none;
    cursor: pointer;
}

.clocking_negative_button {
    background-color: #f2695e !important;
    height: 30px;
    border: none;
    cursor: pointer;
}

.clocking_rightAlign {
    display: inline-block;
    margin-top: 0px;
    float: right;
}

.clocking_table_container {
    position: absolute;
    top: 20%;
}

.clocking_authorisation_panel {
    margin-top: 30px;
}

.clocking_authoriseTextBox {
    margin-top: 5px;
    margin-right: 0px !important;
    background-color: lightyellow !important;
    padding: 10px !important;
    font-size: 1em;
    width: 200px !important;
    border-bottom: 1px solid #fff;
    vertical-align: middle !important;
}

.clocking_authorise_button {
    border: none;
    background-color: #8cc53f;
    line-height: 30px;
    width: 40%;
    height: 30px !important;
    cursor: pointer;
}

.clocking_authoriseCancel_button {
    border: none;
    background-color: var(--cancel);
    line-height: 30px;
    width: 40%;
    float: right;
    height: 30px !important;
    cursor: pointer;
}

.modal-edit-window-container {
    background: var(--background);
    position: absolute;
    height: auto;
    bottom: 5px;
    top: 65px;
    left: 15px;
    right: 15px;
    overflow: hidden;
}

.modal-edit-content-container {
    position: absolute;
    top: 80px;
    bottom: 10px;
    left: 180px;
    right: 10px;
    height: 160px;
}

.clockLink {
    cursor: pointer;
}

.modal-edit-message-container {
    position: absolute;
    margin-top: 30px;
    top: 180px;
    left: 20px;
    width: 280px;
    word-wrap: normal;
}

.modal-messagebox-window-container {
    background: var(--background);
    position: absolute;
    height: auto;
    bottom: 2px;
    top: 65px;
    left: 10px;
    right: 10px;
    overflow: hidden;
}

.modal-messagebox-content-container {
    position: absolute;
    top: 20px;
    bottom: 10px;
    left: 20px;
    right: 10px;
    height: 150px;
}

.clocking_IssueReport_button {
    border: none;
    background-color: #f2695e;
    line-height: 30px;
    width: 40%;
    cursor: pointer;
}

.clocking_IssueReportCancel_button {
    border: none;
    background-color: var(--cancel);
    line-height: 30px;
    width: 40%;
    float: right;
    cursor: pointer;
}

.clocking_shiftCancel_button {
    border: none;
    background-color: var(--cancel);
    line-height: 20px;
    height: 30px;
    color: white;
    float: right;
    cursor: pointer;
}

.clocking_shiftSave_button {
    background-color: #8cc53f !important;
    line-height: 20px;
    height: 30px;
    color: white;
    border: none;
    float: right;
    margin-right: 5px;
    cursor: pointer;
}

.summary_grid {
    height: 250px !important;
    width: 800px !important;
}

.createShiftTable {
    margin-left: 6px !important;
    width: 820px !important;
}

.summary_grid .rgDataDiv {
    overflow-x: hidden !important;
}

.rwDialogPopup.radprompt .rwDialogInput, .logonform input.rfdDecorated, .logonform textarea {
    border: 1px solid var(--edit-row-background) !important;
}

.rwDialogPopup.radprompt .rwPopupButton, .rwDialogPopup.radprompt .rwPopupButton:hover {
    padding-right: 30px !important;
    background-color: transparent !important;
    border: 0px !important;
    line-height: 30px !important;
    height: 30px !important;
}

.promptButton, .rwDialogPopup.radprompt .rwPopupButton, .radprompt.rwDialogPopup .rwPopupButton .rwOuterSpan, .radprompt.rwDialogPopup .rwPopupButton .rwInnerSpan {
    width: 60px;
    height: 30px;
    margin-left: 1px;
    background: var(--button-colour);
    border: none;
    cursor: pointer;
    color: white;
    border-radius: 2px;
    text-align: center;
}

.RadWindow .rwPopupButton span {
    color: var(--button-text);
}

.rwDialogPopup.radprompt > div:nth-child(3) {
    float: right;
}

.promptImage {
    margin-left: 40px;
    margin-right: 15px;
}

.promptButtonPanel {
    margin-right: 30px;
}

/*NO*/


/*.modal-edit-window-container-clocking {
    background: #f2f2f2;
    position: absolute;
    height: auto;
    bottom: 5px;
    top: 65px;
    left: 15px;
    right: 15px;
    overflow: hidden;
}*/

.modal-edit-content-container-auth {
    position: absolute;
    top: 10px;
    bottom: 10px;
    left: 10px;
    right: 10px;
    overflow: auto;
}

.modal-edit-window-container-clocking {
    background: var(--background);
    position: absolute;
    height: auto;
    bottom: 10px;
    top: 70px;
    left: 20px;
    right: 20px;
    overflow: hidden;
}

.modal-edit-content-container-clocking {
    position: absolute;
    top: 10px;
    bottom: 10px;
    left: 10px;
    right: 10px;
    overflow: auto;
}

.p-i-radio::before,
.p-i-radio-checked::before,
.p-i-radiobutton::before {
    content: none !important;
}

.hiddenSearch {
    position: absolute;
    left: -1000px
}

.logonform .rwTitleRow {
    background-color: var(--primary);
}

.logonform .RadWindow .rwTitleRow em {
    color: white;
}

.logonform .rwContentRow {
    background-color: white;
}

.RadButton.RadButton_T2W.rbSkinnedButton.login {
    background-color: transparent;
    border: 0px;
}


/* Leave AvailCalendar Colors */
.leaveAvailCal .unavailable {
    background-color: #F2DEDE;
}

.leaveAvailCal .colourOnly {
    color: var(--button-text);
    font-weight: bold;
}

    .leaveAvailCal .colourOnly.unavailable {
        background-color: #f2695e;
    }

.leaveAvailCal .unavailable .percentage {
    color: red;
}

.leaveAvailCal .limited {
    background-color: #FFE7D6;
}

.leaveAvailCal .colourOnly.limited {
    background-color: #f7941e;
}

.leaveAvailCal .colourOnly.simulated {
    background-color: #DFF2DF;
}

.leaveAvailCal .limited .percentage {
    color: orange;
}

.leaveAvailCal .available {
    background-color: #DFF2DF;
}


.leaveAvailCal .colourOnly.available {
    background-color: #8dc442;
}

.leaveAvailCal .available .percentage {
    color: green;
}

.leaveAvailCal .simulated .percentage {
    font-size: 13px;
    color: #f48342;
}


.leaveAvailCal .blocked {
    background-color: #CBCBCB;
}

.importantInfoFlag {
    position: relative;
}

    .importantInfoFlag::after {
        display: block;
        content: "";
        top: 0;
        left: 0;
        width: 0;
        height: 0;
        position: absolute;
        border-right: 25px solid transparent;
        border-bottom: 25px solid transparent;
        border-top: 25px solid transparent;
    }

.rpadashHeaderItem {
    width: 240px;
    float: right;
}

.rpaHeaderColTOD {
    width: 60px;
    float: left;
}

.rpaHeaderCol {
    width: 60px;
    float: left;
    font-weight: bold;
}

.LocationItem.rpLink .rpText.rpHeaderText {
    width: 500px;
}

/**/
.ctrl-switch {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 34px;
}

    .ctrl-switch input[type=checkbox] {
        display: none;
    }

.ctrl-switch .slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: var(--cancel);
    -webkit-transition: .4s;
    transition: .4s;
}

        .ctrl-switch .slider:before {
            position: absolute;
            content: "";
            height: 26px;
            width: 26px;
            left: 4px;
            bottom: 4px;
            background-color: white;
            -webkit-transition: .4s;
            transition: .4s;
        }

    .ctrl-switch input[type=checkbox]:checked + .slider,
    .ctrl-switch .rfdCheckboxChecked + .slider {
        background-color: #2196F3;
    }

        .ctrl-switch input[type=checkbox]:checked + .slider:before,
        .ctrl-switch .rfdCheckboxChecked + .slider:before {
            -webkit-transform: translateX(26px);
            -ms-transform: translateX(26px);
            transform: translateX(26px);
        }

    .ctrl-switch input[type=checkbox]:focus + .slider {
        box-shadow: 0 0 1px #2196F3;
    }

    .ctrl-switch .slider.round {
        border-radius: 34px;
    }

        .ctrl-switch .slider.round:before {
            border-radius: 50%;
        }
/**/

.report.title {
    background: #00b6e1 !important;
}

.awardrulecheckbox {
    padding: 7px;
}

#tbReportDef.report-def-text {
    background: var(--filter-background);
}

/*------Tenancy Menu CSS------*/
ul.rmVertical.rmGroup.rmLevel2 li:first-child > div.rmText {
    padding: 10px;
}


a.tenantitem.menuOptions {
    text-align: center;
    line-height: 30px;
}

a.clpsButton.menuOptions {
    text-align: center;
    line-height: 30px;
}


/* Works on Firefox */
ul.rmVertical.rmGroup.rmLevel2.tenancymenu {
    scrollbar-width: thin;
    scrollbar-color: var(--primary) !important;
    max-height: 300px;
    overflow-y: auto;
    overflow-x: hidden;
}

    /* Works on Chrome, Edge, and Safari */
    ul.rmVertical.rmGroup.rmLevel2.tenancymenu::-webkit-scrollbar {
        width: 14px;
        border-radius: 0px;
    }

    /*ul.rmVertical.rmGroup.rmLevel2.tenancymenu::-webkit-scrollbar-track {
        background: var(--primary-rgba-track);
    }

    ul.rmVertical.rmGroup.rmLevel2.tenancymenu::-webkit-scrollbar-thumb {
        background-color: var(--primary) !important;
        border-radius: 0px;
        border: 3px solid var(--primary) !important;
    }*/
/* Fixes jumping clear button on department map */
span.clear-image-button {
    background-position: 0px 0px;
}



/*Fixes after the font has been changed*/
table.RadCalendarTimeView_T2W {
    font-size: 13px !important;
}

.RadWindow .rwTitleRow em {
    font-family: "Roboto",sans-serif !important;
}

.ddlPayRunDates.RadComboBoxDropDown {
    min-width: 250px !important;
}

.rnvLink .radImage {
    vertical-align: middle !important;
}

.rnvItem.rnvFirst.notificationWrapper > .rnvRootLink.rnvLink > .rnvText {
    vertical-align: bottom !important;
}

.RadComboBox .rcbEmptyMessage {
    opacity: 1 !important;
    /*text-overflow: unset !important;*/
}

.k-grid td, .k-grid th {
    word-wrap: unset !important;
}

.k-filter-row th, .k-grid-header th.k-header {
    overflow: unset !important;
}

.time-picker, .hours-textbox {
    font-size: 14px !important;
}

#divNotification {
    width: 25px;
    left: 37px;
    top: -2px;
}

#RadWindowWrapper_ctl00_ctl00_ctl00_cphContent_cphContent_cphContent_rwChangeToLeave {
    width: 380px !important;
}

/*#RadWindowWrapper_ctl00_ctl00_ctl00_PopupEdit {
    width: 1010px !important;
}*/


/*.RadGrid .rgClipCells .rgHeader {
    overflow: unset !important;
}*/

.RadComboBoxDropDown .rcbList {
    font-size: 15px;
}

.RadWindow_T2W .rwTable .rwTitlebarControls em {
    padding-left: 15px !important;
}

.radPopup.rnvPopup{
    margin-top:4px;
}

.rnvSlide > *:first-child{
    top: -4px;
}

.radSkin_T2W .radImage {
    background-color: var(--primary);
    border-radius: 50%;
}

.rmItem.rmFirst.rmLast > .rmSlide {
    top: 52px !important;
}

.rmVertical.rmGroup.rmLevel1 {
    background: var(--input-background);
}

    .rmVertical.rmGroup.rmLevel1 > li > a > span {
        color: var(--primary);
    }

/*.rmVertical.rmGroup.rmLevel1 > li > a > span:hover {
            background-color: #97DAF8;
        }*/

img.radImage {
    /*border-radius: 50%;*/
    background-color: var(--primary);
}

input#txtTenancySearch {
    border: 0.5px solid;
}



.RadMenu_T2W .rmGroup .rmLink.rmSelected {
    background-color: var(--input-background) !important;
}



.rmVertical > .rmItem > .rmLink:hover {
    background-color: var(--primary-rgba) !important;
}
/*.RadComboBox.RadComboBox_T2W > table .rcbInputCell.rcbInputCellLeft > .rcbInput.radPreventDecorate {
    font-size: 14px !important;
    text-overflow: initial !important;
    
}*/

.rgPagerCell.NextPrevAndNumeric > .rgWrap.rgAdvPart > .RadComboBox.RadComboBox_T2W > table .rcbInputCell.rcbInputCellLeft > .rcbInput.radPreventDecorate 
{
    font-size: 13px !important;
    text-overflow: initial;
}

.rgPagerCell.NextPrevAndNumeric>.rgWrap.rgAdvPart>.rgPagerLabel 
{
    vertical-align:sub !important;
}

/*.RadGrid .rgClipCells .rgRow > td ,.RadGrid .rgClipCells .rgAltRow > td {
word-wrap:break-word;    overflow: visible !important;
}*/

.RadGrid.RadGrid_T2W.notificationGrid > .rgDataDiv > .rgMasterTable.rgClipCells.rgClipCells > tbody > tr > td > span {
    white-space: nowrap;
}
/*.notificationGrid .RadGrid td.rgPagerCell {
    width : 100%;
    height: 22px;
}*/


/*hovering color change in dropdown in the settings tab*/
.rmSlide > .rmVertical.rmGroup > li > a > span:hover {
    background-color: var(--primary-rgba);
}

/* Bug fixes */
.RadForm_T2W.RadForm .riTextBox{
    font-size:13px !important;
}

#ctl00_cphContent_dtStartTime_timeView_tdl, #ctl00_cphContent_dtFinishTime_timeView_tdl {
    width: 600px !important;
}


#ctl00_ctl00_cphContent_cphContent_frmCriteria_btnLock_btn_btnLock_input, #ctl00_ctl00_cphContent_cphContent_btnChartApply_btn_btnChartApply_input {
    background-color: var(--button-background-b) !important;
    border: 1px solid var(--button-background-b) !important;
}

#cphContent_cphContent_cphContent_btnPublish {
    min-width: 60px !important;
    height: 30px !important;
}

#ctl00_ctl00_ctl00_cphContent_cphContent_cphContent_dpPublishDate_popupButton{
    height:30px;
}

#ctl00_ctl00_ctl00_cphContent_cphContent_cphContent_dpPublishDate_dateInput{
    border:1px solid #4F5050;    
    border-radius:10px;
}
/*#cphContent_cphContent_cphContent_btnPublish.RadButton_T2W.RadButton.RadButton_T2W.rbSkinnedButton.save-button.rbDecorated {
    width: 20px !important;
    height: 20px !important;
    font-size: 12px !important;
}

#ctl00_ctl00_cphContent_cphContent_frmCriteria_btnRetrieve_btn_btnRetrieve_input{
    transform:translateY(-30px) !important;
}*/


.RadForm_T2W.RadForm.rfdTextbox input.rfdDecorated[type="text"],
.RadForm_T2W.RadForm.rfdTextbox input.rfdDecorated[type="text"]:hover,
.RadForm_T2W.RadForm.rfdTextbox input.rfdDecorated[type="password"],
.RadForm_T2W.RadForm.rfdTextbox input.rfdDecorated[type="password"]:hover,
.riTextBox.riEnabled,
.riTextBox.riEnabled:focus,
.riTextBox.riEnabled:active,
.riSingle.RadInput.RadInput_T2W.RadInputFocused,
.RadComboBox.RadComboBox_T2W,
.RadComboBox.RadComboBox_T2W:hover,
.RadForm_T2W.RadForm.rfdTextarea textarea,
.RadForm_T2W.RadForm.rfdTextarea textarea[disabled]:hover,
.rddtInner.rddtExtraPadding,
#ctl00_ctl00_cphContent_cphContent_ScheduleShiftEdit1_rwEditShift_C_tbHours_cb_tbHours,
#ctl00_cphContent_frmEdit_tbHours_cb_tbHours {
    border: 1px solid var(--primary-border) !important;
}


#ctl00_ctl00_ctl00_cphContent_cphContent_cphContent_dpPublishDate_dateInput_wrapper.RadInputFocused {
    border: none !important;
}

#ctl00_ctl00_ctl00_cphContent_cphContent_cphContent_dpPublishDate_dateInput_wrapper.RadInputFocused.RadInputHovered {
    border: none !important;
}

.rcbInput.radPreventDecorate{
    width:87%!important;
}

.p-icon.p-i-arrow-60-down{
    padding-left:5px!important;
}




/*fix for the space issue in copying the schdelue into existing one*/
#cphContent_rpvExisting.rmpView.tab-edit-container-popup>div>table>tbody>tr>td>span {
    padding-right:13px !important;  
}

#cphContent_pvSchedule.rmpView .save-button-panel{
    margin-left:-20px !important;
}

#RadWindowWrapper_ctl00_ctl00_cphContent_cphContent_ScheduleShiftEdit1_rwEditShift .RadMultiPage .rmpView,
.blazor-iframe
{
    height: 93% !important;
}

#ctl00_ctl00_cphContent_cphContent_ScheduleShiftEdit1_rwEditShift_C_lblImportantInstructions,
#ctl00_ctl00_cphContent_cphContent_ScheduleShiftEdit1_rwEditShift_C_lblDefaultActivity,
#ctl00_ctl00_cphContent_cphContent_ScheduleShiftEdit1_rwEditShift_C_ddlShiftID_cb_ddlShiftID {
    white-space: nowrap;
}

#ctl00_ctl00_cphContent_cphContent_ScheduleShiftEdit1_rwEditShift_C_pvShift>table>tbody>tr>td{
    white-space: nowrap
}

#RadWindowWrapper_ctl00_ctl00_cphContent_cphContent_rwChangeToLeave{
    width:400px !important;
}


/*button orientation fix in user contract rule page.*/
#ctl00_ctl00_cphContent_cphContent_tgContractRulesGrid_ctl00_Header .save-button-panel{
    width:90% !important;
}

/*time sheet approval retailer window- increased width from 400 to 420 to avoid the breaking of the words*/
#RadWindowWrapper_ctl00_ctl00_cphContent_cphContent_rwRetailerApprovedTimes{
    width:420px !important;
}

/*scorecard distorted button was fixed in the ScorecardList.aspx changing the width to 120px*/

/*load and calculate button in adding requirement*/
#cphContent_frmEdit_tblShiftEdit>tbody>tr>td{
    white-space:nowrap;
}

/*Upload Scorm Package save buttom*/
#dvSave > a {       
    margin-right: 10px !important;    
}

#dvSave > a > input {    
    font-size: 16px !important;
    font-family: "Roboto",sans-serif;
    min-width: 100px !important;
    height: 44px !important;
    padding: 5px 16px;
    color: var(--primary) !important;
    background: var(--button-background-b) !important;
    border: 1px solid var(--button-background-b) !important;
}

#dvUploadStatus a input {
    color: var(--primary) !important;
    font-family: "Roboto",sans-serif !important;
    background: var(--button-background-b) !important;
}

/*UI Issue - Alignment of Reassign button on Day View */
#ctl00_ctl00_ctl00_cphContent_cphContent_cphContent_rwHighlightPrompt_C_btnReassign {
    font-size: 16px !important;
    font-family: "Roboto",sans-serif;
    min-width: 100px !important;
    height: 44px !important;
    padding: 5px 16px;
    color: var(--primary) !important;
    background: var(--button-background-b) !important;
    border: 1px solid var(--button-background-b) !important;
    cursor:pointer;
}

/*UI Issue on Add Requirement on Day View Mode*/
#ctl00_ctl00_ctl00_cphContent_cphContent_cphContent_radWinAddReq_C_pnlAddReqContainer > .popup-body > table > tbody > tr > td,
#ctl00_ctl00_ctl00_cphContent_cphContent_cphContent_radWinAddReq_C_pnlAddReqContainer > .popup-body > table > tbody > tr > td > table > tbody > tr > td {
    white-space: nowrap;
}


/*publish calender in the Allocation view fix*/
#ctl00_ctl00_ctl00_cphContent_cphContent_cphContent_dpPublishDate_calendar {
    width: 100% !important;
    display: block;
    border-bottom: darkgray;
    border-right: darkgrey;
    border-left: white;
}

/*Fix for the unwanted border in the left of the up and down arrow in configuration popup in allocation mode*/
#ctl00_ctl00_ctl00_cphContent_cphContent_cphContent_radWinConfigure_C_ddlSchChartDataNoDecimalPlaces_cb_ddlSchChartDataNoDecimalPlaces_SpinUpButton,
#ctl00_ctl00_ctl00_cphContent_cphContent_cphContent_radWinConfigure_C_ddlSchChartDataNoDecimalPlaces_cb_ddlSchChartDataNoDecimalPlaces_SpinDownButton{
    border-left:0px !important;
}

#ctl00_ctl00_ctl00_cphContent_cphContent_cphContent_radWinConfigure_C_ddlSchChartDataNoDecimalPlaces_cb_ddlSchChartDataNoDecimalPlaces_SpinDownButton {
    padding: 0px !important;   
}

#ctl00_ctl00_ctl00_cphContent_cphContent_cphContent_radWinConfigure_C>table>tbody>tr>td{
    white-space:nowrap;
}


/*filter dropdown breaking words fixed in sheet view*/
#ctl00_ctl00_ctl00_cphContent_cphContent_cphContent_ddlEmployments_DropDown,
#ctl00_ctl00_ctl00_cphContent_cphContent_cphContent_ddlSkills_DropDown,
#ctl00_ctl00_ctl00_cphContent_cphContent_cphContent_ddlDepartments_DropDown,
#ctl00_ctl00_ctl00_cphContent_cphContent_cphContent_ddlEvents_DropDown,
#ctl00_ctl00_ctl00_cphContent_cphContent_cphContent_ddlTeams_DropDown {
    white-space: nowrap;
}


/* cancel button in adding the record in the scorecard fix*/
#dvSave + div > a > input {
    font-size: 16px !important;
    font-family: "Roboto",sans-serif;
    min-width: 100px !important;
    height: 44px !important;
    padding: 5px 16px;
    color: var(--primary) !important;
    background: var(--button-background) !important;
    border: 1px solid var(--button-background-b) !important;
    cursor: pointer;
}

/*filter in group clocking*/
#RAD_SLIDING_PANE_CONTENT_ctl00_ctl00_cphContent_cphContent_radSlidePaneFilter{
    overflow-y:scroll !important;
}

/*Bulk shift offer buttons*/
#ctl00_cphContent_mvBulkOffer{
    height:100%;
    overflow:auto !important;
    padding:5px !important;
}


/*Overlapping text in the dashboard*/
.t-container.t-container-static.DashboardPageLayout > .t-row.DashboardItemHeaderRow > div > span >input {
    white-space: normal !important;
}

/*orientation of up and down arrow in configuration in Schedule Allocation view*/
.RadInput a{
    padding:unset !important;
}



/*time popup in timesheet approval*/
.k-list-ul{
    white-space:nowrap;
}

/*go home early save and cancel buttons*/
#cphContent_frmEditGoHome_pvGoHome > .save-button-panel, #cphContent_frmEditOvertime save-button-panel {
    margin-left: -20px;
}


/*training calender*/
#cphContent_cphContent_cphContent_test{
    padding: 20px;
    top:70px !important;
}

#cphContent_cphContent_cphContent_pnlFilter{
    height:60px !important;
    padding:10px !important;
}

#cphContent_cphContent_cphContent_pnlFilter > table >tbody>tr{
    vertical-align:middle !important;
}

/*skills and shifts dropdown in adding shift in allocation view*/
#ddSideMenuSkill_DropDown, #ddSideMenuShift_DropDown {
    white-space: nowrap;
}

/*Scorecard dropdown in Training Calender*/
#ctl00_cphContent_frmEdit_ddlScorecard_cb_ddlScorecard_DropDown {
    width: 258px !important;
}

/*forecast sales button fix in the spreadsheet options*/

#cphContent_cphContent_pnlSpreadOptions{
    overflow:unset !important;
}

#cphContent_cphContent_pnlSpreadOptions > p > a > .rfdDecorated {
    font-family: 'Roboto', sans-serif !important;
    font-size:16px !important;
    background: var(--button-background-b) !important;
    border: 1px solid var(--button-background-b) !important;
    height: 44px;
    color: var(--primary) !important;
    cursor: pointer;
    font-weight: 300 !important;
    margin-bottom:5px !important;    
}

/*Forecast sales time picker issue fixed where the time was being wrapped*/
#ctl00_ctl00_cphContent_cphContent_dtSpreadIntervalStart_timeView_wrapper, #ctl00_ctl00_cphContent_cphContent_dtSpreadLastInterval_timeView_wrapper{
    white-space: nowrap !important;
}

/*fix for the hidden delete user icon in the edit shift in the schedule.*/
#ddlUser_taglist {
    white-space: pre-wrap !important;
}

/*notification custom message popup size fix*/
#ctl00_ctl00_ctl00_cphContent_cphContent_cphContent_rwFilter_C > .modal-edit-window-container > .modal-edit-content-container{
    height:100% !important;
}

#RadWindowWrapper_ctl00_ctl00_ctl00_cphContent_cphContent_cphContent_rwFilter{
    height:260px !important;
}


/*time sheet approval by day*/
.AllowanceClaimComment{
    width:200px;
    overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis !important;    
}


/*Menu Tips in the employee schedule*/
#ctl00_ctl00_cphContent_cphContent_mnuTooltip_detached{
    top:82px!important; 
    overflow-y:scroll !important;
}


/*Fix for the jittery screen in Day View*/
.ShiftSection.ReqSection{
    position:relative;
}

#cphContent_cphContent_cphContent_pnlEditRequirement.req-edit{
    position:absolute;
}


#ctl00_ctl00_cphContent_cphContent_tgPayRateVariation_FrozenScroll{
    width: 2100px !important;
}

/*bulk move fix*/
#ctl00_ctl00_ctl00_cphContent_cphContent_cphContent_radWinBulkMove_C{
    width:580px !important;
}

#ctl00_ctl00_cphContent_cphContent_schedulePolicyWarningPrompt_C_warningConfirmButton, #ctl00_ctl00_cphContent_cphContent_schedulePolicyWarningPrompt_C_warningCancelButton {
    font-size: 16px !important;
    font-family: "Roboto",sans-serif;
    min-width: 100px !important;
    height: 44px !important;
    padding: 5px 16px;
    color: var(--primary) !important;    
    border: 1px solid var(--button-background-b) !important;
    cursor: pointer;
}

#ctl00_ctl00_cphContent_cphContent_schedulePolicyWarningPrompt_C_warningConfirmButton {
    background: var(--button-background-b) !important;
}

#ctl00_ctl00_cphContent_cphContent_schedulePolicyWarningPrompt_C_warningCancelButton {
    background: var(--button-background) !important;
}

.tabstrip-content-container:has(#ctl00_ctl00_ctl00_cphContent_cphContent_cphContent_frmEdit_tmpEdit){
    overflow:scroll !important;
}

.setUpBackGroundColour {   
    background-color:var(--filter-background) !important;
}


#ctl00_ctl00_ctl00_cphContent_cphContent_cphContent_frmEdit_departmentGrid_ctl00_ctl05_mapDepartment_ctl04,
#ctl00_ctl00_ctl00_cphContent_cphContent_cphContent_frmEdit_LocationMap_ctl04 {
    left: 74px !important;
    top: 0px !important;
    overflow-y: hidden !important;
    height:29px !important;
}

#ctl00_ctl00_ctl00_cphContent_cphContent_cphContent_frmEdit_departmentGrid_ctl00_ctl05_mapDepartment_ctl04.RadButton.RadButton_T2W.rbSkinnedButton.clear-image-button.rbHovered,
#ctl00_ctl00_ctl00_cphContent_cphContent_cphContent_frmEdit_LocationMap_ctl04.RadButton.RadButton_T2W.rbSkinnedButton.clear-image-button.rbHovered {
        background-position: unset !important;
        outline: none !important;
        border: none !important;
    }


#shiftMenu-AttendanceMenu {
    background-color: var(--button-text);
}

#form1 > div > div > .rcbFooter > .dbComboBoxFooter {
    height: 50px !important;
}

#bulkAwtGrid .ChkAllAwtEx {
    width:8px;
}

#cphContent_pnl{
    height:92% !important;
}

.new-label {
    background: #10cf10;
    color: white;
    border-radius: 4px;
    padding: 4px 10px;
    font-size: 12px;
    margin: 0px 10px;
}

.legacy-tag {
    background-color: #808080;
    color: #ffffff;
    border-radius: 50px;
    padding: 4px 10px;
    font-size: 12px;
    margin: 0px 10px;
}