﻿.NoteBookView {
    width: 100%;
    margin: 0 auto;
    clear: both;
    border-collapse: collapse;
    border-spacing: 0;
    display: inline-block;
}

.NoteBookFooter {
    padding: 10px 102px 10px;
    background-color: #f9f9f9;
    text-align: center;
}

.searchHeader {
    padding: 7px 45px;
    position: relative;
    background-color: #f9f9f9;
    display: block;
    width: 100%;
}

.NoteBookView td {
    padding: 0;
    border: 0;
}

.NoteBookUCPopup table {
    table-layout: fixed;
}

.NoteBookUCPopup input {
    background: #fff url("images/SearchManger.png") no-repeat;
    border: 1px solid #e0dfdf;
    cursor: default;
}

.NoteBookUCPopup {
    padding: 0;
    margin-top: 30px !important;
    background-color: #f1f1ed;
    position: absolute;
    z-index: 101;
    box-shadow: 0 2px 8px rgba(0,0,0,.5);
    font-size: 12px;
}

    .NoteBookUCPopup.OneBookUCTowColumn {
        min-width: 225px;
        color: #3b3b3b;
        width: 260px;
    }

    .NoteBookUCPopup .dataTables_info {
        text-align: center;
        float: none !important;
        margin: 0;
        padding-bottom: 8px;
        background-color: #ebebeb;
        border-top: 1px solid #e0e0d2;
    }

    .NoteBookUCPopup .dataTables_wrapper .dataTables_paginate .paginate_button {
        position: absolute;
        cursor: pointer;
        top: -31px;
        padding: 0;
        width: 34px;
        height: 34px;
        margin: 0;
        border: 0;
    }

        .NoteBookUCPopup .dataTables_wrapper .dataTables_paginate .paginate_button.next, .NoteBookUCPopup .dataTables_wrapper .dataTables_paginate .paginate_button.previous {
            background-color: #f7f7f7 !important;
        }

        .NoteBookUCPopup .dataTables_wrapper .dataTables_paginate .paginate_button.disabled, .NoteBookUCPopup .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover {
            cursor: default;
        }

        .NoteBookUCPopup .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
            border: 0 !important;
        }

    .NoteBookUCPopup .NoteBookView tr.EmptyRow {
        background: 0;
    }

    .NoteBookUCPopup .NoteBookView .EmptyRow td {
        padding-top: 20px;
        font-weight: 500;
    }

    .NoteBookUCPopup .dataTables_wrapper .dataTables_paginate {
        float: none;
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
    }

    .NoteBookUCPopup table, .NoteBookUCPopup table.NoteBookView > tbody > tr > td:last-child, .NoteBookUCPopup table.NoteBookView > tbody > tr > td, .NoteBookUCPopup table.dataTable > tbody > tr > td, .NoteBookUCPopup table.responsiveGrid > tbody > tr > td {
        border: 0 !important;
    }

        .NoteBookUCPopup table.dataTable thead .sorting, .NoteBookUCPopup table.dataTable thead .sorting_asc, .NoteBookUCPopup table.dataTable thead .sorting_desc, .NoteBookUCPopup .NoteBookView tr {
            cursor: pointer;
        }

    .NoteBookUCPopup.NoteBookUCTowColumn table.dataTable thead .sorting_asc, .NoteBookUCPopup.NoteBookUCTowColumn table.dataTable thead .sorting, .NoteBookUCPopup.NoteBookUCTowColumn table.dataTable thead .sorting_desc {
        width: 185px;
    }

    .NoteBookUCPopup.OneBookUCTowColumn table.dataTable thead .sorting_asc, .NoteBookUCPopup.OneBookUCTowColumn table.dataTable thead .sorting, .NoteBookUCPopup.OneBookUCTowColumn table.dataTable thead .sorting_desc {
        width: 215px;
    }

    .NoteBookUCPopup .filterSort {
        position: absolute;
        top: 0;
        width: 34px;
        height: 34px;
        margin: 10px;
        border: 1px solid #e0e0d2;
        background-color: #fff;
        box-sizing: border-box;
        z-index: 1;
    }

        .NoteBookUCPopup .filterSort img {
            padding: 9.5px;
            cursor: pointer;
        }

    .NoteBookUCPopup table.dataTable {
        min-height: 62px;
    }

        .NoteBookUCPopup table.dataTable > thead {
            display: none;
            position: absolute;
            width: 126px;
            border: 1px solid #e2e2e2;
            border-bottom: 0;
            top: 46px;
            background-color: #fff;
            box-sizing: border-box;
        }

            .NoteBookUCPopup table.dataTable > thead > tr {
                width: 100%;
                display: block;
            }

                .NoteBookUCPopup table.dataTable > thead > tr > th {
                    display: block;
                    width: 126px !important;
                    box-sizing: border-box;
                    color: #888;
                    font-size: 12px;
                    padding: 5px 10px !important;
                    background-repeat: no-repeat;
                    background-size: 14px;
                    border: none !important;
                    border-bottom: 1px solid #e2e2e2 !important;
                }

                    .NoteBookUCPopup table.dataTable > thead > tr > th.sorting {
                        background-image: url(Images/NoteBook/sorting.svg) !important;
                    }

                    .NoteBookUCPopup table.dataTable > thead > tr > th.sorting_asc {
                        background-image: url(Images/NoteBook/sort-up.svg) !important;
                    }

                    .NoteBookUCPopup table.dataTable > thead > tr > th.sorting_desc {
                        background-image: url(Images/NoteBook/sort-down.svg) !important;
                    }

        .NoteBookUCPopup table.dataTable > tbody {
            border-top: 1px solid transparent;
        }

            .NoteBookUCPopup table.dataTable > tbody > tr {
                border-bottom: 1px solid #e0e0d2;
                background-color: #f1f1ed;
            }

                .NoteBookUCPopup table.dataTable > tbody > tr:last-child {
                    border-bottom: 0;
                }

                .NoteBookUCPopup table.dataTable > tbody > tr > td {
                    word-break: break-all;
                    word-wrap: break-word;
                    white-space: normal;
                    min-width: 200px;
                }

                    .NoteBookUCPopup table.dataTable > thead > tr > th.FavoriteCol, .NoteBookUCPopup table.dataTable > tbody > tr > td.FavoriteCol {
                        min-width: 0px;
                        width: 0;
                    }

                    .NoteBookUCPopup table.dataTable > tbody > tr > td > a {
                        display: block;
                        margin: 0 !important;
                        word-break: normal;
                        text-align: justify;
                        letter-spacing: -.3px;
                        padding: 5px 10px;
                        color: #414141;
                        font-size: 13px;
                        max-height: 50px;
                        overflow: hidden;
                        box-sizing: border-box;
                        line-height: 21px;
                    }

                .NoteBookUCPopup table.dataTable > tbody > tr .dataTables_empty {
                    padding: 5px 10px !important;
                    box-sizing: border-box;
                }

                .NoteBookUCPopup table.dataTable > tbody > tr.GridViewEmptyDataRow > td {
                    padding: 5px 10px !important;
                    box-sizing: border-box;
                }

    .NoteBookUCPopup.NoteBookUCTowColumn {
        width: 400px;
    }

        .NoteBookUCPopup.NoteBookUCTowColumn table.dataTable > tbody > tr > td > a {
            width: 200px;
        }

    .NoteBookUCPopup.OneBookUCTowColumn table.dataTable > tbody > tr > td > a {
        width: 260px;
    }

    .NoteBookUCPopup table.dataTable > tbody > tr > td:nth-child(2) a {
        color: #888;
        font-size: 12px;
    }

    .NoteBookUCPopup .dataTables_wrapper .dataTables_filter {
        float: none;
        margin: 0 !important;
        padding: 10px;
        background-color: #f1f1ed;
        position: relative;
    }

        .NoteBookUCPopup .dataTables_wrapper .dataTables_filter .closeTypeText {
            width: 35px;
            height: 32px;
            position: absolute;
            top: 11px;
            background-size: 100%;
            background-color: #fff;
            z-index: 100;
            text-align: center;
        }

            .NoteBookUCPopup .dataTables_wrapper .dataTables_filter .closeTypeText span {
                width: 12px;
                height: 12px;
                background-size: 12px;
                display: inline-block;
                margin-top: 10px;
            }

        .NoteBookUCPopup .dataTables_wrapper .dataTables_filter input {
            width: calc(100% - 44px);
            height: 34px;
            box-sizing: border-box;
        }

    .NoteBookUCPopup table.dataTable tbody td {
        padding: 0;
    }
/*************************************************add new style in notebook*************************************************/
.CardDepositBookRecord_Container input.Inputs, .CardDepositBookRecord_Container input[type="text"], .CardDepositBookRecord_Container input[type="number"], .CardDepositBookRecord_Container input[type="tel"] {
    width: 204px;
    border: 1px solid #d4d4d4;
    height: 27px;
}

.notebookDepositSelect .NoteBookTextBoxParent.depositSelector input[type="text"], .notebookDepositSelect .NoteBookTextBoxParent.depositSelector input[type="tel"] {
    padding-left: 2px !important;
    padding-right: 2px !important;
}

.notebookDepositSelect .NoteBookTextBoxParent.shebaSelector input {
    width: 204px;
}
/*************************************************GroupBillPayment*************************************************/
.form_groupVertical .showDeposits img {
    width: 32px;
    height: 32px;
    padding: 6px 6px 6px 5px;
}

.form_groupVertical .NoteBookTextBoxParent input.inputs {
    height: 32px !important;
}

.form_groupVertical .CardDepositBookRecord_Container input.Inputs, .form_groupVertical .CardDepositBookRecord_Container input[type="text"], .form_groupVertical .CardDepositBookRecord_Container input[type="number"], .form_groupVertical .CardDepositBookRecord_Container input[type="tel"] {
    height: 32px !important;
}

.normalInput3_NoteBookControl .CardDepositBookRecord_Container input.Inputs, .normalInput3_NoteBookControl .CardDepositBookRecord_Container input[type="text"], .normalInput3_NoteBookControl .CardDepositBookRecord_Container input[type="number"], .normalInput3_NoteBookControl .CardDepositBookRecord_Container input[type="tel"] {
    width: 188px !important;
}

.form_groupVertical .userCardDepositSelectedData .NoteBookGroupDeposit {
    padding: 6px;
}

.form_groupVertical .userCardDepositSelectedData .NoteBookGroupDeposit {
    padding: 6px;
}

.form_groupVertical .cardSelector input.inputs {
    width: 46.5px;
}

.form_groupVertical .CardDepositContainer {
    width: 300px;
}

.PaymentContainer .CardDepositBookRecord_Container.sourceDepositControlContainer {
    display: inline-block;
    width: 100%;
}

.PaymentContainer .showDeposits {
    float: right;
}

.PaymentContainer .NoteBookTextBoxParent.notebookSourceDeposit {
    display: inline-block;
    width: 89%;
    width: calc(100% - 33px);
}

.PaymentContainer .userCardDepositSelectedData .NoteBookTextBoxParent.notebookSourceDeposit .Inputs:disabled {
    width: 100% !important;
    height: 32px;
    min-height: 32px;
    padding: 3px 5px 4px;
}

.formDepositContainer .CardDepositBookRecord_Container .userCardDepositSelectedData {
    float: none !important;
}

.formDepositContainer .CardDepositBookRecord_Container {
    width: 100%;
}

.PayByCardContainer .textBoxControl dt {
    height: 34px !important;
}

.PayByCardContainer .DynamicPosition .keyBoardtd {
    padding: 3px !important;
}

.PayByCardContainer .textBoxControl dt {
    height: 34px !important;
}

.PayByCardContainer .DynamicPosition .keyBoardtd {
    padding: 3px !important;
}

.PayByCardContainer .imageButtonClear {
    padding: 5px;
}


.PopupValidateContainer.NInput2_Column .CardDepositBookRecord_Container {
    width: 100%;
}

    .PopupValidateContainer.NInput2_Column .CardDepositBookRecord_Container .userCardDepositSelectedData.nc {
        width: 100%;
    }

.PopupValidateContainer.NInput2_Column .NoteBookTextBoxParent.mobileSelector, .PopupValidateContainer.NInput2_Column .NoteBookTextBoxParent.BillSelector {
    width: 32px;
    width: calc(100% - 29px);
}

    .PopupValidateContainer.NInput2_Column .NoteBookTextBoxParent.mobileSelector input[type="text"], .PopupValidateContainer.NInput2_Column .NoteBookTextBoxParent.BillSelector input[type="text"],, .PopupValidateContainer.NInput2_Column .NoteBookTextBoxParent.BillSelector input[type="tel"] {
        box-sizing: border-box;
        width: 100%;
        height: 32px;
    }

.PopupValidateContainer.NInput2_Column .CardDepositBookRecord_Container .userCardDepositSelectedData.nc input[type="image"] {
    padding: 5px 4px;
}

.PopupValidateContainer.NInput2_Column .NoteBookTextBoxParent.mobileSelector input, .PopupValidateContainer.NInput2_Column .NoteBookTextBoxParent.BillSelector input {
    box-sizing: border-box;
    width: 100%;
    height: 32px;
    border: 1px solid #d4d4d4;
    min-height: 25px;
}

/*********************************************saveNotBookPopuo*****************************************************/
.saveNotBookPopuo {
    position: absolute;
    width: 400px;
    background-color: white;
    border: 1px solid #a9a9a9;
    -webkit-box-shadow: rgba(0,0,0,0.23) 0 0 5px 0;
    box-shadow: rgba(0,0,0,0.23) 0 0 5px 0;
    color: #585858;
    z-index: 2;
}

    .saveNotBookPopuo .columnsContainer {
        border: none !important;
        display: block;
    }

    .saveNotBookPopuo .Header {
        font-size: 16px;
        height: 40px;
        background-color: #303e45;
        color: #fff;
        font-weight: normal;
        padding: 6px 15px;
    }

    .saveNotBookPopuo .infoTextPopup {
        color: #e15344;
        font-size: 11px;
        padding: 10px 0;
        padding-top: 15px;
        text-align: center;
    }

    .saveNotBookPopuo .columnsContainer .leftColumn, .saveNotBookPopuo .columnsContainer .rightColumn {
        padding: 0;
        font-size: 12px;
    }

    .saveNotBookPopuo .columnsContainer .rightColumn {
        width: 90px;
    }

    .saveNotBookPopuo .columnsContainer .leftColumn input {
        width: 90%;
    }

    .saveNotBookPopuo .btnContainer {
        padding: 10px 0 !important;
        padding-bottom: 18px !important;
    }

        .saveNotBookPopuo .btnContainer .Style_Center {
            width: 100% !important;
            text-align: center !important;
        }

    .saveNotBookPopuo .btnCancel, .saveNotBookPopuo .btnAccept {
        background-image: none;
        width: 100px !important;
        margin: 0 10px;
    }

.sectionActionSaveNotBook input[type="image"] {
    vertical-align: middle;
}
/******************************************showDeposits********************************************************/
.showDeposits img {
    position: relative;
    display: inline-block !important;
    padding: 3px;
    height: 27px;
}

.showDeposits a {
    vertical-align: middle;
    display: inline-block;
}

.showDeposits span {
    padding: 0;
    margin: 0;
}

.showDeposits a:focus img, .showDeposits a:active img, .showDeposits img:focus, .showDeposits img:active {
    box-shadow: 0 0 3px 2px #efc316;
    outline: 0;
}

.showDeposits a:focus, .showDeposits a:active {
    outline: 0;
}

.showDeposits, .btnshowDeposits {
    position: relative;
}

.btnshowDeposits {
    vertical-align: middle;
}

.showDeposits {
    vertical-align: top;
}

.btnshowDeposits label {
    line-height: 160%;
}

.btnshowDeposits, .showDeposits {
    display: inline-block;
}

.btnshowDeposits {
    height: 25px;
    padding-top: 3px;
}

.showDepositsPopUp {
    position: absolute;
    background: #444;
    color: #fff;
    padding: 4px !important;
    min-width: 150px;
    text-align: center;
    top: -33px;
    border-radius: 5px;
    display: none;
}

    .showDepositsPopUp::after {
        content: "";
        position: absolute;
        top: 100%;
        border-width: 5px;
        border-style: solid;
        border-color: #444 transparent transparent transparent;
    }
/**************************************************************************************************/
input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

input[type=number] {
    -moz-appearance: textfield;
}

.NoteBookTextBoxParent .Inputs {
    padding: 0 5px;
}

.NoteBookTextBoxParent input:disabled {
    background-color: #f9f9f9 !important;
    cursor: default;
}

.CardDepositBookRecord_Container[disabled="disabled"] input:disabled,
.CardDepositBookRecord_Container[disabled="disabled"] .userCardDepositSelectedData input[type="text"]:disabled,
.CardDepositBookRecord_Container[disabled="disabled"] .userCardDepositSelectedData input[type="tel"]:disabled {
    background: #eaeaea !important;
    cursor: default;
}

.notebookDepositSelect .userCardDepositSelectedData.nc input[type="image"] {
    background: #fff;
}

.form_groupVertical .notebookDepositSelect .userCardDepositSelectedData.nc input[type="image"] {
    background: 0;
    width: 33px;
    height: 32px;
}

.NoteBookGroupDeposit {
    border: 1px solid #d4d4d4;
    padding: 3px 3px 2px;
}

.NoteBookTextBoxParent {
    direction: ltr;
    display: inline-block;
}

    .NoteBookTextBoxParent input.inputs[type=number] {
        text-align: left;
        height: 27px;
        border: 1px solid #d4d4d4;
    }

.cardSelector input.inputs {
    width: 42.5px;
    padding: 0 1px;
}

.notebookDepositSelect .NoteBookTextBoxParent.depositSelector .inputs {
    padding-left: 2px !important;
    padding-right: 2px !important;
}

.IsRequired input.valid, input.IsRequired.valid, .NoteBookTextBoxParent[isrequired="True"] input.valid,
.IsRequired input.valid, .IsRequired input.valid[type="text"]:disabled,
div[id*="NoteBook"] input[type="password"]:disabled, div[id*="NoteBook"] input.IsRequired.valid[type="text"],
.NoteBookTextBoxParent[isrequired="True"] input.valid[type="text"],
.NoteBookTextBoxParent[isrequired="True"] input.valid[type="tel"] {
    border: 1px solid #00be21 !important;
}

.IsRequired input.invalid, input.IsRequired.invalid, .NoteBookTextBoxParent[isrequired="True"] input.invalid, .IsRequired input.invalid[type="text"], input.IsRequired.invalid[type="text"], .NoteBookTextBoxParent[isrequired="True"] input.invalid[type="text"] {
    border: 1px solid #ff4848 !important;
}

.BatchTMDisabled .IsRequired input.valid,
.BatchTMDisabled input.IsRequired.valid,
.BatchTMDisabled .NoteBookTextBoxParent[isrequired="True"] input.valid,
.BatchTMDisabled .IsRequired input.valid,
.BatchTMDisabled input.IsRequired.valid[type="text"],
.BatchTMDisabled .NoteBookTextBoxParent[isrequired="True"] input.valid[type="text"],
.BatchTMDisabled .IsRequired input.invalid,
.BatchTMDisabled input.IsRequired.invalid,
.BatchTMDisabled .NoteBookTextBoxParent[isrequired="True"] input.invalid,
.BatchTMDisabled .IsRequired input.invalid[type="text"],
.BatchTMDisabled input.IsRequired.invalid[type="text"],
.BatchTMDisabled input.IsRequired.invalid[type="tel"],
.BatchTMDisabled .NoteBookTextBoxParent[isrequired="True"] input.invalid[type="text"] {
    border: 1px solid #d2d2d2 !important;
    background: #ccc !important;
}

.shebaSelector input {
    width: 190px;
    border: 1px solid #CCC;
    padding: 0 5px;
    min-height: 27px;
}

.AdditionalLettersNotebook {
    padding: 5px 5px 2px;
    border: 1px solid #d4d4d4;
    border-right: 0;
    vertical-align: top;
    display: inline-block;
    height: 27px;
    outline: 0;
}

select.currencyDropDown {
    min-width: 50px;
}

.mobileSelector input, .BillSelector input {
    height: 27px;
}

@media screen and (max-width: 900px) {
    .NoteBookUCPopup .dataTables_wrapper .dataTables_filter {
        margin-top: 0;
    }

    .NoteBookUCPopup.NoteBookUCTowColumn {
        left: 2%;
        right: 2%;
        margin: 30px auto 0;
        width: 400px;
    }

    .NoteBookUCPopup.OneBookUCTowColumn {
        width: 260px;
    }
}

@media screen and (max-width: 600px) {
    .NoteBookUCPopup {
        left: auto;
        right: auto;
    }

        .NoteBookUCPopup .dataTables_wrapper .dataTables_filter {
            margin-top: 0;
        }

    .PaymentContainer .formDepositContainer .NoteBookTextBoxParent.notebookSourceDeposit {
        width: 85%;
        width: calc(100% - 33px);
    }

    .saveNotBookPopuo {
        height: auto;
        right: 3%;
        left: 3% !important;
        margin: 20px auto 0 !important;
        max-width: 400px;
        width: auto;
        margin-top: 0 !important;
    }

        .saveNotBookPopuo .btnContainer {
            padding: 3px 0 !important;
        }

    .NoteBookUCPopup.NoteBookUCTowColumn {
        width: 270px;
        left: auto;
        right: auto;
    }

        .NoteBookUCPopup.NoteBookUCTowColumn table.dataTable > tbody > tr > td {
            display: block;
        }

            .NoteBookUCPopup.NoteBookUCTowColumn table.dataTable > tbody > tr > td > a {
                width: 270px;
                line-height: 18px;
            }

    .NoteBookUCPopup table.dataTable > tbody > tr > td.NoteBookName ~ td.NoteBookNumber a {
        padding-top: 0;
    }

    select.currencyDropDown {
        margin-top: 1px;
    }

    .formDepositContainer .userCardDepositSelectedData input[type="text"]:disabled {
        width: 84% !important;
    }

    .formDepositContainer div[dvfd="divForCardDepositBookRecordsuDMSourceDeposit"] {
        width: 85% !important;
    }
}

@media screen and (max-width: 360px) {
    .PaymentContainer .formDepositContainer .NoteBookTextBoxParent.notebookSourceDeposit {
        width: 83%;
        width: calc(100% - 33px);
    }
}

/********************************************************************/







