/* Version 1.0.14.0 */
@font-face {
    font-family: 'source_sans_probold';
    src: url('../fonts/sourcesanspro-bold-webfont.eot');
    src: url('../fonts/sourcesanspro-bold-webfont.eot?#iefix') format('embedded-opentype'),url('../fonts/sourcesanspro-bold-webfont.woff') format('woff'),url('../fonts/sourcesanspro-bold-webfont.ttf') format('truetype'),url('../fonts/sourcesanspro-bold-webfont.svg#source_sans_probold') format('svg');
    font-weight: normal;
    font-style: normal
}

@font-face {
    font-family: 'source_sans_proregular';
    src: url('../fonts/sourcesanspro-regular-webfont.eot');
    src: url('../fonts/sourcesanspro-regular-webfont.eot?#iefix') format('embedded-opentype'),url('../fonts/sourcesanspro-regular-webfont.woff') format('woff'),url('../fonts/sourcesanspro-regular-webfont.ttf') format('truetype'),url('../fonts/sourcesanspro-regular-webfont.svg#source_sans_proregular') format('svg');
    font-weight: normal;
    font-style: normal
}

* {
    -webkit-font-smoothing: antialiased;
    line-height: 1.42857
}

input {
    outline: none;
    -moz-appearance: textfield
}

ser body {
}

body {
    background: #464444;
    margin: 0;
    padding: 0;
    font-family: helvetica;
    height: 100%;
    scrollbar-face-color: gray;
    scrollbar-arrow-color: #fff;
    scrollbar-highlight-color: #fffbf0;
    scrollbar-3dlight-color: gray;
    scrollbar-shadow-color: #fffbf0;
    scrollbar-darkshadow-color: gray;
    scrollbar-track-color: #ccc
}

.pos-fontRightProduct {
    text-overflow: ellipsis;
    overflow: hidden;
    color: #fff;
    height: 60px
}

.pos-fontRightProductBottom {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    color: #fff
}

.pos-topCloseBtnIcon {
    width: 40px;
    height: 39px;
    float: right;
    background: url(../Content/Images/closeiconB.png);
    background-repeat: no-repeat;
    cursor: pointer
}

.pos-topRefreshBtnIcon {
    width: 40px;
    height: 39px;
    float: right;
    background: url(../Content/Images/refreshiconB.png) center;
    background-repeat: no-repeat;
    cursor: pointer
}

.pos-OrderPopupTabs {
    float: left;
    position: relative;
    z-index: 2
}

    .pos-OrderPopupTabs ul {
        list-style: none;
        padding: 0 0 0 0
    }

        .pos-OrderPopupTabs ul li {
            float: left;
            padding: 6px 12px;
            height: 48px;
            line-height: 26px;
            background: #0a7986;
            color: #fff;
            margin-left: 2px;
            cursor: pointer;
            position: relative;
            min-width: 100px;
            text-align: center
        }

            .pos-OrderPopupTabs ul li:first-child {
                border-top-left-radius: 5px;
                border-bottom-left-radius: 5px
            }

            .pos-OrderPopupTabs ul li:last-child {
                border-top-right-radius: 5px;
                border-bottom-right-radius: 5px
            }

li.pos-OrderSelectedTab:after {
    position: absolute;
    content: '';
    width: 0;
    height: 0;
    border-left: 12px solid transparent;
    border-right: 12px solid transparent;
    border-top: 12px solid #eebc5b;
    bottom: -12px;
    left: 0;
    right: 0;
    margin: auto
}

.pos-OrderPopupTabs ul li.pos-OrderSelectedTab {
    background: #eebc5b
}

.pos-OrderPopupTabs ul li.posva019-OrderSelectedTab {
    background: #eebc5b
}

.pos-refundPopup {
    padding-left: 10px;
    padding-right: 0;
    min-height: 140px;
    height: calc(100% - 60px)
}

.pos-refundPopupRow {
    float: left;
    width: 99%;
    padding: 0 10px 0 0;
    box-sizing: border-box;
    border-bottom: 1px dotted #047784
}

.pos-refundpopupHeadWrap, .pos-refundpopupHead {
    background: #09b3c6;
    width: 100%;
    float: left;
    white-space: nowrap;
    display: flex;
    justify-content: space-between;
    position: relative;
    z-index: 1;
    box-sizing: border-box
}

    .pos-refundpopupHeadWrap p {
        text-align: left;
        padding: 0 10px;
        box-sizing: border-box;
        background: #09b3c6;
        margin: 0;
        padding: 10px;
        color: #035862;
        font-weight: 400
    }

.pos-refundPopupRow h3 {
    box-sizing: border-box;
    color: #fff;
    line-height: 28px
}

    .pos-refundPopupRow h3 select, .pos-refundpopupHead select, .pos-refundPopupRow h3 input {
        padding: 3px 0;
        color: #0ca7b9;
        background: #abe6ed;
        height: 32px;
        width: 100% !important;
        outline: none;
        border: 1px solid #41dcee;
        border-radius: 3px;
        margin-bottom: 0
    }

.pos-refundpopupHead label {
    color: #035862
}

.pos-refundPopupRow .pos-modifierOpt h3 {
    font-size: 12px
}

.posva019-refundpopupHead p {
    box-sizing: border-box;
    padding: 10px
}

.pos-refundpopupHead p label {
    line-height: 30px;
    padding-right: 10px
}

.pos-RefundPopupTableContent {
    background: #05a6b8;
    float: left;
    width: 100%;
    padding-bottom: 10px;
    height: calc(100% - 139px)
}

.pos-refundPopupRow h3 span {
    float: left;
    width: calc(100% - 31px);
    line-height: 28px
}

.pos-altContent {
    height: calc(100% - 100px);
    height: -moz-calc(100% - 100px);
    height: -webkit-calc(100% - 100px);
    float: left;
    width: 100%
}

.pos-tableWrap {
    overflow-x: auto;
    overflow-y: hidden;
    height: 100%
}

.pos-tableBody {
    overflow-x: hidden;
    overflow-y: auto;
    height: calc(100% - 30px);
    height: -moz-calc(100% - 30px);
    height: -webkit-calc(100% - 30px);
    float: left;
    width: 100%
}

.pos-tableHead {
    background: #09b3c6
}

.pos-tableHead, .pos-tableRow {
    width: 100%;
    display: flex;
    justify-content: space-between;
    float: left;
    white-space: normal
}

    .pos-tableHead h3 {
        background: #09b3c6;
        white-space: normal;
        color: #035862
    }

    .pos-tableHead h3, .pos-tableRow h3 {
        margin: 0;
        font-size: 13px;
        padding: 6px 10px;
        display: inline-block;
        max-width: 150px;
        min-width: 80px;
        text-align: center;
        word-wrap: break-word;
        width: 15%;
        line-height: 28px
    }

    .pos-tableRow h3 {
        color: #fff
    }

.pos-orderTable h3 img {
    margin-left: 10px;
    cursor: pointer
}

.pos-tableRow {
    border-bottom: 1px solid #07909f
}

.pos-orderError {
    background: url('../Content/Images/orderError.png') center;
    width: 28px;
    height: 28px;
    background-repeat: no-repeat;
    cursor: default;
    margin: 3px
}

.pos-orderOK {
    background: url('../Content/Images/orderOK.png') center;
    width: 28px;
    height: 28px;
    background-repeat: no-repeat;
    cursor: default;
    margin: 3px
}

.pos-resetOLog {
    background: url('../Content/Images/resetOlog.png') center;
    width: 28px;
    height: 28px;
    background-repeat: no-repeat;
    cursor: pointer
}

.pos-copyOLog {
    background: url('../Content/Images/copyOlog.png') center;
    width: 28px;
    height: 28px;
    background-repeat: no-repeat;
    cursor: pointer;
    margin-left: 12px
}

.pos-syncOLog {
    background: url('../Content/Images/syncOlog.png') center;
    width: 28px;
    height: 28px;
    background-repeat: no-repeat;
    cursor: pointer;
    margin-left: 12px
}

.pos-voidOLog {
    background: url('../Content/Images/voidOlog.png') center;
    width: 28px;
    height: 28px;
    background-repeat: no-repeat;
    cursor: pointer;
    margin-left: 12px
}

.pos-detailsOLog {
    background: url('../Content/Images/detailsOlog.png') center;
    width: 28px;
    height: 28px;
    background-repeat: no-repeat;
    cursor: pointer;
    margin-left: 12px
}

.pos-detailsOLogExpand {
    background: url('../Content/Images/expand.png') center;
    width: 28px;
    height: 28px;
    background-repeat: no-repeat;
    cursor: pointer;
    margin-left: 12px
}

.pos-detailsOLogShrink {
    background: url('../Content/Images/shrink.png') center;
    width: 28px;
    height: 28px;
    background-repeat: no-repeat;
    cursor: pointer;
    margin-left: 12px
}

.pos-detailsOLogPrint {
    background: url('../Content/Images/oLogprinter.png') center;
    width: 28px;
    height: 28px;
    background-repeat: no-repeat;
    cursor: pointer;
    margin-left: 12px
}

.pos-detailsOLogScreen {
    background: url('../Content/Images/oLogScreen.png') center;
    width: 28px;
    height: 28px;
    background-repeat: no-repeat;
    cursor: pointer;
    margin-left: 12px
}

.pos-detailsOLogDefault {
    background: url('../Content/Images/oLogDefault.png') center;
    width: 28px;
    height: 28px;
    background-repeat: no-repeat;
    cursor: pointer;
    margin-left: 12px
}

.POS_clsAddress {
    white-space: nowrap;
    width: 74%;
    float: left;
    text-overflow: ellipsis;
    overflow: hidden
}

.ui-autocomplete {
    z-index: 99999;
    max-height: 300px;
    overflow: auto;
    background: #0ab !important
}

.POS_totalqtys {
    float: left;
    padding-left: 20px;
    width: 100%;
    font-size: 14px;
    box-sizing: border-box
}

    .POS_totalqtys label {
        margin-bottom: 0
    }

    .POS_totalqtys input {
        background: transparent;
        border: none
    }

.col-100 {
    width: 100%
}

.col-66 {
    width: 66.66%;
    float: left
}

.col-50 {
    width: 50%;
    float: left
}

.col-40 {
    width: 40%;
    float: left
}

.col-33 {
    width: 33.33%;
    float: left
}

.col-30 {
    width: 30%;
    float: left
}

.col-25 {
    width: 25%;
    float: left
}

.col-23 {
    width: 23%;
    float: left
}

.col-22 {
    width: 22%;
    float: left
}

.col-20 {
    width: 20%;
    float: left
}

.col-18 {
    width: 18.33%;
    float: left
}

.col-16 {
    width: 16.66%;
    float: left
}

.col-15 {
    width: 15%;
    float: left
}

.col-14 {
    width: 14.28%;
    float: left
}

.col-12 {
    width: 12%;
    float: left
}

.col-10 {
    width: 10%;
    float: left
}

.clearfix:after, .dl-horizontal dd:after, .container:after, .container-fluid:after, .row:after, .form-horizontal .form-group:after, .btn-toolbar:after, .btn-group-vertical > .btn-group:after, .nav:after, .navbar:after, .navbar-header:after, .navbar-collapse:after, .pager:after, .panel-body:after, .modal-footer:after {
    clear: both
}

.pos-payment-resolution {
    width: 8.4%;
    float: left;
    background-color: #18c0d4;
    border-right: 2px solid #0792a2;
    height: 100%;
    position: fixed;
    z-index: 0
}

.pos-div-PaymentBg {
    background: #0fb7cb !important
}

.pos-web-dialog-overlay {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    height: 100%;
    width: 100%;
    margin: 0;
    padding: 0;
    background: #000;
    opacity: .15;
    filter: alpha(opacity=15);
    -moz-opacity: .15;
    z-index: 101;
    display: none
}

.pos-busy-indicator {
    position: fixed;
    width: 42px;
    height: 42px;
    top: 50%;
    left: 50%;
    background-color: #fff;
    background: url('../Content/Images/ajax-loader.gif');
    padding: 0;
    z-index: 999999999;
    font-family: Verdana;
    font-size: 10pt
}

.pos-PopupWrap-alert {
    margin: auto;
    width: 80%;
    max-width: 346px;
    top: 30%;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 102;
    position: fixed;
    box-sizing: border-box
}

.notify-wrap {
    width: 49px;
    height: 57px;
    background-color: transparent;
    text-align: center;
    margin: 0 auto;
    position: relative
}

span.notify-bubble {
    position: absolute;
    right: -21px;
    background-color: #d84451;
    border-radius: 50px;
    padding: 2px;
    width: 30px;
    height: 30px;
    line-height: 32px;
    text-align: center;
    font-size: 12px;
    top: -8px
}

.pos-alert-close {
    width: 50px;
    height: 50px;
    float: right;
    margin-top: -18px;
    margin-right: -26px;
    cursor: pointer
}

.pos-alert-close-info {
    background: url(../Content/Images/info-cros.png);
    background-repeat: no-repeat
}

.pos-alert-close-warn {
    background: url(../Content/Images/warning-cros.png);
    background-repeat: no-repeat
}

.pos-alert-close-error {
    background: url(../Content/Images/error-cros.png);
    background-repeat: no-repeat
}

.pos-PopupHeader-alert {
    float: left;
    width: 100%;
    border-top-left-radius: 7px;
    border-top-right-radius: 7px
}

.pos-PopupHeader-alert-info {
    background-color: #29a1dd
}

.pos-PopupHeader-alert-warn {
    background-color: #f39334
}

.pos-PopupHeader-alert-error {
    background-color: #ed7676
}

.pos-PopupHeader-alert > h4 {
    float: left;
    color: #fff;
    padding: 0;
    margin: 0;
    padding: 15px 15px;
    font-size: 15px;
    font-family: inherit;
    font-weight: 500;
    line-height: 1.1
}

.pos-PopupContent-alert {
    float: left;
    width: 100%;
    padding: 15px;
    border-bottom-left-radius: 7px;
    border-bottom-right-radius: 7px;
    box-sizing: border-box
}

.pos-PopupContent-alert-info {
    color: #0e6fa0;
    background-color: #d9edf7;
    border: 1px #29a1dd solid;
    border-top: 0
}

.pos-PopupContent-alert-warn {
    color: #b55f0a;
    background-color: #fcf8e3;
    border: 1px #f39334 solid;
    border-top: 0
}

.pos-PopupContent-alert-error {
    color: #c11515;
    background-color: #f2dede;
    border: 1px #ed7676 solid;
    border-top: 0
}

.pos-PopupInput-alert {
    float: left;
    width: 100%;
    margin-bottom: 15px
}

    .pos-PopupInput-alert > label {
        clear: both;
        float: left;
        width: 30%;
        margin-top: 7px;
        font-weight: normal;
        font-size: 13px;
        display: inline-block;
        margin-bottom: 5px
    }

    .pos-PopupInput-alert > input {
        float: left;
        width: 70%;
        color: #105c75;
        opacity: .8;
        display: block;
        height: 34px;
        padding: 1px 12px;
        font-size: 14px;
        line-height: 1.42857143;
        color: #555;
        background-color: #fff;
        background-image: none;
        border: 1px solid #ccc;
        border-radius: 4px;
        -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
        box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
        -webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
        transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
        font: inherit;
        margin: 0;
        box-sizing: border-box
    }

.pos-PopuptopCloseIconTop {
    width: 50px;
    height: 50px;
    float: right;
    background: url(../Content/Images/closeiconB.png);
    background-repeat: no-repeat;
    margin-top: -18px;
    margin-right: -26px;
    cursor: pointer
}

.pos-PopupBtn {
    float: right
}

.pos-PopupBtn1 {
    margin-top: 2px;
    float: right;
    width: 40%;
    padding-left: 10px;
    box-sizing: border-box
}

.pos-PopupIcon {
    width: 21px;
    height: 21px;
    float: left
}

.pos-btn {
    color: #fff;
    border-radius: 3px;
    padding: 10px 15px;
    margin-left: 10px;
    display: inline-block;
    margin-bottom: 0;
    font-weight: 400;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    background-image: none;
    border: 1px solid transparent;
    white-space: nowrap;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    border-radius: 4px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

    .pos-btn:hover {
        color: #fff;
        text-decoration: none
    }

.pos-CloseBtn {
    background: #078492
}

.pos-AddProBtn {
    background: #eebc5b
}

.pos-PopupTickIcon {
    background: url(../Content/Images/tick-icon.png);
    background-repeat: no-repeat;
    margin-right: 5px
}

.pos-PopupCloseIcon {
    background: url(../Content/Images/closeIcon.png);
    background-repeat: no-repeat;
    margin-right: 5px
}

.pos-cd-popupwrap {
}

.pos-cd-header {
    float: left;
    width: 100%;
    background: #07909f;
    border-bottom: 1px solid #047784;
    border-top-left-radius: 7px;
    border-top-right-radius: 7px
}

.pos-cd-header-dark {
    background: rgba(3,100,111,1) !important
}

.pos-cd-title {
    float: left;
    color: #d9f1f4;
    padding: 0;
    margin: 0;
    padding: 15px 15px;
    font-size: 15px;
    font-family: inherit;
    font-weight: 500;
    line-height: 1.1
}

.pos-cd-close {
    width: 50px;
    height: 50px;
    float: right;
    background-image: url(../Content/Images/closeiconB.png);
    background-repeat: no-repeat;
    margin-top: -18px;
    margin-right: -26px;
    cursor: pointer
}

.pos-cd-close-dark {
    background-image: url(../Content/Images/close-1.png) !important
}

.pos-cd-content {
    background-color: #05a6b8;
    float: left;
    width: 100%;
    overflow: auto;
    border-bottom-left-radius: 7px;
    border-bottom-right-radius: 7px
}

.pos-cd-content-dark {
    background-color: #078492 !important
}

.pos-d-busy {
    width: 100%;
    opacity: 1;
    position: absolute;
    bottom: 0;
    background-image: url('../Content/Images/ajax-loader.gif');
    background-repeat: no-repeat;
    background-position: center center
}

.pos-pull-left {
    float: left
}

.pos-pull-right {
    float: right
}

.pos-mode-selection-main {
    width: 10%;
    min-width: 260px;
    top: 0;
    margin: auto;
    bottom: 0;
    right: 0;
    left: 0;
    height: 50%;
    position: absolute
}

.poslogout-btn {
    width: 28px;
    height: 28px;
    float: left;
    margin-left: 15px;
    cursor: pointer
}

    .poslogout-btn img {
        cursor: pointer
    }

.pos-modeSelector {
    float: left;
    width: 130px;
    height: 130px;
    cursor: pointer
}

.pos-retailmode-wrap {
    float: left
}

    .pos-retailmode-wrap p {
        text-align: center;
        font-weight: 600;
        color: #4d3b04;
        margin: 7px;
        font-size: 14px
    }

.pos-mode-selectorPOS {
    background: url('../Content/Images/pos.png') no-repeat
}

.clear-both {
    clear: both
}

.wrapper-left {
    width: 100%;
    float: left;
    min-width: 40%;
    height: 100%;
    overflow-x: hidden;
    position: absolute
}

.header-menu {
    width: 40%;
    height: 15%;
    position: relative;
    float: left
}

.header-left {
    width: 100%;
    background-color: #ff4e5d;
    border-bottom: 1px solid #917740;
    position: absolute;
    float: left;
    height: 100%
}

.user-name {
    font-size: 15px;
    color: #fff;
    float: left;
    margin: 0;
    margin-bottom: 8px;
    margin-left: 20px
}

.user-name123 {
    font-size: 15px;
    color: #fff;
    float: left;
    margin: 0;
    margin-bottom: 8px;
    padding: 0 20px;
    width: 100%;
    height: 45px;
    text-overflow: ellipsis;
    overflow: hidden;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    line-height: 1.4px;
    display: -webkit-box;
    box-sizing: border-box
}

.pos-LeftTopText {
    display: inline-block;
    height: 100%;
    word-wrap: break-word;
    width: 75%
}

.john-doe-slide .user-name {
    font-size: 15px;
    color: #fff;
    float: left;
    margin: 0;
    margin-bottom: 8px;
    margin-left: 20px;
    width: 90%
}

.user-name span {
    font-weight: normal
}

.olovka {
    background: url('../Content/Images/olovka.png');
    background-repeat: no-repeat;
    width: 22px;
    height: 22px;
    background-color: #da243a;
    background-position: 5px;
    border-radius: 5px;
    float: right;
    cursor: pointer
}

.header-h-info {
    color: #fff;
    font-weight: normal;
    font-size: 13px
}

    .header-h-info span {
        font-weight: bold;
        font-size: 17px;
        font-size: 13px
    }

.order {
    background-color: #f3bc4f;
    width: 100%;
    border-top: 1px solid #ffd478;
    border-bottom: 1px solid #d7a237;
    height: 20%;
    float: left;
    min-height: 75px
}

.order-bottom {
    width: 40%;
    height: 98% !important
}

.order-left {
    font-size: 20px;
    color: #4d3b04;
    float: left;
    position: relative;
    left: 20px;
    margin-top: 9px
}

.order-rightpck, .order-right, .order-rightpck, .order-right1, .order-right2, .order-rightNGO, .order-rightRet, .order-right3, .order-rightToggle, .order-rightSendKitchen, .POS_alterIcon, .rightPromoCode, .order-rightPromoCode, .order-rightqsr {
    float: right;
    width: 40px;
    height: 40px;
    border-radius: 5px;
    cursor: default;
    position: relative;
    right: 10px;
    margin-top: 5px;
    margin-right: 10px
}

.order-right {
    background: url('../Content/Images/images-1-1.png') no-repeat center;
    right: 0;
    margin-right: 0
}

.order-rightpck {
    background: url('../Content/Images/images-1-1.png') no-repeat center
}

.order-rightqsr {
    background: url('../Content/Images/qsr_icon.png') no-repeat center
}

.order-right1 {
    background: url('../Content/Images/images-1-2.png') no-repeat center
}

.order-right2 {
    background: url('../Content/Images/images-1-3.png') no-repeat center
}

.order-rightNGO {
    background: url("../Content/Images/ngo.png") no-repeat scroll 4px center
}

.order-rightRet {
    background: url('../Content/Images/return.png') no-repeat center
}

.order-right3 {
    background: url('../Content/Images/images-1-4.png') no-repeat center;
    margin-left: 5px
}

.POS_alterIcon {
    background: url('../Content/Images/alter.png') no-repeat center;
    margin-right: 0
}

.order-right4 {
    float: right;
    background: url('../Content/Images/border-img.png');
    width: 15px;
    height: 50px;
    background-repeat: no-repeat;
    background-position: center;
    border-radius: 5px;
    position: relative;
    right: 0;
    margin-right: 5px
}

.order-rightToggle {
    background: url('../Content/Images/toggle.png')no-repeat center;
    cursor: pointer
}

.order-rightSendKitchen {
    background: url('../Content/Images/sendtokitchen.png') no-repeat center;
    cursor: pointer;
    right: 5px
}

.order-rightPromoCode {
    background: url('../Content/Images/promocodeicon.png') no-repeat center;
    cursor: pointer;
    right: 5px
}

.modeSelector-mainWrap {
    float: left;
    width: 100%
}

.order-right-1 {
    float: right;
    background: url('../Content/Images/plus-rose.png') no-repeat;
    width: 31px;
    height: 31px;
    background-repeat: no-repeat;
    background-color: #da243a;
    background-position: center;
    border-radius: 5px;
    cursor: pointer;
    position: relative;
    right: 40px;
    margin-top: 5%
}

.Utility-right {
    float: left;
    background: url('../Content/Images/Utility-right.png') center;
    width: 40px;
    height: 40px;
    background-repeat: no-repeat;
    cursor: default;
    position: relative;
    right: 0;
    margin-top: 0%;
    margin-right: 10px
}

.Utility-right-Return {
    float: left;
    background: url('../Content/Images/return-right.png') center;
    width: 40px;
    height: 40px;
    background-repeat: no-repeat;
    cursor: default;
    position: relative;
    right: 0;
    margin-top: 0%;
    margin-right: 10px
}

.pos-PopupWrapUtilityType .pos-PopuptopCloseIconTop {
    margin-top: -30px;
    margin-right: -38px
}

.Utility-right6, .Utility-right5, .Utility-right4, .Utility-right3, .Utility-right2, .Utility-right1, .Utility-rightMaster, .Utility-cacheReset, .Utility-rightMastersync {
    float: left;
    width: 40px;
    height: 40px;
    background-repeat: no-repeat;
    background-color: #1e7f8a;
    background-position: center;
    border-radius: 5px;
    cursor: pointer;
    position: relative;
    padding: 10px;
    margin-right: 10px;
    margin-bottom: 10px
}

.Utility-cacheReset {
    background-image: url('../Content/Images/cache-reset.png')
}

.Utility-rightMaster {
    background-image: url('../Content/Images/Utility-rightMaster.png')
}

.Utility-rightMastersync {
    background-image: url('../Content/Images/Utility-rightMastersync.png')
}

.Utility-right1 {
    background-image: url('../Content/Images/Utility-right1.png')
}

.Utility-right2 {
    background-image: url('../Content/Images/Utility-right2.png')
}

.Utility-right3 {
    background-image: url('../Content/Images/Utility-right3.png')
}

.Utility-right4 {
    background-image: url('../Content/Images/Utility-right4.png')
}

.Utility-right5 {
    background-image: url('../Content/Images/Utility-right5.png')
}

.Utility-right6 {
    background-image: url('../Content/Images/Utility-right6.png')
}

.Utility-right11 {
    float: right;
    background: url('../Content/Images/returnwinvoice.png');
    width: 51px;
    height: 62px;
    background-repeat: no-repeat;
    background-color: #1e7f8a;
    background-position: center;
    border-radius: 5px;
    cursor: pointer;
    position: relative;
    right: 10px
}

.Utility-right12 {
    float: right;
    background: url('../Content/Images/returnwioinvoice.png');
    width: 51px;
    height: 62px;
    background-repeat: no-repeat;
    background-color: #1e7f8a;
    background-position: center;
    border-radius: 5px;
    cursor: pointer;
    position: relative;
    right: 15px
}

.Utility-rightChangePattern {
    background-image: url('../Content/Images/change-patrn.png')
}

.Utility-rightCashJournal {
    background-image: url('../Content/Images/cash-journal.png')
}

.Utility-rightOrderLog {
    background-image: url('../Content/Images/order-log-util.png')
}

.left-name {
    background-color: #fec95e;
    padding-left: 20px;
    width: 97%;
    border-top: 1px solid #ffd477;
    border-bottom: 1px solid #d4a13a;
    height: 40px;
    float: left
}

.u-name {
    margin: 0;
    color: #4d3b04;
    font-size: 15px;
    font-weight: 600;
    line-height: 40px
}

.u-name-12 {
    margin: 0;
    color: #4d3b04;
    font-size: 13px;
    font-weight: 400;
    position: relative;
    left: 20px;
    z-index: 1
}

.u-name-1 {
    margin: 0;
    color: #4d3b04;
    font-size: 13px;
    font-weight: 400;
    position: relative;
    left: 15px;
    z-index: 1
}

.left-name-1 {
    background-color: #fec95e;
    padding-top: 8px;
    padding-bottom: 8px;
    width: 100%;
    border-bottom: 1px solid #edb850
}

    .left-name-1 input {
        line-height: 30px
    }

.u-name-1-big {
    font-size: 30px;
    margin: 0;
    color: #006570;
    position: relative;
    font-weight: 400;
    text-align: right
}

.price-margin {
    margin-top: 5px
}

.footer {
    width: 40%;
    background: #39d7fc;
    position: relative;
    bottom: 0;
    float: left;
    height: 100%;
    clear: both
}

.add-extra {
    background: url('../Content/Images/plus.png');
    width: 33px;
    height: 33px;
    background-repeat: no-repeat;
    background-color: #00aed2;
    background-position: center;
    border-radius: 5px;
    cursor: pointer;
    margin: 0 auto;
    text-align: center
}

.add-extra1 {
    background: url('../Content/Images/poz1.png');
    width: 44px;
    height: 38px;
    background-repeat: no-repeat;
    background-position: center;
    border-radius: 5px;
    cursor: pointer;
    margin: 0 auto;
    text-align: center
}

.discound-order {
    background: url('../Content/Images/dolar1.png');
    width: 60px;
    height: 50px;
    background-repeat: no-repeat;
    background-position: center;
    border-radius: 5px;
    cursor: pointer;
    margin: 0 auto;
    text-align: center
}

.discound-order1 {
    background: url('../Content/Images/poz2.png');
    width: 60px;
    height: 50px;
    background-repeat: no-repeat;
    background-position: center;
    border-radius: 5px;
    cursor: pointer;
    margin: 0 auto;
    text-align: center
}

.add1 {
    color: #fff;
    position: relative;
    margin-top: 1.1%
}

.discound-order2 {
    background: url('../Content/Images/poz5.png');
    width: 60px;
    height: 50px;
    background-repeat: no-repeat;
    background-position: center;
    border-radius: 5px;
    cursor: pointer;
    margin: 0 auto;
    text-align: center
}

.discound-order134 {
    background: url('../Content/Images/logout.png');
    width: 33px;
    height: 33px;
    background-repeat: no-repeat;
    background-color: #00aed2;
    background-position: center;
    border-radius: 5px;
    cursor: pointer;
    float: left;
    margin-left: 30px;
    margin-left: 30px
}

.dining-option {
    background: url('../Content/Images/clock1.png');
    width: 60px;
    height: 50px;
    background-repeat: no-repeat;
    background-position: center;
    border-radius: 5px;
    cursor: pointer;
    margin: 0 auto;
    text-align: center
}

.dining-option1 {
    background-image: url('../Content/Images/poz3.png');
    width: 45px;
    height: 40px;
    background-repeat: no-repeat;
    background-position: center;
    border-radius: 5px;
    cursor: pointer;
    margin: 0 auto;
    text-align: center
}

.print-guest-check {
    background: url('../Content/Images/print.png');
    width: 60px;
    height: 50px;
    background-repeat: no-repeat;
    background-position: center;
    border-radius: 5px;
    cursor: pointer;
    margin: 0 auto;
    text-align: center
}

.print-guest-check1 {
    background: url('../Content/Images/poz4.png');
    width: 60px;
    height: 50px;
    background-repeat: no-repeat;
    background-position: center;
    border-radius: 5px;
    cursor: pointer;
    margin: 0 auto;
    text-align: center
}

.pay {
    background: url('../Content/Images/pay.png');
    width: 60px;
    height: 50px;
    background-repeat: no-repeat;
    background-position: center;
    border-radius: 5px;
    cursor: pointer;
    margin: 0 auto;
    text-align: center
}

.footer-left-text {
    float: left;
    text-align: center;
    width: 100%;
    font-family: helvetica;
    font-size: 11px
}

.footer-left-text-pay {
    text-align: center;
    font-family: helvetica;
    font-weight: 200;
    font-size: 11px;
    margin: 0;
    width: 100%;
    float: left
}

.add-pay {
    color: #fff;
    position: relative;
    margin-top: 2%
}

.add {
    color: #fff;
    position: relative;
    margin-top: 3%
}

.left-content {
    background: #fec95e;
    width: 100%;
    border-bottom: 1px solid #d7a237;
    -webkit-overflow-scrolling: touch
}

    .left-content input:disabled {
        opacity: 1 !important
    }

.header-right {
    width: 60%;
    background: url('../Content/Images/header-right.png');
    border-bottom: 0 solid #a9938e;
    float: right;
    height: 11%
}

.wrapper-right {
    width: 60%;
    float: right;
    min-width: 60%
}

.cal {
    background: url('../Content/Images/calendar.png');
    width: 22px;
    height: 22px;
    cursor: pointer
}

.sett {
    background: url('../Content/Images/Sync.png');
    width: 40px;
    height: 40px;
    background-repeat: no-repeat;
    cursor: pointer
}

.dailyReport {
    background: url('../Content/Images/daily-report.png') center;
    width: 40px;
    height: 40px;
    background-repeat: no-repeat;
    cursor: pointer
}

.refresh-Button {
    background-image: url('../Content/Images/RefreshUrl.png');
    width: 40px;
    height: 40px;
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer
}

.kbrd {
    background: url('../Content/Images/keyboardicon.png') center;
    width: 40px;
    height: 40px;
    background-repeat: no-repeat;
    cursor: pointer
}

.slauf {
    background: url('../Content/Images/slauf.png') center;
    width: 23px;
    height: 22px;
    cursor: pointer
}

.sear {
    width: 100%;
    position: relative;
    right: 5px
}

.calendar {
    float: left;
    width: 40%;
    margin-top: 10px
}

.search {
    float: right;
    width: 60%;
    margin-top: 10px
}

.search-input {
    border: 0;
    width: 55%;
    border-top-left-radius: 4px;
    background: #d0bbb5;
    border-bottom-left-radius: 4px;
    padding: 7px 0;
    background-repeat: no-repeat;
    background-position: right;
    float: left;
    outline: none;
    margin-left: 10px
}

.content-right {
    width: 100%;
    background-size: cover;
    position: relative;
    height: 100%
}

.bgg {
    background: url('../Content/Images/potato-bg.png');
    background-repeat: repeat-x;
    text-align: center;
    padding-top: 10px;
    padding-bottom: 6px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    height: 48px;
    cursor: pointer;
    position: relative
}

    .bgg img {
        max-height: 100%;
        max-width: 100%
    }

.potato-bg {
    background: #00c5d6;
    text-align: center;
    padding-top: 5px;
    padding-bottom: 5px;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px
}

.content-products {
    padding-bottom: 20px;
    padding-right: 20px;
    position: relative;
    left: 20px;
    float: left;
    margin-top: 10px
}

.content-1 {
    padding-bottom: 10px;
    padding-right: 20px;
    position: relative;
    left: 20px;
    margin-top: 10px
}

.productbgg {
    width: 100%;
    float: left;
    height: 95px;
    background: #00c5d6;
    border-radius: 5px;
    text-align: center;
    line-height: 93px;
    cursor: pointer
}

.potato-bg span {
    color: #fff
}

.footer-right {
    width: 80%;
    background: #867575;
    padding-left: 20px;
    padding-right: 0;
    padding-top: 17px;
    padding-bottom: 14px;
    float: left
}

.footer-right-100 {
    width: 60%;
    background: #867575;
    float: right;
    position: relative;
    bottom: 0;
    height: 100%
}

.bb {
    background-color: #998684 !important
}

.logout {
    background: url('../Content/Images/logout.png');
    width: 22px;
    height: 22px;
    background-repeat: no-repeat;
    cursor: pointer;
    margin: 15px auto
}

.footer2-home {
    width: 100%
}

.footer2 {
    width: 108.6%
}

.col-12.log {
    background: #39d7fc;
    padding-top: 30px;
    padding-bottom: 19px;
    padding-right: 19px;
    border-bottom-right-radius: 5px
}

p.footer-left-text1 {
    float: left;
    color: #fff;
    margin-left: 17px
}

.customer {
    background-color: rgba(0,0,0,.17);
    padding: 7px 26px;
    border-radius: 9px;
    font-size: 16px;
    cursor: pointer;
    font-family: helvetica;
    position: relative;
    left: 20px
}

.customer-search {
    background: #da243a;
    position: absolute;
    width: 90%;
    padding: 10px;
    border-radius: 9px;
    z-index: 110;
    left: 0;
    right: 0;
    margin: 4% auto
}

.search-customer {
    font-size: 15px;
    color: #fff;
    margin: 0;
    position: relative;
    margin-bottom: 5px;
    width: 90%;
    font-weight: 200
}

.namon-card {
    font-size: 13px;
    color: #fff;
    opacity: .7;
    float: left;
    line-height: 28px
}

.pos-CusSearchTitle {
    width: 58%;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden
}

.pretraga, .pretraga-1 {
    width: calc(100% - 40px);
    width: -moz-calc(100% - 40px);
    width: -webkit-calc(100% - 40px);
    border: 0;
    border-radius: 3px;
    padding: 4px
}

.pretraga {
    background: #ff4e5d
}

.pretraga-1 {
    background: #00cbda
}

div.rub {
    width: 0;
    height: 0;
    border-left: 1px solid transparent;
    border-right: 12px solid transparent;
    border-bottom: 10px solid #da243a;
    top: -20px;
    float: left;
    left: 17px;
    position: relative
}

.rub-5 {
    width: 0;
    height: 0;
    border-left: 1px solid transparent;
    border-right: 12px solid transparent;
    border-bottom: 10px solid #da243a;
    top: -20px;
    float: left;
    left: 17px;
    position: relative
}

.lupa, .lupa-1 {
    width: 27px;
    height: 27px;
    float: right;
    background-repeat: no-repeat;
    border-radius: 5px;
    background-position: center;
    cursor: pointer
}

.lupa {
    background-image: url('../Content/Images/lupap.png');
    background-color: #b0001e
}

.lupa-1 {
    background-image: url('../Content/Images/lupa-1.png');
    background-color: #00818d
}

.znj {
    height: 100%;
    float: left;
    width: 40%;
    clear: both
}

div.cc {
    height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    background: url('../Content/Images/bg-right.png');
    background-size: cover;
    width: 60%;
    float: right;
    position: relative
}

div.cc-2 {
    height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    background: #00c5d7;
    background-size: cover;
    width: 100%;
    float: right
}

.add-new {
    text-align: center;
    color: #fff;
    padding-top: 20px;
    font-weight: 200
}

.close {
    background: url('../Content/Images/xx.png');
    width: 20px;
    height: 20px;
    float: right;
    background-repeat: no-repeat;
    cursor: pointer
}

.customer-result {
    position: absolute;
    width: 90%;
    border-radius: 9px;
    max-height: 350px;
    z-index: 110;
    left: 0;
    right: 0;
    margin: 4% auto
}

.rearch-res {
    float: left;
    background-repeat: no-repeat;
    padding-top: 2px;
    color: #fff
}

.close-2 {
    background: url('../Content/Images/xx.png');
    width: 20px;
    height: 20px;
    float: right;
    background-repeat: no-repeat;
    cursor: pointer
}

.u-name-1-big-1 {
    font-size: 13px;
    margin: 0;
    color: #fff;
    position: relative;
    right: 30px;
    font-weight: 400;
    margin-top: 12px;
    text-align: right;
    margin-bottom: 10px
}

.first-p {
    padding: 10px;
    background: #ce1b33;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px
}

.sen-n {
    margin: 0;
    font-size: 13px;
    font-weight: 400;
    word-wrap: break-word
}

.second-p {
    background: #da243a;
    padding: 10px;
    color: #fff;
    border-bottom: 1px solid #b60023
}

.third-p {
    background: #da243a;
    padding: 10px;
    color: #fff;
    border-bottom: 1px solid #d42338;
    display: flex
}

.cal-left.col-50 {
    position: relative;
    left: 20px
}

.medium-cola {
    height: auto;
    float: left;
    width: 100%;
    padding: 10px
}

.special-textarea {
    height: 40px;
    border-bottom: 1px solid #00a6b7;
    line-height: 74px;
    background: #00abbc;
    font-size: 25px;
    float: left;
    width: 100%
}

.medium-icon {
    background: #00b9ca
}

.order-remark {
    border-top: 1px solid #0792a2;
    padding-top: 10px;
    width: 100%
}

.cola-img {
    width: 25%;
    float: left;
    margin-left: 1%;
    background: #3bdbe6;
    padding: 10px 0;
    margin-right: 2%;
    text-align: center;
    border-radius: 10px;
    max-width: 200px;
    position: relative
}

    .cola-img img {
        max-width: 100%;
        min-width: 87px;
        text-align: center
    }

.cola-img1 {
    width: 25%;
    float: left;
    margin-left: 2%;
    background: #3bdbe6;
    padding: 10px 0;
    margin-right: 3%;
    text-align: center;
    border-radius: 10px;
    max-width: 200px
}

    .cola-img1 img {
        width: 0%;
        max-width: 210px;
        min-width: 130px;
        max-height: 126px
    }

.cola-img iframe {
    width: 87%
}

.special-textarea textarea {
    background-color: #3bdbe6;
    border: 0;
    width: 94%;
    height: 75%;
    min-height: 84px;
    margin-left: 3%;
    border-radius: 5px;
    background: #3bdbe6 url('../Content/Images/textarea.png');
    background-repeat: no-repeat;
    background-position: right bottom
}

.medium-text {
    width: 70%;
    float: left
}

.special-textarea h4 {
    margin: 0;
    margin-left: 25px;
    color: #fff;
    font-weight: 400;
    line-height: 40px
}

.special-textarea input {
    opacity: .5;
    background: none;
    border: none;
    text-align: right;
    float: right;
    line-height: 40px;
    font-size: larger;
    display: none;
    width: 40%;
    margin-right: 10px
}

.medium-text h2 {
    margin: 0;
    color: #fff;
    font-size: 17px
}

.medium-text p {
    margin: 0;
    color: #fff;
    font-size: 13px;
    line-height: 20px;
    font-weight: 200;
    margin-bottom: 15px
}

.quantity-cola {
    background: #078492;
    padding: 6px;
    line-height: 34px;
    border-radius: 5px;
    float: left;
    margin-top: 7px
}

    .quantity-cola img {
        position: relative;
        top: 5px;
        float: left;
        margin-left: 10px
    }

    .quantity-cola h4 {
        margin-left: 5px;
        font-weight: normal;
        margin-right: 20px;
        float: left;
        margin: 0;
        margin-top: 8px;
        color: #fff
    }

    .quantity-cola span {
        color: #fff
    }

    .quantity-cola > button {
        border: none;
        margin-top: 5px;
        margin-right: 15px;
        width: 28px;
        height: 28px;
        float: left;
        border-radius: 3px
    }

.quantity-cola1 {
    background: #078492;
    padding: 6px;
    line-height: 34px;
    border-radius: 5px;
    float: left
}

    .quantity-cola1 h4 {
        margin-left: 5px;
        font-weight: normal;
        margin-right: 20px;
        float: left;
        margin: 0;
        color: #fff;
        margin-left: 20px;
        margin-top: 6px
    }

    .quantity-cola1 img {
        position: relative;
        top: 5px;
        float: left;
        margin-left: 10px
    }

.medium-icon p {
    float: left;
    margin-right: 40px;
    text-align: center
}

    .medium-icon p i {
        font-size: 20px;
        width: 40px;
        height: 40px;
        line-height: 40px;
        text-align: center;
        background: #00919f;
        border-radius: 5px;
        color: #fff
    }

.medium-icon span {
    color: #fff;
    font-size: 10px
}

footer-left-text123 {
    float: left;
    text-align: center;
    width: 100%;
    font-family: helvetica;
    font-size: 11px
}

.add.col-16.all-bg {
    background-color: #39d7fc;
    margin: 0;
    height: 100%;
    line-height: 100px;
    text-align: center;
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer
}

    .add.col-16.all-bg i {
        font-size: 40px;
        margin-top: 20px;
        color: #008eb0;
        cursor: pointer
    }

        .add.col-16.all-bg i span {
            font-size: 13px
        }

.header-user h3 i {
    float: right;
    background: rgba(0,0,0,.36);
    width: 20px;
    height: 20px;
    text-align: center;
    line-height: 20px;
    border-radius: 5px;
    background: rgba(0,0,0,.26) url('../Content/Images/slika1.png');
    background-repeat: no-repeat;
    background-position: center
}

.header-user h3 .lupa-p {
    float: right;
    background: rgba(0,0,0,.36);
    width: 30px;
    height: 30px;
    text-align: center;
    line-height: 20px;
    border-radius: 5px;
    background: rgba(0,0,0,.26) url('../Content/Images/search1.png');
    background-repeat: no-repeat;
    background-position: center;
    margin-left: 10px;
    cursor: pointer
}

.header-user h3 .lupa-p-bp {
    float: right;
    background: rgba(0,0,0,.36);
    width: 30px;
    height: 30px;
    text-align: center;
    line-height: 20px;
    border-radius: 5px;
    background: rgba(0,0,0,.26) url('../Content/Images/add-customer.png');
    background-repeat: no-repeat;
    background-position: center;
    margin-left: 10px;
    cursor: pointer
}

.header-user h3 .lupa-p-ol {
    float: right;
    background: rgba(0,0,0,.36);
    width: 30px;
    height: 30px;
    text-align: center;
    line-height: 20px;
    border-radius: 5px;
    background: rgba(0,0,0,.26) url('../Content/Images/ol-order.png');
    background-repeat: no-repeat;
    background-position: center;
    margin-left: 10px;
    cursor: pointer
}

.open-balnce {
    float: left;
    margin-right: 30px;
    color: #fff;
    font-size: 13px
}

    .open-balnce.odvojiti {
        margin-left: 20px
    }

.medium-icon p i.fa.fa-usd.usd-b {
    background: #d8a746;
    width: 60px;
    height: 50px;
    line-height: 50px
}

.active-bg {
    background: #00c5d7
}

.up-class {
    width: 33.3333%
}

.arrow-back i {
    width: 40px;
    height: 40px;
    background: rgba(0,0,0,.21);
    color: #ccbfbf;
    border-radius: 5px;
    line-height: 30px;
    text-align: center;
    cursor: pointer;
    background: #5c4740 url('../Content/Images/slika2.png');
    background-repeat: no-repeat;
    background-position: center
}

.medium-icon p .usd-b {
    font-size: 20px;
    width: 50px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    border-radius: 5px;
    color: #fff;
    background: rgba(249,200,105,1) url('../Content/Images/slika3.png');
    background-repeat: no-repeat;
    background-position: center
}

.medium-icon p .slika3 {
    font-size: 20px;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    border-radius: 5px;
    color: #fff;
    background: rgba(3,141,157,1) url('../Content/Images/slika4.png');
    background-repeat: no-repeat;
    background-position: center
}

.medium-icon p .slika2 {
    font-size: 20px;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    border-radius: 5px;
    color: #fff;
    background: rgba(3,141,157,1) url('../Content/Images/slika5.png');
    background-repeat: no-repeat;
    background-position: center
}

.medium-icon p .slika1 {
    font-size: 20px;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    border-radius: 5px;
    color: #fff;
    background: rgba(3,141,157,1) url('../Content/Images/slika6.png');
    background-repeat: no-repeat;
    background-position: center
}

.TaxCombo {
    width: 50%;
    float: left;
    width: 50%;
    opacity: .8;
    display: block;
    height: 34px;
    padding: 1px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px
}

.popcashcount-fields {
    width: 33.333%;
    box-sizing: border-box;
    padding-right: 10px;
    float: left
}

    .popcashcount-fields label {
        width: 100%;
        color: #fff;
        font-weight: normal
    }

    .popcashcount-fields input {
        box-sizing: border-box;
        width: 100%
    }

.pos-SetModifireDiv {
    height: 50px;
    float: right
}

    .pos-SetModifireDiv h4, .pos-SetModifireDiv input {
        line-height: 50px
    }

.pos-ModifireUlWrap {
    float: left;
    width: 100%;
    box-sizing: border-box;
    margin-top: 10px;
    padding-left: 25px
}

    .pos-ModifireUlWrap li {
        margin-right: 10px;
        padding-top: 8px;
        min-width: 80px;
        border-radius: 4px;
        position: relative;
        text-align: center;
        color: #fff;
        vertical-align: middle;
        display: inline-block;
        font-size: 12px;
        margin-bottom: 10px
    }

        .pos-ModifireUlWrap li span {
            float: left;
            width: 100%;
            background: #3bdbe6;
            padding: 5px;
            min-height: 40px
        }

        .pos-ModifireUlWrap li span {
            float: left;
            width: 100%;
            background: #3bdbe6;
            padding: 5px;
            min-height: 40px;
            box-sizing: border-box
        }

span.pos-modifireQty {
}

span.pos-modifireQty {
    border-top: 1px solid #ddaf52;
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px
}

span.pos-modifireName {
    border-top-left-radius: 3px;
    border-top-right-radius: 3px
}

.pos-modifireBtn {
    display: inline-block;
    width: 28px;
    height: 28px;
    margin-top: 5px;
    cursor: pointer;
    border-radius: 3px
}

.pos-modiPlus {
    margin-left: 10px;
    background: url(../Content/Images/pos-plus-grid.png) no-repeat center #ddaf52
}

.pos-modiMinus {
    margin-right: 10px;
    background: url(../Content/Images/pos-minus-grid.png) no-repeat center #ddaf52
}

.pos-modifireQty input {
    float: left
}

.pos-modifireQtySpan {
    display: inline-block;
    width: auto;
    position: relative;
    top: -9px
}

.pos-modifireSelection {
    background: #f3bc4f !important
}

.payment-text-fields {
    text-align: left;
    position: relative;
    left: 40px;
    color: #fff;
    float: left;
    line-height: 32px;
    margin-right: 15px;
    margin-top: 5px
}

.amount_fields_left {
    width: 16%
}

.credit-card-field {
    width: 100%
}

.payment-method {
    float: left;
    position: relative;
    left: 40px;
    width: 95%;
    z-index: 1
}

    .payment-method > ul {
        margin: 0;
        padding: 0;
        list-style: none
    }

        .payment-method > ul > li {
            float: left;
            margin-right: 10px;
            line-height: 45px
        }

.card-btn {
    font-size: 16px;
    border-radius: 4px;
    background-color: #3bdbe6;
    position: relative;
    text-align: center;
    color: #fff;
    vertical-align: middle;
    display: table-cell;
    cursor: pointer;
    padding: 0 20px;
    margin-bottom: 10px
}

    .card-btn:hover {
        background: #f9c869
    }

.ticket-btn {
    font-size: 16px;
    border-radius: 4px;
    background-color: #3bdbe6;
    position: relative;
    text-align: center;
    color: #fff;
    vertical-align: middle;
    display: table-cell;
    cursor: pointer;
    padding-top: 0;
    padding-right: 20px;
    padding-bottom: 0;
    padding-left: 20px;
    margin-bottom: 10px;
    margin-right: 10px;
    float: left
}

    .ticket-btn:hover {
        background: #f9c869
    }

.uomconversions-btn {
    font-size: 16px;
    border-radius: 4px;
    background-color: #3bdbe6;
    position: relative;
    text-align: center;
    color: #fff;
    vertical-align: middle;
    display: table-cell;
    cursor: pointer;
    padding: 0 20px;
    margin-bottom: 10px
}

    .uomconversions-btn:hover {
        background: #f9c869
    }

.UOMConversions {
    float: left;
    width: 100%;
    padding-left: 15px;
    margin-top: 20px;
    padding-right: 15px;
    box-sizing: border-box
}

.payment-method-btn {
    float: right;
    margin-right: 20px
}

.payment-btns {
    border-radius: 3px;
    float: left;
    padding: 10px 15px;
    text-align: center;
    color: #fff;
    font-size: 15px;
    margin-top: 10px
}

    .payment-btns > span {
        margin-right: 10px
    }

.cancel-btn {
    background-color: #0a8b9b;
    margin-right: 20px;
    cursor: pointer
}

.cancel-btn-icon {
    background: url('../Content/Images/cross.PNG') no-repeat;
    width: 21px;
    height: 21px;
    float: left
}

.ok-btn {
    background-color: #f9c869;
    cursor: pointer
}

.ok-btn-icon {
    background: url('../Content/Images/icon_tick.png') no-repeat;
    width: 21px;
    height: 21px;
    float: left
}

.pos-CalculatorHeader {
    background-color: #079eb0;
    border-bottom: 1px solid #0a93a3;
    float: left;
    width: 100%;
    padding: 10px 0
}

.pos-CalculatorAmmount {
    float: left;
    width: 56%;
    margin-left: 4%
}

    .pos-CalculatorAmmount > label {
        color: #fff;
        font-size: 18px;
        margin-right: 15px
    }

    .pos-CalculatorAmmount > input {
        border-radius: 3px;
        padding: 10px;
        background: #aae0e7;
        border: none;
        color: #105c75;
        text-align: right;
        font-size: 18px;
        width: 55%
    }

.pos-VoucherCount {
    float: left;
    width: 100%
}

    .pos-VoucherCount > label {
        color: #fff;
        padding-left: 20px;
        font-weight: normal
    }

    .pos-VoucherCount > input {
        background: transparent;
        border: none;
        color: #fff;
        font-weight: 600
    }

.pos-CalculatorDoneBtn {
    float: left;
    margin-left: 20%
}

.Calculator-done {
    background: #eebc5b;
    color: #fff;
    font-size: 20px;
    padding: 10px 20px;
    border-radius: 3px;
    float: right
}

.pos-CalculatorWrap {
    width: 100%;
    float: left;
    overflow-y: scroll;
    height: 70%
}

.pos-CalculatorLeft {
    width: 45%;
    float: right;
    margin-left: 10px;
    height: calc(100% - 40px)
}

    .pos-CalculatorLeft .calculator, .pos-CalculatorRight .calculator {
        width: 100%;
        overflow: hidden;
        margin-top: 5px
    }

        .pos-CalculatorLeft .calculator .leftCC, .pos-CalculatorRight .calculator .left {
            background: #41dcee;
            border-radius: 3px;
            color: #fff !important;
            float: left;
            font-size: 30px;
            margin-bottom: 5px;
            margin-right: 10px;
            padding: 12px 0;
            text-align: center;
            width: 28%;
            cursor: pointer
        }

            .pos-CalculatorLeft .calculator .left:hover, .pos-CalculatorRight .calculator .left:hover, .clearBtn:hover {
                background: #eebc5b
            }

            .pos-CalculatorLeft .calculator .leftCC:hover, .pos-CalculatorRight .calculator .leftCC:hover, .clearBtn:hover {
                background: #eebc5b
            }

.pos-CalculatorRight {
    background: #18c0d4;
    border-radius: 3px;
    width: 28%;
    float: left;
    margin-top: 20px
}

    .pos-CalculatorRight .calculator .left {
        background: none repeat scroll 0% 0% #41dcee;
        width: 44.55%;
        font-size: 22px;
        padding: 16px 0
    }

    .pos-CalculatorRight .calculator .leftCC {
        background: none repeat scroll 0% 0% #41dcee;
        width: 44.55%;
        font-size: 22px;
        padding: 16px 0
    }

    .pos-CalculatorRight .calculator {
        margin-left: 8px
    }

.clearBtn {
    width: 93.55%;
    float: left;
    background: #41dcee;
    color: #fff;
    display: block;
    text-align: center;
    border-radius: 3px;
    padding: 20px 0;
    margin-bottom: 5px;
    font-size: 25px;
    cursor: pointer
}

.pos-denomination {
    float: left;
    background-color: #0b9bac;
    width: 50%;
    border-radius: 3px;
    height: 290px;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 10px;
    box-sizing: border-box
}

.pos-denomi-data {
    float: left;
    width: 100%
}

    .pos-denomi-data > ul {
        list-style: outside none none;
        margin: 0;
        padding: 0
    }

        .pos-denomi-data > ul > li {
            list-style: outside none none;
            float: left;
            width: 100%;
            margin-top: 10px
        }

.pos-denomi-list {
    list-style: outside none none;
    float: left;
    width: 100%;
    margin-top: 10px
}

    .pos-denomi-list > label {
        float: left;
        font-weight: normal;
        color: #fff;
        font-size: 16px;
        margin-right: 0;
        line-height: 27px;
        width: 56px;
        text-align: right;
        margin-top: 6px
    }

    .pos-denomi-list > input {
        float: left;
        border: none;
        width: calc(100% - 70px);
        width: -moz-calc(100% - 70px);
        width: -webkit-calc(100% - 70px);
        border-radius: 3px;
        padding: 6px 6px;
        text-align: right;
        background: #aae0e7;
        color: #105c75;
        font-size: 18px
    }

.pos-CashPayInputWrap {
    float: left;
    width: 60%;
    box-sizing: border-box;
    padding-right: 10px
}

.CPayText {
    background: none repeat scroll 0 0 #abe6ed;
    border: medium none;
    border-radius: 3px;
    color: #105c75;
    float: left;
    font-size: 15px;
    padding: 6px 15px;
    position: relative;
    text-align: right;
    width: 32%;
    z-index: 2;
    margin: 5px 0 0 0;
    box-sizing: border-box
}

.pos-CashPayInputWrap .CPayText {
    width: calc(100% - 34px)
}

.DenomBtn {
    width: 30.55%;
    float: left;
    background: #0a8b9b;
    color: #fff;
    display: block;
    text-align: center;
    border-radius: 3px;
    padding: 4px 0;
    margin-bottom: 5px;
    font-size: 21px;
    cursor: pointer
}

    .DenomBtn:hover {
        background: #eebc5b
    }

.DenomMinusBtn {
    cursor: pointer;
    display: block;
    border: none;
    height: 33px;
    float: left;
    background-repeat: no-repeat;
    width: 33px;
    background: url('../Content/Images/pos-minus.png') no-repeat center
}

.pos-denomiPay-list {
    list-style: outside none none;
    float: left;
    width: 100%;
    margin-top: 10px
}

    .pos-denomiPay-list > label {
        float: left;
        font-weight: normal;
        color: #fff;
        font-size: 16px;
        margin-right: 0;
        line-height: 27px;
        width: 56px;
        text-align: right;
        margin-top: 6px
    }

.pos-DenomiPayInputs {
    width: calc(100% - 34px);
    width: -moz-calc(100% - 34px);
    width: -webkit-calc(100% - 34px);
    float: left
}

.pos-denomiPay-list input {
    float: left;
    border: none;
    width: 47%;
    border-radius: 3px;
    padding: 4px 0;
    text-align: right;
    background: #aae0e7;
    color: #105c75;
    font-size: 18px;
    margin-right: 5px
}

.DenomiOk-btn {
    color: #fff;
    border-radius: 3px;
    padding: 10px 15px;
    display: inline-block;
    margin-bottom: 0;
    font-weight: 400;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    background-image: none;
    border: 1px solid transparent;
    white-space: nowrap;
    padding: 6px 24px 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    border-radius: 4px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.DenomCashCancel {
    background: url("../Content/Images/cross.PNG") no-repeat scroll 12px 8px #0a8b9b
}

.CashPayCal {
    background: none repeat scroll 0 0 #1794a3;
    border-radius: 5px;
    padding: 0 3px 3px 3px;
    position: absolute;
    width: 23%;
    z-index: 1
}

    .CashPayCal .line {
        width: 96%;
        border-top: 1px solid #27adbd;
        margin: 52px 0 5px
    }

    .CashPayCal .calculator {
        width: 100%;
        overflow: hidden;
        margin-top: 5px
    }

        .CashPayCal .calculator .left {
            background: none repeat scroll 0 0 #41dcee;
            border-radius: 3px;
            color: #fff !important;
            float: left;
            font-size: 23px;
            margin-bottom: 2px;
            margin-right: 5px;
            padding: 8px 0;
            text-align: center;
            width: 30%;
            margin-left: 3px
        }

            .CashPayCal .calculator .left:hover {
                background: #eebc5b;
                cursor: pointer
            }

            .CashPayCal .calculator .left:nth-child(3) {
                margin-right: 0
            }

.AddExtraItemCal {
    background: none repeat scroll 0 0 #1794a3;
    border-radius: 5px;
    padding: 0 5px 3px 3px;
    position: absolute;
    width: 50%;
    z-index: 1;
    margin-left: 102px;
    margin-top: -4px
}

    .AddExtraItemCal .line {
        width: 96%;
        border-top: 1px solid #27adbd;
        margin: 40px 0 5px
    }

    .AddExtraItemCal .calculator {
        width: 100%;
        overflow: hidden;
        margin-top: 5px
    }

        .AddExtraItemCal .calculator .left {
            background: none repeat scroll 0 0 #41dcee;
            border-radius: 3px;
            color: #fff !important;
            float: left;
            font-size: 23px;
            margin-bottom: 2px;
            margin-right: 5px;
            padding: 8px 0;
            text-align: center;
            width: 30%;
            margin-left: 3px
        }

            .AddExtraItemCal .calculator .left:hover {
                background: #eebc5b;
                cursor: pointer
            }

            .AddExtraItemCal .calculator .left:nth-child(3) {
                margin-right: 0
            }

.searchinputpanel_img {
    background-image: url("../Content/Images/down-keypan.png");
    float: left;
    height: 28px;
    margin-left: 7px;
    margin-top: 3px;
    overflow: hidden;
    position: relative;
    width: 22px;
    z-index: 100 !important;
    cursor: pointer
}

    .searchinputpanel_img.active {
        background-image: url("../Content/Images/up-keypan.png")
    }

.searchInputPanel {
    background: none repeat scroll 0 0 #594841;
    border-radius: 5px;
    padding: 10px 0 0 4px;
    position: absolute;
    width: 74%;
    height: 264px;
    z-index: 1;
    margin-left: 50px;
    margin-top: -5px
}

    .searchInputPanel .line {
        width: 98%;
        border-top: 1px solid #d7c8c0;
        margin: 40px 0 5px
    }

    .searchInputPanel .searchIP {
        width: 100%;
        overflow: hidden;
        margin-top: 5px
    }

        .searchInputPanel .searchIP .left {
            background: none repeat scroll 0 0 #a9938e;
            border-radius: 3px;
            color: #fff !important;
            float: left;
            font-size: 23px;
            margin-bottom: 1px;
            margin-right: 2px;
            padding: 8px 0;
            text-align: center;
            width: 31%;
            margin-left: 4px;
            cursor: pointer
        }

.CashClearButton {
    background: url("../Content/Images/cross.PNG") no-repeat scroll 12px 8px #0a8b9b;
    border-radius: 3px;
    float: left;
    padding: 8px 10px 7px 35px;
    text-align: center;
    width: 15%;
    color: #fff;
    font-size: 15px;
    margin-left: 68%;
    margin-top: 10px;
    cursor: pointer
}

.dailyReportCal {
    background: none repeat scroll 0 0 #1794a3;
    border-radius: 5px;
    padding: 0 5px 3px 3px;
    position: absolute;
    width: 63%;
    z-index: 1;
    margin-left: 92px;
    margin-top: -4px
}

    .dailyReportCal .line {
        width: 96%;
        border-top: 1px solid #27adbd;
        margin: 40px 0 5px
    }

    .dailyReportCal .calculator {
        width: 100%;
        overflow: hidden;
        margin-top: 5px
    }

        .dailyReportCal .calculator .left {
            background: none repeat scroll 0 0 #41dcee;
            border-radius: 3px;
            color: #fff !important;
            float: left;
            font-size: 23px;
            margin-bottom: 2px;
            margin-right: 5px;
            padding: 8px 0;
            text-align: center;
            width: 30%;
            margin-left: 3px
        }

            .dailyReportCal .calculator .left:hover {
                background: #eebc5b;
                cursor: pointer
            }

            .dailyReportCal .calculator .left:nth-child(3) {
                margin-right: 0
            }

.ProductWeightCal {
    background: none repeat scroll 0 0 #1794a3;
    border-radius: 5px;
    padding: 0 5px 3px 3px;
    position: absolute;
    width: 63%;
    z-index: 1;
    margin-left: 92px;
    margin-top: -4px
}

    .ProductWeightCal .line {
        width: 96%;
        border-top: 1px solid #27adbd;
        margin: 40px 0 5px
    }

    .ProductWeightCal .calculator {
        width: 100%;
        overflow: hidden;
        margin-top: 5px
    }

        .ProductWeightCal .calculator .left {
            background: none repeat scroll 0 0 #41dcee;
            border-radius: 3px;
            color: #fff !important;
            float: left;
            font-size: 23px;
            margin-bottom: 2px;
            margin-right: 5px;
            padding: 8px 0;
            text-align: center;
            width: 30%;
            margin-left: 3px
        }

            .ProductWeightCal .calculator .left:hover {
                background: #eebc5b;
                cursor: pointer
            }

            .ProductWeightCal .calculator .left:nth-child(3) {
                margin-right: 0
            }

.ProductPriceCal {
    background: none repeat scroll 0 0 #1794a3;
    border-radius: 5px;
    padding: 0 5px 3px 3px;
    position: absolute;
    width: 63%;
    z-index: 1;
    margin-left: 92px;
    margin-top: -4px
}

    .ProductPriceCal .line {
        width: 96%;
        border-top: 1px solid #27adbd;
        margin: 40px 0 5px
    }

    .ProductPriceCal .calculator {
        width: 100%;
        overflow: hidden;
        margin-top: 5px
    }

        .ProductPriceCal .calculator .left {
            background: none repeat scroll 0 0 #41dcee;
            border-radius: 3px;
            color: #fff !important;
            float: left;
            font-size: 23px;
            margin-bottom: 2px;
            margin-right: 5px;
            padding: 8px 0;
            text-align: center;
            width: 30%;
            margin-left: 3px
        }

            .ProductPriceCal .calculator .left:hover {
                background: #eebc5b;
                cursor: pointer
            }

            .ProductPriceCal .calculator .left:nth-child(3) {
                margin-right: 0
            }

.pos-formCB-right, .pos-formCB {
    border: 1px solid #41dcee;
    width: 60%;
    float: left;
    border-radius: 3px;
    background-color: #fff;
    height: 34px;
    box-sizing: border-box
}

    .pos-formCB select {
        background: #abe6ed;
        height: 32px;
        width: 100% !important;
        padding-left: 10px;
        outline: none
    }

.filter-icon {
    position: absolute;
    bottom: 5px;
    right: 4px;
    width: 22px;
    height: 22px;
    float: right;
    background: url("../Content/Images/filter.png") no-repeat
}

.cls_input {
    background: none;
    width: 100%;
    border: none;
    color: #4d3b04;
    font-size: 13px;
    font-weight: 400;
    position: relative;
    left: 5px;
    z-index: 1
}

input[readonly=y] ::-webkit-outer-spin-button, input[readonly=y]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0
}

input[readonly=y] {
    -moz-appearance: textfield
}

.cls_input_white {
    background: none;
    width: 100%;
    border: none;
    color: #fff;
    font-size: 13px;
    font-weight: 400;
    position: relative;
    text-align: center;
    left: 5px;
    z-index: 1
}

.cls_input_grey {
    background: none;
    width: 100%;
    border: none;
    color: #ceeff3;
    font-size: 13px;
    font-weight: 400;
    position: relative;
    text-align: center;
    left: 5px;
    z-index: 1
}

.cls_input_descQty {
    background: none;
    width: 100%;
    border: none;
    color: #fff;
    font-size: 13px;
    font-weight: 400;
    position: relative;
    text-align: center;
    left: 5px;
    z-index: 1
}

.cls_input_big {
    background: none;
    width: 100%;
    border: none;
    font-size: 30px;
    margin: 0;
    color: #006570;
    position: relative;
    font-weight: 400;
    text-align: right;
    -webkit-appearance: none
}

.pos-PopuptopDoctypeCloseIconTop {
    width: 50px;
    height: 50px;
    float: right;
    background: url(../Content/Images/DocClose.png);
    background-repeat: no-repeat;
    margin-top: -18px;
    margin-right: -26px;
    cursor: pointer
}

.blue-bg {
    background: #41dcee
}

.yellow-bg {
    background: #e5b628
}

.red-bg {
    background: #d04
}

.table-container {
    float: left;
    width: 100vw;
    height: 100%
}

.header-menu {
    width: 40%;
    height: 11%;
    position: relative
}

.btn-search {
    background: url('../Content/Images/search.png') center;
    width: 40px;
    height: 40px;
    background-repeat: no-repeat;
    float: left;
    cursor: pointer;
    margin-left: 10px;
    border-radius: 5px
}

.product-search {
    background: #0ab;
    position: absolute;
    margin-top: 3%;
    width: 52%;
    padding: 10px;
    border-radius: 9px;
    z-index: 105;
    right: 2%;
    margin-left: 1%
}

.search-product {
    font-size: 15px;
    color: #fff;
    margin: 0;
    position: relative;
    left: -12px;
    margin-bottom: 5px;
    width: 90%
}

div.rub-p {
    width: 0;
    height: 0;
    border-left: 12px solid transparent;
    border-right: 2px solid transparent;
    border-bottom: 10px solid #0ab;
    top: -20px;
    float: right;
    left: -31px;
    position: relative
}

div.rub-4 {
    width: 0;
    height: 0;
    border-left: 12px solid transparent;
    border-right: 2px solid transparent;
    border-bottom: 10px solid #0ab;
    top: -20px;
    float: right;
    left: -31px;
    position: relative
}

.close-p {
    background: url('../Content/Images/close-ico.png');
    width: 30px;
    height: 30px;
    float: right;
    background-repeat: no-repeat;
    cursor: pointer;
    position: relative;
    right: -14px;
    top: -6px
}

.product-result {
    position: absolute;
    width: 100%;
    max-height: 280px;
    overflow-y: auto;
    z-index: 9;
    cursor: pointer
}

.first-pp {
    padding: 10px;
    background: #07909f;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px
}

.close-22 {
    background: url('../Content/Images/closeiconB.png');
    width: 40px;
    height: 40px;
    float: right;
    background-repeat: no-repeat;
    cursor: pointer;
    margin-top: -30px;
    margin-right: -30px
}

.rearch-res-2 {
    float: left;
    background-repeat: no-repeat;
    padding-top: 2px;
    color: #fff
}

.second-pp {
    background: #0ab;
    padding: 10px;
    color: #fff;
    border-bottom: 1px solid #008f9c
}

.third-pp {
    background: #0ab;
    padding: 10px;
    color: #fff;
    border-bottom: 1px solid #008f9c
}

.third-pp-PlusImg, .third-pp-MinusImg {
    width: 30px;
    height: 30px;
    float: left;
    margin: 0 0 0 5px;
    border-radius: 4px
}

.third-pp-PlusImg {
    background: url('../Content/Images/pos-plus.png') #64cbdb no-repeat center
}

.third-pp-MinusImg {
    background: url('../Content/Images/pos-minus.png') #64cbdb no-repeat center
}

.prdDes-sea-p-detail {
    width: 79%;
    margin-left: 8%;
    background: #0094a1;
    float: left
}

.prdDes-detail-heading {
    width: 100%;
    float: left;
    background: #41dcee
}

.prdDes-detail-value {
    width: 100%;
    float: left;
    border-top: 1px solid #0ab;
    border-bottom: 1px solid #0ab
}

    .prdDes-detail-value > h3 {
        width: 20%;
        float: left;
        font-size: 13px
    }

h3.prdDes-desc-head {
    width: 47%;
    padding-left: 15px;
    font-size: 14px;
    float: left
}

h3.prdDes-detail-value {
    width: 10%;
    float: left;
    font-size: 13px
}

h3.prdDes-detail-head {
    float: left;
    width: 15%;
    font-size: 13px
}

h3.prdDes-ware-head {
    float: left;
    width: 20%;
    font-size: 13px
}

h3.prdDes-desc-47 {
    width: 47%;
    padding-left: 15px;
    font-size: 14px;
    float: left
}

h3.prdDes-detail-15 {
    float: left;
    width: 15%;
    font-size: 13px
}

h3.prdDes-ware-20 {
    float: left;
    width: 20%;
    font-size: 13px
}

.order-left span {
    font-weight: 600;
    font-family: 'source_sans_probold'
}

.roww {
    float: left;
    cursor: pointer;
    margin-right: 10px
}

.tt {
    float: left;
    cursor: pointer;
    margin-right: 9px
}

.ppt {
    height: 72%;
    overflow-y: auto;
    overflow-x: hidden;
    background: #f3bc4f;
    float: left;
    width: 99.5%
}

.con {
    width: 105px
}

.left-name-1:hover {
    background: #00c5d7
}

.pic {
    background: url('../Content/Images/pos-minus-grid.png') #ddaf52 center;
    width: 25px;
    height: 25px;
    float: left;
    background-repeat: no-repeat;
    position: relative;
    margin-left: -15px;
    cursor: pointer;
    border-radius: 3px
}

.pi {
    background: url('../Content/Images/pos-plus-grid.png') #ddaf52 center;
    width: 25px;
    height: 25px;
    background-repeat: no-repeat;
    margin-left: 2px;
    float: right;
    cursor: pointer;
    border-radius: 3px;
    position: absolute;
    right: -1px;
    z-index: 2
}

.numberr {
    float: left;
    width: 49%
}

    .numberr input {
        left: 0
    }

.head-content {
    width: 100%;
    height: 70%
}

.head-footer {
    float: left;
    width: 100%;
    height: 14%;
    position: relative;
    z-index: 2
}

.header-user {
    margin-top: 3%
}

.order-margin {
    margin-top: 5px
}

.disc-icon {
    background: url('../Content/Images/discount-icon.png');
    float: left;
    text-align: center;
    border-radius: 5px;
    margin-left: -30px;
    cursor: pointer;
    z-index: 2;
    position: relative;
    padding-left: 0;
    background: none;
    font-size: 20px
}

.trash-icon, .menu-icon {
    float: left;
    text-align: center;
    max-height: 40px;
    max-width: 40px;
    min-width: 35px;
    min-height: 35px;
    border-radius: 5px;
    margin-top: 9px;
    margin-left: 4px
}

.pos-stock-icon {
    position: absolute;
    z-index: 2;
    background: #b9aca8;
    padding: 4px;
    cursor: pointer;
    width: 32px;
    box-sizing: border-box;
    height: 32px;
    text-align: center;
    left: -8px;
    top: -18px;
    border-radius: 18px
}

    .pos-stock-icon img {
        max-width: 100%;
        max-height: 100%
    }

.trash-icon img {
}

.menu-icon img {
    margin-top: -1px
}

.POS-offerproWrap {
    float: left;
    width: 100%;
    overflow: auto;
    height: auto;
    border-top: 1px solid #00d2e5
}

.medium-icon {
    padding-top: 10px;
    padding-right: 10px;
    padding-left: 10px
}

.chocolate-ferrero {
    background: #3bdbe6;
    border-radius: 5px;
    padding: 15px;
    float: left;
    max-width: 250px;
    max-height: 126px
}

.chocolate-heading img {
}

.chocolate-heading h2 {
    font-size: 13px;
    color: #fff
}

.chocolate-content {
    clear: both
}

    .chocolate-content p {
        width: 100%;
        text-align: left;
        margin: 0;
        border-top: 1px solid #fff;
        padding-top: 10px;
        padding-bottom: 5px
    }

.chocolate-content-2 .product-qty {
    float: left;
    padding-bottom: 5px
}

.product-qty.product-q1 {
    float: right
}

.chocolate-content {
    font-size: 13px;
    color: #fff
}

.slika-tekst {
    margin: auto
}

    .slika-tekst img {
        float: left
    }

    .slika-tekst h2 {
        float: left
    }

.mini-footer {
    height: 34.9%;
    width: 100%;
    background: #ff4e5d;
    border-top: 1px solid;
    clear: both;
    position: relative;
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    color: #fff
}

.mini-footer-left p {
    margin: 0
}

.mini-footer-left {
    padding-left: 10px;
    overflow-x: auto;
    overflow-y: hidden;
    max-height: 30px;
    white-space: nowrap;
    flex: 1;
    display: flex;
    align-items: center
}

    .mini-footer-left p {
        margin-right: 20px;
        color: #fff;
        font-size: 13px;
        line-height: 30px;
        display: inline-block
    }

.mini-footer-right {
    float: right;
    color: #fff;
    line-height: 30px;
    font-size: 20px;
    margin-top: 0
}

.slika-tekst h2 {
    padding-left: 10px
}

.orderMarginBottom {
    margin-bottom: 5px;
    background-color: #f3bc4f;
    width: 100%;
    border-top: 1px solid #ffd478;
    border-bottom: 1px solid #d7a237;
    height: 20%
}

.web_dialog_overlay1 {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    height: 100%;
    width: 100%;
    margin: 0;
    padding: 0;
    background: #000;
    opacity: .15;
    filter: alpha(opacity=15);
    -moz-opacity: .15;
    z-index: 101;
    display: none
}

.web_dialog1 {
    display: none;
    position: fixed;
    width: 380px;
    height: 200px;
    top: 50%;
    left: 50%;
    margin-left: -190px;
    margin-top: -100px;
    background-color: #fff;
    border: 2px solid #369;
    padding: 0;
    z-index: 102;
    font-family: Verdana;
    font-size: 10pt
}

.web_dialog_overlay {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    height: 100%;
    width: 100%;
    margin: 0;
    padding: 0;
    background: #000;
    opacity: .15;
    filter: alpha(opacity=15);
    -moz-opacity: .15;
    z-index: 101;
    display: none
}

.web_dialog {
    display: none;
    position: fixed;
    width: 380px;
    height: 200px;
    top: 50%;
    left: 50%;
    margin-left: -190px;
    margin-top: -100px;
    background-color: #fff;
    border: 2px solid #369;
    padding: 0;
    z-index: 102;
    font-family: Verdana;
    font-size: 10pt
}

.web_dialog_title {
    border-bottom: solid 2px #369;
    background-color: #369;
    padding: 4px;
    color: #fff;
    font-weight: bold
}

    .web_dialog_title a {
        color: #fff;
        text-decoration: none
    }

.align_right {
    text-align: right
}

.rsload {
    width: 100%;
    height: 100%;
    position: fixed;
    z-index: 10000000;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto
}

.busy_indicator {
    position: fixed;
    width: 42px;
    height: 42px;
    top: 50%;
    left: 50%;
    background-color: #fff;
    background: url('../Content/Images/ajax-loader.gif');
    padding: 0;
    z-index: 110;
    font-family: Verdana;
    font-size: 10pt
}

.busy_indicator1 {
    position: fixed;
    width: 42px;
    height: 42px;
    top: 50%;
    left: 50%;
    background-color: #fff;
    background: url('../Content/Images/ajax-loader.gif');
    padding: 0;
    z-index: 110;
    font-family: Verdana;
    font-size: 10pt
}

.loginForm {
    position: fixed;
    top: 36%;
    left: 38%;
    padding: 0;
    z-index: 102;
    font-family: Verdana;
    font-size: 10pt
}

.potato-bg-Test {
    background: #00c5d6;
    text-align: center;
    padding-top: 5px;
    padding-bottom: 5px;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    min-height: 15px
}

    .potato-bg-Test span {
        color: #fff
    }

.customer-result1 {
    position: absolute;
    margin-top: 0%;
    width: 100%;
    max-height: 308px;
    overflow-y: auto;
    z-index: 110;
    cursor: pointer
}

.product-result-header {
    position: absolute;
    margin-top: 4%;
    width: 52%;
    border-radius: 9px;
    max-height: 270px;
    z-index: 101;
    right: 20px
}

.loginbutton {
    background-color: rgba(0,0,0,.17);
    padding: 7px 26px;
    border-radius: 9px;
    font-size: 16px;
    cursor: pointer;
    font-family: helvetica;
    position: relative;
    left: 100%
}

.pos-PopupWrap, .pos-PopupWrapHold, .pos-PopupWraptaxCashCount, .pos-PopupWraptax, .pos-PopupWrapSRep, .pos-mstrPopupWrap, .pos-PopupWrapDiscountLine, .pos-PopupDayEnd {
    margin: auto;
    width: 90%;
    left: 0;
    right: 0;
    z-index: 105;
    position: fixed;
    box-sizing: border-box;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

.pos-DayEndBtn, .pos-ShiftDayEndBtn {
    color: #fff;
    font-size: 14px;
    border-radius: 4px;
    background-color: #3bdbe6;
    position: relative;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    margin-bottom: 10px;
    width: 48%;
    word-wrap: break-word;
    white-space: normal;
    min-height: 54px;
    line-height: normal;
    display: flex;
    align-items: center;
    text-align: center;
    float: left
}

    .pos-DayEndBtn:hover, .pos-ShiftDayEndBtn:hover {
        text-decoration: none;
        color: #fff
    }

    .pos-DayEndBtn span, .pos-ShiftDayEndBtn span {
        width: 100%
    }

.pos-PopupDayEnd {
    max-width: 400px;
    max-height: inherit
}

.pos-ShiftDayEndBtn {
    margin-left: 12px
}

div#POS_DayEndShifts {
    float: left;
    width: 100%
}

.pos-DayEndShiftWrap ul {
    float: left;
    width: 100%;
    list-style: none;
    padding: 0
}

    .pos-DayEndShiftWrap ul input {
        float: left;
        margin-right: 5px;
        margin-top: 3px
    }

.pos-cd-popupwrap {
    max-width: 500px;
    width: 90%;
    left: 0;
    right: 0;
    z-index: 105;
    position: fixed;
    box-sizing: border-box
}

.pos-PopupWrapSRep {
    max-width: 389px
}

.pos-PopupWraptax {
    max-width: 390px
}

.pos-PopupWrap {
    max-width: 346px
}

.pos-PopupWrapHold {
    max-width: 650px
}

.pos-PopupWraptaxCashCount {
    max-width: 600px
}

.pos-PopupWraptaxAddCustomer {
    margin: 6% auto 4% 10px;
    width: 37%;
    top: 0;
    left: 0;
    right: 0;
    z-index: 109;
    position: fixed;
    box-sizing: border-box;
    height: 72%
}

.pos-PopupWraplogin {
    margin: auto;
    width: 346px;
    top: 0;
    left: 0;
    right: 0;
    z-index: 102;
    position: fixed;
    height: 171px;
    box-sizing: border-box;
    bottom: 0
}

.pos-PopupWrapDevice {
    margin-left: -190px;
    z-index: 102;
    position: fixed;
    box-sizing: border-box
}

.pos-PopupHeader {
    float: left;
    width: 100%;
    background: #07909f;
    border-bottom: 1px solid #047784;
    border-top-left-radius: 7px;
    border-top-right-radius: 7px
}

    .pos-PopupHeader > h4 {
        float: left;
        color: #d9f1f4;
        padding: 0;
        margin: 0;
        padding: 10px 15px;
        font-size: 15px;
        font-family: inherit;
        font-weight: 500;
        line-height: 1.1
    }

.pos-PopupHeaderTL {
    float: left;
    width: 100%;
    background: rgba(3,100,111,1);
    border-bottom: 1px solid #047784;
    border-top-left-radius: 7px;
    border-top-right-radius: 7px
}

    .pos-PopupHeaderTL > h4 {
        float: left;
        color: #d9f1f4;
        padding: 0;
        margin: 0;
        padding: 15px 15px;
        font-size: 15px;
        font-family: inherit;
        font-weight: 500;
        line-height: 1.1
    }

.pos-PopupTableContentTL {
}

.pos-PopuptopCloseIcon {
    width: 19px;
    height: 19px;
    float: right;
    background: url(../Content/Images/closeIcon.png);
    background-repeat: no-repeat;
    margin-top: 10px;
    margin-right: 10px;
    cursor: pointer
}

.pos-PopuptopCloseIconTop {
    width: 50px;
    height: 50px;
    float: right;
    background: url(../Content/Images/closeiconB.png);
    background-repeat: no-repeat;
    margin-top: -18px;
    margin-right: -26px;
    cursor: pointer
}

.pos-PopuptopCloseIconTopTL {
    width: 50px;
    height: 50px;
    float: right;
    background: url(../Content/Images/close-1.png);
    background-repeat: no-repeat;
    margin-top: -18px;
    margin-right: -26px;
    cursor: pointer
}

.pos-PopupHeaderDevice {
    float: left;
    width: 100%;
    background: #eebc5b;
    border-bottom: 1px solid #047784;
    border-top-left-radius: 7px;
    border-top-right-radius: 7px
}

    .pos-PopupHeaderDevice > h4 {
        float: left;
        color: #d9f1f4;
        padding: 0;
        margin: 0;
        padding: 15px 15px;
        font-size: 15px;
        font-family: inherit;
        font-weight: 500;
        line-height: 1.1
    }

.pos-PopuptopCloseIconDevice {
    width: 19px;
    height: 19px;
    float: right;
    background: url(../Content/Images/CloseIconPopup.png);
    background-repeat: no-repeat;
    margin-top: 2px;
    margin-right: 10px;
    cursor: pointer
}

.pos-PopupContent {
    background: #05a6b8;
    float: left;
    width: 100%;
    padding: 15px;
    border-bottom-left-radius: 7px;
    border-bottom-right-radius: 7px;
    box-sizing: border-box;
    height: 100%;
    position: relative;
    height: calc(100% - 40px)
}

.pos-PopupInput {
    float: left;
    width: 100%;
    margin-bottom: 15px
}

    .pos-PopupInput > label {
        float: left;
        width: 40%;
        color: #fff;
        margin-top: 1px;
        font-weight: normal;
        font-size: 13px;
        display: inline-block;
        margin-bottom: 5px
    }

    .pos-PopupInput > input:not([type="checkbox"]) {
        float: left;
        width: 60%;
        color: #105c75;
        opacity: .8;
        display: block;
        height: 34px;
        padding: 1px 12px;
        font-size: 14px;
        line-height: 1.42857143;
        color: #555;
        background-color: #fff;
        background-image: none;
        border: 1px solid #ccc;
        border-radius: 4px;
        -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
        box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
        -webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
        transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
        font: inherit;
        margin: 0;
        box-sizing: border-box
    }

    .pos-PopupInput > input[type="checkbox"] {
        float: left;
        margin-right: 10px
    }

.CUS-pos-PopupWrap .pos-PopupInput > label {
    width: 100%
}

.pos-Input::-webkit-input-placeholder {
    color: #105c75 !important;
    font-size: 14px
}

.pos-Input::-moz-placeholder {
    color: #105c75 !important;
    font-size: 14px
}

.pos-Input:-moz-placeholder {
    color: #105c75 !important;
    font-size: 14px
}

.pos-Input:-ms-input-placeholder {
    color: #105c75 !important;
    font-size: 14px
}

.pos-InputPrice::-webkit-input-placeholder {
    font-size: 14px;
    font-weight: bold
}

.pos-InputPrice::-moz-placeholder {
    font-size: 14px;
    font-weight: bold
}

.pos-InputPrice:-moz-placeholder {
    font-size: 14px;
    font-weight: bold
}

.pos-InputPrice:-ms-input-placeholder {
    font-size: 14px;
    font-weight: bold
}

.pos-PopupInputAddCustomer::-webkit-input-placeholder {
    color: #105c75 !important
}

.pos-PopupInputAddCustomer::-moz-placeholder {
    color: #105c75 !important
}

.pos-PopupInputAddCustomer:-moz-placeholder {
    color: #105c75 !important
}

.pos-PopupAddIcon {
    background: url(../Content/Images/addIcon.png);
    background-repeat: no-repeat;
    margin-right: 5px
}

.pos-PupupSelectIcon {
    background: url(../Content/Images/tick-icon.png);
    background-repeat: no-repeat;
    margin-right: 5px
}

.pos-PopupLogoutAccessIcon {
    background: url(../Content/Images/logoutAccess.png);
    background-repeat: no-repeat;
    margin-right: 5px
}

.pos-PopupDenomIcon {
    background: url(../Content/Images/denomination.png);
    background-repeat: no-repeat;
    margin-right: 3px
}

.pos-PopupInput > input:focus {
    box-shadow: none;
    border: 1px solid #047784
}

.posPrintHistoryBtnImage {
    background: url('../Content/Images/printHist.png') no-repeat;
    margin-right: 5px
}

.salesrep-box {
    overflow-y: auto;
    padding: 5px;
    position: relative;
    padding-bottom: 25px;
    padding-top: 25px
}

.pos-PopupWrapDocType {
    margin: 10% auto;
    width: 260px;
    left: 20%;
    z-index: 102;
    position: absolute;
    box-sizing: border-box
}

.pos-PopupWrapUtilityType {
    margin: 4% auto;
    max-width: 432px;
    left: 41%;
    z-index: 102;
    position: absolute;
    box-sizing: border-box
}

.pos-PopupTableContentUtilityType {
    background: #1794a3;
    float: right;
    width: 100%;
    border-radius: 7px;
    margin-top: 2%;
    padding: 10px 10px
}

.pos-PopuptopUtilityCloseIconTop {
    width: 50px;
    height: 50px;
    float: right;
    background: url(../Content/Images/closee.png);
    background-repeat: no-repeat;
    margin-top: -18px;
    margin-right: -26px;
    cursor: pointer
}

.pos-PopupTableContentDocType {
    background: #f3bc4f;
    float: left;
    width: 100%;
    border-radius: 7px;
    height: 76px
}

.pos-PopupTableContent {
    background: #05a6b8;
    float: left;
    width: 100%;
    border-bottom-left-radius: 7px;
    border-bottom-right-radius: 7px;
    padding-bottom: 10px
}

.pos-PopupDriveInTableContent {
    background: #05a6b8;
    float: left;
    width: 100%;
    border-bottom-left-radius: 7px;
    border-bottom-right-radius: 7px;
    padding-bottom: 10px
}

.pos-TaxTable {
    width: 99%;
    background-color: transparent;
    border-collapse: collapse;
    border-spacing: 0
}

.pos-TaxTableHead {
    background: #09b3c6;
    width: 100%;
    float: left;
    white-space: nowrap;
    display: flex;
    justify-content: space-between;
    position: relative;
    z-index: 1;
    box-sizing: border-box
}

.pos-TaxTableRow > td {
    text-align: center;
    padding: 10px 0;
    width: 50%
}

.pos-TaxTableHead > p, .pos-TaxTablefooter > p {
    color: #035862;
    font-weight: 400
}

.pos-TaxTableHead > p {
    font-size: 14px
}

.pos-TaxTablefooter > p {
    font-size: 17px;
    background: #09b3c6
}

.pos-TaxTablefooterLeft {
    border-bottom-left-radius: 7px
}

.pos-TaxTablefooterRight {
    border-bottom-right-radius: 7px
}

.pos-TaxTableRow > td {
    font-size: 13px;
    color: #ceeff3
}

.pos-TaxTableHead > p, .pos-TaxTablefooter > p {
    text-align: left;
    padding: 0 10px;
    box-sizing: border-box;
    max-width: 185px;
    min-width: 60px;
    background: #09b3c6;
    margin: 0;
    padding: 10px
}

#POS_TaxDetails .pos-TaxTableHead > p, #POS_TaxDetails .pos-TaxTablefooter p {
    width: 50%;
    text-align: center;
    float: left;
    max-width: 50%
}

#POS_TaxDetails .pos-PopupTableContent {
    padding-bottom: 0
}

#POS_TaxDetails .pos-PopupDriveInTableContent {
    padding-bottom: 0
}

.pos-TaxTablefooter > p {
    padding: 10px 0;
    margin-bottom: 0;
    margin-top: 0
}

.checkmarkImg {
    background-image: url('../Content/Images/selected-tick.png');
    width: 19px;
    height: 19px;
    float: left;
    background-repeat: no-repeat;
    background-color: #b8892f;
    background-position: center
}

.cal1 {
    background: url('../Content/Images/calendar.png');
    width: 22px;
    height: 22px;
    cursor: pointer;
    right: -60px;
    top: -27px;
    position: relative
}

.sett1 {
    background: url('../Content/Images/setting.png');
    width: 23px;
    height: 22px;
    background-repeat: no-repeat;
    cursor: pointer;
    right: -120px;
    top: -49px;
    position: relative
}

.slauf1 {
    background: url('../Content/Images/slauf.png');
    width: 23px;
    height: 22px;
    cursor: pointer;
    right: -180px;
    top: -71px;
    position: relative
}

.for-attributes {
    min-width: 80px;
    overflow-x: auto;
    overflow-y: auto;
    padding: 0 10px;
    box-sizing: border-box
}

.att-header {
    color: #fff;
    font-weight: bold
}

.color-att {
    position: relative
}

.size-att {
    left: 20px;
    top: 5px;
    position: relative;
    list-style-type: none
}

.other-att {
    left: 20px;
    top: 5px;
    position: relative
}

.checkmark1 {
    position: absolute;
    -moz-border-radius: 40px;
    border-radius: 40px;
    display: none;
    vertical-align: middle;
    line-height: 20px;
    bottom: -5px;
    right: -4px
}

.size1 {
    min-width: 80px;
    height: 45px;
    border-radius: 4px;
    background-color: #3bdbe6;
    position: relative;
    text-align: center;
    color: #fff;
    vertical-align: middle;
    display: table-cell;
    font-size: 12px;
    cursor: pointer
}

.color-att, .size-att, .other-att {
    border-collapse: separate;
    border-spacing: 10px
}

.step_wrapper {
    border-bottom: 1px solid #089fb0
}

.pos-HoldOrderRow > td {
    text-align: center;
    padding: 10px 0;
    width: 20%
}

.pos-HoldOrderRow > td {
    font-size: 13px;
    color: #ceeff3
}

.quantity-cola span {
    float: left;
    margin-right: 10px
}

.pos-MinusBtn {
    background: url('../Content/Images/pos-minus.png') no-repeat center
}

.pos-PlusBtn {
    background: url('../Content/Images/pos-plus.png') no-repeat center
}

.medium-text h2 {
    font-weight: 100;
    font-family: Helvetica,Arial,sans-serif
}

.medium-text p, .chocolate-content p {
    font-family: Helvetica,Arial,sans-serif;
    font-weight: lighter
}

.quantity-cola h4 {
    font-weight: normal
}

.chocolate-content p b {
    font-weight: bold
}

.pos-Popupoptions {
    width: 320px;
    white-space: nowrap;
    overflow-y: hidden;
    overflow-x: scroll;
    -webkit-overflow-scrolling: touch
}

.pos-option {
    display: inline;
    border-radius: 4px;
    background-color: #3bdbe6;
    text-decoration: none;
    color: #fff;
    font-size: 12px;
    text-align: center;
    padding: 15px 20px;
    margin-right: 3px;
    vertical-align: middle;
    line-height: 45px
}

.SyncLoader {
    background-image: url("../Content/Images/sync-loader.gif");
    width: 20px;
    height: 20px;
    float: left;
    margin-right: 10px;
    margin-top: 5px;
    background-repeat: no-repeat
}

.clsofflineRecords {
    background-image: url("../Content/Images/warning-icon.png");
    float: left;
    margin-right: 10px;
    margin-top: 5px;
    height: 20px;
    width: 20px
}

.onlineStatus {
    background-image: url("../Content/Images/connection.png");
    float: left;
    margin-right: 10px;
    margin-top: 5px;
    height: 19px;
    width: 30px
}

.offlineStatus {
    background-image: url("../Content/Images/connection-error.png");
    float: left;
    margin-right: 10px;
    margin-top: 5px;
    height: 19px;
    width: 30px
}

.printerAvailable {
    background-image: url("../Content/Images/printerConnected.png");
    float: left;
    margin-right: 10px;
    margin-top: 5px;
    height: 25px;
    width: 30px;
    background-repeat: no-repeat
}

.printerNotAvailable {
    background-image: url("../Content/Images/printerNotConnect.png");
    float: left;
    margin-top: 5px;
    height: 25px;
    width: 30px;
    background-repeat: no-repeat
}

.cc-3 {
    width: 100%;
    float: right;
    height: 100%
}

    .cc-3 .left_menu {
        width: 14%;
        float: left;
        background-color: #18c0d4;
        border-right: 2px solid #0792a2;
        height: 100%;
        position: relative
    }

        .cc-3 .left_menu ul {
            padding: 10px 0 0;
            text-align: center
        }

        .cc-3 .left_menu li {
            display: block;
            margin-bottom: 15px;
            width: 100%
        }

            .cc-3 .left_menu li .image_box, .image_box {
                background-color: #0b95a5;
                border-radius: 5px;
                height: 40px;
                margin: 0 auto;
                width: 45px
            }

                .cc-3 .left_menu li .image_box.orange {
                    background: none repeat scroll 0 0 #f9c869 !important
                }

        .cc-3 .left_menu p {
            color: #fff;
            font-size: 12px;
            margin: 5px 0 0
        }

    .cc-3 .right_div {
        width: 85%;
        float: left;
        background: #0fb7cb;
        height: 100%
    }

    .cc-3 .right_div_header {
        width: 100%;
        float: left;
        background-color: #0ca7b9;
        border-bottom: 2px solid #0792a2
    }

    .cc-3 .right_div .right_div_header > ul {
        margin: 15px 0;
        overflow: hidden;
        padding: 0
    }

    .cc-3 .right_div .right_div_header li:first-child {
        margin-left: 15px
    }

    .cc-3 .right_div .right_div_header li {
        display: block;
        float: left;
        width: 22%;
        margin-left: 10px
    }

    .cc-3 .right_div .right_div_header p {
        margin: 0;
        text-align: left;
        color: #fff;
        font-size: 12px
    }

    .cc-3 .right_div .right_div_header input {
        border: medium none;
        border-radius: 3px;
        padding: 11px 10px;
        text-align: right;
        width: 100%;
        background: #aae0e7;
        color: #105c75;
        font-size: 18px;
        box-sizing: border-box
    }

    .cc-3 .right_div_form {
        width: 100%;
        float: left;
        background-color: #0fb7cb;
        padding: 20px 0;
        height: 100%;
        position: relative
    }

        .cc-3 .right_div_form .text_fields {
            margin-bottom: 12px;
            overflow: hidden;
            width: 100%
        }

            .cc-3 .right_div_form .text_fields .text_fields_left {
                color: #fff;
                float: left;
                line-height: 32px;
                margin-right: 15px;
                margin-top: 5px;
                text-align: right;
                width: 30%
            }

            .cc-3 .right_div_form .text_fields .text_fields_right {
                width: 50%;
                float: left
            }

                .cc-3 .right_div_form .text_fields .text_fields_right .amount {
                    background: none repeat scroll 0 0 #abe6ed;
                    border: medium none;
                    border-radius: 3px;
                    color: #105c75;
                    float: left;
                    font-size: 15px;
                    padding: 6px 15px;
                    position: relative;
                    text-align: right;
                    width: 50%;
                    z-index: 3;
                    margin: 5px 0 0 8px;
                    box-sizing: border-box
                }

                .cc-3 .right_div_form .text_fields .text_fields_right .credit_card {
                    background: none repeat scroll 0 0 #abe6ed;
                    border: medium none;
                    border-radius: 3px;
                    padding: 6px 15px;
                    text-align: left;
                    width: 55%;
                    color: #105c75;
                    font-size: 15px;
                    float: left;
                    margin: 5px 0 0 8px
                }

                .cc-3 .right_div_form .text_fields .text_fields_right .name {
                    background: none repeat scroll 0 0 #abe6ed;
                    border: medium none;
                    border-radius: 3px;
                    padding: 6px 15px;
                    text-align: left;
                    width: 100%;
                    color: #105c75;
                    font-size: 15px;
                    margin: 5px 0 0 8px
                }

                .cc-3 .right_div_form .text_fields .text_fields_right .number {
                    background: none repeat scroll 0 0 #abe6ed;
                    border: medium none;
                    border-radius: 3px;
                    padding: 6px 15px;
                    text-align: left;
                    width: 100%;
                    color: #105c75;
                    font-size: 15px;
                    margin: 5px 0 0 8px
                }

                .cc-3 .right_div_form .text_fields .text_fields_right .expires {
                    background: none repeat scroll 0 0 #abe6ed;
                    border: medium none;
                    border-radius: 3px;
                    padding: 6px 15px;
                    text-align: left;
                    width: 32%;
                    color: #105c75;
                    font-size: 15px;
                    margin: 5px 0 0 8px
                }

                .cc-3 .right_div_form .text_fields .text_fields_right .voice_authorization {
                    background: none repeat scroll 0 0 #abe6ed;
                    border: medium none;
                    border-radius: 3px;
                    padding: 6px 15px;
                    text-align: left;
                    width: 32%;
                    color: #105c75;
                    font-size: 15px;
                    margin: 5px 0 0 8px
                }

                .cc-3 .right_div_form .text_fields .text_fields_right .on_btn {
                    background: none repeat scroll 0 0 #0a8b9b;
                    border: medium none;
                    border-radius: 3px;
                    color: #fff;
                    font-size: 15px;
                    margin-left: 10px;
                    padding: 5px 15px
                }

            .cc-3 .right_div_form .text_fields .cancel_btn {
                background: url("../Content/Images/cross.PNG") no-repeat scroll 12px 10px #0a8b9b;
                border-radius: 3px;
                float: left;
                padding: 10px 15px 10px 40px;
                text-align: center;
                color: #fff;
                font-size: 15px;
                margin-top: 10px;
                cursor: pointer
            }

            .cc-3 .right_div_form .text_fields .addIcon_btn {
                background: url("../Content/Images/addIcon.PNG") no-repeat scroll 12px 10px #0a8b9b;
                border-radius: 3px;
                float: left;
                padding: 10px 15px 10px 40px;
                text-align: center;
                color: #fff;
                font-size: 15px;
                margin-left: 54%;
                margin-top: 10px;
                cursor: pointer
            }

            .cc-3 .right_div_form .text_fields .ok_btn {
                background: url("../Content/Images/icon_tick.png") no-repeat scroll 12px 10px #eebc5b;
                border-radius: 3px;
                color: #fff;
                float: left;
                font-size: 15px;
                padding: 10px 15px 10px 40px;
                text-align: center;
                margin-left: 15px;
                margin-top: 10px;
                cursor: pointer
            }

            .cc-3 .right_div_form .text_fields.pos-paycreditBtns {
                float: right;
                width: auto;
                padding-right: 5%
            }

    .cc-3 .left_menu .image_box.orange > img {
        padding: 15% 1px 15% 0
    }

    .cc-3 .left_menu .image_box > img {
        padding: 15% 0
    }

.amount_img {
    background-image: url("../Content/Images/icon_cal.png");
    float: left;
    height: 30px;
    margin-left: 6px;
    margin-top: 6px;
    overflow: hidden;
    position: relative;
    width: 24px;
    z-index: 3;
    cursor: pointer
}

    .amount_img.active {
        background-image: url("../Content/Images/icon_cal-2.png")
    }

.POS-calc-active {
    background-image: url("../Content/Images/icon_cal-2.png") !important
}

.amount_imgTfr {
    background-image: url("../Content/Images/icon_cal.png");
    float: left;
    height: 30px;
    margin-left: 6px;
    margin-top: 6px;
    overflow: hidden;
    position: relative;
    width: 24px;
    z-index: 9999 !important;
    cursor: pointer
}

    .amount_imgTfr.active {
        background-image: url("../Content/Images/icon_cal-2.png")
    }

.credit_card_img {
    background-image: url("../Content/Images/icon_2w.png");
    float: left;
    height: 30px;
    margin-left: 6px;
    overflow: hidden;
    width: 28px;
    margin-top: 6px
}

.calc-pop-box {
    background: none repeat scroll 0 0 #1794a3;
    border-radius: 5px;
    padding: 0 0 0 8px;
    position: absolute;
    width: 25%;
    padding-top: 5px;
    margin-top: -5px;
    min-width: 165px
}

    .calc-pop-box .line {
        width: 96%;
        border-top: 1px solid #27adbd;
        margin: 40px 0 5px
    }

    .calc-pop-box .calculator {
        width: 100%;
        overflow: hidden;
        margin-top: 5px
    }

        .calc-pop-box .calculator .left {
            background: none repeat scroll 0 0 #41dcee;
            border-radius: 3px;
            color: #fff !important;
            float: left;
            font-size: 23px;
            margin-bottom: 5px;
            margin-right: 10px;
            padding: 8px 1px;
            text-align: center;
            width: 28%;
            border: none
        }

            .calc-pop-box .calculator .left:nth-child(3) {
                margin-right: 0
            }

.arrow_img {
    padding: 5px 0
}

.calc-pop-box .calculator .left:hover {
    background: none repeat scroll 0 0 #eebc5b
}

.calc-pop-box {
    display: none
}

.pos-CalculatorHeader {
    background-color: #079eb0;
    border-bottom: 1px solid #0a93a3;
    float: left;
    width: 100%;
    padding: 10px 0
}

.pos-CalculatorAmmount {
    float: left;
    width: 56%;
    padding-left: 4%;
    box-sizing: border-box;
    margin-left: 0
}

    .pos-CalculatorAmmount > label {
        color: #fff;
        font-size: 18px;
        margin-right: 15px
    }

    .pos-CalculatorAmmount > input {
        border-radius: 3px;
        padding: 10px;
        background: #aae0e7;
        border: none;
        color: #105c75;
        text-align: right;
        font-size: 18px;
        width: 55%
    }

.pos-CalculatorDoneBtn {
    float: left;
    margin-left: 17.5%
}

.Calculator-done {
    background: #eebc5b;
    color: #fff;
    font-size: 20px;
    padding: 9px 20px;
    border-radius: 3px;
    float: right;
    cursor: pointer
}

.pos-CalculatorWrap {
    width: 100%;
    float: left;
    overflow-y: auto;
    height: 70%;
    padding: 9px;
    box-sizing: border-box
}

.pos-CalculatorLeft .calculator, .pos-CalculatorRight .calculator {
    width: 100%;
    overflow: hidden;
    margin-top: 5px
}

    .pos-CalculatorLeft .calculator .left, .pos-CalculatorRight .calculator .left {
        background: #41dcee;
        border-radius: 3px;
        color: #fff !important;
        float: left;
        font-size: 30px;
        margin-bottom: 5px;
        margin-right: 10px;
        padding: 13px 0;
        text-align: center;
        width: 29%;
        cursor: pointer
    }

    .pos-CalculatorLeft .calculator .leftCC, .pos-CalculatorRight .calculator .left {
        background: #41dcee;
        border-radius: 3px;
        color: #fff !important;
        float: left;
        font-size: 30px;
        margin-bottom: 5px;
        margin-right: 10px;
        padding: 12px 0;
        text-align: center;
        width: 28%;
        cursor: pointer
    }

        .pos-CalculatorLeft .calculator .left:hover, .pos-CalculatorRight .calculator .left:hover, .clearBtn:hover {
            background: #eebc5b
        }

        .pos-CalculatorLeft .calculator .leftCC:hover, .pos-CalculatorRight .calculator .leftCC:hover, .clearBtn:hover {
            background: #eebc5b
        }

.pos-CalculatorRight {
    background: #18c0d4;
    border-radius: 3px;
    width: 40%;
    float: left;
    margin-top: 20px
}

    .pos-CalculatorRight .calculator .left {
        background: #0a8b9b;
        width: 44.55%;
        font-size: 22px;
        padding: 16px 0
    }

    .pos-CalculatorRight .calculator {
        margin-left: 8px
    }

.clearBtn {
    width: 93.55%;
    float: left;
    background: #41dcee;
    color: #fff;
    display: block;
    text-align: center;
    border-radius: 3px;
    padding: 20px 0;
    margin-bottom: 5px;
    font-size: 25px;
    cursor: pointer
}

.pos-rt-trackorder {
    background: url(../Content/Images/roundtrip-log.png);
    float: right;
    width: 40px;
    height: 40px;
    cursor: pointer
}

.POS-grdNameP {
    width: 80%;
    word-break: break-all;
    margin: 0;
    padding: 0;
    display: block
}

.pos-optiontax {
    display: inline;
    border-radius: 4px;
    background-color: #3bdbe6;
    text-decoration: none;
    color: #fff;
    font-size: 12px;
    text-align: center;
    padding: 15px 20px;
    margin-right: 7px;
    vertical-align: middle;
    line-height: 45px
}

.pos-Popupoptionstax {
    width: 100%;
    height: 72px;
    white-space: nowrap;
    overflow-y: hidden;
    overflow-x: auto;
    float: left;
    -webkit-overflow-scrolling: touch
}

.pos-textoverflow {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    color: #fff
}

.pos-optionSaleRep {
    display: inline;
    border-radius: 4px;
    background-color: #3bdbe6;
    text-decoration: none;
    color: #fff;
    font-size: 12px;
    margin-top: 15PX;
    text-align: center;
    margin-right: 12px;
    vertical-align: middle;
    line-height: 45px;
    float: left;
    overflow-y: hidden
}

.pos-optionRPTType {
    display: inline;
    border-radius: 4px;
    background-color: #3bdbe6;
    text-decoration: none;
    color: #fff;
    font-size: 12px;
    margin-top: 15PX;
    text-align: center;
    margin-right: 12px;
    vertical-align: middle;
    line-height: 45px;
    float: left
}

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

.step_wrapperSales {
    border-bottom: 1px solid #089fb0;
    padding-bottom: 20px;
    padding-left: 15px;
    box-sizing: border-box
}

.checkmark1Sales {
    position: absolute;
    -moz-border-radius: 40px;
    border-radius: 40px;
    display: none;
    vertical-align: middle;
    line-height: 20px;
    bottom: -1px;
    right: 0
}

.checkmark1RPTType {
    position: absolute;
    -moz-border-radius: 40px;
    border-radius: 40px;
    display: none;
    vertical-align: middle;
    line-height: 20px;
    bottom: -5px;
    right: -5px
}

.CCountText {
    width: 24%;
    float: left;
    color: #105c75;
    opacity: .8;
    display: block;
    height: 34px;
    padding: 1px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background: none repeat scroll 0 0 #abe6ed;
    background-image: none;
    border: 1px solid #07909f;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    -webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    font: inherit;
    margin: 0;
    position: relative;
    z-index: 999
}

.CashCountCal {
    background: none repeat scroll 0 0 #1794a3;
    border-radius: 5px;
    padding: 0 0 0 3px;
    position: absolute;
    width: 38%;
    z-index: 1;
    margin-left: -160px;
    margin-top: 0
}

    .CashCountCal .line {
        width: 96%;
        border-top: 1px solid #27adbd;
        margin: 40px 0 5px
    }

    .CashCountCal .calculator {
        width: 100%;
        overflow: hidden;
        margin-top: 5px
    }

        .CashCountCal .calculator .left {
            background: none repeat scroll 0 0 #41dcee;
            border-radius: 3px;
            color: #fff !important;
            float: left;
            font-size: 23px;
            margin-bottom: 2px;
            margin-right: 2px;
            padding: 8px 0;
            text-align: center;
            width: 30%;
            margin-left: 3px
        }

            .CashCountCal .calculator .left:hover {
                background: #eebc5b;
                cursor: pointer
            }

            .CashCountCal .calculator .left:nth-child(3) {
                margin-right: 0
            }

.CashCountCalTfr {
    background: none repeat scroll 0 0 #1794a3;
    border-radius: 5px;
    padding: 0 0 0 3px;
    position: absolute;
    width: 38%;
    z-index: 1;
    margin-left: -160px;
    margin-top: 0
}

    .CashCountCalTfr .line {
        width: 96%;
        border-top: 1px solid #27adbd;
        margin: 40px 0 5px
    }

    .CashCountCalTfr .calculator {
        width: 100%;
        overflow: hidden;
        margin-top: 5px
    }

        .CashCountCalTfr .calculator .left {
            background: none repeat scroll 0 0 #41dcee;
            border-radius: 3px;
            color: #fff !important;
            float: left;
            font-size: 23px;
            margin-bottom: 2px;
            margin-right: 2px;
            padding: 8px 0;
            text-align: center;
            width: 30%;
            margin-left: 3px
        }

            .CashCountCalTfr .calculator .left:hover {
                background: #eebc5b;
                cursor: pointer
            }

            .CashCountCalTfr .calculator .left:nth-child(3) {
                margin-right: 0
            }

.arrow_imgCashCount {
    padding: 5px 0
}

.pull-AddCustomer {
    float: right;
    position: absolute;
    right: 10px;
    bottom: 10px
}

.posCloseBtn {
    background: #078492
}

.posAddProBtn {
    background: #eebc5b
}

.pull-disclineOKCancel {
    float: right
}

.CashCount-pos-PopupInput {
    float: left;
    width: 100%;
    margin-bottom: 15px
}

.pos-PopupInputCashCount {
    float: left;
    width: 100%;
    margin-bottom: 15px
}

    .pos-PopupInputCashCount > label {
        float: left;
        width: 40%;
        color: #fff;
        margin-top: 7px;
        font-weight: normal;
        font-size: 13px;
        display: inline-block;
        margin-bottom: 5px
    }

    .pos-PopupInputCashCount > input {
        float: left;
        width: 60%;
        color: #105c75;
        opacity: .4 !important;
        display: block;
        height: 34px;
        padding: 1px 12px;
        font-size: 14px;
        line-height: 1.42857143;
        color: #555;
        background-color: #abe6ed;
        background-image: none;
        border: none;
        border-radius: 4px;
        -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
        box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
        -webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
        transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
        font: inherit;
        margin: 0
    }

.amount_ChangeOld_img {
    background-image: url("../Content/Images/icon_cal.png");
    float: left;
    height: 30px;
    margin-left: 6px;
    margin-top: 6px;
    overflow: hidden;
    position: relative;
    width: 24px;
    z-index: 14 !important;
    cursor: pointer
}

    .amount_ChangeOld_img.active {
        background-image: url("../Content/Images/icon_cal-2.png")
    }

.ChangeOldPasswordCal {
    background: none repeat scroll 0 0 #1794a3;
    border-radius: 5px;
    padding: 0 0 0 3px;
    position: absolute;
    width: 60%;
    z-index: 10;
    margin-left: -178px;
    margin-top: -5px
}

    .ChangeOldPasswordCal .line {
        width: 96%;
        border-top: 1px solid #27adbd;
        margin: 40px 0 5px
    }

    .ChangeOldPasswordCal .calculator {
        width: 100%;
        overflow: hidden;
        margin-top: 5px
    }

        .ChangeOldPasswordCal .calculator .left {
            background: none repeat scroll 0 0 #41dcee;
            border-radius: 3px;
            color: #fff !important;
            float: left;
            font-size: 23px;
            margin-bottom: 2px;
            margin-right: 2px;
            padding: 8px 0;
            text-align: center;
            width: 30%;
            margin-left: 3px
        }

            .ChangeOldPasswordCal .calculator .left:hover {
                background: #eebc5b;
                cursor: pointer
            }

            .ChangeOldPasswordCal .calculator .left:nth-child(3) {
                margin-right: 0
            }

.amount_ChangeNew_img {
    background-image: url("../Content/Images/icon_cal.png");
    float: left;
    height: 30px;
    margin-left: 6px;
    margin-top: 6px;
    overflow: hidden;
    position: relative;
    width: 24px;
    z-index: 10 !important;
    cursor: pointer
}

    .amount_ChangeNew_img.active {
        background-image: url("../Content/Images/icon_cal-2.png")
    }

.ChangeNewPasswordCal {
    background: none repeat scroll 0 0 #1794a3;
    border-radius: 5px;
    padding: 0 0 0 3px;
    position: absolute;
    width: 60%;
    z-index: 7;
    margin-left: -181px;
    margin-top: -5px
}

    .ChangeNewPasswordCal .line {
        width: 96%;
        border-top: 1px solid #27adbd;
        margin: 40px 0 5px
    }

    .ChangeNewPasswordCal .calculator {
        width: 100%;
        overflow: hidden;
        margin-top: 5px
    }

        .ChangeNewPasswordCal .calculator .left {
            background: none repeat scroll 0 0 #41dcee;
            border-radius: 3px;
            color: #fff !important;
            float: left;
            font-size: 23px;
            margin-bottom: 2px;
            margin-right: 2px;
            padding: 8px 0;
            text-align: center;
            width: 30%;
            margin-left: 3px
        }

            .ChangeNewPasswordCal .calculator .left:hover {
                background: #eebc5b;
                cursor: pointer
            }

            .ChangeNewPasswordCal .calculator .left:nth-child(3) {
                margin-right: 0
            }

.amount_ChangeConfirm_img {
    background-image: url("../Content/Images/icon_cal.png");
    float: left;
    height: 30px;
    margin-left: 6px;
    margin-top: 6px;
    overflow: hidden;
    position: relative;
    width: 24px;
    z-index: 8 !important;
    cursor: pointer
}

    .amount_ChangeConfirm_img.active {
        background-image: url("../Content/Images/icon_cal-2.png")
    }

.ChangeConfirmPasswordCal {
    background: none repeat scroll 0 0 #1794a3;
    border-radius: 5px;
    padding: 0 0 0 3px;
    position: absolute;
    width: 60%;
    z-index: 5;
    margin-left: -178px;
    margin-top: -5px
}

    .ChangeConfirmPasswordCal .line {
        width: 96%;
        border-top: 1px solid #27adbd;
        margin: 40px 0 5px
    }

    .ChangeConfirmPasswordCal .calculator {
        width: 100%;
        overflow: hidden;
        margin-top: 5px
    }

        .ChangeConfirmPasswordCal .calculator .left {
            background: none repeat scroll 0 0 #41dcee;
            border-radius: 3px;
            color: #fff !important;
            float: left;
            font-size: 23px;
            margin-bottom: 2px;
            margin-right: 2px;
            padding: 8px 0;
            text-align: center;
            width: 30%;
            margin-left: 3px
        }

            .ChangeConfirmPasswordCal .calculator .left:hover {
                background: #eebc5b;
                cursor: pointer
            }

            .ChangeConfirmPasswordCal .calculator .left:nth-child(3) {
                margin-right: 0
            }

.draggable {
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -o-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.HistoryText {
    width: 100%;
    float: left;
    color: #105c75;
    opacity: .8;
    display: block;
    height: 34px;
    padding: 1px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background: none repeat scroll 0 0 #abe6ed;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    -webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    font: inherit;
    margin: 0;
    position: relative;
    z-index: 999;
    box-sizing: border-box
}

.btn-searchHistory {
    background: rgba(0,0,0,.26) url('../Content/Images/searchWhite.png');
    width: 35px;
    height: 35px;
    background-repeat: no-repeat;
    float: right;
    cursor: pointer;
    margin-top: 16px;
    border-radius: 6px;
    background-position: center
}

.Mobbtn-searchHistory {
    display: none
}

.btn-searchReturnInvoice {
    background: rgba(0,0,0,.26) url('../Content/Images/search1.png');
    width: 7%;
    height: 29px;
    background-repeat: no-repeat;
    float: right;
    cursor: pointer;
    margin-top: 7px;
    margin-left: 5px;
    border-radius: 6px;
    background-position: center
}

.DateTimeHistory {
    border: none;
    border-radius: 4px;
    background: #8dd8e0;
    padding: 6px;
    margin-top: 1px;
    float: left;
    width: 90%;
    box-sizing: border-box;
    -webkit-appearance: none;
    height: 34px
}

.SetBarcode {
    margin-top: 30px;
    padding-left: 150px;
    width: 130px;
    padding-top: 20px
}

.column {
    font-weight: bold;
    text-align: center;
    float: left
}

.HistoryContent:hover {
    cursor: pointer
}

.pos-PopupWrapDiscountLine {
    max-width: 400px;
    max-height: 250px
}

.DiscountLineText {
    width: 40%;
    float: left;
    color: #105c75;
    opacity: .8;
    display: block;
    height: 34px;
    padding: 1px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background: none repeat scroll 0 0 #abe6ed;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    -webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    font: inherit;
    margin: 0;
    position: relative;
    z-index: 999
}

.DiscAmtCal {
    background: none repeat scroll 0 0 #1794a3;
    border-radius: 5px;
    padding: 6px 0 3px 2px;
    position: absolute;
    width: 53%;
    z-index: 1;
    margin-left: -179px;
    margin-top: -5px
}

    .DiscAmtCal .line {
        width: 96%;
        border-top: 1px solid #27adbd;
        margin: 40px 0 5px
    }

    .DiscAmtCal .calculator {
        width: 100%;
        overflow: hidden;
        margin-top: 5px
    }

        .DiscAmtCal .calculator .left {
            background: none repeat scroll 0 0 #41dcee;
            border-radius: 3px;
            color: #fff !important;
            float: left;
            font-size: 23px;
            margin-bottom: 2px;
            margin-right: 5px;
            padding: 8px 0;
            text-align: center;
            width: 29.4%;
            margin-left: 3px
        }

            .DiscAmtCal .calculator .left:hover {
                background: #eebc5b;
                cursor: pointer
            }

            .DiscAmtCal .calculator .left:nth-child(3) {
                margin-right: 0
            }

.DiscPercntCal {
    background: none repeat scroll 0 0 #1794a3;
    border-radius: 5px;
    padding: 6px 0 3px 2px;
    position: absolute;
    width: 53%;
    z-index: 1;
    margin-left: -179px;
    margin-top: -5px
}

    .DiscPercntCal .line {
        width: 96%;
        border-top: 1px solid #27adbd;
        margin: 40px 0 5px
    }

    .DiscPercntCal .calculator {
        width: 100%;
        overflow: hidden;
        margin-top: 5px
    }

        .DiscPercntCal .calculator .left {
            background: none repeat scroll 0 0 #41dcee;
            border-radius: 3px;
            color: #fff !important;
            float: left;
            font-size: 23px;
            margin-bottom: 2px;
            margin-right: 5px;
            padding: 8px 0;
            text-align: center;
            width: 29.4%;
            margin-left: 3px
        }

            .DiscPercntCal .calculator .left:hover {
                background: #eebc5b;
                cursor: pointer
            }

            .DiscPercntCal .calculator .left:nth-child(3) {
                margin-right: 0
            }

.amount_imgDiscntAmt {
    background-image: url("../Content/Images/icon_cal.png");
    float: left;
    height: 30px;
    margin-left: 6px;
    margin-top: 6px;
    overflow: hidden;
    position: relative;
    width: 24px;
    z-index: 9999 !important;
    cursor: pointer
}

    .amount_imgDiscntAmt.active1 {
        background-image: url("../Content/Images/icon_cal-2.png")
    }

.PromotionFreeCbox {
    width: 20px;
    height: 17px;
    border-radius: 3px;
    float: right;
    opacity: .8;
    margin: 0 !important
}

.PromotionFreelabel {
    color: #fff
}

.formWrapper {
    overflow-y: auto;
    overflow-x: hidden;
    height: calc(100% - 45px)
}

.pos-PopupInputAddCustomer {
    float: left;
    width: 100%;
    margin-bottom: 15px;
    box-sizing: border-box
}

    .pos-PopupInputAddCustomer > label {
        float: left;
        width: 35%;
        color: #fff;
        margin-top: 7px;
        font-weight: normal;
        font-size: 13px;
        display: inline-block;
        margin-bottom: 5px;
        word-break: break-all
    }

    .pos-PopupInputAddCustomer > input {
        float: left;
        width: 55%;
        color: #105c75;
        opacity: .8;
        display: block;
        height: 34px;
        padding: 1px 12px;
        font-size: 14px;
        line-height: 1.42857143;
        background-color: #fff;
        background-image: none;
        border: 1px solid #ccc;
        border-radius: 4px;
        -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
        box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
        -webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
        transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
        font: inherit;
        margin: 0
    }

.pos-mstrPopupWrap * {
    box-sizing: border-box
}

.pos-mstraltContent, .pos-mstrtableWrap, .pos-mstrtableWrap, .pos-mstrtableBody {
    float: left;
    width: 100%
}

.pos-mstrPopupWrap {
    max-width: 600px
}

.pos-mstrPopupHeader {
    float: left;
    width: 100%;
    background: #07909f;
    border-bottom: 1px solid #047784;
    border-top-left-radius: 7px;
    border-top-right-radius: 7px
}

    .pos-mstrPopupHeader > h4 {
        float: left;
        color: #d9f1f4;
        padding: 0;
        margin: 0;
        padding: 10px 15px;
        font-size: 15px;
        font-family: inherit;
        font-weight: 500;
        line-height: 1.1
    }

.pos-mstrPopuptopCloseIcon {
    width: 42px;
    height: 40px;
    float: right;
    background: url(images/closeIcon.png);
    background-repeat: no-repeat;
    cursor: pointer;
    position: relative;
    z-index: 2;
    right: -15px;
    top: -15px
}

.pos-mstrPopupContent {
    background: #05a6b8;
    float: left;
    width: 100%;
    padding: 0 0 0 0;
    border-bottom-left-radius: 7px;
    border-bottom-right-radius: 7px;
    height: 320px
}

.pos-mstraltContent {
    height: calc(100% - 50px);
    height: -moz-calc(100% - 50px);
    height: -webkit-calc(100% - 50px)
}

.pos-mstrtableWrap {
    overflow-x: auto;
    overflow-y: hidden;
    height: 100%
}

.pos-mstrtableBody {
    overflow-x: hidden;
    overflow-y: auto;
    height: calc(100% - 30px);
    height: -moz-calc(100% - 30px);
    height: -webkit-calc(100% - 30px)
}

.pos-mstrtableHead {
    background: #09b3c6
}

.pos-mstrtableHead, .pos-mstrtableRow {
    width: 100%;
    display: flex;
    justify-content: space-between;
    float: left;
    white-space: nowrap
}

    .pos-mstrtableHead h3 {
        background: #09b3c6;
        white-space: nowrap;
        color: #035862
    }

    .pos-mstrtableHead h3, .pos-mstrtableRow h3 {
        margin: 0;
        font-size: 13px;
        padding: 6px 10px;
        display: inline-block;
        max-width: 150px;
        min-width: 80px;
        text-align: center;
        width: 150px
    }

        .pos-mstrtableHead h3:first-child, .pos-mstrtableRow h3:first-child {
            text-align: left
        }

    .pos-mstrtableRow h3 {
        color: #fff
    }

.pos-mstrPopupIcon {
    width: 21px;
    height: 20px;
    float: left
}

.pos-mstrPopupTickIcon {
    background: url(../Content/Images/tick-icon.png);
    background-repeat: no-repeat;
    margin-right: 5px
}

.vrbl_vchr_cal {
    background: none repeat scroll 0 0 #1794a3;
    border-radius: 5px;
    padding: 0 0 0 8px;
    position: absolute;
    width: 25%;
    margin-left: 85px
}

    .vrbl_vchr_cal .line {
        width: 96%;
        border-top: 1px solid #27adbd;
        margin: 40px 0 5px
    }

    .vrbl_vchr_cal .calculator {
        width: 100%;
        overflow: hidden;
        margin-top: 5px
    }

        .vrbl_vchr_cal .calculator .left {
            background: none repeat scroll 0 0 #41dcee;
            border-radius: 3px;
            color: #fff !important;
            float: left;
            font-size: 23px;
            margin-bottom: 5px;
            margin-right: 10px;
            padding: 8px 0;
            text-align: center;
            width: 28%;
            border: none
        }

            .vrbl_vchr_cal .calculator .left:nth-child(3) {
                margin-right: 0
            }

.arrow_img {
    padding: 5px 0
}

.vrbl_vchr_cal .calculator .left:hover {
    background: none repeat scroll 0 0 #eebc5b
}

.vrbl_vchr_cal {
    display: none
}

.amount_imgvvchr {
    background-image: url("../Content/Images/icon_cal.png");
    float: left;
    height: 30px;
    margin-left: 6px;
    margin-top: 6px;
    overflow: hidden;
    position: relative;
    width: 24px;
    z-index: 9999 !important;
    cursor: pointer
}

    .amount_imgvvchr.active {
        background-image: url("../Content/Images/icon_cal-2.png")
    }

.pos-returnInvoicePopup {
    height: 140px;
    overflow-y: auto;
    padding-bottom: 5px;
    padding-left: 10px;
    padding-right: 5px;
    box-sizing: border-box
}

.pos-mobSearch {
    margin-left: 0;
    margin-bottom: 0;
    margin-top: 5px;
    float: left;
    padding: 0 0 5px 15px;
    width: 100%;
    border-bottom: 1px solid #d7a237
}

    .pos-mobSearch input.search-input {
        padding: 6px;
        width: calc(100% - 104px);
        background: #ffecc6;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0
    }

    .pos-mobSearch .btn-search {
        height: 31px;
        width: 31px;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        margin-left: 0
    }

.pos-scanIcon {
    width: 31px;
    height: 31px;
    background: url(../Content/Images/scan.png) #006570 no-repeat center;
    float: left;
    border-radius: 5px;
    margin-right: 10px;
    cursor: pointer
}

.posPayamtInfo {
    color: #fff;
    font-size: 12px;
    font-weight: bold;
    float: left;
    width: 33.3%
}

.pos-HoldOrderRow td.posHoldTblRows {
    text-align: left;
    padding-left: 10px
}

.pos-voucher-formData {
    float: left;
    width: 100%;
    padding-right: 10px
}

.cc-3 .right_div_form .pos-voucher-formData .text_fields .text_fields_left {
    padding-right: 10px
}

.pos-voucherTopField {
    width: 100%;
    margin-bottom: 0 !important;
    margin-top: 20px;
    padding-right: 10px
}

.pos-HoldorderFloat {
    float: left;
    width: 100%
}

.PosHistoryRecordFix {
    position: fixed;
    width: 100%;
    float: left;
    background: #09b3c6;
    height: 39px;
    z-index: 0
}

.pos-HoldorderFloat .pos-TaxTableHead > p {
    position: relative;
    z-index: 1;
    width: 25%;
    text-align: center
}

.pos-TotlAmtWrapDiv {
    float: right;
    width: 42%
}

.pos-totalAmountWrap {
    position: fixed;
    bottom: 12.9%;
    float: right;
    width: 40%;
    background: rgba(0,0,0,.4);
    padding-right: 7px;
    border-top-left-radius: 50px;
    z-index: 9
}

    .pos-totalAmountWrap h3 {
        float: right;
        font-size: 12px;
        color: #fff;
        padding: 7px 0 0 0;
        margin: 0 0 0;
        width: 80%;
        text-align: right
    }

h3.pos-TotalAmtValue {
    float: right;
    width: 80%;
    padding-top: 0
}

    h3.pos-TotalAmtValue input {
        float: right;
        background: transparent;
        border: none;
        text-align: right;
        width: 100%;
        font-size: 14px;
        position: relative;
        right: 0
    }

.cc-3 .right_div_form .text_fields.pay-mulivoucherBtns {
    width: 40%
}

.pos-totalAmountWrap h3 span {
    margin-left: 10px
}

.pos-ResRightDiv {
    height: auto
}

.col-17 {
    width: 17%;
    float: left
}

.POS_EnterDesc {
    opacity: .7;
    width: 78%;
    resize: none
}

.POS_EnterModifierDesc {
    opacity: .7;
    width: calc(100% - 50px);
    resize: none;
    float: left;
    margin-bottom: 10px;
    display: block
}

.POS_BtnWaste {
    height: 35px;
    float: right;
    background-image: url(../Content/Images/waste.png);
    width: 35px;
    cursor: pointer;
    opacity: .3
}

.pos-voidRpopupInput {
    background: none repeat scroll 0 0 #05a6b8;
    width: 100%;
    float: left;
    border: 1px solid #05a6b8;
    padding-right: 10px
}

.pos-voidRpopupInputWrap {
    width: calc(100% - 45px);
    float: left
}

.pos-voidRpopupLabel {
    float: left;
    padding-right: 8px;
    color: #fff;
    width: 100%
}

.pos-OlOrderMapList {
    float: left;
    max-width: 250px;
    height: 362px;
    position: relative;
    overflow-y: auto;
    overflow-x: hidden
}

    .pos-OlOrderMapList ul {
        padding: 0;
        list-style: none;
        box-sizing: border-box
    }

        .pos-OlOrderMapList ul li {
            font-size: 13px;
            color: #fff;
            margin-bottom: 10px;
            background: url(../Content/Images/loc1.png) no-repeat 0 -4px;
            padding-left: 16px;
            cursor: pointer
        }

            .pos-OlOrderMapList ul li:hover {
                color: #044f56;
                background: url(../Content/Images/loc1-hov.png) no-repeat 0 -4px
            }

.pos-OlOrderMapWrap {
    width: calc(100% - 250px);
    height: 402px;
    position: relative;
    overflow: hidden;
    float: left
}

.pos-btnRefreshMap {
    background-image: url('../Content/Images/refresh.png');
    width: 40px;
    height: 40px;
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
    float: right;
    margin-top: 6px
}

.pos-altContent {
    height: calc(100% - 50px);
    height: -moz-calc(100% - 50px);
    height: -webkit-calc(100% - 50px)
}

.pos-tableWrap {
    overflow-x: auto;
    overflow-y: hidden;
    height: 100%
}

.pos-tableBody {
    overflow-x: hidden;
    overflow-y: auto;
    height: calc(100% - 30px);
    height: -moz-calc(100% - 30px);
    height: -webkit-calc(100% - 30px);
    float: left;
    width: 100%
}

.pos-tableHead {
    background: #09b3c6
}

.pos-tableHead, .pos-tableRow {
    width: 100%;
    display: flex;
    justify-content: space-between;
    float: left;
    white-space: normal
}

    .pos-tableHead h3 {
        background: #09b3c6;
        white-space: normal;
        color: #035862
    }

    .pos-tableHead h3, .pos-tableRow h3 {
        margin: 0;
        font-size: 13px;
        padding: 6px 10px;
        display: inline-block;
        max-width: 150px;
        min-width: 80px;
        text-align: center;
        word-wrap: break-word;
        width: 15%;
        line-height: 18px
    }

.pos-tableRow {
    border-bottom: 1px solid #07909f
}

    .pos-tableRow h3 {
        color: #fff
    }

.pos-OrderContent {
    float: left;
    width: 100%;
    height: 100%
}

.pos-PopupIcon {
    width: 21px;
    height: 21px;
    float: left
}

.pos-LeftSearchOlBtn {
    float: right;
    cursor: pointer;
    text-decoration: none;
    font-weight: bold;
    background: #98161a;
    padding: 0 12px;
    border-radius: 3px;
    margin: 10px 0;
    color: #fff;
    position: absolute;
    font-weight: normal;
    right: 42px;
    top: 16px
}

.pos-desWrappert {
    width: 95%;
    display: block;
    padding: 0 10px;
    max-height: 200px;
    margin: 0 auto
}

.pos-tableColsWrap {
    display: flex;
    width: 100%;
    justify-content: space-between
}

.pos-desTableHead, .pos-desTable-row {
    display: flex;
    justify-content: space-between
}

.pos-desTableBody {
    overflow-x: hidden;
    overflow-y: auto;
    float: left;
    width: 100%;
    background: #0094a1;
    height: calc(100% - 30px);
    margin-bottom: 10px
}

.pos-desTableHead {
    background: #41dcee
}

.pos-desTableWrap {
    height: 100%
}

.pos-desTableHead h3, .pos-desTable-row h3 {
    padding-top: 12px;
    padding-bottom: 12px
}

.pos-SearchCol {
    float: left
}

.pos-SearchCol-10 {
    width: 10%
}

.pos-SearchCol-40 {
    width: 40%
}

.pos-SearchCol-15 {
    width: 15%
}

@-moz-document url-prefix() {
    .order-right;

{
    float: right;
    background: url("../Content/Images/images-1-1.png") no-repeat scroll 6px center rgb(189,137,29);
    width: 31px;
    height: 31px;
    border-radius: 5px 5px 5px 5px;
    cursor: default;
    position: relative;
    right: 20px;
    margin-top: 5%;
    margin-right: 10px;
}

.order-right1 {
    float: right;
    background: url("../Content/Images/images-1-2.png") no-repeat scroll 6px center;
    width: 50px;
    height: 50px;
    border-radius: 5px 5px 5px 5px;
    cursor: pointer;
    position: relative;
    right: 20px;
    margin-top: 5px;
    margin-right: 10px;
}

.order-right2 {
    float: right;
    background: url("../Content/Images/images-1-3.png") no-repeat scroll 6px center;
    width: 50px;
    height: 50px;
    border-radius: 5px 5px 5px 5px;
    cursor: pointer;
    position: relative;
    right: 20px;
    margin-top: 5%;
    margin-right: 10px;
}

.order-rightNGO {
    float: right;
    background: url("../Content/Images/ngo.png") no-repeat scroll 4px center;
    width: 50px;
    height: 50px;
    border-radius: 5px 5px 5px 5px;
    cursor: pointer;
    position: relative;
    right: 20px;
    margin-top: 5%;
    margin-right: 10px;
}

.order-rightRet {
    float: right;
    background: url("../Content/Images/return.png") no-repeat scroll 6px center;
    width: 50px;
    height: 50px;
    border-radius: 5px 5px 5px 5px;
    cursor: pointer;
    position: relative;
    right: 20px;
    margin-top: 5%;
    margin-right: 10px;
}

.order-right4 {
    float: right;
    background: url("../Content/Images/border-img.png") no-repeat scroll 6px center transparent;
    width: 15px;
    height: 50px;
    border-radius: 5px 5px 5px 5px;
    position: relative;
    right: 20px;
    margin-top: 5%;
}

.order-right3 {
    float: right;
    background: url("../Content/Images/images-1-4.png") no-repeat scroll 6px center;
    width: 50px;
    height: 50px;
    border-radius: 5px 5px 5px 5px;
    cursor: pointer;
    position: relative;
    right: 20px;
    margin-top: 5%;
}

.top-smanjiti {
    position: relative;
    top: 10px;
}

}

.menu-iconDiscountOrder {
    float: left;
    line-height: 34px;
    text-align: center;
    height: 20px;
    padding: 6px;
    border-radius: 5px;
    margin-top: 6px;
    margin-left: -33px;
    background: #00919f
}

    .menu-iconDiscountOrder img {
        margin-top: 5px
    }

        .menu-iconDiscountOrder img:hover {
            cursor: pointer
        }

.pos-modifier-text {
    font-size: 84%;
    font-style: italic;
    display: block;
    height: auto;
    color: red
}

.pos-note-text {
    font-size: 84%;
    display: block;
    height: auto;
    color: red
}

.POS-quick-paybtn {
    cursor: pointer;
    float: left;
    background: #006570;
    color: #fff;
    border-radius: 3px;
    font-size: 14px;
    padding: 6px 12px;
    margin-left: 15px;
    min-width: 168px;
    text-align: center;
    min-height: 30px;
    box-sizing: border-box
}

    .POS-quick-paybtn:hover {
        color: #fff;
        text-decoration: none
    }

.POS-quickpay-icon {
    background: url(../Content/Images/checkout.png);
    width: 17px;
    height: 20px;
    margin-right: 7px;
    display: inline-block
}

.POS-pro-container {
    float: left;
    width: 60%;
    height: 75%;
    position: absolute;
    background: #b6a498
}

.POS_course-wrap-right, .POS_category-wrap-right, .POS_sub-cat-wrap-right, .POS_pro-list-wrap-right, .POS_products-wrap-right {
    float: left;
    width: 100%
}

.POS_course-wrap-right, .POS_category-wrap-right, .POS_sub-cat-wrap-right {
    padding: 8px 10px;
    box-sizing: border-box
}

.POS_course-wrap-right {
    background: #f05253
}

.POS_category-wrap-right {
    background: #04909f
}

.POS_sub-cat-wrap-right {
    background: #006570;
    padding-right: 64px
}

    .POS_course-wrap-right ul, .POS_category-wrap-right ul, .POS_sub-cat-wrap-right ul {
        list-style: none;
        margin: 0;
        padding: 0
    }

        .POS_course-wrap-right ul li, .POS_category-wrap-right ul li, .POS_sub-cat-wrap-right ul li {
            float: left;
            padding: 5px 12px;
            border-radius: 3px;
            color: #fff;
            cursor: pointer;
            font-size: 14px
        }

            .POS_course-wrap-right ul li.POS_selectedli, .POS_category-wrap-right ul li.POS_activeCat, .POS_sub-cat-wrap-right ul li.active {
                background: #f3bc4f
            }

.POS-products-wrap-right {
    padding-top: 15px;
    overflow: auto;
    padding-left: 15px;
    box-sizing: border-box
}

    .POS-products-wrap-right img {
        float: left;
        margin-right: 15px;
        margin-bottom: 15px
    }

.ui-autocomplete {
    background: #0ab !important;
    z-index: 1000
}

.header-left .navbar-default {
    background-color: transparent;
    border: none;
    float: left
}

.header-left .navbar-toggle {
    margin-top: 0;
    padding: 7px 4px;
    margin-bottom: 0;
    margin-right: 10px
}

.header-left .navbar-default .navbar-toggle .icon-bar {
    background-color: #ffcece
}

.header-left .navbar-default .navbar-toggle, .header-left .navbar-default .navbar-toggle:hover, .header-left .navbar-default .navbar-toggle:focus {
    border-color: #98161a;
    background-color: #98161a
}

.header-left .navbar-default .navbar-collapse {
    position: absolute;
    z-index: 102;
    min-width: 250px;
    right: -10px;
    background: #f3bc4f;
    margin-top: 10px;
    border: 1px solid #d4a13a
}

.header-left .navbar-nav .open .dropdown-menu li {
    float: left
}

.header-left .nav > li:first-child {
    margin-left: 10px
}

.header-left .nav > li > a, .header-left .navbar-nav > li > a, .header-left .navbar-nav .open .dropdown-menu > li > a {
    padding: 0
}

.header-left .navbar-nav .open .dropdown-menu {
    float: left;
    padding-left: 10px;
    padding-right: 10px;
    border-top: 1px solid #c69e4f;
    margin-top: 10px
}

.header-left .navbar {
    min-height: 0;
    margin-bottom: 0
}

.posAddProBtn span {
    display: inline-block
}

.pos-PopInputCalc {
    float: left;
    width: 60%
}

    .pos-PopInputCalc > input {
        width: calc(100% - 30px);
        float: left
    }

.pos-QtyWrap {
    width: calc(100% - 120px);
    z-index: 3;
    position: relative;
    background: #1794a3
}

.pos-QtyInputWrap {
    margin-top: 8px;
    width: 97px;
    line-height: 30px
}

.pos-Width60 {
    float: left;
    width: 60%
}

    .pos-Width60 > input {
        width: calc(100% - 30px)
    }

.pos-TextCenter {
    text-align: center !important
}

.pos_PoupDataContainer {
    height: 125px;
    overflow-y: auto;
    padding-bottom: 10px;
    overflow-x: hidden
}

.POS_imgThumb {
    float: left;
    width: 100%;
    margin-top: 10px;
    white-space: nowrap;
    overflow-x: auto;
    overflow-y: hidden
}

    .POS_imgThumb a {
        width: 50px;
        height: 50px;
        display: inline-block;
        background: #1794a3;
        margin-right: 10px;
        border-radius: 3px;
        text-align: center
    }

        .POS_imgThumb a img {
            max-width: 100%;
            height: 100%
        }

.POS_stockInfo {
    position: absolute;
    bottom: -1px;
    right: 0;
    background: rgba(0,0,0,.6);
    border-bottom-right-radius: 8px;
    color: #fff;
    font-size: 13px;
    font-weight: normal;
    padding: 5px 10px
}

.left-content p.VAPOS_grdNameP {
    width: 87%;
    word-wrap: break-word;
    margin: 0;
    padding-top: 5px
}

.pos-btn:first-child {
    margin-left: 0
}

#POS_txtAmountTransfer.CCountText {
    width: calc(100% - 36px);
    width: -moz-calc(100% - 36px);
    width: -webkit-calc(100% - 36px)
}

.pos-denomi-list :last-child {
    margin-left: 10px
}

.disc-icon {
    font-size: 15px;
    padding-left: 0;
    background: none;
    margin-top: 10px
}

.POS_CashPayIputBtn {
    margin-top: 25px;
    float: left;
    width: 50%;
    position: relative;
    padding-left: 10px;
    box-sizing: border-box
}

.POS-order-top {
    min-height: 97px
}

.reserved-chk {
    float: left;
    padding-right: 8px
}

    .reserved-chk input {
        float: left
    }

    .reserved-chk label {
        float: left;
        margin-left: 5px
    }

.pos-PopupContent * {
    box-sizing: border-box
}

.pos-PopupWraptaxAddCustomer .formWrapper .form-group :not(label) {
    width: 59%
}

.pos-PopupWraptaxAddCustomer .formWrapper .form-group .TaxCombo {
    padding: 0
}

.pos-mstrRefreshIco {
    width: 35px;
    float: left;
    height: 35px;
    background: url(../content/Images/mstrrefresh.png) no-repeat center #096771;
    margin-left: 10px;
    margin-top: 7px;
    cursor: pointer;
    border-radius: 7px
}

.ALT-stock-pop {
    float: left;
    width: 33.3333%;
    margin-bottom: 15px;
    box-sizing: border-box
}

    .ALT-stock-pop .pos-PopupInput > select, .pos-PopupInput.altinput-data > input {
        margin-top: 5px;
        width: 100%
    }

.ALT-stock-pop {
    padding: 0 7px
}

    .ALT-stock-pop:nth-child(3) .pos-PopupInput.altinput-data, #POS_HistoryRecords .ALT-stock-pop:nth-child(3) {
        padding-left: 7px
    }

.pos-refund-popup-row label {
    width: 100%
}

.pos-refund-popup-row .pos-PopInputCalc {
    width: 100%
}

    .pos-refund-popup-row .pos-PopInputCalc.pos-refund-input-wrap > input {
        width: 100%
    }

.pos-refund-popup-row .pos-optionSaleRep {
    margin-top: 0;
    float: none;
    display: inline-block
}

.VAPOS_MCurList {
    width: 100%;
    white-space: nowrap;
    overflow: auto;
    float: left
}

.pos-OrdersLogIcon {
    background: url('../Content/Images/orderlog.png') no-repeat center
}

.stk-pos-ContentMainWrap {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 1
}

.pos-PageHeader {
    float: left;
    width: 100%;
    background: #07909f;
    border-bottom: 1px solid #047784;
    height: 39px
}

.pos-OrderLogSearchWrap input {
    width: calc(100% - 40px)
}

.pos-PageHeader h4 {
    float: left;
    color: #fff;
    padding-left: 15px
}

.pos-OrderLogSearchWrap {
    width: 30%;
    float: right;
    padding-top: 10px;
    padding-right: 10px
}

.pos-card-detail-table {
    display: flex;
    flex-flow: column;
    padding: 0 20px
}

.pos-card-table-head {
    display: flex;
    padding: 5px 0;
    background: #07909f
}

    .pos-card-table-head h3 {
        flex: 1;
        font-size: 15px;
        color: #fff;
        margin: 0;
        padding: 0 10px;
        min-width: 60px;
        word-break: break-all
    }

.pos-card-detail-table-body {
    display: flex;
    flex-flow: column
}

.pos-card-table-row {
    display: flex;
    border-right: 1px solid #07909f;
    border-bottom: 1px solid #07909f
}

    .pos-card-table-row p {
        display: flex;
        flex: 1;
        padding: 0 10px;
        color: #fff;
        font-size: 14px;
        margin: 0;
        border-left: 1px solid #07909f;
        min-width: 60px;
        word-break: break-all
    }

.pos-credit-card-detail {
    display: flex;
    width: 100%;
    padding: 0 20px 5px;
    color: #fff
}

.pos-cj-btn-icon {
    display: none;
    position: absolute;
    right: 0;
    height: 34px;
    line-height: 34px;
    top: 0
}

.pos-cj-bp-inn-pop-wrap {
    position: absolute;
    background: #abe6ed;
    width: 100%;
    z-index: 9;
    top: 34px;
    max-height: 175px;
    border-radius: 3px;
    display: flex;
    flex-direction: column;
    display: none
}

.pos-cj-bp-drp-header {
    float: left;
    width: 100%;
    background: #07909f;
    padding: 0 5px;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    display: flex
}

    .pos-cj-bp-drp-header h3 {
        font-size: 14px;
        color: #fff;
        margin: 0;
        padding: 8px 5px;
        display: flex;
        width: 33.333%
    }

.pos-cj-bp-drp-content {
    float: left;
    width: 100%;
    display: flex;
    flex-direction: column;
    height: calc(100% - 31px);
    overflow: auto;
    padding: 0 5px
}

.pos-cj-bp-frm-row {
    display: flex
}

    .pos-cj-bp-frm-row p {
        width: 33.333%;
        padding: 5px;
        margin: 0;
        font-size: 13px;
        color: #046d77
    }

.pos-cj-btn-icon span {
    color: #056e79;
    font-size: 16px;
    cursor: pointer;
    z-index: 9;
    margin-right: 10px
}

.pos-cj-bp-frm-row:hover {
    background: #049aab
}

    .pos-cj-bp-frm-row:hover p {
        color: #fff
    }

.pos-mandatory-label:after {
    content: '*';
    position: relative;
    color: red;
    font-size: 16px
}

.pos_ps_desc {
    display: block;
    width: 100%;
    float: left;
    background: #0094a1
}

.pos_ps_heading {
    width: 100%;
    float: left;
    background: #41dcee;
    display: flex
}

.pos_ps_headDesc {
    width: 47%;
    padding-left: 15px;
    font-size: 14px;
    float: left
}

.pos_ps_headLblPrice {
    float: left;
    width: 15%;
    font-size: 13px
}

.pos_ps_headlblQty {
    float: left;
    width: 15%;
    font-size: 13px
}

.pos_ps_headlblWh {
    float: left;
    width: 20%;
    font-size: 13px;
    display: none
}

.pos_ps_dataDiv {
    width: 100%;
    float: left;
    border-bottom: 1px solid #0ab;
    display: flex
}

.pos_ps_dataASIDesc {
    width: 47%;
    padding-left: 15px;
    font-size: 14px;
    float: left
}

.pos_ps_dataASI {
    float: left;
    width: 15%;
    font-size: 13px
}

.pos_ps_dataPrice {
    cursor: pointer;
    color: #fff
}

.pos_ps_dataDiv h3, .pos_ps_heading h3 {
    margin: 0;
    padding-top: 15px;
    padding-bottom: 15px;
    border-right: 1px solid #0ab;
    padding-left: 15px
}

    .pos_ps_dataDiv h3 input {
        left: 0
    }

.pos-walkInCustomerCountBtn {
    width: 40px;
    height: 40px;
    background-color: #4f3e39;
    border-radius: .9rem;
    display: none;
    float: left;
    margin-left: 5px;
    cursor: pointer
}

.pos-CustCountTxt {
    color: #40e0d0;
    text-align: center;
    vertical-align: middle;
    display: table-cell;
    font-weight: 800
}

@media(max-width:1366px) {
    .pos-CalculatorRight .calculator .left {
        width: 43.55%
    }

    .CashPayCal .calculator .left {
        width: 29.4%
    }

    .pos-PopupWrapDocType {
        top: 4%;
        left: 18%
    }

    .pos-CalculatorLeft .calculator .left, .pos-CalculatorRight .calculator .left {
        padding: 9px 0;
        width: 26%
    }

    .pos-CalculatorRight .calculator .left {
        padding: 12px 0
    }

    .clearBtn {
        padding: 12px 0
    }

    .pos-LeftTopText {
        width: 70%
    }
}

@media(max-width:1366px) {
    .search-input {
        width: 51%
    }
}

@media(max-width:1280px) {
    .searchInputPanel .searchIP .left {
        width: 30%
    }

    .search-input {
        margin-left: 0
    }

    .searchInputPanel {
        margin-left: 50px;
        width: 75%
    }

    .CashPayCal .calculator .left {
        width: 28%
    }
}

@media(max-width:1235px) {
    .medium-text p {
        margin: 0
    }
}

@media(max-width:1152px) {
    .pos-CalculatorRight .calculator .left {
        width: 42.55%
    }

    .clearBtn {
        width: 91.55%
    }

    .search-input {
        width: 47%
    }

    .pos-CalculatorAmmount > label {
        margin-right: 10px
    }

    .cc-3 .right_div_form .text_fields pos-Multivoucheradd, .cc-3 .right_div_form .text_fields .pos-MultivoucherCancel, .cc-3 .right_div_form .text_fields .pos-MultivoucherOK {
        font-size: 13px;
        padding: 10px 10px 10px 37px;
        margin-left: 10px
    }

    .cc-3 .right_div_form .text_fields .addIcon_btn {
        margin-right: 10px !important;
        font-size: 13px;
        padding: 10px 10px 10px 37px
    }

    .pos-CalculatorAmmount {
        width: 47%
    }

    .cc-3 .right_div_form .text_fields.pay-mulivoucherBtns {
        width: 48%
    }
}

@media(max-width:1128px) {
    .user-name123 {
        font-size: 12px
    }

    .pos-LeftTopText {
        width: 64%
    }

    .open-balnce {
        float: left;
        margin-right: 30px;
        color: #fff;
        font-size: 11px
    }
}

@media(max-width:1024px) {
    .pos-CalculatorRight .calculator .left {
        width: 40%
    }

    .CashPayCal .calculator .left {
        width: 28.4%
    }

    .calc_pop_box {
        width: 29.4%
    }

    .pos-PopupWrapDocType {
        top: 6%;
        left: 13%
    }

    .searchInputPanel {
        width: 78%;
        margin-left: 15px
    }

    .search-input {
        width: 40%
    }

    .posTerWidthLeft {
        left: 1px
    }

    .u-name-1 {
        left: 9px
    }

    .cc-3 .right_div .right_div_header input {
        font-size: 15px
    }

    .left-name {
        padding-left: 12px
    }

    .quantity-cola h4 {
        font-size: 15px
    }
}

@media(max-width:999px) {
    .medium-text p {
        margin: 0;
        color: #fff;
        font-size: 12px;
        line-height: 20px;
        font-weight: 200;
        margin-bottom: 1px
    }

    .order-left {
        font-size: 17px
    }

    .pos-LeftTopText {
        width: calc(100% - 110px)
    }
}

@media(max-width:900px) {
    .pos-PopupWrapDocType {
        top: 30%;
        right: -40%
    }

    .searchInputPanel {
        width: 74%;
        margin-left: 15px
    }

        .searchInputPanel .searchIP .left {
            width: 31%
        }

    .wrapper-left {
        overflow-y: auto
    }
}

@media(width:800px)and (height:1280px) {
    .header-menu {
        width: 100%;
        height: 6%
    }

    .ppt {
        overflow-y: auto;
        overflow-x: hidden;
        background: #f3bc4f
    }

    .order {
        background-color: #f3bc4f;
        border-top: 1px solid #ffd478;
        border-bottom: 1px solid #d7a237;
        height: 15%
    }

    .medium-cola {
        height: 23%;
        margin-top: 2%
    }

    .head-footer {
        width: 100%;
        height: 8%
    }

    .footer-left-text-pay {
        text-align: center;
        font-family: helvetica;
        font-weight: 200;
        font-size: 20px;
        margin: 0;
        margin-top: 15px;
        line-height: 40px;
        width: 100%;
        float: left
    }

    .pay {
        background: url('../Content/Images/pay.png');
        width: 60px;
        height: 50px;
        background-repeat: no-repeat;
        background-position: 10px;
        border-radius: 5px;
        cursor: pointer;
        margin-left: 12px;
        float: left
    }

    .footer-left-text {
        float: left;
        text-align: center;
        width: 68%;
        font-family: helvetica;
        font-size: 14px
    }

    .medium-icon {
        background: #00b9ca;
        border-top: 1px solid #00d2e5
    }

    .special-textarea {
        line-height: 74px;
        background: #00abbc;
        border-bottom: 1px solid #099bac;
        border-top: 1px solid #0490a1;
        font-size: 25px
    }
}

@media(max-height:700px) {
}

@media(width:768px)and (height:1024px) {
    .header-menu {
        width: 100%;
        height: 8%
    }

    .searchInputPanel .searchIP .left {
        width: 30%
    }

    .searchInputPanel {
        width: 76%
    }

    .order {
        background-color: #f3bc4f;
        width: 100%;
        border-top: 1px solid #ffd478;
        border-bottom: 1px solid #d7a237;
        height: 16%
    }

    .ppt {
        overflow-y: auto;
        overflow-x: hidden;
        background: #f3bc4f
    }

    .medium-cola {
        height: 33%;
        margin-top: 2%
    }

    .medium-icon {
        background: #00b9ca;
        border-top: 1px solid #00d2e5
    }

    .head-footer {
        width: 100%;
        height: 9%
    }

    .pay {
        background: url('../Content/Images/pay.png');
        width: 60px;
        height: 50px;
        background-repeat: no-repeat;
        background-position: 10px;
        border-radius: 5px;
        cursor: pointer;
        margin-left: 12px;
        float: left
    }

    .footer-left-text-pay {
        text-align: center;
        font-family: helvetica;
        font-weight: 200;
        font-size: 11px;
        margin: 0;
        margin-top: 20px;
        line-height: 40px;
        width: 100%;
        float: left
    }
}

@media(max-width:1215px) {
    .add-extra {
        background: url('../Content/Images/plus.png');
        width: 33px;
        height: 33px;
        background-repeat: no-repeat;
        background-color: #00aed2;
        background-position: 7px;
        border-radius: 5px;
        cursor: pointer;
        margin: 0 auto;
        text-align: center
    }

    .add-extra1 {
        background: url('../Content/Images/poz1.png');
        width: 44px;
        height: 38px;
        background-repeat: no-repeat;
        background-position: 7px;
        border-radius: 5px;
        cursor: pointer;
        margin: 0 auto;
        text-align: center
    }

    .discound-order {
        background: url('../Content/Images/discount.png');
        width: 33px;
        height: 33px;
        background-repeat: no-repeat;
        background-color: #00aed2;
        background-position: 7px;
        border-radius: 5px;
        cursor: pointer;
        margin: 0 auto;
        text-align: center
    }

    .discound-order1 {
        background: url('../Content/Images/poz2.png');
        width: 60px;
        height: 50px;
        background-repeat: no-repeat;
        background-position: 7px;
        border-radius: 5px;
        cursor: pointer;
        margin: 0 auto;
        text-align: center
    }
}

@media(max-width:1100px) {
    .content-1 {
        padding-bottom: 10px;
        padding-right: 10px;
        position: relative;
        left: 20px
    }

    .POS-quick-paybtn {
        min-width: 130px !important
    }

    .CPayText {
        width: calc(100% - 30px);
        width: -moz-calc(100% - 30px);
        width: -webkit-calc(100% - 30px)
    }

    .pos-PopupBtn1 {
        margin-top: 10px
    }
}

@media(max-width:900px) {
    .ppt {
        height: 67%
    }

    .order-bottom, .left-name {
        width: 100%
    }

    .order-bottom {
        height: 100%
    }

    .header-menu {
        width: 100% !important;
        position: relative
    }

    .header-right {
        width: 100%;
        background: url('../Content/Images/header-right.png');
        border-top-left-radius: 3px;
        border-top-right-radius: 3px;
        border-bottom: 0 solid #a9938e;
        float: right;
        height: 14%
    }

    .footer-left-text-pay {
        line-height: 40px
    }

    .footer-right-100 {
        width: 100%;
        background: #867575;
        float: right;
        position: relative;
        bottom: 0;
        height: 100%
    }

    .footer {
        width: 100%;
        background: #39d7fc;
        position: relative;
        bottom: 0;
        float: left;
        height: 100%;
        clear: both
    }

    div.cc {
        height: 100%;
        overflow-x: hidden;
        background: url('../Content/Images/bg-right.png');
        background-size: cover;
        width: 100%;
        float: right
    }

    div.cc-2 {
        height: 100%;
        overflow-x: hidden;
        overflow-y: scroll;
        background: #00c5d7;
        background-size: cover;
        width: 100%;
        float: right
    }

    .znj {
        height: 100%;
        float: left;
        width: 100%;
        clear: both
    }

    .header-left {
        width: 100%;
        background-color: #ff4e5d;
        border-bottom: 1px solid #917740;
        border-top-left-radius: 3px;
        border-top-right-radius: 3px;
        float: left;
        height: 100%
    }
}

@media(max-width:840px) {
    .content-1 {
        padding-bottom: 10px;
        padding-right: 10px;
        position: relative;
        left: 20px
    }
}

@media(max-height:750px) {
}

@media(max-height:700px) {
    .ppt {
    }

    .order-bottom {
    }
}

@media(max-width:506px) {
    .content-1 {
        padding-bottom: 10px;
        padding-right: 10px;
        position: relative;
        left: 20px
    }
}

@media(max-width:767px) {
    .pos-PopupWraptaxAddCustomer {
        width: 90%
    }

    .pos-btn {
        max-width: 120px;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden
    }

    .pos-btnitems {
        color: #fff;
        border-radius: 3px;
        padding: 10px 15px;
        margin-left: 10px;
        display: inline-block;
        margin-bottom: 0;
        font-weight: 400;
        text-align: center;
        vertical-align: middle;
        cursor: pointer;
        background-image: none;
        border: 1px solid transparent;
        white-space: nowrap;
        padding: 6px 12px;
        font-size: 14px;
        line-height: 1.42857143;
        border-radius: 4px;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none
    }

    .left-name {
        width: 100%
    }

    .header-user i {
        float: left;
        width: 30px;
        height: 30px;
        text-align: center;
        line-height: 20px;
        border-radius: 5px;
        margin-right: 10px;
        cursor: pointer;
        background-color: #98161a;
        color: #ffcece;
        line-height: 30px;
        font-size: 16px
    }

        .header-user i img {
            max-width: 100%;
            float: left
        }

    .header-user .lupa-p {
        background: rgba(0,0,0,.26) url('../Content/Images/search1.png') no-repeat center;
        margin-right: 10px
    }

    .header-user .lupa-p-bp {
        background: rgba(0,0,0,.26) url('../Content/Images/add-customer.png') no-repeat center
    }

    .user-name123 {
        font-size: 14px !important;
        width: 40%;
        padding-left: 10px
    }

    .order-left {
        left: 10px
    }

    .POS_totalqtys {
        padding-left: 10px
    }

    .footer-right-100 {
        width: 100%;
        float: left;
        height: auto
    }

    .head-content {
        height: 78.1% !important;
        position: relative;
        float: left
    }

    .ppt {
        height: 50.8%
    }

    .znj {
        width: 100%;
        position: relative
    }

    .pos-ModifireUlWrap li {
        padding-top: 4px
    }

    .logout {
        margin: 12px auto
    }

    .POS-quick-paybtn {
        margin-top: 3px;
        margin-left: 10px;
        padding: 5px 12px
    }

    .disc-icon {
        width: 25px;
        margin-left: -40px;
        font-size: 12px
    }

    .u-name {
        font-size: 13px
    }

    .order-rightSendKitchen, .order-rightToggle, .order-right3, .pos-utilitybtn, .Utility-rightMastersync, .Utility-rightMaster, .Utility-cacheReset, .rightPromoCode, .order-rightPromoCode, .Utility-rightCashJournal {
        width: 35px;
        height: 35px;
        margin-right: 10px;
        right: 0;
        padding: 0
    }

    .pos-utilitybtn {
        margin-bottom: 10px
    }

    .posbrown-btn, .order-rightpck, .order-right1, .order-rightRet, .order-right2, .refresh-Button {
        margin-right: 10px
    }

    .order-right, .posbrown-btn, .pay, .print-guest-check, .dining-option, .discound-order2, .print-guest-check1, .order-rightpck, .order-right1, .POS_alterIcon, arrow-back i, .order-rightRet, .order-right2, .refresh-Button {
        width: 35px;
        height: 35px;
        background-color: #4d3b04
    }

    .order-right, .order-rightSendKitchen, .POS_alterIcon, .order-rightToggle, .order-right3, .posbrown-btn, .pos-utilitybtn, .pay, .print-guest-check, .dining-option, .discound-order2, .print-guest-check1, .order-rightpck, .order-right1, .order-rightRet, .order-right2, .refresh-Button {
        border-radius: 7px
    }

    .order-rightSendKitchen, .order-rightToggle, .order-right3, .pos-utilitybtn {
        background-color: #006570
    }

    .order-right4 {
        height: 35px;
        margin-top: 5px
    }

    .pay, .print-guest-check, .dining-option, .discound-order2, .print-guest-check1 {
        margin-top: 5px
    }

    .order-rightpck, .order-right1, .order-rightRet, .order-right2 {
        margin-top: 0
    }

    .poschnge-odertype ul {
        background-color: #f3bc4f;
        box-shadow: none;
        margin-top: 16%;
        border: 1px solid #d4a13a;
        left: 20px
    }

        .poschnge-odertype ul li:first-child {
            margin-left: 5px
        }

    .pos-utilitybtn {
        right: 0;
        text-indent: -99999px
    }

    .poschnge-odertype ul li, .posbrown-btn, .arrow-back, .refresh-Button {
        float: left
    }

        .poschnge-odertype ul li a {
            padding: 0
        }

    .header-user, .header-user .pull-right {
        margin-top: 5px
    }

    .header-menu {
        height: 9%;
        min-height: 45px
    }

    .order-margin {
        margin-top: 6px
    }

    .cola-img {
        margin-left: 0;
        margin-right: 0
    }

    .pos-cd-popupwrap {
    }

    .pos-denomination {
        margin-left: 0
    }

    .pos-PopupHeader > h4 {
        padding: 10px 15px
    }

    .pos-optionSaleRep {
        padding: 0 5px;
        margin-right: 4px;
        min-width: 75px;
        margin-bottom: 10px;
        margin-top: 0
    }

    .step_wrapperSales {
        border-bottom: none;
        padding: 10px 0 0 10px
    }

    .pos-TaxTableHead > p, .pos-TaxTablefooter > p, .chngepasspop-field {
        width: 100%;
        float: left
    }

    .pos-TaxTableHead > p, .pos-TaxTablefooter > p {
    }

    .HistoryText, div.cc {
        width: 100%
    }

    .DateTimeHistory {
        width: calc(100% - 45px);
        width: -moz-calc(100% - 45px);
        width: -webkit-calc(100% - 45px)
    }

    .pos-TaxTableHead {
    }

    .cc-3 .right_div_form {
        padding: 0
    }

        .cc-3 .right_div_form .pos-CalculatorHeader .text_fields {
            margin-bottom: 0
        }

    .AddExtraItemCal {
        margin-left: 69px
    }

    .AddExtraItemCal, .ChangeOldPasswordCal, .ChangeNewPasswordCal, .ChangeConfirmPasswordCal {
        width: 67%
    }

    .ChangeOldPasswordCal, .ChangeNewPasswordCal, .ChangeConfirmPasswordCal {
        margin-left: -165px
    }

    .AddExtraItemCal .calculator .left {
        width: 29%;
        font-size: 18px;
        padding: 5px 0
    }

    .ChangeOldPasswordCal .calculator .left, .ChangeNewPasswordCal .calculator .left, .ChangeConfirmPasswordCal .calculator .left {
        padding: 1px 0
    }

    .pos-holdunholdpop {
        min-height: .01%;
        overflow-x: auto;
        width: 100%
    }

    .holdunhold-inner {
        display: table
    }

        .holdunhold-inner .pos-TaxTableHead {
            display: table-row;
            padding-bottom: 5px
        }

            .holdunhold-inner .pos-TaxTableHead > p {
                display: table-cell;
                white-space: nowrap;
                width: auto;
                float: none !important;
                text-align: center !important
            }

    .pos-TaxTableHead {
    }

    .pos-HoldOrderRow > td {
        width: 15%;
        padding: 10px 6px
    }

    .pos-HistoryRecordWrap .pos-HoldOrderRow > td {
        float: left;
        padding: 10px 0
    }

    #POS_HoldOrderContent .pos-HoldOrderRow > td {
        min-width: 65px
    }

    .pos-btn {
        padding: 6px 5px;
        float: left;
        margin-left: 10px;
        font-size: 12px
    }

    .CCountText {
        width: 36%
    }

    .pos-PopupContent {
        padding: 10px
    }

    .pos-PopupTickIcon {
    }

    .CashCountCal {
        width: 55%;
        margin-left: -119px
    }

    .PromotionFreeCbox {
        float: left;
        margin-right: 10px;
        margin-top: 0
    }

    .PromotionFreelabel {
        width: auto;
        font-weight: normal
    }

    .CashCountCalTfr {
        margin-left: -175px
    }

    #POS_DenomCCountContent.pos-PopupContent {
        overflow-y: auto
    }

    .rightmain-wrap {
        position: absolute;
        z-index: 101;
        transition: all ease-in .3s;
        -moz-transition: all ease-in .3s;
        -webkit-transition: all ease-in .3s;
        height: 100%;
        width: 0;
        right: 0
    }

    .mini-footer {
        height: auto
    }

    .onlineStatus, .offlineStatus {
        margin-right: 10px
    }

    .printerAvailable, .Utility-right1 {
        margin-right: 0
    }

    .add1 {
        margin-top: 0
    }

    .pos-TaxTableHead > p input {
        padding-left: 10px
    }

    .pos-TaxTableHead > p input, .cc-2 *, .cc-3 * {
        box-sizing: border-box
    }

    .content-products {
        padding-right: 11px
    }

    .con {
        width: 97px
    }

    .bgg {
        height: 65px
    }

    .productbgg {
        height: 105px;
        line-height: 105px
    }

    .bgg, .potato-bg-Test {
        font-size: 11px
    }

    .potato-bg-Test {
        padding: 5px
    }

    .quantity-cola {
        padding: 4px 4px
    }

        .quantity-cola h4 {
            font-size: 13px;
            z-index: 2;
            position: relative
        }

        .quantity-cola > button {
            width: 23px;
            height: 23px
        }

    .amount_img {
        margin-left: 4px
    }

    .trash-icon, .menu-icon {
        width: 35px;
        height: 35px
    }

    .third-pp-PlusImg, .third-pp-MinusImg {
        width: 33px;
        height: 33px
    }

    .third-pp-PlusImg, .third-pp-MinusImg {
        margin-left: 10px
    }

    .trash-icon img, .menu-icon img, .medium-icon {
        width: 100%
    }

    .cola-img, .cola-img1 {
        max-width: 100%;
        vertical-align: middle;
        line-height: 155px;
        width: 100%;
        padding: 5px 0;
        height: 170px;
        border-bottom: 1px solid #63d0dd;
        margin-top: 10px;
        margin-left: 0
    }

        .cola-img img, .cola-img1 img {
            max-width: 100%;
            max-height: 100%;
            margin: 0 auto;
            min-width: inherit;
            width: auto
        }

    .quantity-cola span {
        margin-right: 0;
        margin-top: 0
    }

    .max-width-is {
        width: 100%
    }

    .medium-text {
        width: 100%
    }

        .medium-text h2 {
            width: 100%;
            float: left;
            font-size: 13px
        }

    .UOMConversions {
        padding: 0;
        margin-top: 10px
    }

    div.cc-2 {
        overflow-y: auto
    }

    .chocolate-ferrero {
        max-width: inherit;
        max-height: inherit;
        width: 100%;
        padding: 15px 15px 0;
        margin-bottom: 10px
    }

    .quantity-cola .CashPayCal {
        z-index: 0
    }

    .slika-tekst img {
        width: 40px;
        height: 40px;
        margin-bottom: 10px
    }

    .slika-tekst h2 {
        width: 80%;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
        margin: 0;
        line-height: 40px
    }

    .DiscAmtCal, .DiscPercntCal {
        margin-left: -121px
    }

    .promofree-check {
        width: 100%;
        padding-right: 8px
    }

        .promofree-check input {
            margin: 0 7px 0 0
        }

        .promofree-check, .promofree-check input, .promofree-check label, #POS_AttPanelTxtArea.special-textarea {
            float: left
        }

    .quantity-cola1 {
        float: right;
        margin-top: 10px
    }

        .quantity-cola1 img {
            top: 0;
            margin-left: 0
        }

    #POS_AttPanelTxtArea.special-textarea {
        width: 100%
    }

    .color-att {
        left: 0
    }

    .cc-3 .left_menu {
        width: 100%;
        height: auto
    }

        .cc-3 .left_menu ul {
            text-align: left;
            overflow-x: auto;
            overflow-y: hidden;
            height: 80px;
            white-space: nowrap;
            padding-left: 7px;
            padding-right: 7px;
            width: 72%;
            display: inline-block;
            float: left;
            margin: 0
        }

        .cc-3 .left_menu li {
            display: block;
            margin-bottom: 0;
            display: inline-block;
            text-align: center;
            margin: 0 5px 0;
            width: auto
        }

    .pos-CalculatorAmmount {
        width: 100%;
        margin-bottom: 10px
    }

        .pos-CalculatorAmmount > input, .calc_pop_box {
            width: 64%
        }

        .pos-CalculatorAmmount > input, .CPayText, .pos-denomination, .cc-3 .right_div .right_div_header input {
            padding: 6px
        }

        .pos-CalculatorAmmount > label, .Calculator-done {
            font-size: 14px
        }

    .pos-CalculatorDoneBtn {
        float: right;
        margin-left: 10px;
        margin-right: 10px
    }

    .pos-CalculatorWrap .pos-denomination {
        margin-top: 10px
    }

    .pos-CalculatorWrap {
        height: 63%
    }

    .CPayText {
        margin-left: 0
    }

    .pos-PopupBtn1 {
        width: auto;
        padding-left: 0
    }

        .pos-PopupBtn1 .btn {
            float: right
        }

    .cc-3 .right_div .right_div_header li {
        width: 44%;
        margin-left: 10px;
        margin-bottom: 5px
    }

        .cc-3 .right_div .right_div_header li:first-child {
            margin-left: 10px
        }

    .pos-PopupCloseIcon {
    }

    .cc-3 .right_div .right_div_header > ul {
        margin: 5px 0 0 0
    }

    .cc-3 .right_div_header {
        border-bottom: none
    }

    .cc-3 .right_div_form .text_fields .cancel_btn, .cc-3 .right_div_form .text_fields .ok_btn {
        float: right;
        margin-right: 10px
    }

    .cc-3 .right_div_form .text_fields .cancel_btn {
        margin-left: 0
    }

    .cc-3 .right_div_form .text_fields .ok_btn {
        margin-left: 0
    }

    .payment-text-fields {
        left: 10px
    }

    .cc-3 .right_div_form .text_fields .text_fields_right {
        width: 70%;
        padding: 0 10px 0 15px
    }

        .cc-3 .right_div_form .text_fields .text_fields_right .amount {
            width: 100%;
            margin-left: 0
        }

    .cc-3 .right_div_form form .text_fields .text_fields_right .amount {
        width: calc(100% - 35px)
    }

    .cc-3 .right_div {
        height: calc(100% - 96px);
        height: -moz-calc(100% - 96px);
        height: -webkit-calc(100% - 96px);
        width: 100%;
        position: relative
    }

    .postransaction-wrap {
        float: left;
        width: 100%;
        height: calc(100% - 115px);
        height: -moz-calc(100% - 115px);
        height: -webkit-calc(100% - 115px);
        overflow-y: auto;
        overflow-x: hidden
    }

    .cc-3 .right_div .right_div_header input {
        height: 30px
    }

    .cc-3 .right_div .right_div_header input, .pos-PopupInput input {
        font-size: 14px
    }

    .pos-CalculatorAmmount > label {
        width: 25%;
        vertical-align: middle;
        margin-bottom: 0
    }

    .cc-3 .right_div_form .text_fields .text_fields_left {
        line-height: 20px;
        text-align: left;
        padding-left: 10px;
        margin-right: 0
    }

    .pi, .pic {
        width: 21px;
        height: 21px
    }

    .pos-Input::-webkit-input-placeholder {
        font-size: 14px
    }

    .pos-Input::-moz-placeholder {
        font-size: 14px
    }

    .pos-Input:-moz-placeholder {
        font-size: 14px
    }

    .pos-Input:-ms-input-placeholder {
        font-size: 14px
    }

    .pos-InputPrice::-webkit-input-placeholder {
        font-size: 14px
    }

    .pos-InputPrice::-moz-placeholder {
        font-size: 14px
    }

    .pos-InputPrice:-moz-placeholder {
        font-size: 14px
    }

    .pos-InputPrice:-ms-input-placeholder {
        font-size: 14px
    }

    .poschnge-odertype ul {
        right: 20px;
        left: inherit
    }

    .customer-search {
        margin: 5px auto
    }

    .customer-result {
        max-height: 100%;
        width: 100%;
        height: 100%;
        margin-top: 0
    }

    .customer-result1 {
        max-height: 85%;
        height: calc(100% - 76px);
        height: -moz-calc(100% - 76px);
        height: -webkit-calc(100% - 76px)
    }

    .first-p {
        border-top-left-radius: 0;
        border-top-right-radius: 0
    }

    .pos-PopupBtn {
        margin-top: 10px
    }

    .special-textarea input {
        font-size: 24px
    }

    .TaxCombo {
        padding: 0
    }

    .cls_input_big {
        right: 0
    }

    .pos-PopupWrapDiscountLine .pos-PopupContent {
        height: auto
    }

    .POS-HomeTopIcons {
        position: absolute;
        right: 0
    }

    .price-margin, .disc-icon {
        margin-top: 0
    }

    .pos-denomiPay-list input {
        width: 44%;
        font-size: 14px;
        padding-right: 5px
    }

    .payment-method {
        width: 100%
    }

    .payment-method {
        left: 0;
        padding: 0 10px
    }

    .cc-3 .right_div_form .text_fields {
        float: right
    }

    .card-btn {
        font-size: 14px;
        padding: 0 10px
    }

    .pos-CalculatorLeft .calculator .left, .pos-CalculatorRight .calculator .left {
        font-size: 20px
    }

    .pos-CalculatorRight .calculator .left, .clearBtn {
        font-size: 18px
    }

    .clearBtn {
        padding: 7px 0
    }

    .pos-PopupWrapHold {
    }

    .pos-holdWrapMob {
        height: 80%
    }

    .pos-PopupTableContent {
        height: calc(100% - 40px);
        height: -moz-calc(100% - 40px);
        height: -webkit-calc(100% - 40px);
        box-sizing: border-box;
        padding-bottom: 10px
    }

    .pos-PopupDriveInTableContent {
        height: calc(100% - 60px);
        height: -moz-calc(100% - 50px);
        height: -webkit-calc(100% - 50px);
        box-sizing: border-box;
        padding-bottom: 10px
    }

    .pos_PopHoldOrderFixedHead {
        position: fixed;
        width: 100%;
        height: 40px;
        background: #09b3c6;
        z-index: 0
    }

    .pos_PopHoldOrderDataWrap {
        height: calc(100% - 54px);
        height: -moz-calc(100% - 54px);
        height: -webkit-calc(100% - 54px);
        overflow-y: hidden;
        overflow-x: auto;
        margin-bottom: 10px
    }

    .pos-CalculatorLeft {
        width: 42%
    }

        .pos-CalculatorLeft .calculator .left {
            width: 24%
        }

    .pos-dnomibtnsMob {
        position: absolute;
        bottom: 10px;
        right: 10px
    }

    .pos_PoupDataContainer {
        height: calc(100% - 40px);
        width: -webkit-fit-content;
        padding-left: 10px;
        box-sizing: border-box
    }

    .pos-PopupWraptaxCashCount {
    }

    .pos-btn {
        font-size: 12px
    }

    .order-remark {
        display: inline-block;
        padding-top: 10px;
        border-top: none;
        margin-left: 9px;
        padding-left: 7px;
        border-left: 1px solid #0792a2;
        width: auto
    }

    .searchInputPanel {
        width: 84%;
        margin-left: -6px
    }

    span.notify-bubble {
        right: -6px;
        top: -14px;
        width: 25px;
        height: 25px;
        line-height: 25px
    }

    .pos-HoldOrderRow td.posHoldTblRows {
    }

    .pos-CalculatorRight {
        margin-top: 5px
    }

    .pos-HoldOrderPopHead {
        width: auto
    }

    .pos-SetModifireDiv h4 {
        margin-left: 10px
    }

    .pos-ModifireUlWrap {
        padding-left: 10px
    }

    .pos-OlOrderMapWrap {
        width: 98%
    }

    .pos-OlOrderMapList {
        max-width: 100%;
        height: 200px;
        padding-top: 10px;
        overflow: hidden
    }

        .pos-OlOrderMapList ul {
            padding: 0
        }

    .pos-OlOrderPopupWrap {
        height: 90%
    }

    .pos-OlOrderContent {
        overflow-y: auto;
        overflow-x: hidden
    }

    .arrow-back i {
    }

    .search {
        width: 57%
    }

    .calendar {
        width: 43%
    }

    .pos-SearchMobCol-35 {
        width: 35%
    }

    .pos-DayEndShiftWrap ul input, #POS_CLDayendDateShift input {
        margin-top: 0
    }
}

@media(max-height:600px) {
    .head-content {
        height: 62.5%
    }

    .ppt {
        height: 53.2%
    }

    .mini-footer {
        height: 30px
    }

    .head-footer {
        height: 19.2%
    }

    .order {
        height: 18%
    }

    .calendar, .search {
        margin-top: 5px
    }

    .pos-PopupWraptax, .pos-PopupWrapDiscountLine {
        top: 45%
    }

    #POS_ChangePwdPopup.pos-PopupWrap {
        top: 35%
    }

    .calc-pop-box .calculator .left {
        padding: 5px 1px
    }

    .cc-3 .right_div .right_div_header > ul {
    }

    .pos-PopupWraptaxCashCount {
        margin: 1% auto
    }

    .pos-CalculatorLeft .calculator .left {
        padding: 5px 0
    }
}

@media(max-height:600px)and (min-height:570px) {
    .head-content {
        height: 63.5%
    }

    .pos-PopupWraptaxCashCount {
        height: 82%
    }

    .pos-CashMobBtns {
        position: absolute;
        bottom: 15px;
        right: 15px
    }

    .POS-quick-paybtn {
        padding: 2px 12px
    }
}

@media(max-width:600px)and (min-width:400px),(max-height:1024px)and (min-height:850px) {
    .head-content {
        overflow-y: auto;
        overflow-x: hidden
    }

    .ppt {
        height: 72% !important
    }

    .footer-left-text-pay {
        line-height: normal;
        font-size: 11px
    }

    .user-name123 {
        width: 100%
    }

    .pos-PopupWrapUtilityType {
        left: 6%
    }

    .product-result-header, .product-search {
        width: 90%
    }
}

@media(max-width:1024px)and (min-width:850px),(max-height:600px)and (min-height:400px) {
    .u-name {
        font-size: 13px
    }

    .POS_totalqtys {
        width: 60%;
        font-size: 11px
    }

        .POS_totalqtys input {
            width: 40%;
            max-width: 90px
        }

    .header-user {
        margin-top: 2%
    }

    .Utility-right-Return, .Utility-right {
        margin-left: 10px
    }

    .Utility-right-Return {
        margin-right: 0
    }

    .ppt {
    }

    .mini-footer {
    }

    .order-left {
        width: 57%;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden
    }
}

@media only screen and (min-device-width:600px)and (max-device-width:1024px)and (orientation:portrait) {
    .header-menu {
        height: auto
    }

    .header-right {
        height: 6.5%
    }

    .head-content {
        height: 66.6% !important
    }

    .ppt {
        height: calc(100% - 118px) !important
    }

    .znj, div.cc {
        height: 50%
    }

    .order-bottom {
        height: auto !important
    }

    .footer-right-100, .mini-footer {
        height: auto
    }

    .add.col-16.all-bg {
        padding-bottom: 10px
    }

    .search {
        width: 53%
    }

    .header-user .lupa-p {
        margin-right: 0
    }

    .pos-PopupWrapDocType {
        top: 20%;
        left: auto;
        margin: 0;
        right: 50px
    }

    .order-rightpck, .order-right1, .order-rightRet, .order-right2 {
        margin-top: 5px
    }

    .pos-payment-resolution, .cc-3 .left_menu {
        width: 14%
    }

    .cc-3 .left_menu, .cc-3 .right_div {
        height: 100%
    }

    .cc-3 .right_div {
        width: 85%
    }

    .cc-3 .left_menu ul {
        overflow-x: initial;
        overflow-y: initial;
        height: auto;
        white-space: nowrap;
        padding-left: 7px;
        padding-right: 7px;
        width: 100%;
        display: block;
        float: left;
        margin: 0
    }

    .cc-3 .left_menu li {
        display: block !important;
        margin-bottom: 0;
        text-align: center;
        margin: 0 0 15px;
        width: 100%
    }

    .order-remark {
        display: block;
        padding-top: 10px;
        border-top: none;
        margin-left: 0;
        padding-left: 0;
        border-top: 1px solid #0792a2;
        width: 100%
    }

    .cc-3 .left_menu p {
        white-space: normal
    }

    .pos-PopupBtn1 {
        width: 40%;
        margin-top: 0
    }

    .pos-CalculatorAmmount {
        width: 80%
    }

    .pos-CalculatorDoneBtn {
        margin-left: 10px
    }

    .customer-result1 {
        max-height: 600px;
        height: auto
    }

    .pos-HoldOrderPopHead, .pos_PopHoldOrderFixedHead {
        width: 100%
    }

    .pos-HoldOrderRow td.posHoldTblRows {
        padding-left: 10px;
        padding-left: 10px;
        padding-right: 10px;
        max-width: 185px
    }

    #POS_HoldOrderContent .pos-HoldOrderRow > td {
        min-width: 41px
    }

    .refresh-Button {
        background-position: initial
    }

    .Utility-rightMastersync, .Utility-rightMaster, .Utility-cacheReset {
        width: 40px;
        height: 40px;
        padding: 10px
    }
}

@media only screen and (min-device-width:768px)and (max-device-width:1024px)and (orientation:portrait) {
    .header-menu {
        height: 6%
    }

    .header-user {
        margin-top: 12px
    }

    .head-content {
        height: 65% !important
    }

    .ppt {
        height: calc(100% - 119px) !important
    }

    .search {
        width: 43%
    }

    .pos-PopupWraptaxAddCustomer {
        width: 80%
    }

    .searchInputPanel .searchIP .left {
        width: 29.5%
    }
}

@media(max-width:599px) {
    .wrapper-left {
    }

    .posPayamtInfo {
        width: 50%
    }

    .order-bottom {
        height: auto !important;
        padding-bottom: 5px
    }

    .VAPOS_grdNameP {
        float: left;
        word-wrap: break-word;
        width: 95%
    }

    .order-rightpck, .order-right1, .order-rightRet, .order-right2 {
        right: 0
    }

    .search {
        width: 94%;
        margin-bottom: 20px;
        margin-left: 20px;
        margin-right: 0
    }

    .search-input {
        width: calc(100% - 90px);
        width: -moz-calc(100% - 90px);
        width: -webkit-calc(100% - 90px)
    }

    .btn-search {
        background-color: #4f3e39
    }

    .product-search {
        margin-top: 14%;
        width: 87%
    }

    .lupa-1 {
        margin-top: 0
    }

    .product-result-header {
        width: 100%;
        right: 0;
        margin-top: 0;
        top: 0;
        height: 100%;
        max-height: 100%
    }

    .tt {
        display: none
    }

    .close-22 {
        width: 30px;
        height: 30px;
        margin-top: -10px;
        margin-right: 0
    }

    .product-result {
        max-height: 100%;
        height: calc(100% - 90px);
        height: -moz-calc(100% - 90px);
        height: -webkit-calc(100% - 90px)
    }

    #POS_ChangePwdPopup.pos-PopupWrap {
        top: 30%
    }

    .order-left {
        margin-top: 0
    }

    .POS_totalqtys {
        width: 55%
    }

        .POS_totalqtys input {
            width: 30%
        }

    .POS_alterIcon, .order-right, .order-right3, .POS_totalqtys {
        margin-bottom: 5px
    }

    .cc-3 .right_div_form .text_fields .text_fields_left {
        line-height: 16px
    }

    .orderMobCls {
        height: 20.2%
    }

    .ppt {
        height: 51%
    }

    .mobcol-15 {
        width: 15%
    }

    .mobcol-22 {
        width: 22%
    }

    .mobcol-23 {
        width: 23%
    }

    .mobcol-25 {
        width: 25%
    }

    .mobcol-20 {
        width: 20%
    }

    .second-pp .sen-n {
        font-size: 12px
    }

    .head-footer {
        max-height: 25px
    }

    .pos-CusTopIco {
        float: right;
        width: 100%
    }
}

@media(max-height:400px) {
    .ppt {
        height: 100px
    }

    .head-content {
        height: 64.2% !important
    }

    .pos-PopupWraptaxCashCount {
        left: 10px
    }
}

@media(min-width:700px) {
    .ui-keyboard-button {
        height: 3em;
        min-width: 3em
    }
}

@media(min-width:600px) {
    ::-webkit-scrollbar {
        width: 5px;
        height: 5px
    }

    ::-moz-scrollbar {
        width: 4px
    }

    ::-webkit-scrollbar-track {
        background-color: #fff;
        border-left: 1px solid #fff;
        border-radius: 10px
    }

    ::-moz-scrollbar-track {
        background-color: #fff;
        border-left: 1px solid #fff;
        border-radius: 10px
    }

    ::-webkit-scrollbar-thumb {
        background-color: #444;
        border-radius: 10px
    }

    ::-moz-scrollbar-thumb {
        background-color: #444;
        border-radius: 10px
    }

    ::-webkit-scrollbar-thumb:hover {
        background-color: #000
    }

    ::-moz-scrollbar-thumb:hover {
        background-color: #000
    }
}

.patt-holder {
    background: #3382c0;
    -ms-touch-action: none
}

.patt-wrap {
    position: relative;
    cursor: pointer
}

    .patt-wrap ul, .patt-wrap li {
        list-style: none;
        margin: 0;
        padding: 0
    }

.patt-circ {
    position: relative;
    float: left;
    box-sizing: border-box;
    -moz-box-sizing: border-box
}

    .patt-circ.hovered {
        border: 3px solid #090
    }

.patt-error .patt-circ.hovered {
    border: 3px solid #ba1b26
}

.patt-hidden .patt-circ.hovered {
    border: 0
}

.patt-dots {
    background: #fff;
    width: 10px;
    height: 10px;
    border-radius: 5px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -5px;
    margin-left: -5px
}

.patt-lines {
    border-radius: 5px;
    height: 10px;
    background: rgba(255,255,255,.7);
    position: absolute;
    transform-origin: 5px 5px;
    -ms-transform-origin: 5px 5px;
    -webkit-transform-origin: 5px 5px
}

.patt-hidden .patt-lines {
    display: none
}

@charset "utf-8";

* {
    font-family: Helvetica,sans-serif
}

body {
    background: #f9c869;
    margin: 0;
    padding: 0
}

.pos-logoutClose {
    float: left;
    position: absolute;
    right: 0;
    top: 0;
    background: url('../Content/Images/logout-icon.png');
    width: 70px;
    height: 62px;
    cursor: pointer
}

.pos-login-wrapper {
    width: 48%;
    margin: auto;
    min-width: 350px;
    position: absolute;
    z-index: 2;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    height: 341px
}

.pos-login-wrapper2 {
    width: 100%;
    float: left
}

.pos-login-left-wrap {
    width: 47%;
    float: left
}

.pos-company-logo, .pos-form {
    width: 100%;
    float: left
}

    .pos-company-logo > img {
        width: 100%
    }

.pos-login-left-wrap > h4, .pos-login-right-wrap > h4 {
    float: left;
    width: 100%;
    font-size: 20px;
    color: #fff;
    font-weight: normal;
    padding: 0;
    margin-top: 15px;
    margin-bottom: 20px
}

.pos-form-right, .pos-form {
    border: 1px solid #41dcee;
    width: 100%;
    float: left;
    border-radius: 3px;
    margin-bottom: 10px;
    background-color: #fff;
    height: 40px
}

.pos-login-btns {
    color: #fff;
    background-color: #41dcee;
    border-radius: 3px;
    width: 100%;
    padding: 10px 0;
    float: left;
    text-align: center;
    cursor: pointer
}

.pos-login-tick {
    width: 19px;
    height: 19px;
    background-image: url('../Content/Images/online-tick.png');
    float: right;
    position: relative;
    top: -14px;
    right: -5px
}

.pos-login-right-wrap {
    width: 48%;
    float: right;
    margin-left: 15px
}

.pos-form-right > img, .pos-form > img {
    height: auto;
    vertical-align: middle;
    padding: 0 2px
}

.pos-login-combo > select, .pos-login-combo-2 > select {
    border: medium none;
    width: calc(100% - 28px);
    color: #0ca7b9
}

.pos-login-combo-2 > select {
    height: 40px
}

.pos-form-right > input {
    border: medium none;
    padding: 8px 0;
    width: calc(100% - 32px);
    color: #0ca7b9;
    height: 40px;
    box-sizing: border-box
}

.pos-login-combo-2 {
    width: 100%;
    height: 40px
}

.pos-form > select:focus, .pos-form-right > input:focus {
    outline: none
}

.pos-login-keypad {
    width: 100%;
    float: left
}

.login-keypad-row {
    width: 100%;
    float: left
}

.pos-login-BackBtn {
    width: 50px;
    height: 50px;
    float: right;
    margin-right: 20px;
    margin-top: 20px;
    cursor: pointer;
    margin-right: 20px;
    display: none
}

.login-keypad-col {
    width: 33.333%;
    float: left;
    box-sizing: border-box;
    padding-right: 10px
}

    .login-keypad-col:last-child {
        padding-right: 0
    }

.login-keypad-btn {
    background-color: #41dcee;
    border-radius: 3px;
    color: #fff;
    float: left;
    font-size: 25px;
    margin-bottom: 10px;
    padding: 17.5px 0;
    text-align: center;
    width: 100%;
    cursor: pointer
}

    .login-keypad-btn:hover {
        background: #079eb1
    }

.keypad-last {
    margin-right: 0
}

.backspace-img {
    background-image: url('../Content/Images/backspace.png');
    background-position: center;
    background-repeat: no-repeat;
    width: auto;
    height: 29px;
    text-align: center;
    margin: 0;
    padding: 0
}

.pos-login-btn {
    font-size: 20px;
    padding: 20px 0 !important
}

.pos-vienna-logo {
    position: absolute;
    bottom: 0;
    right: 0;
    margin-right: 20px;
    margin-bottom: 10px;
    z-index: 0
}

    .pos-vienna-logo > img {
        width: 100%
    }

.backspace-img {
    height: 36px
}

.patt-holder {
    background: transparent
}

.patt-wrap li {
    background: #0ca7b9
}

.patt-headdiv {
    color: #fff;
    font-size: 20px;
    margin-top: 25px;
    float: left;
    margin-left: 68px
}

@media(max-width:1366px) {
    .login-keypad-btn {
        padding: 18px 0
    }
}

@media(max-width:1280px) {
    .login-keypad-btn {
    }

    .pos-form > select, .pos-form-right > input {
    }

    .login-keypad-btn {
        padding: 15.5px 0
    }

    .pos-login-btn {
        padding: 18px 0 !important
    }

    .pos-login-wrapper {
        width: 55%
    }
}

@media(max-width:1024px) {
    .pos-login-wrapper {
        width: 75%
    }

    .patt-headdiv {
        margin-left: 100px
    }
}

@media(max-width:999px) {
    .login-keypad-btn {
        padding: 14px 0
    }

    .pos-login-btn {
        padding: 16px 0 !important
    }

    .pos-login-wrapper {
        width: 83%
    }
}

@media(max-width:768px) {
    .pos-login-wrapper {
        width: 87%
    }

    .login-keypad-btn {
        padding: 8px 0
    }

    .login-keypad-btn {
    }

    .pos-login-btn {
        font-size: 16px;
        padding: 15px 0 !important
    }

    .backspace-img {
        background-image: url('../Content/Images/backspace2.png')
    }

    .pos-form > select, .pos-login-combo > select {
        width: 83%
    }

    .pos-login-combo-2 > select, .pos-form-right > input {
        height: 37px
    }

    .pos-form-right > input {
    }

    .pos-login-combo > select#cmbUserAccess {
        padding: 4px 0
    }

    .pos-login-wrapper, .pos-login-wrapper * {
        box-sizing: border-box
    }

    .pos-login-BackBtn {
        width: 50px;
        height: 50px;
        float: right;
        margin-right: 20px;
        margin-top: 20px;
        cursor: pointer;
        margin-right: 20px;
        display: none;
        position: absolute;
        bottom: 0;
        margin-left: 10px
    }
}

@media(max-height:600px) {
    .login-keypad-btn {
        padding: 12px 0
    }

    .pos-login-BackBtn {
        width: 50px;
        height: 50px;
        float: right;
        margin-right: 20px;
        margin-top: 20px;
        cursor: pointer;
        margin-right: 20px;
        display: none;
        position: absolute;
        bottom: 0;
        margin-left: 10px
    }
}

@media(max-width:599px) {
    .pos-login-wrapper {
        width: 80%;
        min-width: 320px;
        top: 10px;
        margin: 0 auto
    }

    .pos-login-left-wrap > h4, .pos-company-logo {
        width: 50%;
        float: right
    }

    .pos-login-left-wrap, .pos-login-right-wrap {
        width: 100%
    }

    .pos-form > select, .pos-login-combo-2 > select, .pos-form-right > input {
        height: 36px
    }

    .login-keypad-btn {
    }

    .pos-login-btn {
        font-size: 18px
    }

    .login-keypad-btn {
        padding: 7px 0
    }

    .pos-login-btn {
        padding: 13px 0 !important
    }

    .pos-login-BackBtn {
        width: 50px;
        height: 50px;
        float: right;
        margin-right: 20px;
        margin-top: 20px;
        cursor: pointer;
        margin-right: 20px;
        display: none;
        position: absolute;
        bottom: 0;
        margin-left: 10px
    }
}

.CUS-pos-PopupWrap * {
    box-sizing: border-box
}

.CUS-pos-PopupWrap {
    margin: auto;
    width: 70%;
    left: 0;
    right: 0;
    max-height: 600px;
    position: fixed;
    z-index: 9999;
    height: 75%;
    box-sizing: border-box;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

.CUS-PopupContent {
    background: #05a6b8;
    float: left;
    width: 100%;
    padding: 0 15px 0 0;
    border-bottom-left-radius: 7px;
    border-bottom-right-radius: 7px;
    height: calc(100% - 40px);
    position: relative;
    min-height: 350px
}

.customer-wrap {
    position: absolute;
    height: 100%;
    width: 100%
}

.btns {
    float: right;
    position: absolute;
    bottom: 5px;
    right: 10px
}

    .btns > span {
        margin-left: 10px;
        float: left
    }

.stock-pop {
    float: left;
    width: 33.3333%;
    box-sizing: border-box;
    height: 100%;
    position: relative;
    display: flex;
    flex-direction: column
}

.customer-form {
    border-right: 1px solid #1abcce
}

.middle-div {
    border-left: 1px solid #048896;
    border-right: 1px solid #1abcce
}

.middle-div, .right-div {
    background: #05a6b8;
    border-bottom-left-radius: 7px;
    border-bottom-right-radius: 7px
}

.right-div {
    border-left: 1px solid #048896
}

.customer-form .pos-PopupInput {
    margin-bottom: 7px;
    float: left;
    width: 100%
}

.customer-wrap .pos-PopupInput > label {
    margin-top: 0;
    margin-bottom: 3px
}

.stock-pop .pos-PopupInput, .genatt-inputs .TaxCombo {
    margin-bottom: 7px;
    float: left
}

.stock-pop textarea {
    height: 60px;
    width: 100%;
    resize: none;
    color: #105c75;
    opacity: .8;
    padding: 6px 12px;
    font-size: 13px;
    border-radius: 3px;
    float: left
}

.genatt-inputs .TaxCombo:nth-child(odd) {
    margin-right: 10px
}

.stock-pop .TaxCombo select {
    padding-left: 10px;
    border: none;
    outline: none;
    width: 100%;
    height: 32px;
    color: #0ca7b9
}

h3.heading {
    margin: 0;
    font-size: 14px;
    color: #fff;
    background: #047784;
    padding: 8px 10px
}

.inputs-wrap, .genatt-inputs, .history-table {
    padding: 10px;
    float: left;
    width: 100%;
    overflow-y: auto;
    overflow-x: hidden
}

.inputs-wrap, .middle-div .history-table2 {
    height: 100%;
    display: flex;
    flex-direction: column
}

.middle-div .history-table {
    height: calc(100% - 34px);
    height: -moz-calc(100% - 34px);
    height: -webkit-calc(100% - 34px)
}

.genatt-inputs, .history-table {
    height: calc(100% - 73px);
    height: -moz-calc(100% - 73px);
    height: -webkit-calc(100% - 73px)
}

.customer-form .footer-div {
    border-bottom-left-radius: 7px
}

.inputs-wrap {
    box-sizing: border-box
}

.footer-div {
    background: #047784;
    padding: 6px 10px;
    width: 100%;
    font-size: 12px;
    color: #fff
}

span.dob {
    float: left;
    width: 50%;
    padding-right: 10px
}

span.dob2 {
    float: left;
    width: 50%;
    text-align: right;
    padding-right: 10px
}

span.cardpnt {
    float: right;
    width: 50%;
    text-align: right
}

    span.cardpnt > div#CUST_InvTot {
        text-align: right;
        float: right !important;
        padding-right: 5px;
        width: 50%
    }

.middle-div > div, .right-div > div {
    position: relative;
    height: 50%;
    width: 100%;
    display: flex;
    flex-direction: column
}

.frm-data {
    width: 48%;
    float: left;
    padding-right: 5px
}

.history-table {
    padding: 0;
    overflow-x: auto;
    overflow-y: hidden
}

.total {
    float: left;
    display: none
}

    .total label {
        float: left;
        padding-left: 7px;
        color: #fff;
        font-weight: normal
    }

    .total input {
        float: left;
        background: transparent;
        border: none;
        color: #ceeff3
    }

.right-div .cus-his .history-table {
    height: calc(100% - 35px);
    height: -moz-calc(100% - 35px);
    height: -webkit-calc(100% - 35px)
}

.selected-row {
    background: #f9b31d
}

.customer-form .pos-PopupInput > input {
    width: 100%
}

.CST-inputType {
    background: transparent;
    border: none;
    width: 100%;
    color: #fff
}

.scrolltable {
    overflow-x: auto;
    height: 100%;
    display: flex;
    display: -webkit-flex;
    flex-direction: column;
    -webkit-flex-direction: column;
    background: #09b3c6
}

.headWrap {
    background: #09b3c6
}

.scrolltable .table-head {
    background: #09b3c6;
    color: #035862;
    text-align: left;
    display: table
}

.headrow, .table-row {
    display: table-row
}

.table-head h3 {
    background: #09b3c6
}

.table-head h3, .table-body h3 {
    padding: 6px 9px;
    min-width: 80px;
    display: table-cell;
    font-size: 13px;
    font-weight: normal;
    width: 150px
}

.table-body h3 {
    color: #fff
}

.scrolltable > .table-body {
    width: -webkit-fit-content;
    overflow-y: auto;
    overflow-x: hidden;
    flex: 1;
    -webkit-flex: 1;
    background: #05a6b8
}

.table-data {
    width: 100%;
    display: table
}

.pos-CusTopIco {
    float: right
}

span.pos-CusMobView {
    line-height: 36px;
    cursor: pointer;
    float: left;
    margin-left: 10px;
    display: none
}

.customer-wrap .cancel {
    margin-right: 10px
}

.OpenInvoiceWrap {
    float: left;
    position: relative;
    height: 95%;
    width: 66.66%
}

.OpnInvoiceTable {
    height: 89%;
    box-sizing: border-box
}

@media(max-width:1024px) {
    .CUS-pos-PopupWrap {
        width: 85%
    }
}

@media(max-width:767px) {
    .CUS-pos-PopupWrap {
        width: 90%
    }

    .stock-pop {
        width: 100%
    }

    .middle-div, .right-div {
        display: none
    }

    span.pos-CusMobView {
        display: block
    }

    .middle-div > div {
        height: 33%
    }

    .right-div > div {
        height: 100%
    }

    .CUS-pos-PopupWrap {
        height: 88%
    }

    .inputs-wrap {
        height: calc(100% - 120px)
    }

    .customer-form .footer-div {
        border-bottom-right-radius: 7px
    }

    .genatt-inputs {
        height: calc(100% - 31px)
    }

    .btns {
        bottom: 43px
    }

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

    .OpnInvoiceTable {
        height: 84%
    }
}

@media(max-height:600px)and (min-width:570px) {
    .CUS-pos-PopupWrap {
        top: 43%
    }

    .middle-div .history-table2 {
        height: calc(100% - 85px);
        height: -moz-calc(100% - 85px);
        height: -webkit-calc(100% - 85px)
    }
}