/*
 * Do not change as this will be overriden by Rintagi upon upgrade.
*/
.Form {
    margin: 0 auto;
    clear: both;
}

.SignControlContainer {
    position: relative;
}

.SignButtonContainer {
    position: absolute;
    right: 10px;
    top: 8px;
}

    .SignButtonContainer input {
        background-image: url("../images/clear25x25.png");
        background-repeat: no-repeat;
        background-color: transparent;
        background-size: 18px;
        border: none;
        height: 18px;
        width: 18px;
    }

        .SignButtonContainer input:hover {
            cursor: pointer;
        }

.SignImage {
    width: 100%;
    max-width: 300px;
    max-height: 150px;
}

.SignBottomMsg {
    padding: 3px;
}

.SignCanvas {
    margin-top: 3px;
}

.SignCanvasContainer {
    display: block;
    text-align: center;
    padding: 4px 0;
    border-radius: 4px;
}

.SignControl {
    border: 1px solid #CCC;
    border-radius: 4px;
    min-height: 166px;
    text-align: center;
    position: relative;
    background-color: #f8f8f8;
}

.Confirm {
    font-weight: bold;
    font-size: 14pt;
    color: #000099;
    font-style: italic;
    font-family: helvetica, Verdana, 'Times New Roman';
    background-color: Silver;
}

.HelpText {
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 10pt;
    color: Navy;
    font-family: helvetica, Verdana, 'Times New Roman';
    display: inline-block;
}

.FootText {
    margin-top: 10px;
    font-size: 10pt;
    font-family: helvetica, Verdana, 'Times New Roman';
    display: inline-block;
}

.MsgText {
    font-size: 10pt;
    font-family: helvetica, Verdana, 'Times New Roman';
}

.FiltText {
    font-size: 10pt;
    font-style: italic;
    color: Teal;
    font-family: helvetica, Verdana, 'Times New Roman';
}

.PickList {
    font-size: 100%;
    width: 100%;
    padding: 0px 0px 1px 0px;
    border: 1px solid #c4c4c4; /* Do not remove */
    border-radius: 4px;
}

.DscLabel {
    font-size: 10pt;
    font-style: italic;
    font-family: helvetica, Verdana, 'Times New Roman';
    color: Navy;
}

.ListView, .viewport > table {
    background-color: transparent;
}

    .ListView .selectedItm, .GrdEdtTmp {
        background: rgba(255, 255, 255, 0.9);
    }

.ListView {
    overflow-x: auto;
    -webkit-overflow-scrolling: auto;
}

.GrdDel, .GrdCan {
    background-repeat: no-repeat;
    padding: 3px;
    margin-top: 5px;
    width: 20px;
    margin-bottom: 3px;
    width: 20px;
    height: 20px;
    border-radius: 4px;
    display: inline-block;
}

.GrdDelAll {
    background-image: url("../images/button/GrdDelAll.png");
    background-repeat: no-repeat;
    padding: 3px;
    margin-top: 5px;
    width: 20px;
    width: 20px;
    height: 20px;
    border-radius: 4px;
    display: inline-block;
}

.GrdDel {
    background-image: url("../images/button/GrdDel.png");
}

.GrdCan {
    background-image: url("../images/button/GrdCan.png");
}

.GrdDelAll:hover {
    background-image: url("../images/button/GrdDelAll_hover.png");
}

.GrdDel:hover {
    background-image: url("../images/button/GrdDel_hover.png");
}

.GrdCan:hover {
    background-image: url("../images/button/GrdCan_hover.png");
}

.GrdHead, .GrdSel, .GrdFoot, .GrdTxtLb, .GrdBoxLb, .GrdNwrLb, .GrdTxtLn, .GrdBoxLn, .GrdNwrLn {
    font-size: 10pt;
    font-family: helvetica, Verdana, 'Times New Roman';
    padding-left: 3px;
    padding-right: 3px;
    color: #474641;
}

.ListView .GrdEdtTmp * {
    color: #474641;
}

.GrdTxtLb {
    overflow: hidden;
    word-wrap: break-word;
    width: inherit;
}

.GrdHead {
    font-weight: bold;
    vertical-align: top;
    background-color: #e3e0d1;
    white-space: normal;
}

.GrdSel {
    background-color: Lime;
}

.GrdFoot {
    font-weight: bold;
    background-color: #e3e0d1;
    white-space: normal;
}

.GrdNwrLb, .GrdNwrLn {
    white-space: nowrap;
}

.GrdTxtLn, .GrdBoxLn, .GrdNwrLn {
    text-decoration: underline;
}

.GrdTxt, .GrdBox, .GrdNum, .GrdDdl, .GrdCtr {
    text-align: left;
    font-size: 13px;
    color: #660099;
    font-family: helvetica, Verdana, 'Times New Roman';
    background-color: White;
    padding-left: 3px;
    padding-right: 3px;
    border-radius: 4px;
    height: 24px;
    width: 100%;
}

.GrdTxt, .GrdNum, .GrdCtr {
    /* do not override or change as these setting are for textbox in order to properly size and aligned with
     * other controls like dropdown list
     */
    border-width: 1px;
    padding-left: 3px;
    padding-right: 3px;
}

.GrdLnk:disabled {
    display: none;
}

.GrdBox, .GrdDdl {
    height: 24px;
    padding: 0px 0px 0px 2px;
}

.GrdBox {
    text-align: center;
}

    .GrdBox input {
        width: 20px;
        height: 20px;
        margin: 2px;
        cursor: pointer;
        vertical-align: middle;
    }

.GrdTxt td {
    padding-top: 3px;
}

.GrdTxt .pgr {
    font-size: 13px;
}

    .GrdTxt .pgr td {
        height: 24px;
    }

.GrdTxt tr[onclick]:hover {
    cursor: pointer;
}

.GrdNum {
    text-align: right;
}

.GrdAlt {
    background-color: #f7f2e1;
}

.GrdItm {
    background-color: white;
}

.PwdBox {
    font-size: 10pt;
    color: white;
    font-family: helvetica, Verdana, 'Times New Roman';
    background-color: teal;
}

.PopUpBanner {
    background-color: #213a65;
    color: White;
    font-size: 12pt;
}

.ValidSumm {
    font-size: 10pt;
    font-family: helvetica, Verdana, 'Times New Roman';
    background-color: Silver;
}

body.PageBackground {
    background-image: url(../images/special/couch.jpg);
    background-color: #ededed;
    background-position: center;
    background-attachment: fixed;
    background-repeat: no-repeat;
}

.TabPanel {
    padding: 10px;
    border: 1px solid #BFBAB0;
}

    .TabPanel .padder {
        padding: 10px 0px;
    }

.LoginChgLink {
    color: Black;
    text-decoration: none;
    font-family: helvetica, Verdana, 'Times New Roman';
    font-size: 8pt;
    white-space: nowrap;
}

    .LoginChgLink:hover {
        color: Blue;
    }

.AjaxSpinner {
    background-color: white;
    border-width: 1px;
    border-style: solid;
    position: absolute;
    width: 200px !important;
    top: 40% !important;
    left: 50% !important;
    height: 68px;
    z-index: 9999;
}

div.ajax__tab_xp .ajax__tab_tab {
    height: 21px;
}

.Mandatory {
    color: Red;
}

.GrpLabel {
    padding: 1px 5px 1px 5px;
    text-align: right;
    font-size: 10pt;
    font-family: helvetica, Verdana, 'Times New Roman';
    color: Black;
    background-color: Transparent;
    white-space: nowrap;
}

.GrpLabelL {
    text-align: left;
}

.GrpContent {
    padding: 1px 5px 1px 5px;
    text-align: left;
    color: #333;
    min-height: 16px;
    font-family: helvetica, Verdana, 'Times New Roman';
    font-size: 13px;
    color: #333;
    border-radius: 4px;
    vertical-align: top;
}

.GrpLabel080 {
    text-align: right;
    width: 80px;
    padding: 1px 5px 1px 5px;
}

.GrpLabel100 {
    text-align: right;
    width: 100px;
    padding: 1px 5px 1px 5px;
}

.GrpLabel120 {
    text-align: right;
    width: 120px;
    padding: 1px 5px 1px 5px;
}

.GrpLabel140 {
    text-align: right;
    width: 140px;
    padding: 1px 5px 1px 5px;
}

.GrpLabel160 {
    text-align: right;
    width: 160px;
    padding: 1px 5px 1px 5px;
}

.HelpPopup {
    width: 450px;
    height: 150px;
    border: solid 1px #FFA600;
    background-color: #FAF0BE;
    padding: 3px;
    text-align: left;
}

.HelpTitle {
    font-size: 8.5pt;
    font-weight: bold;
    font-family: helvetica, Verdana, 'Times New Roman';
    color: #000000;
}

.HelpMsg {
    font-size: 8.5pt;
    font-style: italic;
    font-family: helvetica, Verdana, 'Times New Roman';
    color: #000000;
    width: 445px;
    height: 135px;
    clear: right;
    padding-right: 5px;
    overflow-x: hidden;
    overflow-y: scroll;
}

.PageBackground {
    background-color: transparent;
}

.HomeTabS {
    width: 49%;
    height: 220px;
}

.HomeTabW {
    width: 100%;
    height: 220px;
}

.HomeTab h3 {
    background-color: #012A7C;
    padding: 5px 8px 5px 10px;
    color: #FFFFFF;
    font-size: 10pt;
    font-family: 'Century Gothic', 'Lucida Sans Unicode', Verdana;
    border-radius: 4px;
}

.HomeTab ul {
    list-style-type: none;
    margin: 5px;
}

.HomeHeader {
    font-family: helvetica, Verdana, 'Times New Roman';
    font-weight: bold;
    font-size: 9pt;
    color: #FFFFFF;
    background-color: #012A7C;
    padding: 3px;
}

.HomeSection {
    border-bottom: solid 1px #9EBBD9;
}

    .HomeSection span {
        font-weight: bold;
        font-size: 9pt;
    }

    .HomeSection a {
        color: Blue;
    }

.PassPoor, .PassWeak, .PassAvg, .PassStr, .PassEx {
    font-family: helvetica, Verdana, 'Times New Roman';
    font-weight: bold;
    font-size: 8pt;
    background-color: #F4F4F4;
}

.PassPoor {
    color: Red;
}

.PassWeak {
    color: Red;
}

.PassAvg {
    color: Orange;
}

.PassStr {
    color: Green;
}

.PassEx {
    color: Green;
}

.ErrLst .Col1 {
    width: 20%;
}

.ErrLst tr.RowBreak td.Col1 {
    color: Red;
    border-top: solid 1px;
    vertical-align: top;
}

.ErrLst tr.RowBreak td {
    border-top: solid 1px;
}

.WarnMsg {
    color: red;
    font-size: 11pt;
    font-weight: bold;
    font-family: helvetica, Verdana, 'Times New Roman';
}

.TrMenuItem {
    cursor: pointer;
}

#cClientFocusButton {
    /* this is a hidden button(should be display:none but is using visibility:hidden which takes up space in IE we must force it to nothing here, 2010.5.18 gary */
    height: 0px;
    width: 0px;
}

input:disabled, .GrdDdl:disabled { 
    cursor: default;
    background-color: WhiteSmoke !important;
    /*this is for safari mobile*/ 
   -webkit-text-fill-color: #000; 
   -webkit-opacity: 0.7; 
   color: #000; 
}

input[type="button"] /* IE needs inline style, this has no effect on IE */ {
    text-shadow: 0 1px 1px rgba(255, 255, 255, 0.85);
    background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#fff), to(#bbb));
    background-image: -moz-linear-gradient(0 100% 90deg, #fff, #bbb);
    -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5);
    -moz-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5);
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5);
    border-radius: 14px;
}

    input[type="button"]:hover /* IE needs inline style, this has no effect on IE */ {
        -webkit-box-shadow: 0 0px 5px rgba(0, 0, 0, 0.5);
        -moz-box-shadow: 0 0px 5px rgba(0, 0, 0, 0.5);
        box-shadow: 0 0px 5px rgba(0, 0, 0, 0.5);
    }

.DashBoard {
    float: right;
}

.TabFolder input.button {
    width: 100%;
}

input.button {
    top: auto;
    margin: 0px 2px 0px 2px;
    background: #222 url(../images/alert-overlay.png) repeat-x;
    display: inline-block;
    color: #fff;
    text-decoration: none;
    border-radius: 5px;
    -o-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
    -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
    -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
    box-shadow: 0 1px 3px rgba(0,0,0,0.5);
    text-shadow: 0 -1px 1px rgba(0,0,0,0.25);
    border-bottom: 1px solid rgba(0,0,0,0.25);
    position: relative;
    cursor: pointer;
    border: none;
}

    input.button:hover {
        background-color: #111;
        color: #fff;
    }

    input.button:active {
        top: 1px;
    }

input.right.button {
    float: right;
    clear: both;
}

input.small.button {
    font-size: 11px;
    padding: 4px 7px 3px;
}

input.button, input.medium.button {
    font-size: 13px;
    font-weight: bold;
    text-shadow: 0px -1px 1px rgba(0,0,0,0.25);
    display: inline-block;
}

input.large.button {
    font-size: 14px;
    padding: 8px 14px 9px;
}

input.green.button {
    background-color: #91bd09;
}

    input.green.button:hover {
        background-color: #749a02;
    }

input.blue.button {
    background-color: #5083D0;
}

    input.blue.button:hover {
        background-color: #2b5eaa;
    }

input.red.button {
    background-color: #e33100;
}

    input.red.button:hover {
        background-color: #872300;
    }

input.magenta.button {
    background-color: #a9014b;
}

    input.magenta.button:hover {
        background-color: #630030;
    }

input.orange.button {
    background-color: #ff5c00;
}

    input.orange.button:hover {
        background-color: #d45500;
    }

input.yellow.button {
    background-color: #ffb515;
}

    input.yellow.button:hover {
        background-color: #d3991d;
    }

.GrdEdtTmp input.button {
    color: white;
}

input.button:disabled {
    background-color: #cdcdcd !important;
    box-shadow: none;
    text-shadow: none;
    cursor: default;
}

/* BannerNam, BannerRtn and BannerBtn combine to form the action banner just above the screen */
.BannerGrp {
    padding: 10px;
    background: rgba(255,255,255,0.8);
    border-radius: 4px;
}

.BannerNam {
    display: block;
}

.BannerBtn {
    /* this is a div wrapping the buttons which we want it tug to the right side in both IE 7 and 8(chrome/firefox ...)
     * and float is the correct way, rather than text align */
    float: right;
}

    .BannerBtn table tbody tr td {
        vertical-align: middle;
    }

        .BannerBtn table tbody tr td table {
            margin: 2px;
        }

    .BannerBtn.button-container {
        display: -moz-inline-stack;
        display: inline-block;
        zoom: 1;
        *display: inline;
        float: right;
        padding: 5px 10px;
    }

.BtnTbl > div {
    float: left;
}

.grid div.grid-container {
    height: 200px;
    display: table;
    padding-left: 2px;
    min-width: 280px;
    height: 100%;
}

    .grid div.grid-container[class*='1-12'] {
        padding-top: 2px;
        padding-left: 0px;
    }

.grid-container .viewport {
    display: table-cell;
}

.grid-container .button-container input {
    margin: 0px;
    padding: 3px;
    margin-left: 2px;
}

.grid-container .button-container .button-grp input[type=submit] {
    background-color: transparent;
    border-radius: 4px;
}

    .grid-container .button-container .button-grp input[type=submit]:hover {
        background-color: rgba(255,255,255, 0.5);
        border: 1px solid #cdcdcd;
    }

.grid-container .button-container input[type=file] {
    height: 22px;
    padding: 0px;
}

.TabFolder {
    margin-bottom: 8px;
}

.rmvSpace .screen-tabfolder {
    display: none;
}

.TabFolder:after, #content > div > div:after {
    content: "";
    display: block;
    clear: both;
}

.button-container {
    padding: 0 7px 0 0;
    background: rgba(255,255,255,0.5);
    border-radius: 4px;
}

    .button-container > div {
        display: -moz-inline-stack;
        display: inline-block;
        zoom: 1;
        *display: inline;
        vertical-align: top;
        padding: 4px 0 3px 0;
    }

    .button-container .button-grp {
        float: left;
    }

.button-grp > div {
    display: table-cell;
    vertical-align: middle;
}

.grdPaging {
    padding-left: 10px;
    padding-right: 10px;
}

    .grdPaging > div {
        display: table-cell;
    }

.grdFind input {
    width: 120px;
}

.button-grp div.btnPgGrp {
    display: table;
}

.btnPgGrp > div {
    display: table-cell;
}

.button-container div span {
    padding-left: 5px;
}

.button-container input, .button-container div img {
    top: 0px;
    vertical-align: middle;
}

.button-grp {
    margin-left: 4px;
    margin-bottom: 3px;
}

.button-container input {
    margin-left: 5px;
}

.banner-container {
    width: 100%;
}

div.crystalstyle div span {
    font-family: tahoma;
    font-weight: normal;
}

.SignInLink {
    text-decoration: none;
    font-size: 12px;
    font-family: Verdana, 'Times New Roman';
    color: black;
    background-color: Transparent;
    white-space: nowrap;
    text-align: right;
    vertical-align: top;
    margin-left: 10px;
}

.lanResetBtn {
    vertical-align: middle;
    border-width: 1px !important;
    border-color: #ccc;
    border-style: solid;
    border-radius: 4px;
    dispay: table-cell;
}

    .lanResetBtn:hover {
        border-color: #FBCB09;
    }

table.calendar tr td, table.calendar tr th {
    font-family: Arial; /* Do not set font-size here */
}

table.calendar tr th {
    padding: 2px 2px 1px;
}

table.calendar tr td table tr td {
    font-weight: bold;
    text-align: center;
    font-size: 12px;
}

table.calendar tr td a {
    text-decoration: none;
    display: block;
    padding: 2px 2px 1px;
    text-align: center;
}

    table.calendar tr td a:hover {
        background-color: #ccc;
    }

.group-panel {
    padding: 0px;
    margin-top: 10px;
    margin-bottom: 10px;
    border-color: #333;
    border-style: solid;
    display: block;
}

#MsgIcon {
    float: left;
    margin-right: 10px;
}

.MsgPopup {
    width: 50%;
    background: #FDFDFD;
    border: solid 5px black;
    border-radius: 10px;
    color: #333;
    min-height: 100px;
    cursor: move;
}

.MsgClsImage {
    border-width: 0;
    float: left;
    left: 20px;
    position: absolute;
    top: 10px;
}

.MsgCloseButton {
    float: right;
}

.MsgPopupContent {
    padding: 10px 20px 30px 70px;
    font-family: calibri, sans-serif;
    font-size: 18px;
}

div.ui-tooltip div.ui-tooltip-content,
div.ui-tooltip div.ui-tooltip-title {
    font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
    font-size: 11px;
}

div.ui-tooltip div.ui-tooltip-title {
    font-weight: bold;
}

.helpCnt:hover {
    background-color: #e5e5e5;
}

input.wait {
    background: white url('../images/indicator.gif') no-repeat center !important;
}

/* Autocomplete control Style */
.autoCmptPref {
    padding: 4px 10px 4px 10px;
    background-color: #DDDDDD;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
    border-radius: 4px 0 0 4px;
    margin-right: -5px;
}

.autocomplete-box-input {
    font-family: helvetica, Verdana, 'Times New Roman';
    font-size: inherit;
    color: #333;
    padding: 3px 22px 3px 5px;
    vertical-align: middle;
    margin: 0px;
    background: #fff none;
    border-radius: 4px;
    height: 23px;
}

.reset-lang .autocomplete-container {
    width: 100%;
    display: table-cell;
    margin-right: 0;
}

.reset-lang > div {
    display: table;
}

.TabFolder .r-table:first-child > .r-tr .r-td {
    vertical-align: top;
}

.screen-search .autocomplete-box-input, .screen-tabfolder .autocomplete-box-input, .reset-lang .autocomplete-box-input,
header .autocomplete-box-input, footer .autocomplete-box-input, .grid-container .autocomplete-box-input,
.search-grp .autocomplete-box-input, .screen-filter .autocomplete-box-input {
    width: 100% !important;
}

.ui-button-icon-only.autocomplete-box-button {
    text-align: right;
    padding: 0px;
    margin: 0 0 0 -24px;
    border-radius: 0px 4px 4px 0;
    height: 23px;
    width: 24px;
    border-left: none;
    zoom: 1;
    overflow: hidden;
    *margin-bottom: 4px;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.autocomplete-container {
    white-space: nowrap;
    display: inline;
    margin-right: -4px;
}

.ui-autocomplete.ui-menu.ui-widget {
    padding: 1px;
}

    .ui-autocomplete.ui-menu.ui-widget .ui-menu-item a { 
        font-size: 12px;
        -webkit-box-sizing: content-box;
        -moz-box-sizing: content-box;
        box-sizing: content-box;
        margin: 0 !important;
    }

    .ui-autocomplete.ui-menu.ui-widget .ui-menu-item a.seperator {
        border-bottom: 1px dashed #cdcdcd;
    }

    .ui-autocomplete.ui-menu.ui-widget .ui-menu-item .r-table {
        height: 100%;
    }

    .ui-autocomplete.ui-menu.ui-widget .ui-menu-item .r-td {
        vertical-align: top;
    }

.autoCompIcon {
    max-height: 35px;
    max-width: 35px;
    background-color: #ededed;
    vertical-align: middle;
    margin-left: 5px;
}

.autoCompDesc {
    color: #8d8d8d;
    display:block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow:hidden;
}

.ui-autocomplete {
    max-height: 200px;
    overflow-y: auto;
    overflow-x: hidden;
    white-space: nowrap;
}
/* IE 6 doesn't support max-height. Use height instead, this forces the menu to always be this tall. */
* html .ui-autocomplete {
    height: 200px;
}

.combobox {
    border: 1px solid #C4C4C4; /* Do not remove */
    position: relative;
    background-color: white;
    height: 16px;
    font-family: helvetica, Verdana, 'Times New Roman';
    font-size: 13px;
    color: #333;
    padding: 3px 0px;
    border-radius: 4px;
    margin-right: 88px;
}

    .combobox .combobox-dropdownlist,
    .combobox .combobox-textbox {
        border: none;
        font-family: helvetica, Verdana, 'Times New Roman';
        font-size: 12px;
        color: #333;
        margin: 0px 0 0 5px;
        padding: 0px;
    }

    .combobox span {
        background-color: #f7f7f7;
    }

    .combobox .combobox-controls {
        position: absolute;
        top: 2px;
        float: left;
        white-space: nowrap;
    }

    .combobox .combobox-dropdownlist {
        border-radius: 4px;
        padding: 0 0 0 3px;
        margin: 0px;
    }

#expand .inp-txt {
    font-family: helvetica, Verdana, 'Times New Roman';
    font-size: 15px;
    color: #333;
    width: 95%;
    height: 350px;
    padding: 1px;
    display: block;
    margin: 0 auto;
}

.show-expand-button {
    cursor: pointer;
}

#menu-container-wrapper, #menutop-container-wrapper {
    position: relative;
    z-index: 26; /* Crystal Report is 25 */
}

a.menuNoClick {
    cursor: default;
}

.ribbon {
    position: relative;
    width: 50%;
    font-size: 1.5em;
    font-weight: bold;
    padding: 6px 20px 6px 50px;
    margin: 30px 10px 10px -50px;
    color: #555;
    background-color: #999;
    text-shadow: 0px 1px 2px #bbb;
    -webkit-box-shadow: 0px 2px 4px #888;
    -moz-box-shadow: 0px 2px 4px #888;
    box-shadow: 0px 2px 4px #888;
}

    .ribbon:before {
        content: ' ';
        position: absolute;
        width: 0;
        height: 0;
        width: 30px;
        left: auto;
        right: -2px;
        top: 0px;
        border-width: 20px 10px;
        border-style: solid;
        border-color: transparent #fff transparent transparent;
    }

    .ribbon:after {
        content: ' ';
        position: absolute;
        width: 0;
        height: 0;
        left: 0px;
        top: 100%;
        border-width: 5px 10px;
        border-style: solid;
        border-color: #666 #666 transparent transparent;
    }

.RptWizNavi {
    margin-top: 20px;
}

.DocDownload {
    background-image: url("../images/Download.png");
    display:block;
    width: 19px;
    height: 19px;
}

.DocUpload {
    max-width: 60px;
}

.DocPanel {
    margin-right: -4px;
    width: 100%;
    display: inline-block;
    border-radius: 4px;
    padding: 0px 3px;
    border: 1px solid #c4c4c4; /* Do not remove */
}

    .DocPanel input[type*="file"] {
        width: 100%;
    }

.r-docIcon {
    vertical-align: text-bottom;
    position: absolute;
    margin-top: 2px;
    padding: 3px;
    border-radius: 4px;
}

    .r-docIcon:hover {
        background-color: #cdcdcd;
    }

/* Rating */
.ui-stars-star,
.ui-stars-cancel {
    float: left;
    display: block;
    overflow: hidden;
    text-indent: -999em;
    cursor: pointer;
    height: 24px;
}

    .ui-stars-star a,
    .ui-stars-cancel a {
        width: 16px;
        height: 15px;
        display: block;
        background: url(../Images/jquery.ui.stars.gif) no-repeat 0 0;
    }

    .ui-stars-star a {
        background-position: 0 -32px;
    }

.ui-stars-star-on a {
    background-position: 0 -48px;
}

.ui-stars-star-hover a {
    background-position: 0 -64px;
}

.ui-stars-cancel-hover a {
    background-position: 0 -16px;
}

.ui-stars-star-disabled,
.ui-stars-star-disabled a,
.ui-stars-cancel-disabled a {
    cursor: default;
}

.ui-slider {
    position: relative;
    text-align: left;
    padding-left: 6px;
}

    .ui-slider .ui-slider-handle {
        position: absolute;
        z-index: 1;
        width: 10px;
        height: 1.2em;
        cursor: default;
    }

    .ui-slider .ui-slider-range {
        position: absolute;
        z-index: 1;
        font-size: .7em;
        display: block;
        border: 0;
        background-position: 0 0;
    }

.ui-slider-horizontal {
    height: .8em;
}

    .ui-slider-horizontal .ui-slider-handle {
        top: -.3em;
        margin-left: -.6em;
    }

    .ui-slider-horizontal .ui-slider-range {
        top: 0;
        height: 100%;
    }

    .ui-slider-horizontal .ui-slider-range-min {
        left: 0;
    }

    .ui-slider-horizontal .ui-slider-range-max {
        right: 0;
    }

.ui-slider-vertical {
    width: .8em;
    height: 100px;
}

    .ui-slider-vertical .ui-slider-handle {
        left: -.3em;
        margin-left: 0;
        margin-bottom: -.6em;
    }

    .ui-slider-vertical .ui-slider-range {
        left: 0;
        width: 100%;
    }

    .ui-slider-vertical .ui-slider-range-min {
        bottom: 0;
    }

    .ui-slider-vertical .ui-slider-range-max {
        top: 0;
    }

.ButtonImg {
    cursor: pointer;
    border: none;
}

    .ButtonImg:hover {
        background-color: #E5E5E5;
    }

/* Screen button */
.BtnTbl img {
    padding-top: 3px;
}

.moreButtonSec > div {
    float: right;
}

.helpful-tip, .CustomizeButtonImg, .EditButtonImg, .MoreButtonImg, .SaveCloseButtonImg, .SaveButtonImg, .NewSaveButtonImg, .CopySaveButtonImg, .ExpTxtButtonImg, .ExpRtfButtonImg, .UndoAllButtonImg, .RedoAllButtonImg, .ClearButtonImg, .AuditButtonImg, .NewButtonImg, .CopyButtonImg, .DeleteButtonImg, .ShowCriButtonImg, .ExpXmlButtonImg, .ExpPdfButtonImg, .ExpDocButtonImg, .ExpXlsButtonImg, .ViewButtonImg, .PrintButtonImg, .PreviewButtonImg {
    background-repeat: no-repeat;
    background-position: center 3px;
    padding-top: 31px;
    font-size: 10px;
    font-family: Comic Sans MS;
    text-transform: uppercase;
    background-color: transparent;
    height: auto;
    width: auto;
    min-width: 40px;
}

.moreButtonSec {
    display: block;
}

.helpful-tip {
    cursor: help;
    background-image: url('../images/help.png');
    color: #333;
    border: none;
}

.CustomizeButtonImg {
    background-image: url('../images/button/Customize.png');
    color: #333;
}

.EditButtonImg {
    background-image: url('../images/button/Edit.png');
    color: #008B3B;
}

.MoreButtonImg {
    display: none;
    background-image: url('../images/button/More.png');
    color: #333;
}

.SaveCloseButtonImg, .SaveButtonImg, .NewSaveButtonImg, .CopySaveButtonImg {
    background-image: url('../images/button/Save.png');
    color: #ee6213;
}

.ExpTxtButtonImg {
    background-image: url('../images/button/ExpTxt.png');
    color: #333;
}

.ExpRtfButtonImg {
    background-image: url('../images/button/ExpRtf.png');
    color: #333;
}

.UndoAllButtonImg {
    background-image: url('../images/button/UndoAll.png');
    color: #333;
}

.RedoAllButtonImg {
    background-image: url('../images/button/RedoAll.png');
    color: #333;
}

.ClearButtonImg {
    background-image: url('../images/button/Clear.png');
    color: #333;
}

.AuditButtonImg {
    background-image: url('../images/button/Audit.png');
    color: #333;
}

.NewButtonImg {
    background-image: url('../images/button/New.png');
    color: #333;
}

.CopyButtonImg {
    background-image: url('../images/button/Copy.png');
    color: #333;
}

.DeleteButtonImg {
    background-image: url('../images/button/Delete.png');
    color: #333;
}

.ClearCriButtonImg {
    background-image: url('../images/button/eraser.png');
    color: #333;
    margin-left: 10px;
    background-repeat: no-repeat;
    background-color: transparent;
    background-position: center;
    height: 25px;
    width: 40px;
}

/* Grid button */
.grid-container .button-container .button-grp input.InsRowButtonImg {
    background-image: url('../images/button/InsRow.png');
    height: 23px;
    background-color: #222;
    background-position: 6px center;
    border-radius: 4px;
    color: White;
    padding: 1px 10px 1px 24px;
    background-repeat: no-repeat;
}

    .grid-container .button-container .button-grp input.InsRowButtonImg:hover {
        background-color: #333;
        border: none;
    }

.PgSizeButtonImg, .FirstButtonImg, .PrevButtonImg, .NextButtonImg, .LastButtonImg, .FindButtonImg, .ContinueButtonImg, .ImportButtonImg, .HideImpButtonImg, .ShowImpButtonImg {
    width: 24px;
    background-position: center center;
    background-repeat: no-repeat;
}

.PgSizeButtonImg {
    background-image: url('../images/button/PgSize.png');
}

.FirstButtonImg {
    background-image: url('../images/button/First.png');
}

.PrevButtonImg {
    background-image: url('../images/button/Prev.png');
}

.NextButtonImg {
    background-image: url('../images/button/Next.png');
}

.LastButtonImg {
    background-image: url('../images/button/Last.png');
}

.FindButtonImg {
    background-image: url('../images/button/Find.png');
}

.ContinueButtonImg {
    background-image: url('../images/button/Continue.png');
}

.ImportButtonImg {
    background-image: url('../images/button/Import.png');
}

.HideImpButtonImg {
    background-image: url('../images/button/HideImp.png');
}

.ShowImpButtonImg {
    background-image: url('../images/button/ShowImp.png');
}

.GrdSort {
    padding-top: 1px;
    padding-left: 1px;
    border-radius: 4px;
}

/* Report Button */
.GSearchButtonImg {
    background-image: url('../images/button/Search.png');
    color: #333;
}

.ShowCriButtonImg {
    background-image: url('../images/button/ShowCri.png');
    color: #333;
}

.ExpXmlButtonImg {
    background-image: url('../images/button/ExpXml.png');
    color: #333;
}

.ViewButtonImg {
    background-image: url('../images/button/View.png');
    color: #ee6213;
}

.ExpPdfButtonImg {
    background-image: url('../images/button/ExpPdf.png');
    color: #333;
}

.ExpDocButtonImg {
    background-image: url('../images/button/ExpDoc.png');
    color: #333;
}

.ExpXlsButtonImg {
    background-image: url('../images/button/ExpXls.png');
    color: #333;
}

.PrintButtonImg {
    background-image: url('../images/button/Print.png');
    color: #333;
}

.PreviewButtonImg {
    background-image: url('../images/button/Preview.png');
    color: #333;
}

/* Wizard Button */
.SearchButtonImg {
    background-image: url('../images/button/Search.png');
    width: 23px;
    height: 23px;
}

.ListButtonImg {
    background-image: url('../images/button/List.png');
    width: 23px;
    height: 23px;
}

.ImportButtonImg {
    background-image: url('../images/button/Import.png');
    width: 23px;
    height: 23px;
}

/* MyProfile */
div.ProfileBox {
    padding: 20px;
}

.ProfileDisp .ProfCmp {
    color: #777777;
    padding: 0px 0px 0px 10px;
}

.ProfileDisp .ProfPrj {
    color: #333333;
    padding: 0px 0px 0px 10px;
}

.ProfileDisp .ProfSys {
    color: #555555;
    padding: 0px 0px 0px 10px;
}

.ProfileDisp .LbUsrName {
    cursor: pointer;
}

.PeofileDetail {
    padding-bottom: 10px;
    border-bottom: 1px solid #999;
}

.ThumbNail {
    border-radius: 4px;
}

.Expand {
    cursor: pointer;
}

.ProfileBtnGroup {
    margin-top: 10px;
}

.ui-progressbar {
    margin: 5px 0;
}

/*My account page*/
.input input {
    border: none;
    color: #444444;
    font-size: 13px;
    background-color: #e8e8e8;
    border-radius: 4px;
}

    .input input:focus {
        background-color: #d8d8d8;
    }

.input {
    zoom: 1;
    *display: inline;
    margin: 5px 0 15px 0;
}

.triangle-right.left:after {
    top: 8px;
    left: -10px;
    bottom: auto;
    border-width: 10px 10px 0 0;
    border-color: transparent #980807;
}

.triangle-right:after {
    content: "";
    position: absolute;
    bottom: -20px; /* value = - border-top-width - border-bottom-width */
    left: 50px; /* controls horizontal position */
    border-width: 20px 0 0 20px; /* vary these values to change the angle of the vertex */
    border-style: solid;
    border-color: #980807 transparent;
    /* reduce the damage in FF3.0 */
    display: block;
    width: 0;
}

.triangle-right.left {
    margin-left: 40px;
    background: white;
}

.triangle-right {
    position: absolute;
    padding: 6px;
    color: #980807;
    font-size: 12px;
    border: 1px solid #980807; /* default background for browsers without gradient support */
    -o-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
    -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
    -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
    box-shadow: 0 1px 3px rgba(0,0,0,0.5);
    border-radius: 10px;
}

.flag {
    position: absolute;
    padding: 3px;
    text-align: left;
    display: block;
    font-size: 11px;
    font-weight: normal;
    max-width: 140px;
    z-index: 10;
    white-space: normal; /*fixerror message text wrap issue for autocomplete box */
}

.errMsgBorder {
    border: 1px solid red;
}

.acErrMsgBorder {
    border: 1px solid red;
    border-left-width: 0px;
}

.MyPrfContent {
    margin: 20px auto;
    padding: 20px 0px;
    background-color: #F4F6F5;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
    max-width: 480px;
    min-width: inherit;
}

    .MyPrfContent > .r-tr > .r-td > div {
        padding: 0 30px;
    }

    .MyPrfContent .inp-lbl {
        color: #555;
        font-size: 14px;
        font-weight: normal;
    }

.GoogleLoginTitle {
    font-size: 13px;
    font-weight: bold;
    color: #444;
}

.LoginNameSec {
    color: #666;
    font-weight: bold;
    font-size: 12px;
    margin-top: 10px;
}

.GoogleLoginBtnSec {
    margin: 30px 8px 0 8px;
}

    .GoogleLoginBtnSec div:first-child {
        float: left;
    }

    .GoogleLoginBtnSec div:nth-child(2) {
        float: right;
    }

.SelectLoginPanel {
    background-color: #ededed;
    border-radius: 4px;
    padding: 20px 10px;
}

.pNewProfile {
    margin-top: 20px;
    padding-bottom: 10px;
}

.pNewPwd {
    margin-top: 10px;
}

.txtLabel {
    color: #666;
    font-weight: bold;
    font-size: 13px;
}

.ContentTop {
    margin-bottom: 20px;
}

    .ContentTop .link-home {
        vertical-align: middle;
    }

    .ContentTop .login-img {
        text-align: center;
        margin-bottom: 20px;
    }

        .ContentTop .login-img img {
            width: 100%;
            max-width: 300px;
        }

    .ContentTop .autocomplete-box-input {
        width: 100% !important;
    }

.LoginButton a {
    float: left;
}

.LoginButton {
    text-align: right;
}

.MyAcctWarnMsg {
    color: Red;
    display: block;
    width: 100%;
    border-radius: 4px;
    padding: 0 0 5px 0;
    margin-top: 20px;
    font-size: 11px;
}

.cbTerm {
    display: table-cell;
    padding-bottom: 20px;
}

.btn_login {
    padding: 4px 10px;
    background-color: #FFAA31;
    color: White;
    border: none;
    border-radius: 4px;
    font-weight: bold;
    width: 100%;
    margin-top: 20px;
}

    .btn_login:hover {
        background-color: #FF9031;
        cursor: pointer;
    }

.signInPanel a {
    width: 100%;
    padding: 5px 10px;
    background-color: #3898ee;
    color: White;
    border: none;
    border-radius: 4px;
    font-weight: bold;
    display: block;
    text-align: center;
    font-size: 13px;
    text-decoration: none;
}

    .signInPanel a:hover {
        background-color: #2990ea;
    }

.signInBtn {
    color: #444;
    border: none;
    padding-left: 30px;
    width: 100%;
    height: 25px;
}

    .signInBtn:hover {
        background-color: #f4f4f4;
        cursor: pointer;
    }

.signInImg {
    position: absolute;
}

.separateLine {
    border-bottom: 1px solid #dedede;
    width: 45%;
    float: left;
    height: 15px;
    margin-top: 5px;
}

.middleText {
    width: 10%;
    float: left;
    text-align: center;
    color: #8d8d8d;
    margin-top: 10px;
}

.accessCodeSec .codeVerifyBtn {
    background: #ffaa31;
    border: none;
    color: white;
    padding: 5px 20px;
    cursor: pointer;
    border-radius: 4px;
}

    .accessCodeSec .codeVerifyBtn:hover {
        background: #ff9031;
    }

    .accessCodeSec .codeVerifyBtn:focus {
        background: #ff9031;
    }

.accessCodeSec input {
    padding: 4px;
    width: 100%;
}

.accessCodeSec span {
    font-size: 13px;
}

.accessCodeSec .r-td {
    vertical-align: middle;
}

.accessCodeBtnSec input, .TwoFactorAuthenticationBtn input {
    width: 100%;
    color: white;
    background-color: #5083d0;
    border: 0;
    padding: 5px 20px;
    cursor: pointer;
    border-radius: 4px;
}

    .accessCodeBtnSec input:hover, .TwoFactorAuthenticationBtn input:hover {
        background-color: #2b5eaa;
    }

.RememberCodeSec input {
    margin: 0 3px 0 0;
    vertical-align: middle;
}

.RememberCodeSec, .accessCodeSec, .accessCodeBtnSec input, .SecretCodeLabel {
    margin-top: 20px;
}


.TwoFactorAuthenticationBtn {
    margin-bottom: 5px;
}

.TwoFactorSecretPanel > div {
    margin-top: 10px;
}

.GoogleSignInPanel, .FbSignInPanel, .WinSignInPanel, .OffSignInPanel {
    float: left;
    width: 49%;
    border: 1px solid #dedede;
    background-color: #f0f0f0;
    margin-top: 5px;
    white-space: nowrap;
}

.GoogleSignInPanel, .WinSignInPanel {
    margin-right: 2%;
}

    .WinSignInPanel input, .OffSignInPanel input, .GoogleSignInPanel input, .FbSignInPanel input {
        border: none;
        color: #555;
        height: 27px;
        background-color: transparent;
        cursor: pointer;
    }

    .GoogleSignInPanel:hover, .FbSignInPanel:hover, .WinSignInPanel:hover, .OffSignInPanel:hover {
        background-color: #f4f4f4;
        cursor: pointer;
    }

.GoogleLinkPanel, .FbLinkPanel, .WinLinkPanel, .OffLinkPanel {
    margin: 0;
    border: 1px solid #dedede;
    background-color: #f0f0f0;
    margin-top: 5px;
    white-space: nowrap;
    position: relative;
}
/*new chanage*/

.title-content > div {
    display: inline-block;
}

.titleLogin {
    margin-left: 10px;
    vertical-align: middle;
}

.lbPwdInfo {
    padding-left: 5px;
    font-size: 12px;
    color: #444444;
}

.MaintMsg {
    color: Red;
    font-family: helvetica, Verdana, 'Times New Roman';
    overflow-x: hidden;
    overflow-y: hidden;
    border-radius: 4px;
    margin: 10px 0;
    padding: 5px 0px 0px 0px;
}

    .MaintMsg textarea {
        max-width: 380px;
        width: 100%;
        height: 200px;
    }

div.GrdOuter {
    width: 100%;
    display: flex;
}

    div.GrdOuter:empty {
        display: block;
    }

div.GrdInner {
    display: inline-block;
    vertical-align: middle;
    width: 100%;
}

    div.GrdInner:last-of-type {
        display: inline-block;
        margin-right: 0px;
    }

.GrdEdtTmp div.GrdInner > table td:first-of-type {
    width: 100%;
}

.GrdEdtTmp div.DocPanel > table td:first-of-type {
    width: auto;
}

div.GrdInner > table {
    width: 100%;
}

div.GrdInner td {
    padding-left: 0;
    padding-right: 0;
}

.watermark {
    color: #999 !important;
}

/* Following two lines should be deleted */
.header-container {
    padding: 5px;
    vertical-align: middle;
}

    .header-container > div.autocomplete-container input.ui-autocomplete-input {
        border-top-left-radius: 0px;
        border-bottom-left-radius: 0px;
    }

.criteria-grp {
    margin-top: 5px;
    background: rgba(255, 255, 255, 0.1);
}

.search-grp {
    margin-top: 5px;
}

.screen-title {
    font-size: 2em;
    font-family: 'Century Gothic', 'Lucida Sans Unicode';
}

.screen-criteria {
    padding: 5px;
}

.screen-filter {
    padding-top: 5px;
    text-align: right;
}

.screen-search {
    padding-top: 5px;
}

    .screen-search .r-table {
        background-color: #ddd;
        border-radius: 4px;
    }

    .screen-search > div.autocomplete-container input.ui-autocomplete-input {
        border-top-left-radius: 0px;
        border-bottom-left-radius: 0px;
    }

.screen-system {
    padding-top: 5px;
    text-align: right;
}

.screen-tabfolder {
}

    .screen-tabfolder .r-table {
        padding: 10px;
        border-radius: 6px;
    }

.TabFolder > div {
    background: rgba(255,255,255,0.8);
    border-radius: 4px;
}

.TabFolder > .grid-container {
    background: none;
    border-radius: 4px;
}

.wizard-header {
    background-color: #F5FFFA;
    padding-top: 20px;
    padding-bottom: 10px;
}

.wizard-title {
    font-size: 2em;
    font-family: 'Century Gothic', 'Lucida Sans Unicode';
}

.wizard-entity {
    text-align: right;
    display: inline;
}

.wizard-help {
    padding: 10px 0px;
    font-size: 1.2em;
    color: Navy;
    font-family: 'Century Gothic', 'Lucida Sans Unicode';
}

.wizard-image {
}

.wizard-image-mob {
    display: none;
}

.wizard-image-dsk {
    display: block;
    width: 100%;
    margin: 0 auto;
}

.wizard-content {
}

.wizard-action {
    padding: 10px 0px;
    text-align: right;
}

.wizard-footer {
    padding: 10px 0px;
}

.inp-lab {
    font-size: 100%;
    font-family: inherit;
    width: 100%;
    white-space: normal;
}

.inp-ddl, .inp-ctr, .inp-txt, .inp-num, .inp-ddlln, .inp-ctrln, .inp-txtln, .inp-numln, .inp-lbl, .inp-pic, .inp-rad {
    font-size: 100%;
    font-family: inherit;
    width: 100%;
    border-radius: 4px;
}

.inp-ddl, .inp-ddlln {
    padding: 2px;
}

.inp-ctr, .inp-ctrln {
    padding: 3px 2px;
    text-align: center;
}

.inp-txt, .inp-txtln {
    padding: 3px 2px;
}

.r-content .inp-txt {
    margin-right: -4px;
}

.inp-num, .inp-numln {
    padding: 3px 2px;
    text-align: right;
}

.inp-ddlln, .inp-ctrln, .inp-txtln, .inp-numln {
    text-decoration: underline;
}

.inp-lbl {
    padding: 3px 2px;
    font-weight: bold;
}

    .inp-lbl:empty {
        padding: 0;
    }

.inp-pic {
    padding: 2px;
    border: 1px solid #c4c4c4; /* Do not remove */
}

.inp-chk input {
    margin: 2px;
    cursor: pointer;
    vertical-align: middle;
}

.r-criteria {
    float: left;
    padding-bottom: 6px;
}

    .r-criteria select, .r-criteria input {
        min-height: 23px;
    }

    .r-criteria .inp-rad input[type*="radio"], .r-criteria .inp-rad label {
        vertical-align: middle;
    }

    .r-criteria .inp-rad input[type*="radio"] {
        margin-top: 0;
    }

.r-labelR, .r-labelL {
    padding: 1px 5px 1px 5px;
    font-size: 10pt;
    font-family: helvetica, Verdana, 'Times New Roman';
    color: Black;
    background-color: Transparent;
    white-space: nowrap;
    vertical-align: middle;
}

.r-labelR {
    text-align: right;
}

.r-labelL {
    text-align: left;
}

.r-labelT {
    white-space: normal;
}

.r-labelM {
    vertical-align: middle;
}

.r-content {
    padding: 1px 4px 1px 4px; /* needed for the screen criteria */
    text-align: left;
    color: #333;
    font-family: helvetica, Verdana, 'Times New Roman';
    font-size: 13px;
    color: #333;
    border-radius: 4px;
    width: 100%;
}

.screen-search .r-tr > .r-content {
    height: 26px;
}

.r-tr > .r-content {
    height: 28px;
}

.r-icon {
    vertical-align: text-bottom;
    height: 16px;
    position: absolute;
    padding-top: 2px;
}

/*Jquery ui Dialog Box custom css*/
.ui-dialog-buttonset .ui-button .ui-icon-maximize {
    background-image: url('../images/button/maximize.png');
    background-position: center;
}

.ui-dialog-buttonset .ui-button .ui-icon-restore {
    background-image: url('../images/button/restore.png');
    background-position: center;
}

.ui-dialog-buttonset {
    padding-top: 2px;
}

    .ui-dialog-buttonset .ui-dialog .ui-dialog-buttonpane button {
        margin-right: 2px;
    }

.searchDlg .ui-dialog-buttonpane .ui-dialog-buttonset button {
    background-color: #f6f6f6;
    border: 1px solid #ccc;
    padding: 1px;
    height: 20px;
    width: 20px;
    top: 50%;
    margin-top: 0;
}

    .searchDlg .ui-dialog-buttonpane .ui-dialog-buttonset button:hover {
        background-color: #fdf5c1;
        border: 1px solid #fbcb09;
    }

.searchDlg .ui-resizable-w, .searchDlg .ui-resizable-n, .searchDlg .ui-resizable-nw, .searchDlg .ui-resizable-sw, .searchDlg .ui-resizable-ne {
    display: none !important;
}

.ui-dialog {
    z-index: 1001 !important;
}

    .ui-dialog .ui-dialog-buttonpane {
        position: absolute;
        top: 5px;
        right: 40px;
        margin: 0px;
        padding: 0px;
        border-top: 0px;
        background-color: transparent;
    }

.ui-dialog-buttonset {
    background-color: transparent;
}

.ui-dialog .ui-dialog-buttonpane button {
    margin: 0px 5px;
    border: none;
    background-color: #FF5C00;
    background-image: none;
    color: white;
}

.ui-button-text-only .ui-button-text {
    padding: 0.2em 1em;
}

.ui-dialog .ui-dialog-title {
    color: #333;
}

.ui-dialog .ui-dialog-titlebar {
    background-color: transparent;
    float: none;
}

.ui-widget-header .ui-icon {
    background-image: url('../css/images/ui-icons_222222_256x240.png');
}

.ui-widget-header {
    background-image: none;
    border: none;
}

.ui-dialog .ui-dialog-titlebar-close {
    margin-right: 10px;
}

    .ui-dialog .ui-dialog-titlebar-close:hover, .ui-dialog .ui-dialog-titlebar-close:focus {
        margin-right: 10px;
    }

.ui-dialog .ui-dialog-content {
    height: auto !important;
}

#searchLinkDlg {
    width: 100% !important; /*slove the width issue for the iframe inside the dialog box created in ClientRule.js */
    overflow: auto;
}

/*Jquery Token Input Control style Without Search List*/
ul.token-input-list-tokenInput {
    overflow: hidden;
    width: 100%;
    border: 1px solid #8496ba;
    cursor: text;
    font-size: 12px;
    font-family: Verdana;
    min-height: 1px;
    z-index: 999;
    margin: 0;
    padding: 0;
    background-color: #fff;
    list-style-type: none;
    clear: left;
    border-radius: 4px;
}

    ul.token-input-list-tokenInput li input {
        border: 0;
        width: 50px;
        padding: 1px 8px;
        background-color: white;
        margin: 1px 0;
        -webkit-appearance: caret;
    }

li.token-input-token-tokenInput {
    overflow: hidden;
    height: auto !important;
    height: 15px;
    margin: 3px;
    padding: 1px 3px;
    background-color: #eff2f7;
    color: #000;
    cursor: default;
    border: 1px solid #ccd5e4;
    font-size: 11px;
    border-radius: 5px;
    float: left;
    white-space: nowrap;
}

    li.token-input-token-tokenInput p {
        display: inline;
        padding: 0;
        margin: 0;
    }

    li.token-input-token-tokenInput span {
        color: #a6b3cf;
        margin-left: 5px;
        font-weight: bold;
        cursor: pointer;
    }

li.token-input-selected-token-tokenInput {
    background-color: #5670a6;
    border: 1px solid #3b5998;
    color: #fff;
}

li.token-input-input-token-tokenInput {
    float: left;
    margin: 0;
    padding: 0;
    list-style-type: none;
}

div.token-input-dropdown-tokenInput {
    position: absolute;
    width: 400px;
    background-color: #fff;
    overflow: hidden;
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    cursor: default;
    font-size: 11px;
    font-family: Verdana;
    z-index: 1;
    display: none !important;
}

    div.token-input-dropdown-tokenInput p {
        margin: 0;
        padding: 5px;
        font-weight: bold;
        color: #777;
        display: none !important;
    }

    div.token-input-dropdown-tokenInput ul {
        margin: 0;
        padding: 0;
    }

        div.token-input-dropdown-tokenInput ul li {
            background-color: #fff;
            padding: 3px;
            margin: 0;
            list-style-type: none;
        }

            div.token-input-dropdown-tokenInput ul li.token-input-dropdown-item-tokenInput {
                background-color: #fff;
            }

            div.token-input-dropdown-tokenInput ul li.token-input-dropdown-item2-tokenInput {
                background-color: #fff;
            }

            div.token-input-dropdown-tokenInput ul li em {
                font-weight: bold;
                font-style: normal;
            }

            div.token-input-dropdown-tokenInput ul li.token-input-selected-dropdown-item-tokenInput {
                background-color: #3b5998;
                color: #fff;
            }

/*Jquery Token Input Control Style With Search List*/
ul.token-input-list-tokenInputWithSearch {
    overflow: hidden;
    height: auto !important;
    height: 1%;
    width: 143px;
    border: 1px solid #8496ba;
    cursor: text;
    font-size: 12px;
    font-family: Verdana;
    min-height: 1px;
    z-index: 999;
    margin: 0;
    padding: 0;
    background-color: #fff;
    list-style-type: none;
    clear: left;
    border-radius: 4px;
}

    ul.token-input-list-tokenInputWithSearch li input {
        border: 0;
        width: 50px;
        padding: 1px 8px;
        background-color: white;
        margin: 1px 0;
        -webkit-appearance: caret;
    }

li.token-input-token-tokenInputWithSearch {
    overflow: hidden;
    height: auto !important;
    height: 15px;
    margin: 3px;
    padding: 1px 3px;
    background-color: #eff2f7;
    color: #000;
    cursor: default;
    border: 1px solid #ccd5e4;
    font-size: 11px;
    border-radius: 5px;
    float: left;
    white-space: nowrap;
}

    li.token-input-token-tokenInputWithSearch p {
        display: inline;
        padding: 0;
        margin: 0;
    }

    li.token-input-token-tokenInputWithSearch span {
        color: #a6b3cf;
        margin-left: 5px;
        font-weight: bold;
        cursor: pointer;
    }

li.token-input-selected-token-tokenInputWithSearch {
    background-color: #5670a6;
    border: 1px solid #3b5998;
    color: #fff;
}

li.token-input-input-token-tokenInputWithSearch {
    float: left;
    margin: 0;
    padding: 0;
    list-style-type: none;
}

div.token-input-dropdown-tokenInputWithSearch {
    position: absolute;
    width: 400px;
    background-color: #fff;
    overflow: hidden;
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    cursor: default;
    font-size: 11px;
    font-family: Verdana;
    z-index: 1;
}

    div.token-input-dropdown-tokenInputWithSearch p {
        margin: 0;
        padding: 5px;
        font-weight: bold;
        color: #777;
    }

    div.token-input-dropdown-tokenInputWithSearch ul {
        margin: 0;
        padding: 0;
    }

        div.token-input-dropdown-tokenInputWithSearch ul li {
            background-color: #fff;
            padding: 3px;
            margin: 0;
            list-style-type: none;
        }

            div.token-input-dropdown-tokenInputWithSearch ul li.token-input-dropdown-item-tokenInputWithSearch {
                background-color: #fff;
            }

            div.token-input-dropdown-tokenInputWithSearch ul li.token-input-dropdown-item2-tokenInputWithSearch {
                background-color: #fff;
            }

            div.token-input-dropdown-tokenInputWithSearch ul li em {
                font-weight: bold;
                font-style: normal;
            }

            div.token-input-dropdown-tokenInputWithSearch ul li.token-input-selected-dropdown-item-tokenInputWithSearch {
                background-color: #3b5998;
                color: #fff;
            }

/* Customize jquery-ui-1.10.4.custom.min.css */
ul.ui-autocomplete .ui-menu-item {
    list-style-image: none;
}

    ul.ui-autocomplete .ui-menu-item a {
        padding-top: 2.4px;
        padding-bottom: 2.4px;
    }

.ui-widget-header .ui-icon {
    background-image: url('../css/images/ui-icons_222222_256x240.png');
}

.ui-widget-header {
    background-image: none;
    border: none;
}

.TpMenuIcon {
    max-height: 20px;
}

.sb-menu .TpMenuLevel_1.TpMenuItemLast a, .sb-menu .TpMenuLevel_2.TpMenuItemLast a, .sb-menu .TpMenuLevel_3.TpMenuItemLast a,
.sb-menu .TpMenuLevel_4.TpMenuItemLast a, .sb-menu .TpMenuLevel_1.TpMenuItemLast a:hover, .sb-menu .TpMenuLevel_2.TpMenuItemLast a:hover,
.sb-menu .TpMenuLevel_3.TpMenuItemLast a:hover, .sb-menu .TpMenuLevel_4.TpMenuItemLast a:hover {
    border-bottom-right-radius: 0px !important;
}

#sb-site {
    z-index: auto !important;
    box-shadow: none;
}

/* ClientSide charts control Style */
div.jqplot-target {
    height: 300px;
    width: 500px;
    margin: 15px auto;
}

.jqplot-yaxis {
    margin-top: 20px;
}

.jqplot-title {
    font-size: 15px;
    font-weight: bold;
}

.jqplot-yaxis-label {
    left: -25px !important;
}

.jqplot-xaxis .jqplot-xaxis-tick {
    margin-top: 20px !important;
}

.jqplot-xaxis {
    margin-left: 10px !important;
    margin-top: 10px;
}

.jqplot-grid-canvas, .jqplot-series-canvas, .jqplot-series-shadowCanvas, .jqplot-lineRenderer-highlight-canvas {
    padding: 20px 0 0 10px;
}

.jqplot-event-canvas {
    display: none;
}

/* Google minimal jquery tab-folder. */
#tabs {
    overflow: hidden;
    width: 100%;
    margin: 10px 0 0 0;
    padding: 0;
    list-style: none;
}

    #tabs li {
        float: left;
        margin: 0 -15px 0 0;
    }

    #tabs a {
        float: left;
        position: relative;
        padding: 0 22px;
        height: 0;
        line-height: 27px;
        text-transform: uppercase;
        text-decoration: none;
        color: #fff;
        border-right: 30px solid transparent;
        border-bottom: 25px solid #3D3D3D;
        border-bottom-color: #777\9;
        opacity: .3;
        filter: alpha(opacity=30);
    }

        #tabs a:hover, #tabs a:focus {
            border-bottom-color: #2ac7e1;
            opacity: 1;
            filter: alpha(opacity=100);
        }

        #tabs a:focus {
            outline: 0;
        }

        #tabs a.current {
            z-index: 1;
            border-bottom-color: #3d3d3d;
            opacity: 1;
            filter: alpha(opacity=100);
        }

/* Flexslider Carousel */
.flexslider {
    display: table;
    position: relative;
    zoom: 1;
}

.flex-viewport {
    max-height: 2000px;
    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    transition: all 1s ease;
}

.loading .flex-viewport {
    max-height: 300px;
}

.flexslider .slides {
    zoom: 1;
    overflow: hidden;
}

.carousel li {
    margin-right: 5px;
}

.flexslider:hover .flex-next {
    opacity: 0.8;
    right: 5px;
}

.flexslider:hover .flex-prev {
    opacity: 0.8;
    left: 5px;
}

    .flexslider:hover .flex-next:hover, .flexslider:hover .flex-prev:hover {
        opacity: 1;
    }

.flex-direction-nav .flex-disabled {
    opacity: .3!important;
    filter: alpha(opacity=30);
    cursor: default;
}

.flex-control-nav {
    width: 100%;
    position: absolute;
    bottom: 10px;
    text-align: center;
}

    .flex-control-nav li {
        margin: 0 6px;
        display: inline-block;
        zoom: 1;
        *display: inline;
    }

.flex-direction-nav a {
    width: 30px;
    height: 30px;
    margin: -20px 0 0;
    display: block;
    background: url(../images/bg_direction_nav.png) no-repeat 0 0;
    position: absolute;
    top: 50%;
    cursor: pointer;
    text-indent: -9999px;
    opacity: 0;
    -webkit-transition: all .3s ease;
}

.flex-direction-nav .flex-next {
    background-position: 100% 0;
}

.flex-direction-nav .flex-prev {
}

.flex-container a:active,
.flexslider a:active,
.flex-container a:focus,
.flexslider a:focus {
    outline: none;
}

.slides, .flex-control-nav, .flex-direction-nav {
    margin: 0;
    padding: 0;
    list-style: none;
}

.slides {
    display: table-cell;
}

.flexslider .flex-control-nav {
    display: none;
}

/*Mobile Menu custom css*/
#mobileMenu {
    display: none;
}

#TpMenu {
    display: block;
}

/* Calender display */
.responsive-calendar {
    width: 100%;
    position: relative;
    max-width: 960px;
}

    .responsive-calendar * {
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

    .responsive-calendar .responsive-calendar-date span, .responsive-calendar .calendar-day-headers span {
        font-family: Courier, monospace;
    }

    .responsive-calendar .responsive-calendar-date {
        border-bottom: 1px solid #EEEEEE;
        margin: 10px 0;
        padding-bottom: 10px;
    }

.responsive-calendar-content .calendar-day-headers .dayname, .responsive-calendar-content .calendar-day-content .day {
    float: left;
    width: 13.6%;
    margin: 5px 0 5px 0.8%;
    border-radius: 4px;
}

.responsive-calendar-content .calendar-day-headers .first-child, .responsive-calendar-content .calendar-day-content .first-child {
    margin-left: 0;
}

.responsive-calendar-content .calendar-day-headers .dayname .clear, .responsive-calendar-content .calendar-day-content .clear {
    clear: both;
}

.responsive-calendar .dayname {
    background-color: #ededed;
    box-shadow: 0 1px 2px #ccc;
    text-align: center;
    max-height: 30px;
    height: 100%;
    line-height: 28px;
}

    .responsive-calendar .dayname span {
        color: #666;
        text-transform: uppercase;
        font-size: 16px;
    }

.responsive-calendar .day {
    box-shadow: 0 1px 2px #CCCCCC;
    height: 50px;
    position: relative;
    background-color: #fcfcfc;
}

.responsive-calendar .active {
}

.responsive-calendar .disabled {
    opacity: 0.6;
}

.responsive-calendar .day {
    background-repeat: no-repeat;
    background-position: center;
}

    .responsive-calendar .day .day-head {
        display: inline-block;
        background-color: #ededed;
        width: 20px;
        text-align: center;
        border-radius: 2px;
        margin: 2px 0 0 2px;
    }

        .responsive-calendar .day .day-head span {
            color: #333;
        }

    .responsive-calendar .day .day-head-right {
        display: inline-block;
        float: right;
        margin: 2px 2px 0 0;
    }

        .responsive-calendar .day .day-head-right span {
            color: white;
        }

    .responsive-calendar .day .day-text span {
        color: #eee;
    }

    .responsive-calendar .day .day-text > a > span {
        color: #aaa;
        text-decoration: underline;
    }

    .responsive-calendar .day .day-text a {
        text-decoration: none;
    }

        .responsive-calendar .day .day-text a:hover {
            text-decoration: underline;
            color: white;
        }

    .responsive-calendar .day .day-text {
        margin: 2px;
        white-space: normal;
        text-align: center;
        line-height: 12px;
        padding-top: 2px;
    }

.responsive-calendar .responsive-calendar-date .button {
    position: absolute;
    background-color: #F29D2C;
    color: white;
    padding: 5px 10px;
    border-radius: 4px;
}

.responsive-calendar .responsive-calendar-date .btn-prev {
    top: 0;
    left: 0;
}

.responsive-calendar .responsive-calendar-date .btn-next {
    top: 0;
    right: 0;
}

.responsive-calendar .responsive-calendar-date .date {
    text-align: center;
}

    .responsive-calendar .responsive-calendar-date .date span {
        font-size: 24px;
        color: #333;
    }

        .responsive-calendar .responsive-calendar-date .date span.prior-month:not(:empty) {
            font-size: 18px;
            border-radius: 4px;
            padding: 3px 5px;
            background: rgba(0,0,0,0.1);
            color: #777;
            position: absolute;
            left: 0;
            width: 60px;
        }

        .responsive-calendar .responsive-calendar-date .date span.next-month:not(:empty) {
            font-size: 18px;
            border-radius: 4px;
            padding: 3px 5px;
            background: rgba(0,0,0,0.1);
            color: #777;
            position: absolute;
            right: 0;
            width: 60px;
        }

        .responsive-calendar .responsive-calendar-date .date span.prior-month:hover, .responsive-calendar .responsive-calendar-date .date span.next-month:hover {
            background-color: #e8e8e8;
            color: #555;
        }

.mobileHeader, .LinkBtnSec, .SociBtnSec, .ProfBtnSec {
    display: none;
}

.cntPanel {
    width: 100%;
    display: table;
}

    .cntPanel > div {
        display: table-cell;
    }

.LSide, .RSide {
    max-width: 200px;
    vertical-align: top;
}

.mobilekeyPop .mobileHeader, .mobilekeyPop .BannerBtn {
    position: absolute;
}

.ajax__htmleditor_editor_base {
    height: auto !important;
    background-color: #ededed !important;
}

section.grid-pad {
    background: rgba(255,255,255,0.7);
    padding: 10px;
    border-radius: 4px;
    margin-top: 5px;
}

input.chkMobile {
    position: static;
}

.ui-datepicker-title select.ui-datepicker-month, .ui-datepicker-title select.ui-datepicker-year {
    color: black;
}
.resultTotal
{
    font-size: 12px; color: #666; font-weight: bold; padding: 3px 5px 5px 5px; display: inline-block;
}

.itemTotal {
    font-size: 12px; color: #666; font-weight: bold; padding: 5px 2px 5px 2px; display: block; border-radius: 2px; background-color: white; margin-top: 5px; text-align: center;
}

/* @media should always be the last item on css */
/* Web only */
@media only screen and (min-width : 768px) {
    #sb-site {
        left: 0px !important;
        min-height: 100% !important;
    }

    .ListView .GrdItm:hover, .ListView .GrdAlt:hover {
        background: #fff9b4;
        cursor: pointer;
    }
}

/* Mobile & Tablet shared */
@media only screen and (max-width : 992px) {
    .mobileHeader {
        display: block;
        position: fixed;
        top: 0;
        left: 0;
        background-color: #333;
        opacity: 0.75;
        width: 100%;
        padding: 4px 6px 0px 10px;
        z-index: 99;
    }

        .mobileHeader > div {
            float: right;
        }

    .mobileLogo img {
        max-height: 25px;
    }

    .BannerBtn {
        float: none;
        position: fixed;
        bottom: 0px;
        background: rgba(0,0,0,0.7);
        padding: 5px 10px;
        z-index: 99;
        width: 100%;
        left: 0;
        right: 0;
    }

    .BannerGrp {
        margin-top: 0;
        padding: 0;
        background-color: transparent;
    }

    .CustomizeButtonImg, .EditButtonImg, .MoreButtonImg, .SaveCloseButtonImg, .SaveButtonImg, .NewSaveButtonImg, .CopySaveButtonImg, .ExpTxtButtonImg, .ExpRtfButtonImg, .UndoAllButtonImg, .RedoAllButtonImg, .ClearButtonImg, .AuditButtonImg, .NewButtonImg, .CopyButtonImg, .DeleteButtonImg, .helpCnt, .ShowCriButtonImg, .ExpXmlButtonImg, .ExpPdfButtonImg, .ExpDocButtonImg, .ExpXlsButtonImg, .ViewButtonImg, .PrintButtonImg, .PreviewButtonImg {
        background-color: #e8e8e8;
    }

        .CustomizeButtonImg:hover, .EditButtonImg:hover, .MoreButtonImg:hover, .SaveCloseButtonImg:hover, .SaveButtonImg:hover, .NewSaveButtonImg:hover, .CopySaveButtonImg:hover, .ExpTxtButtonImg:hover, .ExpRtfButtonImg:hover, .UndoAllButtonImg:hover, .RedoAllButtonImg:hover, .ClearButtonImg:hover, .AuditButtonImg:hover, .NewButtonImg:hover, .CopyButtonImg:hover, .DeleteButtonImg:hover, .helpCnt:hover, .ShowCriButtonImg:hover, .ExpXmlButtonImg:hover, .ExpPdfButtonImg:hover, .ExpDocButtonImg:hover, .ExpXlsButtonImg:hover, .ViewButtonImg:hover, .PrintButtonImg:hover, .PreviewButtonImg:hover {
            background-color: white;
        }

    .moreButtonSec {
        position: absolute;
        bottom: 67px;
        left: 0px;
        right: 0px;
        background: rgba(0,0,0,0.7);
        padding: 5px 10px;
        z-index: 999;
    }

        .moreButtonSec > div > input {
            margin: 0px 0 4px 4px;
        }

    .MoreButtonImg {
        display: block;
    }

    .BtnTbl > div.MoreBtnCnt, .BtnTbl > div.HelpMsgCnt {
        float: right;
    }

    .BtnTbl > div {
        margin-right: 4px;
    }

        .BtnTbl > div.HelpMsgCnt {
            margin-right: 0px;
        }

    .BtnTbl img {
        margin: 0px 5px;
    }

    .mMenuTitle {
        font-size: 14px;
        color: #ddd;
        vertical-align: top;
    }

    .navicon-line:first-of-type {
        margin-top: 2px;
    }

    .navicon-line {
        width: auto;
        margin-left: 0;
    }

    .hideMoreButtonSec {
        display: none;
    }

    .mobileHeader .mobileLogo {
        max-height: 35px;
        padding: 1px;
        border: 1px solid transparent !important;
        border-radius: 4px;
        float: left;
    }

        .mobileHeader.mobileLogo:hover {
            cursor: pointer;
            border: 1px solid #e5e5e5 !important;
        }

    .mobileHeader .crumbSec {
        margin-top: 8px;
        float: left;
    }

    .crumbMobile {
        text-decoration: none;
        color: white;
        border-radius: 4px;
        margin: 0 0 0 2px;
        cursor: default;
        font-size: 16px;
        font-weight: bold;
    }

    #sb-site {
        margin: 0 0 40px 0;
    }

    .ProfileUser, .ProfileBtn {
        display: none;
    }

        .ProfileUser .LbUsrName {
            color: white;
        }

    .ProfBtnSec, .LinkBtnSec, .SociBtnSec, .SignInMobile {
        display: block;
        color: #333;
        z-index: 101;
        background-repeat: no-repeat;
        background-position: center 18px;
        background-size: auto 12px;
        font-size: 13px;
        font-family: Comic Sans MS;
        text-transform: uppercase;
        background-color: transparent;
        height: auto;
        width: auto;
        border: none;
        background-color: #e8e8e8;
        height: 32px;
        padding: 0 5px 16px 5px;
        letter-spacing: -0.5px;
        margin: 0 2px;
        text-align: center;
    }

        .ProfBtnSec:hover, .LinkBtnSec:hover, .SociBtnSec:hover, .SignInMobile:hover {
            background-color: white;
            cursor: pointer;
        }

    .ProfBtnSec, .SignInMobile {
        background-image: url('../images/button/Profile.png');
    }

    .LinkBtnSec {
        background-image: url('../images/button/Links.png');
    }

    .SociBtnSec {
        background-image: url('../images/button/Social.png');
    }

    header .link-content {
        position: fixed;
        top: 37px;
        left: 0px;
        background-color: #333;
        opacity: 0.70;
        padding: 0px 10px;
        width: 100%;
        z-index: 99;
        margin: 0;
    }

    .link-content .r-table .r-tr .r-td {
        padding: 0px;
    }

    .link-content .r-table a, .link-content .r-table input {
        background-color: #e5e5e5;
        height: 26px;
        color: #333;
        font-size: 11px;
        border-radius: 4px;
        vertical-align: middle;
        margin: 4px 0 4px 2px;
    }

        .link-content .r-table a:hover, .link-content .r-table input:hover {
            background-color: white;
        }

    .link-content .r-table a {
        padding: 7px !important;
        display: inline-block;
        text-align: center;
        font-weight: bold;
        width: auto;
    }

    .link-content .r-table input {
        padding: 2px !important;
    }

    #mobileMenu {
        display: inline-block;
        vertical-align: middle;
    }

    #TpMenu, #VrMenu {
        display: none !important;
    }

    #TpMobileMenu {
        display: block;
    }

    a.TpMenuLink {
        background-color: transparent;
    }

    ul.TpMenuSub a.TpMenuLink:hover {
        background-color: transparent;
    }

    .ProfCmp, .ProfPrj, .ProfSys {
        display: none;
    }

    .HideOnMobile {
        display: none !important;
    }

    .HideBgImgOnMobile {
        background-image: none !important;
    }

    body .ui-tooltip {
        position: fixed !important;
        bottom: 60px !important;
        top: auto !important;
        right: 0 !important;
        left: auto !important;
    }

    .helpful-tip, .CustomizeButtonImg, .EditButtonImg, .MoreButtonImg, .SaveCloseButtonImg, .SaveButtonImg, .NewSaveButtonImg, .CopySaveButtonImg, .ExpTxtButtonImg,
    .ExpRtfButtonImg, .UndoAllButtonImg, .RedoAllButtonImg, .ClearButtonImg, .AuditButtonImg, .NewButtonImg, .CopyButtonImg, .DeleteButtonImg, .ShowCriButtonImg,
    .ExpXmlButtonImg, .ExpPdfButtonImg, .ExpDocButtonImg, .ExpXlsButtonImg, .ViewButtonImg, .PrintButtonImg, .PreviewButtonImg {
        padding-top: 20px;
        font-size: 9px;
        min-width: 35px;
        background-size: 18px;
    }

    header.grid {
        margin-top: 36px;
    }

    .mobilekeyPop header.grid {
        margin-top: 0px;
        min-height: 35px;
    }

    .mobilekeyPop .reset-lang {
        margin-top: 36px;
    }

    input.signOutButton {
        display: none;
    }

    .helpful-tip, .CustomizeButtonImg, .EditButtonImg, .MoreButtonImg, .SaveCloseButtonImg, .SaveButtonImg, .NewSaveButtonImg, .CopySaveButtonImg, .ExpTxtButtonImg, 
    .ExpRtfButtonImg, .UndoAllButtonImg, .RedoAllButtonImg, .ClearButtonImg, .AuditButtonImg, .NewButtonImg, .CopyButtonImg, .DeleteButtonImg, .ShowCriButtonImg, 
    .ExpXmlButtonImg, .ExpPdfButtonImg, .ExpDocButtonImg, .ExpXlsButtonImg, .ViewButtonImg, .PrintButtonImg, .PreviewButtonImg {
        font-size: 16px;
    }
}

/* Tablet only */
@media only screen and (min-width : 768px) and (max-width : 992px) {
    /* HideObjOnTablet must come before ShowObjHeader here */
    .HideObjOnTablet {
        display: none !important;
    }

    .ShowObjHeader {
        display: inline-block !important;
    }

    .GrdHead, .GrdSel, .GrdFoot, .GrdTxtLb, .GrdBoxLb, .GrdNwrLb, .GrdTxtLn, .GrdBoxLn, .GrdNwrLn, .GrdLabelText, .GrdEdtLabelText, div.GrdInner:last-of-type {
        padding-left: 0px;
        letter-spacing: -1px;
    }

    .inp-lbl {
        letter-spacing: -1px;
    }

    .r-content {
        padding: 1px 4px !important;
    }
}
/* Mobile only */
@media only screen and (max-width : 768px) {
    .LSide, .RSide {
        max-width: none;
    }

    .cntPanel > div {
        display: block;
    }

    .r-criteria {
        float: none;
    }

        .r-criteria input:not([type=checkbox]), .r-criteria select {
            width: 100% !important;
        }

    .sb-navbar {
        left: 0px !important;
        border: 1px solid transparent;
        border-radius: 4px;
    }

        .sb-navbar:hover {
            border: 1px solid #aaa;
        }

    div.sb-right {
        overflow-x: hidden;
    }

    #sb-site {
        transform: none;
        -ms-transform: none;
        -webkit-transform: none;
    }

    .sb-right .sb-menu li a {
        border: none;
        text-align: left;
    }

    .wizard-image div {
    }

    .wizard-image-mob {
        display: block;
        width: 100%;
        margin: 0 auto;
    }

    .wizard-image-dsk {
        display: none;
    }

    /* Error Message Mobile */
    .triangle-right {
        border: none;
        border-radius: 0px;
        box-shadow: none;
    }

        .triangle-right:after {
            display: none;
        }

        .triangle-right.left {
            margin-left: 0px;
        }

    .flag {
        max-width: none;
        margin-left: 0px !important;
        margin-top: 0px !important;
        position: static;
    }

    .GrdHead, .GrdSel, .GrdFoot, .GrdTxtLb, .GrdBoxLb, .GrdNwrLb, .GrdTxtLn, .GrdBoxLn, .GrdNwrLn, .GrdLabelText, .GrdEdtLabelText, div.GrdInner:last-of-type {
        padding-left: 0px;
        letter-spacing: -1px;
    }

    .inp-lbl {
        letter-spacing: -1px;
    }

    div.GrdInner td {
        width: 100%;
    }

    .GrdTxt, .GrdBox, .GrdNum, .GrdDdl, .GrdAlt, .GrdItm, .GrdCtr {
        color: #333;
    }

    .GrdBox {
        text-align: left;
    }

    .GrdEdtLabelText {
        color: #000000;
        padding: 2px 0 0 0;
        margin: 2px 0 0 0;
        font-weight: bold;
    }

    .GrdItm, .GrdAlt {
        border: 1px solid #cdcdcd;
        padding: 10px;
        margin: 5px 0;
    }

    .selectedItm .GrdInner {
        border-bottom: 1px solid #ededed;
        padding-bottom: 5px;
    }

    .selectedItm .g-td {
        padding: 0px 2px;
    }

        .selectedItm .g-td:last-child {
            margin-top: 10px;
        }

    .GrdEdtTmp {
        padding: 10px 15px 10px 10px;
    }

        .GrdEdtTmp div.GrdOuter {
            display: inline-block;
        }

    .ListView .selectedItm, .GrdEdtTmp {
        border: 1px solid #c2d7ef;
        background: #FDF5EC;
    }

    .screen-tabfolder .r-table {
        background: #FDF5EC;
    }

    .cntPanel {
        display: block;
    }

    .r-docIcon, .r-icon {
        position: static;
    }

    .GrdEdtTmp .GrdTxt, .GrdEdtTmp .GrdBox, .GrdEdtTmp .GrdNum, .GrdEdtTmp .GrdDdl, .GrdEdtTmp .GrdCtr, .GrdEdtTmp .GrdLabelText, .GrdEdtTmp .GrdEdtLabelText, .GrdEdtTmp div.GrdInner:last-of-type {
        text-align: left;
    }

    .GrdEdtTmp div.GrdInner {
        max-width: 100% !important;
    }

    .grid-container {
        display: inline;
    }

    .HideObjOnMobile {
        display: none !important;
    }

    .grid-container .button-container .button-grp input.InsRowButtonImg {
        height: 35px;
        margin-bottom: 10px;
    }

    .button-container .button-grp {
        float: none;
        display: block;
    }

    .button-container > div {
        display: block;
    }

    .grid-container .button-container .button-grp input.InsRowButtonImg, .grdFind, .grdFind input, .grdFindFilter, .grdFindFilter select, .grdSortDiv {
        width: 100%;
    }

    .button-grp div.btnPgGrp {
        margin-left: auto;
        margin-right: auto;
    }

    .grdFindFilter {
        padding-left: 2px;
    }

    .grdFind, .grdSortDiv {
        padding-left: 5px;
    }

    .grid-container .button-container .grdFind input {
        margin-top: 3px;
        margin-bottom: 3px;
    }

    .grid div.grid-container, .grid-container .viewport {
        display: block;
    }

    section.grid-pad {
        padding: 0px;
    }

    .DocPanel input[type*="file"] {
        width: auto;
    }

    .responsive-calendar .day .day-head {
        width: 10px;
    }

        .responsive-calendar .day .day-head span {
            font-size: 9px;
        }

    .responsive-calendar .day .day-head-right span {
        font-size: 9px;
    }
    .helpful-tip, .CustomizeButtonImg, .EditButtonImg, .MoreButtonImg, .SaveCloseButtonImg, .SaveButtonImg, .NewSaveButtonImg, .CopySaveButtonImg, .ExpTxtButtonImg, 
    .ExpRtfButtonImg, .UndoAllButtonImg, .RedoAllButtonImg, .ClearButtonImg, .AuditButtonImg, .NewButtonImg, .CopyButtonImg, .DeleteButtonImg, .ShowCriButtonImg, 
    .ExpXmlButtonImg, .ExpPdfButtonImg, .ExpDocButtonImg, .ExpXlsButtonImg, .ViewButtonImg, .PrintButtonImg, .PreviewButtonImg { 
        padding-top: 20px;
        font-size: 9px;
        min-width: 35px;
        background-size: 18px;
    }

    .moreButtonSec 
    {
        bottom: 47px;
    }

    .mMenuTitle
    {
        font-size: 10px;
    }

     .ProfBtnSec, .LinkBtnSec, .SociBtnSec, .SignInMobile { 
        display: block;
        color: #333;
        z-index: 101;
        background-repeat: no-repeat;
        background-position: center 17px;
        background-size: auto 10px;
        font-size: 10px;
        font-family: Comic Sans MS;
        text-transform: uppercase;
        background-color: transparent;
        height: auto;
        width: auto;
        border: none;
        background-color: #e8e8e8;
        height: 30px; 
        padding: 0 3px 12px 3px; 
        letter-spacing:-0.5px;
        margin: 0 2px;
        text-align: center;
    }

    .crumbMobile
    {
        font-size: 12px;
    }
}

/* charting for really small screen (Smartphones - portrait/landscape) like iphone and this must be at the end of this css file */
@media only screen and (max-width : 480px) {
    div.jqplot-target {
        height: 300px;
        width: 270px;
        margin: 10px;
    }

    .GoogleSignInPanel, .FbSignInPanel, .WinSignInPanel, .OffSignInPanel {
        float: none;
        width: 100%;
    }

    .FbSignInPanel {
        margin-top: 10px;
    }

    .MyPrfContent {
        padding: 20px 10px;
    }

    .GoogleLoginBtnSec div:first-child, .GoogleLoginBtnSec div:nth-child(2) {
        float: none;
    }

    .TabFolder .r-td {
        display: block;
        height: 100%;
        padding-top: 6px;
    }

    .TabFolder .r-content {
        padding-top: 1px;
    }

    .r-content {
        padding: 1px 4px !important;
    }

    .SignCanvas {
        max-width: 280px;
    }

    input.chkMobile {
        position: relative;
    }
}

/*extra small device*/
@media only screen and (max-width : 360px) 
{
    .helpful-tip, .CustomizeButtonImg, .EditButtonImg, .MoreButtonImg, .SaveCloseButtonImg, .SaveButtonImg, .NewSaveButtonImg, .CopySaveButtonImg, .ExpTxtButtonImg, 
    .ExpRtfButtonImg, .UndoAllButtonImg, .RedoAllButtonImg, .ClearButtonImg, .AuditButtonImg, .NewButtonImg, .CopyButtonImg, .DeleteButtonImg, .ShowCriButtonImg, 
    .ExpXmlButtonImg, .ExpPdfButtonImg, .ExpDocButtonImg, .ExpXlsButtonImg, .ViewButtonImg, .PrintButtonImg, .PreviewButtonImg { 
        font-size: 8px;
    }

     .moreButtonSec 
    {
        bottom: 44px;
    }

      .ProfBtnSec, .LinkBtnSec, .SociBtnSec, .SignInMobile { 
        display: block;
        color: #333;
        z-index: 101;
        background-repeat: no-repeat;
        background-position: center 17px;
        background-size: auto 10px;
        font-size: 8px;
        font-family: Comic Sans MS;
        text-transform: uppercase;
        background-color: transparent;
        height: auto;
        width: auto;
        border: none;
        background-color: #e8e8e8;
        height: 30px; 
        padding: 0 3px 12px 3px; 
        letter-spacing:-0.5px;
        margin: 0 2px;
        text-align: center;
    }

    .crumbMobile
    {
        font-size: 12px;
    }

    .mMenuTitle
    {
        font-size: 8px;
    }

    .BtnTbl > div
    {
        margin-right: 2px;
    }
}