/* ----------------------------------------------------------------------------- */
/* CSP Styles*/
/* ----------------------------------------------------------------------------- */
input[type="text"] {
    border-color: #8D91AA;
    background-color: #FFFFFF;
    border-width: thin;
    border-style: solid;
    padding: 2px 2px 1px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    font: 12px "segoe ui", arial, sans-serif;
    color: #5A5E72 !important;
}

.txt-area {
    border-color: #8D91AA;
    background-color: #FFFFFF;
    border-width: thin;
    border-style: solid;
    padding: 2px 2px 1px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    font: 12px "segoe ui", arial, sans-serif;
    color: #5A5E72 !important;
}

input[type="number"] {
    border-color: #8D91AA;
    background-color: #FFFFFF;
    border-width: thin;
    border-style: solid;
    padding: 2px 2px 1px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    color: #5A5E72 !important;
    font: 12px "segoe ui", arial, sans-serif;
}

select {
    border-color: #8D91AA;
    background-color: #FFFFFF;
    border-width: thin;
    border-style: solid;
    padding: 2px 2px 1px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    font: 12px "segoe ui", arial, sans-serif !important;
    color: #5A5E72 !important;
}


.td-master {
    background-color: #FFFFFF; /* Gets changed for Harbortouch*/
    width: 15%;
}

.hr-top {
    width: 100%;
    border-style: solid;
    border-width: 1px;
    border-color: #4f6f19; /* Gets changed for Harbortouch*/
    margin-top: 10px;
    margin-bottom: 10px;
}

.hr-bottom {
    width: 100%;
    border-style: solid;
    border-width: 1px;
    border-color: #4f6f19; /* Gets changed for Harbortouch*/
    margin-top: 10px;
    margin-bottom: 10px;
}

#menu > li > a {
    background-size: contain;
    background-repeat: no-repeat;
    height: 30px;
    padding-bottom: 2px;
    background-position-x: 5px;
    width: 180px;
}

    #menu > li > a:hover {
        height: 35px;
        background-size: contain;
        background-repeat: no-repeat;
        padding-bottom: 2px;
        background-position-x: 5px;
    }

#transactions {
    background: url('/Skin/Valutec/Images/Customer_Icon.png');
    height: 30px !important;
    /*width: 35px !important;*/
}

    #transactions:hover {
        background: url('/Skin/Valutec/Images/Customer_hover.png');
    }

#customers, #toast {
    background: url('/Skin/Valutec/Images/Customer_Icon.png');
    height: 30px !important;
    /*width: 35px !important;*/
}

    #customers:hover, #toast:hover {
        background: url('/Skin/Valutec/Images/Customer_hover.png');
    }

#help {
    background: url('/Skin/Valutec/Images/Help_Icon.png');
    height: 30px !important;
    /*width: 35px !important;*/
}

    #help:hover {
        background: url('/Skin/Valutec/Images/Help_hover.png');
    }

#reports {
    background: url('/Skin/Valutec/Images/Reports_Icon.png');
    height: 30px !important;
    /*width: 35px !important;*/
}

    #reports:hover {
        background: url('/Skin/Valutec/Images/Reports_hover.png');
    }

#admin {
    background: url('/Skin/Valutec/Images/Settings_Icon.png');
    height: 30px !important;
    /*width: 35px !important;*/
}

    #admin:hover {
        background: url('/Skin/Valutec/Images/Settings_hover.png');
    }

#orderTracking {
    background: url('/Skin/Valutec/Images/OrderTracking_Icon.png');
    height: 30px !important;
    /*width: 35px !important;*/
}

    #orderTracking:hover {
        background: url('/Skin/Valutec/Images/OrderTracking_hover.png');
    }

#myAccount {
    background: url('/Skin/Valutec/Images/MyAccount_Icon.png');
    height: 30px !important;
    /*width: 35px !important;*/
}

    #myAccount:hover {
        background: url('/Skin/Valutec/Images/MyAccount_hover.png');
    }

#maintenance {
    background: url('/Skin/Valutec/Images/Settings_Icon.png');
    /*background-size: 16px 16px;*/ /* adjust icon size */
    height: 30px !important;
}

    #maintenance:hover {
        /* keep same greyscale on hover or change as desired */
        /*filter: grayscale(100%) brightness(80%) contrast(90%);
        -webkit-filter: grayscale(100%) brightness(80%) contrast(90%);*/
        background: url('/Skin/Valutec/Images/Settings_hover.png');
        /*background-size: 16px 16px;*/ /* adjust icon size */
        /*height: 30px !important;
        background-color: #F5F5FD !important;*/
    }

#cardLookup {
    background: url('/Skin/Valutec/Images/CardLookup_Icon.png');
    height: 30px !important;
    /* width: 35px !important;*/
}

    #cardLookup:hover {
        background: url('/Skin/Valutec/Images/CardLookup_hover.png');
    }

#digitalGiftCardManager {
    background: url('/Skin/Valutec/Images/Import_Icon.png');
    padding-top: 2px !important;
    height: 30px !important;
    /*width: 35px !important;*/
}

    #digitalGiftCardManager:hover {
        background: url('/Skin/Valutec/Images/Import_hover.png');
    }

#WPCardSequence {
    background: url('/Skin/Valutec/Images/CardLookup_Icon.png');
    padding-top: 2px !important;
    height: 30px !important;
    /* width: 35px !important;*/
}

    #WPCardSequence:hover {
        background: url('/Skin/Valutec/Images/CardLookup_hover.png');
    }


#activityAlerts {
    background: url('/Skin/Valutec/Images/Import_Icon.png');
    padding-top: 2px !important;
    height: 30px !important;
    /*width: 35px !important;*/
}

    #activityAlerts:hover {
        background: url('/Skin/Valutec/Images/Import_hover.png');
    }

#primecardLookup {
    background: url('/Skin/Valutec/Images/CardLookup_Icon.png');
    height: 30px !important;
    /*width: 35px !important;*/
}

    #primecardLookup:hover {
        background: url('/Skin/Valutec/Images/CardLookup_hover.png');
        padding-top: 2px !important;
    }

.panel-default {
    border-color: #8D91AA !important;
}

.card-primary {
    border-color: #8D91AA !important;
}

/* ----------------------------------------------------------------------------- */
/* protected.master : Menu Controls Styles */
/* ----------------------------------------------------------------------------- */
.dropdown-submenu {
    position: relative;
}

    .dropdown-submenu > .dropdown-menu {
        top: 0;
        left: 100%;
        margin-top: 0px;
        margin-left: 0px;
        -webkit-border-radius: 0 6px 6px 6px;
        -moz-border-radius: 0 6px 6px;
        border-radius: 0 6px 6px 6px;
    }

    /*.dropdown-submenu > a:after {
        display: block;
        float: right;
        width: 0;
        height: 0;
        border-color: transparent;
        border-style: solid;
        border-width: 5px 0 5px 5px;
        border-left-color: #ccc;
    }*/

    .dropdown-submenu:hover > .dropdown-menu {
        display: block;
    }

    .dropdown-submenu:hover > a:after {
        border-left-color: #fff;
    }

    .dropdown-submenu.pull-left {
        float: none;
    }

        .dropdown-submenu.pull-left > .dropdown-menu {
            left: -100%;
            margin-left: 10px;
            -webkit-border-radius: 6px 0 6px 6px;
            -moz-border-radius: 6px 0 6px 6px;
            border-radius: 6px 0 6px 6px;
        }

    .dropdown-submenu > a:hover, ul.dropdown-menu.multi-level > li > a:hover, ul.dropdown-menu > li > a:hover {
        background-color: #6A6E87 !important;
        color: #1B1B6F;
        border: 1px solid #F5F5FD;
    }

    .dropdown-submenu > a:hover {
        color: #1B1B6F;
        border: 1px solid #6A6E87;
        width: 180px;
    }

    .dropdown-submenu > a:active {
        background-color: #6A6E87 !important;
        width: 170px;
        color: #1B1B6F;
    }

ul.dropdown-menu.multi-level, ul.dropdown-menu {
    top: 0;
    margin-top: 0px;
    margin-left: 0px;
    border: 1px solid #6A6E87;
    background-color: #F5F5FD;
}

    ul.dropdown-menu.multi-level > li > a, ul.dropdown-menu > li > a {
        font: normal 12px/21px "Segoe UI", Arial, sans-serif;
        color: #6A6E87;
        text-decoration: none;
        margin-left: 0px;
        padding: 3px 7px !important;
    }

.nav-stacked > li {
    width: 150px;
    margin-right: 5px;
}

.nav > li > a {
    font: normal bold 12px/21px "Segoe UI", Arial, sans-serif;
    line-height: 21px;
    color: #6A6E87 !important;
    padding: 1px 1px 1px 12px;
}

    .nav > li > a:hover, .nav > li > a:focus {
        text-decoration: none;
        background-color: #F5F5FD !important;
        width: 180px;
        color: #1B1B6F !important;
    }

.menuText {
    font: normal 12px/21px "Segoe UI", Arial, sans-serif;
    line-height: 21px;
    color: #6A6E87 !important;
    padding-left: 45px;
    display: block;
}


.submenu-img {
    padding-bottom: 2px;
    height: 15px;
    width: 15px;
    vertical-align: middle;
}

.dropend .dropdown-toggle::after {
    display: none !important;
}

/*****************************************************************************************/
/* Customer.aspx */
/*****************************************************************************************/
.txtCustomStyle {
    display: inline-block;
    white-space: nowrap;
    text-align: left;
    vertical-align: middle;
    border-width: 1px;
    border-style: solid;
    font: 12px "segoe ui",arial,sans-serif;
    border-color: #8D91AA;
    /*background: #e7f1d7 !important;*/
    color: #FFFFFF !important;
}

.btnFindCustomer, .btnFindCard, .btnLoadTransactions {
    text-align: right;
    white-space: nowrap;
    vertical-align: middle;
    color: #fff;
    background-color: #1B1B6F;
    border-width: 1px;
    border-style: solid;
    border-color: #8D91AA;
}

    .btnFindCustomer:hover, .btnFindCard, .btnLoadTransactions {
        background-color: #1B1B6F;
    }


/*****************************************************************************************/
/* AccountInformation.aspx */
/*****************************************************************************************/
.pnlAccountHead {
    height: 35px;
    background-color: #1B1B6F !important;
    /*background-image: url(PanelBar/RootItemBg.png) !important;*/
    border-color: #8D91AA !important;
    position: relative;
    padding-left: 10px;
    padding-top: 5px;
}

    .pnlAccountHead > a {
        display: inline-block;
        font: normal 12px/24px "Segoe UI", Arial, sans-serif;
        text-decoration: none;
        color: white !important;
        text-decoration: none !important;
        width: 100%;
        font-weight: bold;
    }

        .pnlAccountHead > a:hover {
            font: normal 12px/24px "Segoe UI", Arial, sans-serif;
            text-decoration: none;
            color: white !important;
            text-decoration: none !important;
            font-weight: bold;
        }

.pnlAccountBody {
    color: #5A5E72;
    font: normal 12px/24px "Segoe UI", Arial, sans-serif;
    background-color: #FFFFFF !important;
    padding: 5px !important;
}

.panel-group .panel + .panel {
    margin-top: 0px !important;
}

.panel-heading .accordion-toggle:after .card-heading {
    /* symbol for "opening" panels */
    font-family: 'Glyphicons Halflings'; /* essential for enabling glyphicon */
    content: "\e114"; /* adjust as needed, taken from bootstrap.css */
    float: right; /* adjust as needed */
    color: black; /* adjust as needed */
}

.panel-heading .accordion-toggle.collapsed:after {
    /* symbol for "collapsed" panels */
    content: "\e080"; /* adjust as needed, taken from bootstrap.css */
}

/* Down arrow (open) */
.pnlAccountHead > a.accordion-toggle::after {
    content: "\25BC"; /* ▼ */
    float: right;
    font-size: 1.2em;
    margin-right: 18px;
    color: #000;
    transition: transform 0.2s;
}


.tblAccountGrid {
    border: 1px solid #8D91AA;
    color: #2b2c20;
    background-color: #e1e1e3;
    font: 12px/16px "segoe ui",arial,sans-serif;
    display: table;
    width: 100%;
}

    .tblAccountGrid tbody tr:first-child {
        border: 0;
        border-bottom: 1px solid #3c6716;
        background-color: #8dc63f;
        color: #2b2c20;
    }

        .tblAccountGrid tbody tr:first-child th {
            padding-top: 5px !important;
            padding-bottom: 4px !important;
            padding-left: 7px !important;
            padding-right: 7px !important;
            text-align: left;
            font-weight: normal;
        }

/*****************************************************************************************/
/* RegisterNewCustomer.aspx */
/*****************************************************************************************/
.color-black {
    color: #000000;
}

.btnSearchCard, .btn_CDCancel, .btn_CDSave, .btnUpdateCustomer, .rbReset {
    text-align: right;
    white-space: nowrap;
    vertical-align: middle;
    color: #FFFFFF;
    background-color: #1B1B6F;
    border-width: 1px;
    border-style: solid;
    border-color: #8D91AA;
}

    .btnSearchCard:hover, .btn_CDCancel:hover, .btn_CDSave:hover, .btnUpdateCustomer:hover, .rbReset:hover {
        background-color: #1B1B6F;
    }

.btncancelstyle {
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    color: #FFFFFF;
    background-color: #1B1B6F;
    border-width: 1px;
    border-style: solid;
    border-color: #8D91AA;
    width: 120px;
    height: 22px;
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
    font-size: 12px;
    background-image: url("/Common/Images/MenuIcons/cancel.png");
    background-repeat: no-repeat;
    background-position-x: 4px;
    background-position-y: center;
}

.btnsavestyle {
    text-align: right;
    white-space: nowrap;
    vertical-align: middle;
    color: #FFFFFF;
    background-color: #1B1B6F;
    border-width: 1px;
    border-style: solid;
    border-color: #8D91AA;
    width: 120px;
    height: 22px;
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
    font-size: 12px;
    background-image: url("/Common/Images/MenuIcons/savetick2.png");
    background-repeat: no-repeat;
    background-position-x: 4px;
    background-position-y: center;
}

.btnokstyle {
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    color: #FFFFFF;
    background-color: #1B1B6F;
    border-width: 1px;
    border-style: solid;
    border-color: #8D91AA;
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
    font-size: 12px;
    background-image: url("/Common/Images/MenuIcons/savetick2.png");
    background-repeat: no-repeat;
    background-position-x: 64px;
    background-position-y: -4px;
}


.ddlState {
    font: 12px "segoe ui", arial, sans-serif !important;
}

    .ddlState > option {
        color: #000000 !important;
    }

.pnlMiscDetails {
    display: none;
}



/*****************************************************************************************/
/*****************************************************************************************/
/* PAGE LEVEL CSS */
/*****************************************************************************************/
.btn-custom {
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    color: #FFFFFF;
    background-color: #1B1B6F;
    border-width: 1px;
    border-style: solid;
    border-color: #8D91AA;
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
    font-size: 12px;
}

    .btn-custom:hover {
        background-color: #1B1B6F;
    }


.errorMsg {
    color: red !important;
    font-style: italic;
}
/*****************************************************************************************/
/* Angular Grid CSS */
/*****************************************************************************************/
.ui-grid-header-cell-primary-focus, .ui-grid-pager-panel {
    background-color: #1B1B6F;
    color: #FFFFFF;
}
/*****************************************************************************************/
/*****************************************************************************************/
/* Old CSS */
/*****************************************************************************************/
.supportText {
    font: normal bold 12px/21px "Segoe UI", Arial, sans-serif;
    text-decoration: none;
    color: #e1e1e3;
}

.roundedPanel {
    background-color: #ffffff;
    font-weight: bold;
}

.formHeaderText {
    font: bold 12pt arial;
}

.formError {
    font: bold 12pt arial;
    color: Maroon;
}

.normError {
    font: bold 10pt arial,helvetica,tahoma;
    color: Maroon;
}

.dataTableHead {
    font: bold 12pt arial,helvetica,tahoma;
    color: #BBBBBB;
    letter-spacing: 5px;
}

.tableHead {
    font: bold 10pt arial,helvetica,tahoma;
    color: #000000;
    border-bottom: 1px solid black;
}

.tableData {
    font: 8pt arial,helvetica,tahoma;
}

.tableDataAlt {
    font: 8pt arial,helvetica,tahoma;
    background-color: #CCCCCC;
}

.inputText {
    font: bold 10pt arial,helvetica,tahoma !important;
    color: #807f83 !important;
}

.inputData {
    font: 10pt arial,helvetica,tahoma !important;
}

.inputTextwobold {
    font: 10pt arial,helvetica,tahoma !important;
    color: #807f83 !important;
}

.smallText {
    font: 8pt arial,helvetica,tahoma !important;
}

.largeText {
    font: bold 12pt arial,helvetica,tahoma !important;
}

.smallBold {
    font: bold 8pt arial,helvetica,tahoma;
}

.inputTextsmall {
    font: bold 9pt arial,helvetica,tahoma;
    color: #807f83;
}

.radioList {
    font: bold 8pt arial,helvetica,tahoma;
}

    .radioList input {
        padding-bottom: 5px;
    }

.smallLink {
    font: 8pt arial,helvetica,tahoma;
    text-decoration: underline;
    color: #5A5E72;
}

    .smallLink:hover {
        font: 8pt arial,helvetica,tahoma;
        text-decoration: underline;
        color: #1B1B6F;
    }

.normalLink {
    font: 10pt arial,helvetica,tahoma;
    text-decoration: none !important;
    color: #5A5E72 !important;
}

    .normalLink:hover {
        font: 10pt arial,helvetica,tahoma;
        text-decoration: none !important;
        color: #1B1B6F !important;
    }

.largeLink {
    font: bold 12pt arial,helvetica,tahoma;
    text-decoration: underline;
    color: #5A5E72;
}

    .largeLink:hover {
        font: bold 12pt arial,helvetica,tahoma;
        text-decoration: underline;
        color: #1B1B6F;
    }

.cardnumberHeader {
    font:  14pt arial,helvetica,tahoma;
    color: #17171C;
}

#receipt {
    font: 10pt system;
    margin-top: 15px;
}

    #receipt .loc {
        padding-bottom: 3px;
    }

    #receipt .box {
        font: bold 10pt system;
        border: 1px solid black;
        padding: 4px;
        margin-top: 5px;
        margin-bottom: 5px;
        text-align: left;
    }

    #receipt .item {
        padding-bottom: 3px;
        font-weight: bold;
        color: #888888;
        width: 120px;
    }

    #receipt .itemData {
        padding-bottom: 3px;
    }

    #receipt .line {
        border-top: 1px solid black;
        padding-top: 8px;
        font: bold 10pt arial,helvetica,tahoma;
        margin-top: 8px;
    }


.resultBox {
    padding: 10px;
    margin-bottom: 8px;
    background-color: #cccccc;
    font: 10pt arial,helvetica,tahoma;
    color: #000000;
}


.supportBoxTop {
    background-color: #8dc63f;
    width: 300px;
    height: 60px;
    text-align: center;
    font: bold 12pt arial,helvetica,tahoma;
}

.supportBoxBot {
    background-color: #aeadb1;
    width: 300px;
    height: 40px;
    text-align: center;
    text-align: center;
    font: bold 12pt arial,helvetica,tahoma;
    vertical-align: middle;
}

.fieldsetHeader {
    font: bold 12pt arial,helvetica,tahoma;
    color: #003300;
    border: 2px;
}

.debugText {
    font: 8pt arial,helvetica,tahoma;
    color: Maroon;
    border-color: Red;
    line-height: 12px;
    background-color: cornsilk;
}

.loggedInUser {
    font: bold 8pt arial,helvetica,tahoma;
    text-decoration: none;
    /*font-style: italic;*/
    /*color: #ababab;*/
    color: black;
    padding-right: 10px;
}

.tblParams {
    table-layout: fixed;
    width: 400px;
}


.editCustomerHead {
    font: bold 10pt arial;
    color: #777777;
    text-decoration: underline;
}

.tableBorder {
    border: 1px solid black;
}

.vtHeader {
    font: bold 14pt arial,helvetica,tahoma !important;
    color: #17171C !important;
}

.discountLockHeader {
    font: bold 15pt arial,helvetica,tahoma !important;
    color: green !important;
    text-align: center;
}

.vtSubHeader {
    font: bold 12pt arial,helvetica,tahoma !important;
}


.transactionResponse {
    font: bold 10pt/20px Tahoma;
}

.debugBox {
    background-color: #fff8dc;
    border: 1px dashed #880000;
    padding: 5px;
    margin-top: 50px;
    margin-left: 5px;
    text-align: left;
}

.textBoxDisabled {
    background-color: #FFFFFF;
    color: #000000;
    font: 10pt arial,helvetica,tahoma;
}

.textBoxWatermark {
    font: 8pt arial,helvetica,tahoma;
    font-style: italic;
    height: 20px;
    width: 150px;
    padding: 2px 0 0 2px;
    border: 1px solid #BEBEBE;
    background-color: #F0F8FF;
    color: gray;
}

.validatorCalloutHighlight {
    background-color: #fffacd;
}

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

.modalPopup {
    background-color: #4f6f19;
    border-width: 3px;
    border-style: solid;
    border-color: Gray;
    padding: 3px;
    width: 450px;
}


/* CSP Changes */

.Welcomereport {
    width: 100px;
}

.width100 {
    width: 100%;
}

.width200 {
    width: 200px;
}

.width600 {
    width: 600px;
}



.width90 {
    width: 80%;
}

.height50 {
    height: 50px;
}


.tableCSP {
    border: 0;
    width: 100%;
    border-spacing: 0;
}

.tdpadding5 {
    padding: 5px;
}


.tdpaddingtop5 {
    padding-top: 5px;
}

.tdwidthpadinfleft5 {
    width: 20%;
    padding-left: 5px;
}

.tdpaddingtop15 {
    padding-top: 15px;
}

.tdpaddingtop20 {
    padding-top: 20px;
}

.tdpaddingright5 {
    padding-right: 5px;
}

.tdpaddingleft0 {
    padding-left: 0px;
}

.tdpaddingleft5 {
    padding-left: 5px;
}

.tdpaddingleft300 {
    padding-left: 300px;
}

.tdpaddinglefttop20 {
    padding-left: 20px;
    padding-top: 10px;
}

.tdpaddinglefttop {
    padding-left: 20px;
    padding-top: 15px;
}

.tdpaddingleft8 {
    padding-left: 8px;
}

.trpadding25 {
    height: 25px;
    padding-left: 20px;
}

.tdpadding20 {
    width: 100%;
    padding-left: 20px;
}


.tdwidth30 {
    width: 30%;
    text-align: "left";
}

.tdwidth20 {
    width: 20%;
    text-align: "left";
}

.tdwidth10 {
    width: 10%;
    text-align: "left";
}



.tdcsppadding15 {
    padding-left: 15px;
    padding: 4px;
    text-align: left;
}

.div5CSP {
    padding-left: 5px;
    margin-left: 5px;
}

.tdmarginbottom15 {
    padding-left: 20px;
    margin-bottom: 15px;
}

.tdMarginbottom10 {
    padding: 10px;
    margin-bottom: 10px;
}

.div90CSP {
    width: 90% !important;
}


.tdwidth120 {
    width: 120px;
}

.tdwidth220 {
    width: 220px;
}

.tdwidthtop200 {
    width: 200px;
    vertical-align: top;
}

.tdwidth240 {
    width: 240px;
}

.chart300 {
    Height: 300px;
}

.tr20CSP {
    height: 20px;
}


.trhegiht30 {
    height: 30px;
}

.tr10CSP {
    height: 10px;
}

.td100CSP {
    width: 100%;
    padding-left: 20px;
    text-align: left;
}


.vtHeaderCSP {
    font: bold 14pt arial,helvetica,tahoma;
    color: #807f83;
    width: 20%;
    padding-left: 5px;
}

.inputTextCSP {
    font: bold 10pt arial,helvetica,tahoma;
    color: #807f83;
    width: 20%;
    padding-left: 5px;
}

.tdclearleft {
    padding-top: 20px;
    clear: left;
    vertical-align: middle;
    height: 24px;
}


.divwidth600 {
    width: 600px;
    padding-left: 20px;
    padding-top: 20px;
}


.divwidthpaddingtop15 {
    width: 100%;
    padding-top: 15px;
}



.tdpaddingwidth600 {
    padding-top: 20px;
    width: 600px;
    text-align: center;
}

.tdpaddinglefttopbottomleft5 {
    padding-left: 5px;
    padding-top: 5px;
    padding-bottom: 5px;
    margin-left: 5px;
    margin-top: 5px;
}



.inputDatapaddingtopleftmarginleft5 {
    font: 10pt arial,helvetica,tahoma;
    padding-top: 5px;
    padding-left: 5px;
    margin-left: 5px;
}

.smallTextCSP {
    font: 8pt arial,helvetica,tahoma;
    padding: 10px;
    margin-bottom: 10px;
}

.smallTextpaddingtop5 {
    font: 8pt arial,helvetica,tahoma;
    padding-top: 5px;
}


/*Grid Styles*/

.HeaderStyleWidth75 {
    width: 75px;
}

.HeaderStyleWidth100 {
    width: 100px;
}


.HeaderStyleWidth20 {
    width: 20px;
}

.HeaderStyleWidth140 {
    width: 140px;
}

.HeaderStyleWidth80 {
    width: 80px;
}

.errorLbl {
    font-style: normal;
    color: red;
}

.txtbackgroundcolor {
    border-color: #8D91AA;
    background-color: #FFFFFF;
    border-width: thin;
    border-style: solid;
    padding: 2px 2px 1px;
}

.btnRunReport {
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    color: #FFFFFF;
    background-color: #1B1B6F;
    border-width: 1px;
    border-style: solid;
    border-color: #8D91AA;
    border-radius: 5px !important;
    background-position-x: 1px !important;
}

.btnRefresh {
    text-align: right;
    white-space: nowrap;
    vertical-align: middle;
    color: #FFFFFF;
    background-color: #1B1B6F;
    border-width: 1px;
    border-style: solid;
    border-color: #8D91AA;
}

.tdpaddingclearleft {
    padding-top: 20px;
    clear: left;
    vertical-align: middle;
    height: 24px;
}
/**dropdown hover**/
/*#ddlLocationID:hover,#ddlTerminalID:hover, #ddlCardProgram:hover,#ddlReportCategory:hover,#lstReports:hover,#ddlViewReports:hover,#ddlFormat:hover {
    background-color: #FF8000;
}*/



/****Virtual Terminal Page***/

/* Virtual Terminal User */

.btnVtterminal {
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    color: #e7f1d7;
    background-color: #c64600;
    border-width: 1px;
    border-style: solid;
    border-color: #8b2913;
}

.headerBar {
    background-color: #8D91AA !important;
    color: #fff;
    width: 640px;
    height: 28px;
    padding: 4px;
    vertical-align: middle;
}

.signOutLink {
    font-size: smaller;
    color: #5A5E72;
    text-decoration: underline;
}

    .signOutLink:hover {
        color: #5A5E72;
    }


.headerText {
    font: bold 14pt arial,tahoma;
    padding-left: 10px;
    letter-spacing: 1px;
}

.rightBorder {
    border-right: 1px dotted #aaaaaa;
}

.bottomBorder {
    border-bottom: 1px dotted #aaaaaa;
}

.tranGroupText {
    text-align: left;
    font-size: smaller;
    letter-spacing: 1px;
    color: #17171C !important;
}

.selectedTransactionText {
    font-weight: bold !important;
    font-size: x-large !important;
    letter-spacing: 1px !important;
    color: #17171C !important;
}

.fieldHeader {
    font-size: x-small;
    color: #17171C;
    padding-bottom: 3px;
}

.moreInfoLink {
    font-size: x-small;
    color: #F09B42;
    font-style: italic;
}

    .moreInfoLink:hover {
        color: darkred;
    }

.errorText {
    color: red !important;
}


.vtcustLinkButton {
    background-color: transparent;
    border: none;
    cursor: pointer;
    text-decoration: underline !important;
    padding: 0px;
    color: #1B1B6F !important;
    font: bold 10pt arial,helvetica,tahoma;
}

.vterminalcustLinkButton {
    background-color: transparent;
    border: none;
    cursor: pointer;
    text-decoration: underline;
    padding: 0px;
    font-size: x-small;
    color: #F09B42;
    font-style: italic;
}

.vtcustLinkButton2 {
    background-color: transparent;
    border: none;
    cursor: pointer;
    text-decoration: underline;
    padding: 0px;
    color: #1B1B6F !important;
    font: bold 10pt arial,helvetica,tahoma;
}

.vtcustLinkButton3 {
    background-color: transparent;
    border: none;
    cursor: pointer;
    text-decoration: underline;
    padding: 0px;
    color: blue;
    font-size: medium;
    font-style: normal;
    font-family: Times New Roman;
}

.VTbtncolor {
    background-color: #1B1B6F !important;
    color: white;
    height: 25px;
    border-color: #8D91AA !important;
    border-style: solid;
}

.btnwidth165 {
    width: 165px;
}

.txtwidth240 {
    width: 240px;
}


.txtwidth300 {
    width: 300px;
}

.txtstatewidth40 {
    Width: 40px;
}

.txtwidth55 {
    Width: 55px;
}

.txtzipwidth60 {
    Width: 60px;
}

.btnwidth80 {
    width: 80px;
}

.txtwidth120 {
    Width: 120px;
}

.txtwidth140 {
    Width: 140px;
}

.txtwidth160 {
    Width: 160px;
}


.txtwidth200 {
    Width: 200px;
}


.txtwidth280 {
    Width: 280px;
}

.tdpaddinglefttop20 {
    padding-left: 20px;
    padding-top: 10px;
    width: 660px;
}

.divheadbarmargintop10 {
    background-color: #8D91AA !important;
    color: #fff;
    width: 640px;
    height: 28px;
    padding: 4px;
    vertical-align: middle;
    margin-top: 10px;
}


.tdpaddingbottom20 {
    padding-bottom: 20px;
}

.tdverticalaligncenter {
    padding-top: 10px;
    clear: left;
    vertical-align: middle;
    padding-bottom: 10px;
}

.tdwidthbordertop1 {
    width: 640px;
    border-top: 1px dotted #aaaaaa;
    text-align: right;
    margin-top: 8px;
    padding-top: 8px;
}

.tdsolidborder1 {
    border: 1px solid #000000;
    width: 580px;
}

.tdsolidborder580 {
    border: 1px solid #000000;
    width: 580px;
}

.errorLbl {
    font-style: normal;
    color: red;
}

input.watermark {
    color: #999;
    font-style: italic;
}

.tdwidth157 {
    width: 157px;
}

.tdheight42 {
    height: 42px;
}


.tdheight29 {
    height: 29px;
}

.tdwidthheight90 {
    width: 100%;
    height: 90px;
}

/*******************************************/
/*Card Maintenance.aspx */
/********************************************/
#btn_ChangeType {
    width: 132px;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    color: #FFFFFF;
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
    font-size: 12px;
    background-color: #1B1B6F;
    border-width: 1px;
    border-style: solid;
    border-color: #8D91AA;
}

#btn_Continue, #btn_Cancel, #btn_CnfrmContinue, #btn_CnfrmCancel, #btn_finalOK, #btn_clear {
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    color: #FFFFFF;
    background-color: #1B1B6F;
    border-width: 1px;
    border-style: solid;
    border-color: #8D91AA;
}


/********************************************/
.btnTransparent {
    background-color: transparent;
    border: none;
    margin: 0;
    overflow: visible;
    text-transform: none;
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
    font-size: 12px;
    /*cursor: pointer;
    text-decoration: underline;
    padding: 0px;
    color: blue;
    font-size: small;
    color: blue;
    font-style: normal;*/
}

.btn-LidSearch {
    height: 22px;
    width: 75px;
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: 400;
    line-height: 17px;
    background: url('/Skin/Valutec/TelerikSkin/FormDecorator/ButtonSprites.png');
    color: #ffffff;
    border: 0px;
    margin: auto;
    border-radius: 5px;
    background-color: transparent;
    background-repeat: no-repeat;
    background-position-x: left;
    background-position-y: -22px;
    padding-left: 4px !important;
    text-align: center;
    vertical-align: middle;
}

/*Grid Footer border fix for IE*/
.ui-grid-pager-panel {
    border-top-style: solid;
    border-top-color: #d4d4d4 !Important;
}

.lbHome {
    background: url(../../Valutec/Images/Home_new.png);
    background-size: contain;
    height: 46px;
    width: 46px;
    border: none;
}

.centeralignment {
    /*text-align:center !important;*/
    vertical-align: central;
}

.imgWarningIcon {
    width: 5%;
}
/* SearchUser.aspx */
.pl-210 {
    padding-left: 210px !important;
}

/* Keep radio inputs and their labels inline and on one row */
.radio-group {
    display: flex;
    gap: 12px; /* space between radio items */
    align-items: center;
    flex-wrap: nowrap; /* prevent wrapping to next line */
}

/* Each radio + label stays together */
.radio-item {
    display: inline-flex;
    align-items: center;
    white-space: nowrap; /* prevents label wrapping */
}

/* small responsive fallback: allow wrap on very narrow screens */
@media (max-width: 420px) {
    .radio-group {
        flex-wrap: wrap;
        gap: 8px;
    }
}
/* Utility to remove vertical gap between two adjacent rows */
.no-gap {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

    /* Ensure bootstrap column padding doesn't reintroduce vertical space */
    .no-gap > [class*="col-"] {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }

.mh-150 {
    min-height: 150px !important;
}

input[type="text"].ui-grid-filter-input {
    background-color: #8D91AA;
    color: #FFFFFF !important;
}

.angular-ui-grid .ui-grid {
    border-color: #8D91AA;
}

.ui-grid-cell input {
    color: #FFFFFF !important;
}

/* Add bottom spacing between top-level menu items */
#pnlMenuBar #menu > li:not(:last-child) {
    margin-bottom: 12px; /* adjust spacing */
}

/* Add bottom spacing after any nested <ul> (submenu) blocks */
#pnlMenuBar #menu ul {
    margin-bottom: 12px;
}

/* Ensure anchor fills the item so the gap is visible */
#pnlMenuBar #menu > li > a {
    display: block;
}

/* Optional: if Bootstrap overrides these, enable the important fallback */
#pnlMenuBar #menu > li:not(:last-child),
#pnlMenuBar #menu ul {
    /* margin-bottom: 12px !important; */
}

/* Shrink menu icons without changing menu height */
#pnlMenuBar #menu > li > a {
    display: block;
    height: 30px !important; /* preserve menu row height */
    line-height: 30px !important; /* vertically center text */
    background-repeat: no-repeat !important;
    background-position: 8px center !important; /* horizontal offset + vertical center */
    background-size: 16px 16px !important; /* smaller icon */
    padding-left: 36px !important; /* leave space for the icon */
    width: 187px !important;
}

    /* Keep hover state consistent (no height change) */
    #pnlMenuBar #menu > li > a:hover,
    #pnlMenuBar #menu > li > a:focus {
        height: 30px !important;
        line-height: 30px !important;
        background-size: 16px 16px !important;
        width: 187px !important;
    }

/* Align the menuText block with the new padding */
#pnlMenuBar .menuText {
    padding-left: 1px !important;
    padding-top: 4px !important;
}
/* Target only the Digital Gift Card Manager menu text: subtle taller hover */
#digitalGiftCardManager {
    height: 30px !important; /* keep overall menu row height fixed */
    line-height: 30px !important; /* vertical centering */
    overflow: visible; /* allow visual scaling without affecting layout */
    white-space: nowrap;
}

    #digitalGiftCardManager .menuText {
        display: inline-block; /* required for transform to work cleanly */
        transition: transform 0.12s ease, color 0.12s ease;
        transform-origin: center;
    }

    /* Slight vertical grow on hover/focus — does not change layout height */
    #digitalGiftCardManager:hover .menuText,
    #digitalGiftCardManager:focus .menuText {
        transform: scaleY(1.12); /* increase to taste (1.05 - 1.20) */
        color: #1B1B6F; /* optional: change color on hover to match design */
    }

.bgcolor-grey {
    background-color: #F3F3F3 !important;
    background-image: none !important;
    border: none !important;
}
/* Stronger rule for the daily status panel when bgcolor-grey isn't applying */
.pnl-dailystatus.bgcolor-grey,
.card.pnl-dailystatus.bgcolor-grey {
    background-color: #FFFFFF !important; /* adjust color to your design */
    /*color: #1B1B1B !important;
    border: 1px solid rgba(0,0,0,0.06) !important;*/
}

/* fallback: target the specific server control if needed (use only if you confirm ClientID)
   Replace ctl00_Main_... with the actual client id shown in browser devtools */
#Panel_DailyStatus, /* safe: if ASP.NET renders id unchanged */
#ctl00_Main_Panel_DailyStatus {
    background-color: #FFFFFF !important;
}

.Panel3,
.card.Panel3.bgcolor-grey {
    background-color: #FFFFFF !important;
}

.Panel1,
.card.Panel1.bgcolor-grey {
    background-color: #FFFFFF !important;
}

#Panel3, /* safe: if ASP.NET renders id unchanged */
#ctl00_Main_Panel3 {
    background-color: #FFFFFF !important;
}

#Panel1, /* safe: if ASP.NET renders id unchanged */
#ctl00_Main_Panel1 {
    background-color: #FFFFFF !important;
}

#tdSold,
#ctl00_Main_tdSold {
    background-color: #FFFFFF !important;
}

#tdRedeem,
#ctl00_Main_tdRedeem {
    background-color: #FFFFFF !important;
}

.Tblwidth {
    width: 98% !important;
}

.td-width {
    width: 15% !important;
}

.td-width-extend {
    width: 36% !important;
}

.pagemenu-right {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 12px;
    height: 40px; /* match h-40 */
    padding-right: 12px;
}

/* Ensure the right block hugs the right edge of the cell */
.userInfoRow {
    display: flex;
    align-items: center;
    width: 100%;
    box-sizing: border-box; /* ensures padding doesn't shrink available width */
}

/* left block stays compact */
.userInfoLeft {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* push this block to the far right and keep items on one line */
.userInfoRight {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: auto; /* the key: pushes this group to the right */
    white-space: nowrap;
}

.lblColor {
    color: #1B1B6F !important;
}

.gdvNewsnew > tbody > tr > th, .gdvNewsnew > tbody > tr > th, .gdvNewsnew > tbody > tr > th, .gdvNewsnew > tbody > tr > td, .gdvNewsnew > tbody > tr > td, .gdvNewsnew > tbody > tr > td {
    padding-top: 4px;
    padding-bottom: 3px;
    padding-left: 7px;
    padding-right: 7px;
    border-color: #8D91AA;
}

.gdvNewsnew {
    font: 12px/16px "segoe ui",arial,sans-serif !important;
    border: 1px solid #8D91AA !important;
    background: #1B1B6F !important;
    color: #2b2c20 !important;
    background-color: #e1e1e3 !important;
}

    .gdvNewsnew > tbody > tr:nth-child(even) {
        background: #aeadb1;
        border-color: #8D91AA;
    }

    .gdvNewsnew > tbody > tr:nth-child(odd) {
        background: #e1e1e3;
        border-color: #8D91AA;
    }

/*.lbSignoutv2 {
    background: url('/Skin/Valutec/Images/Signout_Icon_New.png') !important;
    background-size: contain;
    height: 25px;
    width: 24px;
    border: none;
}*/
/* Add near other utility/button styles */
.signout-btn {
    width: 20px !important; /* desired width */
    height: 20px !important; /* desired height */
    padding: 0;
    border: none;
    background: transparent;
    vertical-align: middle;
}

.myHome-btn {
    width: 17px !important;
    height: 17px !important;
}
/* ensure .menuText shows the desired hover color */
#pnlMenuBar #menu > li > a:hover .menuText,
#pnlMenuBar #menu > li > a:focus .menuText,
#pnlMenuBar #menu > li > a:hover,
#pnlMenuBar #menu > li > a:focus,
.menuText:hover {
    color: #1B1B6F !important;
}
/* Focus styles for the state DropDownList (class "ddlState") */
/*.ddlState:focus,
.ddlState:focus-visible {
    outline: none;*/ /* remove default outline */
/*border-color: #1B1B6F !important;*/ /* change border color on focus */
/*box-shadow: 0 0 0 3px rgba(27,27,111,0.12) !important;*/ /* subtle glow */
/*color: #1B1B6F !important;*/ /* selected text color when focused */
/*background-color: #ffffff !important;*/ /* keep a readable background */
/*}*/

/* Optional: style option hover/focus (Firefox supports this; other browsers vary) */
/*.ddlState option:hover,
.ddlState option:focus {
    background-color: #1B1B6F;
    color: #ffffff;
}*/

.td-pl-20 {
    padding-left: 20px !important;
    padding-left: 20px !important;
}

.ReportDrpstyleNew {
    border-color: #8D91AA !important;
    background-color: #FFFFFF !important;
    border-width: thin;
    border-style: solid;
    padding: 2px 2px 1px !important;
    border-top-left-radius: 5px !important;
    border-top-right-radius: 5px !important;
    border-bottom-left-radius: 5px !important;
    border-bottom-right-radius: 5px !important;
    font: 12px "segoe ui", arial, sans-serif !important;
    color: #2b2c20 !important;
    font-weight: bold !important;
}
/* specific header style for gdvBillingCurrent,gdvBillingPrev,gdvCardManagement */
.gdv-header,
.gdv-header th,
.tblAccountGrid .gdv-header {
    background-color: #1B1B6F !important;
    color: #ffffff !important;
    border-color: #8D91AA !important;
}

/* ensure GridView-rendered <th> inherits text color */
.tblAccountGrid th {
    color: #ffffff !important;
}
/* Add near other ui-grid styles */
/*.angular-ui-grid .ui-grid-pager-row-count-label {
    line-height: 3;  avoid extra vertical gap from line-height 
}*/

/* If you only want to affect the OrderHistory grid, target its container */
#dvAccessUsers, #dvOrderHistory .ui-grid-pager-row-count-label {
    line-height: 3;
}

.h-125 {
    height: 125px !important;
}

.ReportRangeNew {
    width: 90% !important;
    background: #FFFFFF;
    border-radius: 7px;
}

.btn-newstyle {
    background: #1B1B6F !important;
    border-color: #8D91AA !important;
    color: #FFFFFF !important;
}

.fieldBorder {
    background: #FFFFFF;
    border-radius: 5px;
}

.tablink-newstyle {
    background-color: #1B1B6F;
    color: white;
    /*float: left;*/
    border: none;
    outline: none;
    cursor: pointer;
    padding: 5px 16px;
    font-size: 12px;
    width: 18%;
}

    .tablink-newstyle:hover {
        background-color: #8D91AA;
    }

.tabcontent-newstyle {
    overflow: hidden;
    border: 1px solid #ccc;
    background-color: #FFFFFF;
    display: none;
    padding: 20px 20px;
    height: 100%;
}
/* Styles for the offerType select */
.offer-type {
    border: 1px solid #1B1B6F; /* border color */
    color: #1B1B6F; /* selected text color shown in closed select */
    background-color: #ffffff;
    padding: 6px 10px;
    border-radius: 3px;
    -webkit-appearance: menulist; /* preserve native dropdown look */
    appearance: menulist;
}

    .offer-type:focus {
        outline: none;
        box-shadow: 0 0 0 0.2rem rgba(27,27,111,0.14);
        border-color: #1B1B6F;
    }

    /* Option popup styling (limited cross‑browser support) */
    .offer-type option {
        color: #1B1B6F;
        background: #ffffff;
    }

        /* Some browsers accept this; many (Chrome) don't fully support option:selected styling */
        .offer-type option:checked,
        .offer-type option[selected] {
            background: #1B1B6F;
            color: #ffffff;
        }

.h-230 {
    height: 230px !important;
}
.emailColor {
    color: #5A5E72 !important;
}