* {
    /*border: 0;*/
    outline: none;
}

.header {
    border-left: 1px solid #808080;
    border-right: 1px solid #808080;
    border-top: 0px solid #808080;
    border-bottom: 1px solid #ccc;
    background: url(/images/sprite.png) repeat-x 0px 0px;
    background-color: #3589c5;
    color: #000000;
    font-size: 9pt;
    font-weight: bold;
    line-height: 1.9;
    font-family: arial,helvetica,clean,sans-serif;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 0px;
    padding-bottom: 0px;
}

.legendDiv {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.body {
    background-color: #f2f2f2;
    border-color: #808080;
    border-style: solid;
    border-width: 0px 1px;
    padding: 10px;
    text-align: center;
    font: 400 10pt Arial;
}


input:focus {
    background-color: rgb(230, 230, 230);
}

input:hover {
    background-color: rgb(230, 230, 230);
}

input[disabled="disabled"] {
    filter: grayscale(1);
    background-color: lightgray;
    color: gray;
    cursor: default;
    opacity: 0.5;
}

    input[disabled="disabled"]:hover {
        background-color: lightgray;
    }

textarea:focus {
    /*background: #ffffcc;*/
    background-color: rgb(230, 230, 230);
}

textarea:hover {
    /*background: #ffffcc;*/
    background-color: rgb(230, 230, 230);
}

/*.rcbInputCell :hover {
    background-color: #ffffcc !important;
    background: #ffffcc !important;
}

.rcbInputCell :focus {
    background-color: #ffffcc !important;
    background: #ffffcc !important;
}*/


.MainDiv {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    vertical-align: middle;
    left: 50%;
}




body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, textarea, p, blockquote {
    margin: 0;
    padding: 0;
    cursor: default;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

html {
    height: 100%;
}

body {
    height: 100%;
    margin: 0;
    background-repeat: no-repeat;
    background-attachment: fixed;
}

th, td {
    vertical-align: middle;
}

.greybg {
    background: #eaeaea;
    width: 100%;
}

.bgImage {
    background-image: url(../images/backgrounds/Default-Light-BusinessBlue.jpg);
    background-repeat: no-repeat;
    background-size: cover;
}


.gradient {
    background: #dadbdb;
    background: -moz-linear-gradient(top, #464646 0%, #64AABE 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#464646), color-stop(100%,#64AABE)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #464646 0%,#64AABE 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #464646 0%,#64AABE 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #464646 0%,#64AABE 100%); /* IE10+ */
    background: linear-gradient(top, #464646 0%,#64AABE 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr= '#464646', endColorstr= '#64AABE',GradientType=0 ); /* IE6-9 */
}

.mainLogo {
    display: block;
    margin-left: auto;
    margin-right: auto;
    margin-top: 200px;
    width: 300px;
}

/*
.favDiv {
    
    border: thin solid orange;
    width: 500px;
    height: 900px;
    float: left;
    position: absolute;
    padding-top: 45px;
    margin: 0 0 0 0;
}

    */

/* ====================== LOADING SPINNER ==========================*/

body.loading, body.loading * {
    cursor: wait !important;
}

#loader {
    display: table;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 999999;
}

    #loader > div {
        display: none;
        width: 100%;
        height: 100%;
        background: rgba(1,1,1,0.2);
        text-align: center;
        vertical-align: middle;
    }

        #loader > div > div {
            padding: 10px 25px 15px 18px;
            background-color: white;
            width: 50px;
            margin: auto;
            border-radius: 10px;
            border: 1px solid #323232;
        }

/*=================================================*/
.flex-grid {
    max-width: 800px;
    max-height: 600px;
    width: 800px;
    height: 600px;
    float: left;
    position: absolute;
    top: 35px;
    display: flex;
    flex-flow: column;
    flex-wrap: wrap;
    /*border: solid thin pink;*/
}

    .flex-grid .desktopFavorite {
        font-size: 8pt;
        text-align: center;
        width: 100px;
        height: 100px;
        font-family: Arial;
        font-size: 9pt;
        overflow: hidden;
        color: white;
        /*border: solid thin yellow;*/
    }

        .flex-grid .desktopFavorite a {
            text-decoration: none;
            color: white;
        }

        .flex-grid .desktopFavorite img {
            display: block;
            margin: auto;
            margin-bottom: 3px;
        }

    .flex-grid .desktopFavoriteLink {
        text-decoration: none;
        color: white;
        overflow: hidden;
    }


/*.col {
    overflow: hidden;
    -webkit-column-count: 4;*/ /* Chrome, Safari, Opera */
/*-moz-column-count: 4;*/ /* Firefox */
/*column-count: 4;*/
/*border: solid thin yellow;*/
/*}*/

/*=================================================*/



.MenuGroup {
    cursor: pointer;
    z-index: 101;
    /*	background: #b1d8f5;  Old browsers */
}

.SchedulerGreen {
    /* this is actually yellow*/
    background: #FFFACD !important;
}

.SchedulerBlue {
    /*background: #64B1FF;*/
    background: #D4E9FE !important;
}

.rsContent .rsContentTable .rsRow, .SchedulerGreen {
    /*background:#CEFFCE !important;*/
    background: #FFFACD !important;
}


.SchedulerScrollGreen {
    background: #FFFACD !important;
}

.SchedulerScrollBlue {
    /*background: #64B1FF;*/
    background: #D4E9FE !important;
}

.SchedulerScrollNone {
    /*background: #64B1FF;*/
    background: #f5fcff !important;
}



.favButtonHover:hover {
    background-color: transparent;
}




/*
table.RadCalendar_Web20 .rcRow .rcOutOfRange {
    background: Azure;
    font-style: italic;
}*/


/* Grid column header buttons, used for sorting grid columns*/
.HeaderButton {
    border: none;
    cursor: pointer;
    height: 100%;
    font-size: 8pt;
}

.ArialBold8 {
    font: "Arial";
    font-weight: bold;
    font-size: 8pt;
    border: none;
    cursor: pointer;
    height: 100%;
}



/* Rad Calendar Input Control */

.RadInput_Web20 .riTextBox {
    border: thin solid #404040 !important;
}

.RadInput_Web20 .riDisabled {
    border: thin solid #404040 !important;
}

/* Rad Combobox Style */

.RadComboBox table td.rcbInputCell {
    box-shadow: 1px 1px 0px 0px #505050 inset, 0px -1px #505050 inset;
    background: none;
    background-color: white;
}

.RadComboBox table td.rcbArrowCell {
    box-shadow: 0px 1px 0px 0px #505050 inset, 0px -1px #505050 inset;
}



/* RadCalendar Control */

.RadCalendar_VimBiz {
    background-color: white;
    color: black;
    border: thin solid white;
    font-family: Arial;
}


.RadCalendar .rcTitlebar {
    border: thin solid white !important;
    font-family: Arial;
}



.rcTitle {
    font-size: 10pt;
    font-weight: bold;
    border: thin solid white;
}



/*.RadCalendar .rcTitlebar .rcNext {
    color: green !important;
    border: thin solid red !important;
}

.RadCalendar_VimBiz .rcFastNext {
    border: thin solid red;
    color: red;
}


.RadCalendar_VimBiz .rcPrev {
    border: thin solid red;
    color: red;
    background-color: lightpink;
}

.RadCalendar_VimBiz .rcFastPrev {
    border: thin solid red;
    color: red;
}*/



.RadCalendar_VimBiz a {
    background-color: white;
    color: black;
    border: none;
}

    .RadCalendar_VimBiz a:hover {
        background-color: deepskyblue;
        color: black;
        border: none;
    }

.RadCalendar_VimBiz .rcCalendar {
    border: thin solid white;
    font-family: Arial;
}

.RadCalendar_VimBiz .rcCalendars {
    border: thin solid white;
}

.RadCalendar_VimBiz .rcWeek {
    border: none;
    color: white;
    background-color: white;
    font-size: 9pt;
}

.RadCalendar_VimBiz .rcRow {
    border: none;
    color: white;
    background-color: white;
    font-size: 9pt;
}

    .RadCalendar_VimBiz .rcRow th {
        border: none;
        color: #5f91cd;
        background-color: #e6eff9;
        font-size: 9pt;
    }

.RadCalendar_VimBiz .rcWeek th {
    border: none;
    color: #5f91cd;
    background-color: #e6eff9;
    text-align:center;
}

.RadCalendar_VimBiz .rcSelected a {
    background-color: deepskyblue;
}

.RadCalendar_VimBiz .rcSelected span {
    color: gray;
}

.RadCalendarMonthView .RadCalendarMonthView_VimBiz {
    background-color: red !important;
}

.table.RadCalendarMonthView {
    background-color: white !important;
}

table.RadCalendar_VimBiz .rcRow .today a {
    color: black;
    font-weight: 900;
    /*border-radius: 15px;*/
    /*border: 1px solid pink;*/
}


/* Holidays */
table.RadCalendar_VimBiz .rcRow .holidays a {
    color: mediumorchid;
    font-weight: bold;
    font-style: italic;
}

/* Red Dates */
table.RadCalendar_VimBiz .rcRow .reddates a {
    color: black;
    background-color: #fcafaf;
    border: solid thin #fcafaf;
}


table.RadCalendar_VimBiz .rcRow .reddatesblueborder a {
    background-color: #fcafaf;
    border: solid 1px #008aff;
}

table.RadCalendar_VimBiz .rcRow .reddatesblueborder-holiday a {
    background-color: #fcafaf;
    color: mediumorchid;
    font-weight: bold;
    font-style: italic;
    border: solid 1px #008aff;
}

table.RadCalendar_VimBiz .rcRow .reddates-holiday a {
    color: mediumorchid;
    font-weight: bold;
    font-style: italic;
    background-color: #fcafaf;
    border: solid thin #fcafaf;
}


table.RadCalendar_VimBiz .rcRow .bluedates a {
    color: black !important;
    border: solid 1px #008aff;
}

table.RadCalendar_VimBiz .rcRow .bluedates-dash {
    color: black;
    background-color: white;
    border: dashed 1px black;
}


table.RadCalendar_VimBiz .rcRow .bluedates-dash-holiday {
    color: mediumorchid !important;
    font-weight: bold;
    font-style: italic;
    background-color: white;
    border: dashed 1px black;
}

    table.RadCalendar_VimBiz .rcRow .bluedates-dash-holiday a {
        color: mediumorchid !important;
    }


table.RadCalendar_VimBiz .rcRow .bluedates-holiday a {
    color: mediumorchid;
    font-weight: bold;
    font-style: italic;
    border: solid 1px #008aff;
}

table.RadCalendar_VimBiz .rcRow td.rcOutOfRange {
    background-color: white;
    font-style: italic;
    color: grey;
    border: solid thin white;
}

/*table.RadCalendar_VimBiz .rcRow .rcOutOfRange span {
    background-color: white;
    font-style: italic;
    color: gray;
    border: thin solid white;
}*/

/*table.RadCalendar_VimBiz .rcRow .disabled {
    background-color:white;
    font-style: italic;
    color:gray;
    border: thin solid white;

}*/

table.RadCalendar_VimBiz .rcOtherMonth {
    color: white !important;
    background-color: white;
}

.disabled {
    font-style: italic;
    color: gray;
    border: thin solid white;
}


/*Calendar popup when clicking the top date range on the Month Calendar*/
table.RadCalendarMonthView {
    background-color: white;
}



/* Request Dates */
table.RadCalendar_VimBiz .rcRow .requestdates a {
    color: #FF7200;
    border: solid 1px #FF7200;
}



.rcPrev {
    background: url(../images/Arrow_DarkBlue_Left_Single_Default.png) repeat-x 0px 0px;
}

    .rcPrev:hover {
        background: url(../images/Arrow_DarkBlue_Left_Single_Hover.png) repeat-x 0px 0px;
    }

.rcFastPrev {
    background: url(../images/Arrow_DarkBlue_Left_Double_Default.png) repeat-x 0px 0px;
}

    .rcFastPrev:hover {
        background: url(../images/Arrow_DarkBlue_Left_Double_Hover.png) repeat-x 0px 0px;
    }

.rcNext {
    background: url(../images/Arrow_DarkBlue_Right_Single_Default.png) repeat-x 0px 0px;
}

    .rcNext:hover {
        background: url(../images/Arrow_DarkBlue_Right_Single_Hover.png) repeat-x 0px 0px;
    }

.rcFastNext {
    background: url(../images/Arrow_DarkBlue_Right_Double_Default.png) repeat-x 0px 0px;
}

    .rcFastNext:hover {
        background: url(../images/Arrow_DarkBlue_Right_Double_Hover.png) repeat-x 0px 0px;
    }


.rwControlButtons li {
    /* display: none;*/
}

/* End RadCalendar Control */

/*==================================================*/

.CutCopyPaste {
    font-family: Helvetica Neue, Helvetica, Arial, sans-serif !important;
    font-style: normal;
    text-decoration: none !important;
    background-color: white !important;
    color: black;
}


.CutCopyPasteItem {
    padding-top: 2px !important;
    color: black;
    background-color: #f5f5f5 !important;
    font-family: Helvetica Neue, Helvetica, Arial, sans-serif !important;
    font-style: normal;
    text-decoration: none !important;
    font-size: 10pt;
    vertical-align: middle !important;
    line-height: 1.5em;
    margin-bottom: 0px !important;
    padding-bottom: 0px !important;
}

    .CutCopyPasteItem:hover {
        background-color: #1A90FF !important;
        font-family: Helvetica Neue, Helvetica, Arial, sans-serif !important;
        font-style: normal;
        text-decoration: none !important;
        font-size: 10pt;
        vertical-align: middle !important;
        line-height: 1.5em;
        margin-bottom: 0px !important;
        padding-bottom: 0px !important;
    }


.rmLink.CutCopyPasteItem img.rmLeftImage {
    height: 16px !important;
    margin-top: 0px !important;
}

/*=====================================================*/


/*========Menu Theme Test==========================================*/

.RadMenu_VimBiz {
    font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
    border-bottom: thin solid black;
    width: 100%;
}


.taskbarMenuItemUser {
    float: right;
    background-color: #dcdde0 !important;
    border-left: thin solid red;
}

    .taskbarMenuItemUser .rmLeftImage {
        /* This centers the image beside the text */
        padding-top: 1px;
    }

.taskbarMenuItemRight .rmLeftImage {
    /* This centers the image beside the text */
    padding-top: 1px;
}

/* Top taskbar Info button*/
.taskbarMenuItemRight {
    float: right;
    background-color: #dcdde0 !important;
}


/* Top taskbar items*/
.taskbarMenuItem {
    min-width: 110px;
    background-color: red !important;
}

    .taskbarMenuItem:hover {
        background-color: rgb(51, 153, 255);
    }

    .taskbarMenuItem .rmText {
        /* This moves the text a little closer to the image */
        /*margin-left: -2px;*/
    }

    .taskbarMenuItem .rmLeftImage {
        /* This centers the image beside the text */
        padding-top: 1px;
    }

.rmItem.taskbarMenuItem {
    background-color: #dcdde0 !important;
}

/* Top taskbar items*/
.taskbarMenuHome {
    min-width: 25px;
    background-color: #dcdde0 !important;
}

    .taskbarMenuHome .rmLeftImage {
        padding: 2px 0px 2px 0px;
    }


/* Top Menu Bar, Background.  Menu Items lay on top of this and have their own styles*/
ul.rmRootGroup.rmHorizontal {
    border: none;
    background-color: #dcdde0 !important;
}

/* Start Button - this makes the VimBiz button text white, but not the rest of the menu text*/
.startMenu > .rmLink.rmRootLink.rmExpand.rmExpandDown {
    color: white;
}



.startMenu {
    font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
    font-style: italic;
    color: white !important;
    border-style: none;
    border: none;
    -webkit-font-smoothing: antialiased;
    background: #3574cf !important;
    background: linear-gradient(to bottom, #3574cf 45%,#4f9afe 110%) !important;
    vertical-align: middle !important;
    padding: 0;
    margin: 0;
}

    .startMenu:hover {
        color: white !important;
        border: 1px;
        border-style: none;
        border: none;
        -webkit-font-smoothing: antialiased;
        background: #25a0da;
    }


/*  End Top Menu & Start Button*/

/* Lowest level background of vertical menu*/
ul.rmVertical.rmGroup.rmLevel1 img {
    height: 16px;
    margin-top: -8px;
    margin-left: 5px;
}

ul.rmVertical.rmGroup {
    border: 1px solid rgb(238, 238, 238);
}
/* End-  Lowest level background of vertical menu*/

.RadMenu .rmTopArrow, .RadMenu .rmBottomArrow, .RadMenu .rmScrollWrap {
    background-color: gainsboro;
}

    .RadMenu .rmGroup:before, .RadMenu .rmMultiColumn:before,
    .RadMenu .rmScrollWrap > .rmHorizontal:before,
    .RadMenu .rmScrollWrap > .rmVertical:before {
        content: "";
        width: 30px;
        height: 100%;
        border: none !important;
        display: block;
        position: absolute;
        left: 0;
        top: 0;
    }

/*This is the background of the main menu items*/
div.RadMenu_VimBiz .rmItem {
    color: black;
    font-style: normal;
    font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
    text-indent: 0px;
    font-size: 14px;
    background-position: 0% 0%;
    font-weight: normal;
    border-left: 1px solid rgb(238, 238, 238);
    border-top: 1px solid rgb(238, 238, 238);
    border-right: 1px solid rgb(238, 238, 238);
    border-bottom: 1px solid rgb(238, 238, 238);
    margin-bottom: 0px;
    vertical-align: middle !important;
    background-color: rgb(251, 251, 251);
}

/*This is the background of the main menu LINK items*/
.startMenu < .RadMenu_VimBiz .rmItem .rmLink {
    font-size: 14px;
    background-color: rgb(251, 251, 251);
    background: -moz-linear-gradient(left, #dcdde0 0%, #ffffff 100%);
    background: -webkit-gradient(linear, left, right, color-stop(0%,#dcdde0), color-stop(100%,#ffffff));
    background: -webkit-linear-gradient(left, #dcdde0 0%,#ffffff 100%);
    background: -o-linear-gradient(left, #dcdde0 0%,#ffffff 100%);
    background: -ms-linear-gradient(left, #dcdde0 0%,#ffffff 100%);
    background: linear-gradient(left, #dcdde0 0%,#ffffff 100%);
}

/*When hovering on a LINK*/
div.RadMenu_VimBiz .rmItem .rmLink:hover {
    font-size: 14px;
    color: white;
    background-color: rgb(51, 153, 255);
    font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
    -webkit-font-smoothing: antialiased !important;
    background: -moz-linear-gradient(top, rgb(51, 153, 255) 0%, rgb(51, 153, 255) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(51, 153, 255)), color-stop(100%,rgb(51, 153, 255)));
    background: -webkit-linear-gradient(top, rgb(51, 153, 255) 0%,rgb(51, 153, 255) 100%);
    background: -o-linear-gradient(top, rgb(51, 153, 255) 0%,rgb(51, 153, 255) 100%);
    background: -ms-linear-gradient(top, rgb(51, 153, 255) 0%,rgb(51, 153, 255) 100%);
    background: linear-gradient(top, rgb(51, 153, 255) 0%,rgb(51, 153, 255) 100%);
}


.rmGroup, .RadMenu .RadMenu_VimBiz .rmPopup {
    padding: 0px !important;
    position: relative;
}


.RadMenu .rmVertical > .rmSeparator {
    margin: 0;
    border: medium solid rgb(238, 238, 238);
}

.RadMenu .Popout {
    display: none;
    width: 16px;
    height: 16px;
    position: absolute;
    right: 2px;
    z-index: 7001;
    top: 6px;
    background-image: url('../images/popOutWhite.png') !important;
}


.rmLink.rmRootLink.rmImageOnly:hover {
    margin: auto;
    outline: none;
}

.rmLink.rmRootLink.rmImageOnly > img {
    margin: auto;
}


/************************************************************* 
                        LOGIN PAGES
***************************************************************/
body.login {
    background-color: gainsboro;
    color: #30507f;
}

.login .logo {
    margin: auto;
    padding: 20px 0;
    width: 400px;
    text-align: center;
}

.login .main {
    width: 400px;
    margin: 0 auto;
    font-family: Calibri;
    background-color: white;
    padding: 20px;
    border-radius: 20px;
}

.msgContainer {
    min-height: 23px;
    background-repeat: no-repeat;
    background-position: left 10px top 10px;
    border-radius: 10px;
    display: block;
    font-size: 12pt;
    vertical-align: middle;
    padding: 11px;
    margin-bottom: 20px;
}

    .msgContainer span {
        margin-left: 40px;
        display: block;
    }

    .msgContainer.info {
        color: #30507f;
        background-color: #add9ff;
        background-image: url('../images/WarningYellow_24.png') !important;
    }

    .msgContainer.warning {
        color: #c99e2e;
        background-color: #ffe499;
        background-image: url('../images/WarningYellow_24.png') !important;
    }

    .msgContainer.error {
        color: red;
        background-color: mistyrose;
        background-image: url('../images/CircleXRed_24.png') !important;
    }

.login hr {
    border-top: 1px lightgrey dashed;
    margin: 20px 0 20px 0;
}

.login .txt > input {
    border: 1px solid lightgrey;
    font-size: 14pt;
    width: 100%;
    text-indent: 35px;
    height: 35px;
}

.login .txt > span {
    float: left;
    height: 35px;
    width: 35px;
    position: absolute;
}

.login h3 {
    font-size: 12pt;
    color: gray;
    width: 100%;
    margin-top: 10px;
}

.login .usernameTxt > span {
    background: url('../images/PersonGrey_16.png') 10px center no-repeat;
}

.login .pwdTxt > span {
    background: url('../images/Lock_Closed_16.png') 10px center no-repeat;
}

.login .pinTxt > span {
    background: url('../images/Gear_16.png') 10px center no-repeat;
}

.login .captchaTxt > span {
    background: url('../images/captcha_icon.png') 10px center no-repeat;
}

.login .verificationTxt > span {
    background: url('../images/verification_code.png') 10px center no-repeat;
}



.login .buttonContainer {
    width: 100%;
    height: 100%;
    padding: 0px;
    display: table;
    margin-top: 25px;
}

.login .buttonOption {
    width: 50%;
    vertical-align: middle;
    display: table-cell;
    border: 1px solid lightgrey;
    background-color: #fdfffa;
    padding-left: 5px;
}

.login .button {
    display: table-cell;
    border: 1px solid #30507f;
}

    .login .button > input {
        width: 100%;
        background-color: #30507f;
        font-size: 13pt;
        height: 32px;
        color: white;
        border-style: none;
    }


/************************************************************* 
               2 FACTOR AUTH & CAPTCHA 
***************************************************************/


.capContainer {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    
}

.captcha {
    
    margin-left: 25%;
    margin-right: 25%;
}


.rcRefreshImage {
    background: url(../images/reload_16.ico) no-repeat 0;
    border-radius: 3px;
    position: absolute;
    top: 65px;
    width: 16px;
    height: 22px;
}


.rcLabelClass {
    position: relative;

}

.rcCaptchaAudioLink {
    background-color: #30507f;
    border-radius:3px;
    position: absolute;
    left: 185px;
    top: 65px;
    height: 22px;
    width: 96px;
    font-size: 12px;
    line-height: 22px;
    text-decoration: none;
    text-align: center;
    color: white;
}

.requestCode {
    text-decoration: none;
    color: darkgray;
}


/************************************************************* 
                 TABS STYLES
***************************************************************/
.VimDevPanel img {
    width: 16px;
    height: 16px;
    margin-left: 4px;
    margin-top: 3px;
}

.VimDevPanel .VimdevGridCell img {
    margin-left: 0;
    margin-top: 0;
}

.VimDevPanel .VimdevLinkButton,
.form-menu-container .VimdevLinkButton,
.form-menu-btn {
    font-family: Arial;
    font-size: 10pt;
    font-weight: bold;
    vertical-align: bottom;
    margin-left: 4px;
    text-decoration: none;
    color: black !important;
}

.form-menu-btn {
    position: absolute;
    right: 10px;
    top: 35px;
    height: 16px;
    display: inline-block;
    background: url(../images/DotsHorizontalDarkGray_16.png) no-repeat 0;
    background-position-x: 5px;
    cursor: pointer;
    z-index: 1000;
    padding: 5px 5px 5px 21px;
    border-collapse: collapse;
    border: 1px solid transparent;
}

    .form-menu-btn:hover {
        border: 1px solid lightgray;
        background-color: gainsboro;
    }

    .form-menu-btn.popup {
        top: 5px;
    }

/* Dropdown Content (Hidden by Default) */
.form-menu-container {
    display: none;
    position: absolute;
    background-color: #f1f1f1;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    top: 59px;
    right: 10px;
    border: solid 1px gray;
    z-index: 11000;
}

    .form-menu-container.popup {
        top: 29px;
    }

    .form-menu-container .form-menu-item {
        white-space: nowrap;
        padding: 5px 5px 7px 5px;
    }

        .form-menu-container .form-menu-item .VimdevLinkButton,
        .form-menu-container .form-menu-item img {
            white-space: nowrap;
            display: inline-block;
            cursor: pointer !important;
        }

        .form-menu-container .form-menu-item:hover {
            border: transparent 0 gray;
            background-color: gainsboro;
        }

/*.tabstripContainer .tabitem{
    border-color:gray!important;
}

.tabstripContainer .tabitem.selected{
    border-color:black!important;
}*/
/************************************************************* 
                 TAB OVERFLOW STYLES
***************************************************************/
/* Dropdown Button */
.tabOverflowBtn {
    height: 25px;
    width: 20px;
    /*margin-left:5px;*/
    background-repeat: no-repeat;
    cursor: pointer;
    background-position: center;
    border: solid 1px transparent;
}

    /* Dropdown button on hover & focus */
    .tabOverflowBtn:hover, .tabOverflowBtn:focus {
        background-color: gainsboro;
        border: solid 1px gray;
    }

/* The container <div> - needed to position the dropdown content */
.tabWrapper {
    position: absolute;
    display: inline-block;
    height: 20px;
    width: 20px;
}

/* Dropdown Content (Hidden by Default) */
.tabDropdownContainer {
    display: none;
    position: absolute;
    background-color: #f1f1f1;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1000;
    right: -10px;
    top: 30px;
    border: solid 1px gray;
}

    .tabDropdownContainer .VimDevPanel {
        box-shadow: none;
    }

    /* Links inside the dropdown */
    .tabDropdownContainer div {
        display: block;
        z-index: 1000;
        width: 100%;
        border: solid 1px transparent !important;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        height: 25px;
        position: relative;
        font-weight: bold;
        font-family: Arial;
        font-size: 10pt;
    }

    .tabDropdownContainer a {
        color: black;
        text-decoration: none;
        position: relative !important;
        left: 5px !important;
        top: 0px !important;
        vertical-align: text-top !important;
        /*margin:0px 5px 5px 5px!important;*/
    }

    .tabDropdownContainer img {
        position: relative !important;
        vertical-align: middle;
    }

    .tabDropdownContainer div:hover {
        border: solid 1px gray;
        background-color: gainsboro;
    }

/* Show the dropdown menu (use JS to add this class to the .dropdown-content container when the user clicks on the dropdown button) */
.show {
    display: block;
}

/************************************************************* 
                 VIMDEV CONTROLS
***************************************************************/

.VimdevButton, .VimdevCalendar, .VimdevCheckbox, .VimdevCombobox, .VimdevDateTimePicker, .VimdevLinkButton, .VimdevImageButton, .VimdevRadioButton {
    cursor: pointer;
}

.VimdevImageButton, .VimdevCombobox, .VimdevCheckbox, .VimdevGroupBoxModel, .VimdevLabel, .VimdevTextbox, .VimdevRadioButton {
    font-family: Arial;
    font-size: 9pt;
}

    /*.VimdevTextBox.RadInputFocused,*/
    .VimdevTextBox input:focus,
    .VimdevTextBox textarea:focus,
    .VimdevCombobox .rcbFocused,
    .VimdevImageButton:focus,
    .VimdevCheckbox input:focus,
    .VimdevRadioButton input:focus,
    .VimdevDateTimePicker .RadInputFocused,
    .VimdevDateTimePicker a:focus {
        outline-style: solid;
        outline-color: #0080ff;
        outline-width: 2px;
        /* box-shadow: 0 0 8px #003e7d;*/
    }

        .VimdevCombobox .rcbFocused .rcbReadOnly .rcbInput {
            color: black;
        }

span.VimdevTextBox.RadInputFocused.RadInputMultiline {
    outline: none;
}

.riTextBox.riRead {
    background-color: rgb(235, 235, 235) !important;
}

.riTextBox.riEnabled {
    background-color: #fff !important;
}

.VimDevPanel {
    border-top: solid thin #45515f;
    border-left: solid thin #45515f;
    border-right: solid thin #45515f;
    z-index: 2;
    box-shadow: 3px 4px #bebebe, 2px 2px white inset;
    white-space: nowrap;
}

    .VimDevPanel:hover {
        background-color: #fcfcfc;
        /* cursor:pointer; */
    }

    .VimDevPanel.selected {
        box-shadow: 5px 1px 0px -2px #bebebe;
        /* cursor: default; */
        z-index: 99;
    }

        .VimDevPanel.selected .VimdevLinkButton:hover {
            cursor: default;
        }

.VimdevGroupBoxModel {
    position: absolute;
    /* JB 2020-08-10 Commented below styles. Moved styles from VimBizWebForm to here.
    border-width:1px;
    outline: solid thin black; 
    border:none;
    border-left: solid 1px #f7fbff;
    border-top: solid 1px #f7fbff;
            .Style.Add("border-color", ColorTranslator.ToHtml(VimBizThemeModule.Theme.FrameworkColor.GroupBoxBorder))
            .Style.Add("background-color", ColorTranslator.ToHtml(VimBizThemeModule.Theme.FrameworkColor.GroupBox))
            .Style.Add("color", ColorTranslator.ToHtml(VimBizThemeModule.Theme.FrameworkColor.GroupBoxText)) 'Actual: 8596b4, tweeked to match: b7cef7
 */
    border: solid 1px #8596b4;
    background: #a1b9dc;
    color: #484848;
}

/* Button background colors */
.VimdevImageButton {
    background-color: #b1cff5 !important;
    position: absolute;
    /* JB 2020-08-10 Moved styles from VimBizWebForm to here. */
    outline: solid 1px black;
    border: none;
    border-left: solid 1px #f7fbff;
    border-top: solid 1px #f7fbff;
}

    .VimdevImageButton.TextOverflow {
        padding-left: 25px;
    }

    .VimdevImageButton.TextOverflow, .VimdevLabel.TextOverflow {
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
    }

.VimdevButton {
    background-color: #b1cff5 !important;
}

/* Button hover colors */
.VimdevImageButton:hover {
    background-color: #c2deff !important;
}

.VimdevButton:hover {
    background-color: #c2deff !important;
}

/*
.VimdevLinkButton:hover{
    background-color: #ffffff !important;
}

/*.VimdevCheckbox {
}

.VimdevCombobox {
}*/

.VimdevRadioButton, .VimdevLabel, .VimdevCheckbox {
    background-color: transparent;
}

.VimdevWebTreeView {
    border-style: inset;
}
/*.VimDevPanel tr[fpspread=ch]
{
    height:30px!important;
}*/

/* ===========================================================
    BADGE
   ===========================================================*/

.badge {
    border-radius: 50%;
    width: 16px;
    height: 16px;
    display: flex;
    position: absolute; /* Position the badge within the relatively positioned button */
    align-items: center;
    justify-content: center;
    font-weight: 500;
    font-size: 0.85em;
    color: white;
    z-index: 10;
    border: 1px solid white;
}

.badge-sm {
    width: 8px;
    height: 8px;
    border: 1px solid white;
}

    .badge.blue {
        background-color: #2f4d77;
    }
    .badge.gray {
        background-color: gray;
    }

/* ===========================================================
BR CUSTOM GRID COLORS
===========================================================*/
    .VimDevPanel .grid-cube-icon {
        width: 10px;
        height: 10px;
        border: 1px solid black;
        display: inline-block;
        margin-right: 3px;
    }

.VimDevPanel tr:hover > .VimdevGridCell {
    background-color: rgb(232, 248, 252);
}

.VimDevPanel tr:hover > .VimdevGridHeader {
    background-color: #E6E6E6 !important;
}

.VimdevGridCell.VimdevGridHeader:hover {
    background-color: #E6E6E6 !important;
}

.VimdevGridCellGreyBackground {
    background-color: darkgray !important;
}

.VimdevGridRow.GridRowHover [class^="proj-br-day-type-"],
.VimdevGridRow.GridRowHover [class*=" proj-br-day-type-"],
.VimdevGridRow.GridRowHover .VimdevGridCellGreyBackground {
    opacity: 0.8;
}

/*.VimdevGridCell.selected {*/
/*position: relative;*/
/*background-image: url(../images/1x1.png) !important;
    background-size: contain;
    opacity: .5;
    border: 1px solid red;
}
.VimdevGridCell.GridCellHover {*/
/*position: relative;*/
/*background-image: url(../images/1x1.png) !important;
    background-size: contain;*/
/*background-color: transparent!important;*/
/*opacity: 1;
}*/
/*
.VimdevGridRow.selected td {
    border-bottom: 2px solid black !important;
    border-top: 2px solid black !important;
}
    .VimdevGridRow.selected td:first-child {
        border-left: 2px solid black !important;
    }
    .VimdevGridRow.selected td:last-child {
        border-right: 2px solid black !important;
    }
.VimdevGridRow.GridRowHover td {
    border-bottom: 2px solid black !important;
    border-top: 2px solid black !important;
}
    .VimdevGridRow.GridRowHover td:first-child {
        border-left: 2px solid black !important;
    }
    .VimdevGridRow.GridRowHover td:last-child {
        border-right: 2px solid black !important;
    }*/
.VimDevPanel .VimdevLinkButton img {
    vertical-align: bottom;
    margin-right: 3px;
}

.VimDevGridNoRecordsFound {
    position: absolute;
    background: white;
    font-family: arial,helvetica,clean,sans-serif;
    font-size: 10pt;
}

    .VimDevGridNoRecordsFound div {
        text-align: center;
        padding: 10px;
        opacity: 0.5;
        margin: 10px;
        border: 1px solid #a1a1a1;
        background: #e3e3e3;
    }

    .VimDevGridNoRecordsFound span {
        display: table-cell;
        font-size: 8pt;
        text-align: justify;
        vertical-align: top;
    }

    .VimDevGridNoRecordsFound img {
        padding-right: 10px;
        filter: grayscale(100%);
    }

    .VimDevGridNoRecordsFound ul {
        margin-left: 40px;
        margin-top: 15px;
    }

    .VimDevGridNoRecordsFound li {
        text-align: left;
        padding: 3px 0px
    }

        .VimDevGridNoRecordsFound li > img {
            vertical-align: bottom;
            padding-right: 5px;
            filter: grayscale(0%);
        }

    .VimDevGridNoRecordsFound H3 {
        padding-bottom: 5px;
    }


.VimdevGridRow > td,
.VimdevGridCell {
    vertical-align: middle;
    background-color: white;
    border-top-style: Solid;
    border-top-width: 0px;
    border-left-color: #a0a0a0;
    border-left-style: Solid;
    border-left-width: 1px;
    border-right-color: #a0a0a0;
    border-right-style: Solid;
    border-right-width: 1px;
    border-bottom-style: Solid;
    border-bottom-width: 1px;
    border-bottom-color: #a0a0a0;
    font-family: arial,helvetica,clean,sans-serif;
    font-size: 10pt;
    padding: 5px 5px !important;
    /*white-space:pre-wrap;*/
    white-space:normal;
}

    /*for cells in the grid that are for images, we do not want any padding for left and right*/
    .VimdevGridCell[celltype2="ImageCellType" i] {
        padding: 5px 0px !important;
    }

    .VimdevGridCell.VimdevGridHeader {
        background-color: #EFEFEF !important;
        border: 1px solid darkgray;
        text-align: center;
        vertical-align: middle;
        /*background: url(../images/GridHeader.jpg) repeat 0;*/
        padding: 0px 2px !important;
        height: 30px;
    }
        /*if the text on a header is too long for the visible area then we show
            the elipse instead of it continuing on.
        */
        .VimdevGridCell.VimdevGridHeader input {
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            font-size: 10pt;
        }

    .VimdevGridCell .GridCellOverflow {
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
    }

    .VimdevGridCell a {
        color: #4975c9;
        cursor: pointer;
    }

        .VimdevGridCell a:hover {
            text-decoration: none;
        }


.VimdevSPGridCell {
    text-wrap: pretty;
}

.VimdevSPGridCell a {
    color: #4975c9;
    cursor: pointer;
}

    .VimdevSPGridCell a:hover {
        text-decoration: none;
    }

/*
.VimdevLinkButton img{

}
.VimdevWebTreeViewNode {
}
.VimdevButton {
}
.VimdevCalendar {
}
    
.VimdevWebContextMenuItem {
}

.VimdevWebContextMenu {
}

.VimdevDateTimePicker {
}

.VimdevWebHTMLEditor {
}
    
.VimdevImage {
}

.VimdevLabel {
}


.VimdevRadioButton {
}

.VimdevTextBox {
    
}
    
.VimdevTextBox:focus {
    background-color: rgb(230, 230, 230)!important;
}

.VimdevTextBox:hover {
    background-color: rgb(230, 230, 230)!important;
}


    

.SpreadContextMenu  {
    
}

.SpreadContextMenu li {
    
}
*/


.SpreadContextMenu li .icon {
    background-repeat: no-repeat;
    height: 16px !important;
    width: 16px !important;
}

.icon {
    height: 16px;
    width: 16px;
    margin-top: 4px !important;
}


/************************************************************* 
                 Colorpicker Override
***************************************************************/


div.CustomHeight .rcpIcon,
div.CustomHeight .rcpIcon a {
    height: 12px;
    width: 26px;
    max-width: 26px;
    position: absolute;
}

.RadColorPicker .rcpIcon {
    min-width: 29px;
}

div.CustomHeight .rcpIcon a {
    padding: 2px 6px;
    border: thin solid black;
    border-radius: unset;
}

    div.CustomHeight .rcpIcon a:hover,
    div.CustomHeight .rcpIcon a:active,
    div.CustomHeight .rcpIcon a:focus {
        background-position: 0 0;
    }

.RadTreeView {
    font-size: 10pt;
    font-family: arial,helvetica,clean,sans-serif;
}


/*************************************************************
             TIMECARD IMAGES
***************************************************************/

/***BLANK IMAGE***/
.TimecardImage {
}

    .TimecardImage a div {
        background-repeat: no-repeat;
        background-position-y: center;
        background-position-x: 5px;
    }

        .TimecardImage a div nobr {
            padding-left: 15px;
        }

    /***CANCEL IMAGE***/
    .TimecardImage.Cancel a div {
        background-image: url('../images/cancel8.png') !important;
    }

    /***GREEN DOT***/
    .TimecardImage.GreenDot a div {
        background-image: url('../images/GreenDot_8.png') !important;
    }

    /***BLUE SQUARE***/
    .TimecardImage.BlueSquare a div {
        background-image: url('../images/blue_square.png') !important;
    }

/*************************************************************
             PANEL LAYOUT
***************************************************************/

.updatePanel {
    border: none;
    margin: 0;
    position: absolute;
}



/*.rsAllDayRow .rsAptMid {
    height: 20px;    
    
}*/

.rsAptContent {
    line-height: 20px;
}

/*    .rsAptContent div {
        display: inline-block;
        vertical-align: middle;
        line-height: normal;
        text-align:center;
    }*/


.aptErrorText {
    height: 18px;
    line-height: 18px;
}

.aptError {
    width: 100%;
    display: block;
}


.aptErrorImg {
    float: right;
    padding-right: 5px;
}

.apptHeader {
    width: 100%;
    background-color: lightgrey;
    border-radius: 3px;
    border: solid thin darkgray;
    padding-left: 2px;
    margin-left: -6px;
    color: black;
}

    .apptHeader img {
        float: right;
        padding-right: 5px;
    }

/*************************************************************
             Tooltips
***************************************************************/

.my-timecards-tooltip{
    min-width: 250px;
}

    .my-timecards-tooltip th{
        background-color:gainsboro;
    }

    .my-timecards-tooltip th,
    .my-timecards-tooltip td {
        padding: 4px 10px;
    }

    .my-timecards-tooltip td {
        text-align: center;
    }

    .my-timecards-tooltip td:first-child {
        text-align: left;
    }

    .my-timecards-tooltip tr:nth-child(2n+1) td {
        background-color: ghostwhite;
    }

/*************************************************************
    GENERIC (Bootstrap styles)
***************************************************************/


.w-10 {
    width: 10%;
}

.w-20 {
    width: 20%;
}

.w-25 {
    width: 25%;
}

.w-30 {
    width: 30%;
}

.w-40 {
    width: 40%;
}

.w-50 {
    width: 50%;
}

.w-60 {
    width: 60%;
}

.w-70 {
    width: 70%;
}

.w-75 {
    width: 75%;
}

.w-80 {
    width: 80%;
}

.w-90 {
    width: 90%;
}

.w-100 {
    width: 100%;
}

.w-auto {
    width: auto;
}

.text-nowrap {
    white-space: nowrap;
}

.text-center {
    text-align: center !important;
}

.text-end {
    text-align: right !important;
}