﻿.no-seq {
    border-radius: 6px;
    padding: 10px;
    border: solid 1px;
    display: inline-block;
    height: 0px;
    line-height: 0px;
    margin-left: 6px;
    margin-right: 6px;
    border: solid 1px #001017;
    background: #000000;
    margin-top: -10px;
    margin-bottom: -10px;
    /* color: #000; */
    font-weight: 600;
}


.dx-form-group-with-caption .dx-form-group.dx-form-group-with-caption {
   padding-left: 0px !important;
}


/*Error Tooltip */
.dx-datagrid-rowsview .dx-data-row .dx-invalid-message .dx-overlay-content, .dx-datagrid-rowsview .dx-adaptive-detail-row .dx-invalid-message .dx-overlay-content {
    background-color: #f59e98 !important
}


/* Margin of form Label (dx) */
.dx-layout-manager .dx-field-item:not(.dx-first-row) {
    padding-top: 2px !important;
}


    /* Customize website's scrollbar like Mac OS
Not supports in Firefox and IE */
    :: -webkit-scrollbar {
    background-color: #2a6297;
    width: 16px
}
::-webkit-scrollbar-track {
    background-color: #0e0e0e
}
::-webkit-scrollbar-thumb {
    background-color: #404040;
    border-radius: 16px;
    border: 6px solid #0e0e0e
}
::-webkit-scrollbar-button {
    display: none
}

.g-link, .g-link:visited {
    color: #fff !important;
}

    .g-link:hover {
        text-decoration: underline;
        color: #fff;
    }


.kob-icon-link {
    font-size: 2.1em !important;
    padding-right: 10px;
    float: left;
    margin-left: -4px;
    color: #fff
}
    .kob-icon-link:hover
    {
        color:#278cdd
    }

    .b {
        font-weight: 600;
    }

.kob-green {
    color: #8BC34A
}

.kob-red {
    color: #fc5e5e
}

.kob-orange{
    color:orange
}

.kob-grey{
    color: #333
}

.kob-1{
    color:orange;
    font-weight:500;
}

div.err {
    text-align:left;
    font-weight:400;
    line-height:21px
}

div.err i{
    color: #999;
}




#buttonSaveUser {
    color: #ccc;
    border: 1px solid rgba(255, 255, 255, 0.24);
    border-radius: 2px;
    font-weight: 500;
    color: #fff;
    margin-top: 10px;
    background-color:midnightblue
}

    #buttonSaveUser:hover {
        background-color: rgba(255, 255, 255, 0.08);
        color: #fff !important;
    }


.kob-button {
    color: #ccc;
    border: 1px solid rgba(255, 255, 255, 0.24);
    border-radius: 2px;
    font-weight: 500;
    color: #fff;
    padding: 7px 10px;
    margin-top: 10px;
    line-height: 33px;
}

    .kob-button:hover {
        background-color: rgba(255, 255, 255, 0.08);
        color: #fff !important;
    }


.aqm-text-thin {
    font-weight: 400 !important;
    display: inline-block;
    width: 130px
}


#logout {
    padding: 3px 6px;
    color: #ccc;
    border: 1px solid rgba(255, 255, 255, 0.24);
    border-radius:2px;
    font-weight:500;
    color:#fff
}

    #logout:hover {
        background-color: rgba(255, 255, 255, 0.08);
    }


    .aqm-text-thin
    {
        font-weight:400 !important;
        display:inline-block;
        width:130px
    }



input:focus {
    outline: none;
}
:focus {
    outline: none;
}

.form-control
{
    border-radius:0 !important
}
    .form-control:not([readonly]):focus {
        box-shadow: none;
        -webkit-box-shadow: none;
        background-color: #050c2b !important
    }

    .form-control:focus {
        box-shadow: none;
        -webkit-box-shadow: none;
    }
    body {
        margin: 0 !important;
        padding: 0;
        font-family: Roboto;
        font-size: 13px
    }

    body * {
        /*font-family: Prompt;*/
        font-weight: 400;
        font-family: Roboto
    }

    body :link {
        text-decoration:none;
    }

.font-red-haze {
    color: #fd616b !important
}

.clearfix {
    clear: both
}

.pull-left
{
    float:left
}

.pull-right {
    float: right
}

.left-menu {
    float: left;
    border-right: 1px solid #dce0ec !important;
    border: none;
    outline: 0;
    padding: 0;
    margin-right: 10px;
    background-color: #111;
    border-color: #333 !important;
    height:68px
}

    .left-menu button {
        height: 68px;
        width: 68px;
        border: none;
        -webkit-transition: .5s all;
        -moz-transition: .5s all;
        -ms-transition: .5s all;
        -o-transition: .5s all;
        transition: .5s all;
    }

        .left-menu button:hover {
            background-color: #278cdd !important;
            color: #000 !important;
            -webkit-transition: .5s all !important;
            -moz-transition: .5s all !important;
            -ms-transition: .5s all !important;
            -o-transition: .5s all !important;
            transition: .5s all !important;
        }



#menu i {
    font-size: 28px;
    color: #ccc
}



#menu:focus {
    border: none;
}

#menu:hover i {
    font-size: 28px;
    color: #000
}





#slideOutContainer {
    height: auto;
    position: absolute;
    top: 0;
    bottom: 0;
    width: 100%;
}

.page-header .top-menu .dropdown-user .dropdown-menu > li > a
{
    font-weight:400;
}
.nav > li > a:focus, .nav > li > a:hover {
    text-decoration: none;
    background-color: #278cdd !important;
    color: #fff !important;
}

.page-header .top-menu .nav .open > a:hover, .page-header .top-menu .nav .open > a:focus {
    background-color: #278cdd !important;
    color: #fff !important;
}

[data-command=unselect] {
    color: #ccc;
}

[data-command=unselect]:hover {
    color: #fff;
}

tr.select {
    background-color: #e1e9f7 !important;
}

tr.select td:first-child {
    border-left: solid 1px #0e45f8;
}

.bs-actionsbox,
.bs-donebutton,
.bs-searchbox {
    background-color: #fff;
}

.page-header .top-menu .dropdown-user .dropdown-menu {
    width: 200px;
}

.page-header .top-menu .dropdown-user .dropdown-menu > li > a {
    color: #ccc !important;
}

.dropdown > .dropdown-menu,
.dropdown-toggle > .dropdown-menu,
.btn-group > .dropdown-menu {
    margin-top: 10px;
    background-color: #3a3838;
    color: #ccc !important;
}

.dropdown > .dropdown-menu:after,
.dropdown-toggle > .dropdown-menu:after,
.btn-group > .dropdown-menu:after {
    position: absolute;
    top: -7px;
    left: 10px;
    right: auto;
    display: inline-block !important;
    border-right: 7px solid transparent;
    border-bottom: 7px solid #3a3838;
    border-left: 7px solid transparent;
    content: '';
}

.dropdown-menu > li > a {
    padding: 8px 16px;
    color: #b9b9b9;
    text-decoration: none;
    display: block;
    clear: both;
    font-weight: 300;
    line-height: 18px;
    white-space: nowrap;
}

.dropdown-menu li.divider {
    background: #636060;
    margin: 0;
}

.dropdown-menu > li > a:focus,
.dropdown-menu > li > a:hover {
    text-decoration: none;
    color: #fff;
    background-color: #000;
}

.dropdown > .dropdown-menu:before,
.dropdown-toggle > .dropdown-menu:before,
.btn-group > .dropdown-menu:before {
    position: absolute;
    top: -8px;
    left: 9px;
    right: auto;
    display: inline-block !important;
    border-right: 8px solid transparent;
    border-bottom: 8px solid #e0e0e0;
    border-left: 8px solid transparent;
    content: '';
}

.select-option {
    z-index: 100;
    position: absolute;
    top: 43px;
    height: 40px;
    background-color: #3a3838;
    border-color: #3a3838;
    color: #eee;
    left: 20px;
    right: 20px;
    line-height: 40px;
    padding-left: 12px;
    display: none;
}

.select-option .arrow:after {
    position: absolute;
    top: 40px;
    left: 14px;
    display: inline-block;
    border-right: 6px solid transparent;
    border-top: 6px solid #3a3838;
    border-left: 6px solid transparent;
    content: '';
}

.f-b label {
    margin: 0 !important;
}

.b-fix {
    height: 38px !important;
    line-height: 26px !important;
}

.note.note-info {
    background-color: #fff !important;
    border-color: #dd2e31 !important;
    color: #010407 !important;
    padding: 6px 10px;
    text-align: right;
    height: 43px !important;
    border-top: solid 1px #dcddde !important;
    border-right: solid 1px #dcddde !important;
    border-left: solid 1px #dcddde !important;
    margin-bottom: 0;
    padding: 6px 6px;
}

.note.note-info select {
    width: 80px;
    margin-left: 8px;
    margin-right: 8px;
}

/*thead {
    background-color: #faf9f9 !important;
}*/

.s-hd {
    display: block;
    padding-left: 19px;
    font-size: 10px;
}

.f-n {
    font-weight: 400 !important;
}

select.input-xs,
input[type=text].input-xs {
    padding: 1px;
    font-size: 14px !important;
    height: 28px;
    width: 100%;
    border: none;
}

.p0 {
    padding: 0 !important;
}

.modal-dialog {
    overflow-y: initial !important;
}

.modal-body {
    max-height: calc(-100vh);
    overflow-y: auto;
    min-height: 500px;
}

.td-1 {
    padding: 0px 9px !important;
}

.td-0 {
    padding: 0px !important;
}

.nb {
    border: none;
    background-color: transparent !important;
    font-weight: 500;
}

.dropdown-menu > li > a {
    color: #797777;
    font-weight: 400;
}

.form-control {
    background-color: #232326 !important;
    color:#ccc;
}
.bootstrap-select.btn-group .dropdown-menu.inner {
    background-color: #232326 !important
}
.bootstrap-select > .dropdown-toggle.bs-placeholder,
.bootstrap-select > .dropdown-toggle.bs-placeholder:active,
.bootstrap-select > .dropdown-toggle.bs-placeholder:focus,
.bootstrap-select > .dropdown-toggle.bs-placeholder:hover {
    color: #bdbdbd !important;
    background-color: #2c2c2f;
    border-color: #3c3c3e;
  
}

.dropdown-menu {
    background-color: #232326 !important
}
/*.btn-group > .dropdown-menu {
    background-color: #3a3838;
}*/
/*.form-light {
    .dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus {
        color: #fff;
        background-color: #fefefe;
    }

    .btn-default.focus, .btn-default:focus {
        color: #333;
        background-color: #fff !important;
        border-color: #8c8c8c;
    }
}*/
/*.dropdown-menu li.divider {
    background: #7d7d7d;
}

.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus {
    color: #fff;
    background-color: #615d5d;
}

.dropdown > .dropdown-menu:after, .dropdown-toggle > .dropdown-menu:after, .btn-group > .dropdown-menu:after {
    position: absolute;
    top: -7px;
    left: 10px;
    right: auto;
    display: inline-block !important;
    border-right: 7px solid transparent;
    border-bottom: 7px solid #393938;
    border-left: 7px solid transparent;
    content: '';
}*/
[data-command=unselect] {
    color: #ccc;
}

[data-command=unselect]:hover {
    color: #fff;
}

tr.select {
    background-color: #e1e9f7 !important;
}

tr.select td:first-child {
    border-left: solid 1px #0e45f8;
}

strong {
    font-weight: 600 !important;
}

.table-adv .cw > td:first-child {
    cursor: move;
    cursor: grab;
    cursor: -moz-grab;
    cursor: -webkit-grab;
    width: 40px;
    vertical-align: middle;
    font-size: 14px;
    padding: 0px;
    padding-right: 4px;
    color: #999;
}

.table-adv td {
    user-select: none;
}

.table-adv tbody + tbody {
    border-top: 1px solid #e7ecf1;
}

.table-adv tbody {
    border-bottom: none;
}

.table-adv tbody tr td div,
.table-adv tbody tbody tr td input[type=text] {
    font-size: 12px;
}

.table-adv .fa-2x {
    line-height: normal;
}

.table-adv tfoot > tr > th {
    padding: 1px 2px 1px 2px;
    vertical-align: middle;
}

.table-adv .cl {
    margin-bottom: 0;
    font-weight: 400;
    margin-top: 3px;
}

.table-adv .cl2 {
    margin-bottom: 0;
    font-weight: 400;
    margin-top: 3px;
    margin-top: 0px;
}

.table-adv .ip {
    width: 40px;
    float: right;
    background-color: #e9edef;
    margin-left: 8px;
    color: #4c87b9;
    height: 25px;
}

.table-adv .it {
    width: 200px;
    padding: 1px;
    height: 25px;
}

.table-adv .it2 {
    width: 200px;
    padding: 1px;
    height: 25px;
    padding-left: 4px;
}

.table-adv .percent {
    float: right;
    margin-left: 8px;
    font-weight: 400;
    border-radius: 4px !important;
    font-family: Consolas;
    width: 55px;
    text-align: right;
    height: 25px;
    line-height: 25px;
}





.dx-datagrid .dx-header-filter {
    color: #d86d0e;
}

.dx-datagrid .dx-header-filter-empty {
    color: rgb(138, 122, 39);
}

.dx-datagrid .dx-sort-up {
    color:#3cc108 !important;
}

.dx-datagrid .dx-sort-down {
    color: red !important;
}


[id^=dis-amount-calculate-] input[type=text], [id^=sv-amount-calculate-] input[type=text] {
    text-align: right;
}

.h{
    font-weight:600
}

.image-in-popup
{
    width:225px;
    margin-left:auto;
    margin-right:auto;
    display:block;

}

.act {
    color: #8BC34A !important;
}

.statusName {
    color: #8B8B8B !important;
    font-size: 15px !important;
    text-transform: uppercase;
}


.q {
    color: #8B8B8B
}

.q1 {
    color: #e0e0e0 !important;
}

/*Yellow*/
.q2 {
    color: #f3c017 !important
}

/*Green*/
.q3, .q7, .q10, .q12 {
    color: #14e02b !important;
}

/*Blue*/
.q5{
    color: #278cdd !important;
}

/*Red*/
.q4, .q6, .q9, .q11 {
    color: #ee2019 !important
}

/*Orange*/
.q8 {
    color: #ff6600 !important
}


.qb {
    background-color: #8B8B8B
}

.qb1 {
    background-color: #e0e0e0 !important;
}

/*Yellow*/
.qb2 {
    background-color: #f3c017 !important
}

/*Green*/
.qb3, .qb7, .qb10, .qb12 {
    background-color: #14e02b !important;
}

/*Blue*/
.qb5 {
    background-color: #278cdd !important;
}

/*Red*/
.qb4, .qb6, .qb9, .qb11 {
    background-color: #ee2019 !important
}

/*Orange*/
.qb8 {
    background-color: #ff6600 !important
}





.grey {
    color: #807f7f
}

.d0 {
    color: #FF0000;
}

.d1 {
    color: #FFCC00;
}

.d2 {
    color: #FF3399;
}

.d3 {
    color: #79CA0B;
}

.d4 {
    color: #FF8000;
}

.d5 {
    color: #0099FF;
}

.d6 {
    color: #CC33FF;
}

.d7 {
    color: #FF0000;
}

.rv {
    color: #278cdd;
}


.ad {
    color: #dd8c27;
}



.fk
{
    text-decoration:none !important;
}


.fk:hover {
    color:#fff;
}





.dx-link-save {
    color: #07de07 !important;
}

.dx-link-cancel {
    color: red !important;
}


.sub-text {
    font-size: 12px;
    color: #b4b4b4;
    font-style: italic
}

[data-command=delete-service],
[data-command=delete-discount],
[data-command=delete-product],
[data-command=change-product] {
    font-size: 16px !important;
}


    [data-command=delete-service]:hover,
    [data-command=delete-discount]:hover,
    [data-command=delete-product]:hover,
    [data-command=change-product]:hover {
        color: #fff !important;
    }



    .tb{
        font-weight:700;
    }




.grid-info {
    font-style: italic;
    color: #d2bb10
}

.p0
{
    padding:0px
}


[id^=buttonSave] {
    margin-top   :5px
}
#buttonSaveComplete {
    background-color: #f3c017 !important;
}

#buttonSaveComplete:hover {
    background-color: #c9a11c !important;
}

#buttonSaveCustomerRevise {
    background-color: #fc890d !important;
}

    #buttonSaveCustomerRevise:hover {
        background-color: #d3740d !important;
    }

.th {
    font-family: Prompt;
}

/*.dx-field-item-content .dx-placeholder {
    top: -4px !important
}*/

.dx-texteditor.dx-editor-outlined .dx-texteditor-input {
    padding: 12px 8px 12px !important;
}


/*.dx-31 .dx-placeholder {
    top: -4px !important
}*/

.qs {
    padding: 0px;
    font-weight: 400;
}

.btn-select-product {
    background-color: #f3c200;
    color: black;
    padding-top:2px;
    margin: 6px 8px;
    float: right;
    font-weight: 600;
    height: 22px;
    line-height: 19px;
    font-size: 12px;
    font-family: Roboto
}




.font-blue {
    color: #4280b1
}



ul.c-menu {
    padding-left: 0;
    margin-top: 10px !important
}



    ul.c-menu .selected {
        border-right: solid 8px #03A9F4 !important;
        border-top: none !important;
        border-bottom: none !important;
        background-color: #404040;
    }

        ul.c-menu .selected a {
            color: #03A9F4 !important;
        }

ul.c-menu .selected a:hover {
    color: #000 !important;
}

        ul.c-menu li.item {
            list-style: none;
            font-weight: 600;
            padding-right: 0;
            text-transform: uppercase;
            /*padding-left: 10px;*/
            /*line-height: 20px;*/
            line-height: 18px;
            border-right: solid 0px transparent;
        }   

        ul.c-menu li.item a {
            color: #b1a9a9;
            padding: 10px;
            display: block;
            /*margin-left:9px*/
        }

        ul.c-menu li.item a i {
            padding-right: 8px;
        }





    ul.c-menu li.item a:hover {
        color: #000;
        text-decoration: none;
        background-color: #2092ce;
        font-weight: 600;
        /*padding-left: 20px;*/
        -webkit-transition: .5s all;
        -moz-transition: .5s all;
        -ms-transition: .5s all;
        -o-transition: .5s all;
        transition: .5s all;
    }


.inline-menu {
    background-color: #07141f;
}




.inline-menu li
{
    display:inline-block;
    padding:0;
    margin:0
}

    .inline-menu li a:hover {
        color: #278cdd !important;
        text-decoration:none
    }


    .inline-menu i {
        font-size:17px
    }
#menu {
    background-color: #111;
    border-color: #333 !important;
    cursor:pointer
 
}


.c-menu-heading {
    color: #75a2f5;
    padding-top: 20px;
    padding-left: 12px;
    font-size: 10px;
}

.underline
{
    text-decoration:underline
}






.svg-box {
    display: inline-block;
    position: relative;
    width: 150px;
}

.green-stroke {
    stroke: #7CB342;
}

.red-stroke {
    stroke: #FF6245;
}

.yellow-stroke {
    stroke: #FFC107;
}


.circular circle.path {
    stroke-dasharray: 330;
    stroke-dashoffset: 0;
    stroke-linecap: round;
    opacity: 0.4;
    animation: 0.7s draw-circle ease-out;
}

/*------- Checkmark ---------*/
.checkmark {
    stroke-width: 6.25;
    stroke-linecap: round;
    position: absolute;
    top: 56px;
    left: 49px;
    width: 52px;
    height: 40px;
}

    .checkmark path {
        animation: 1s draw-check ease-out;
    }

@keyframes draw-circle {
    0% {
        stroke-dasharray: 0,330;
        stroke-dashoffset: 0;
        opacity: 1;
    }

    80% {
        stroke-dasharray: 330,330;
        stroke-dashoffset: 0;
        opacity: 1;
    }

    100% {
        opacity: 0.4;
    }
}

@keyframes draw-check {
    0% {
        stroke-dasharray: 49,80;
        stroke-dashoffset: 48;
        opacity: 0;
    }

    50% {
        stroke-dasharray: 49,80;
        stroke-dashoffset: 48;
        opacity: 1;
    }

    100% {
        stroke-dasharray: 130,80;
        stroke-dashoffset: 48;
    }
}

/*---------- Cross ----------*/

.cross {
    stroke-width: 6.25;
    stroke-linecap: round;
    position: absolute;
    top: 54px;
    left: 54px;
    width: 40px;
    height: 40px;
}

    .cross .first-line {
        animation: 0.7s draw-first-line ease-out;
    }

    .cross .second-line {
        animation: 0.7s draw-second-line ease-out;
    }

@keyframes draw-first-line {
    0% {
        stroke-dasharray: 0,56;
        stroke-dashoffset: 0;
    }

    50% {
        stroke-dasharray: 0,56;
        stroke-dashoffset: 0;
    }

    100% {
        stroke-dasharray: 56,330;
        stroke-dashoffset: 0;
    }
}

@keyframes draw-second-line {
    0% {
        stroke-dasharray: 0,55;
        stroke-dashoffset: 1;
    }

    50% {
        stroke-dasharray: 0,55;
        stroke-dashoffset: 1;
    }

    100% {
        stroke-dasharray: 55,0;
        stroke-dashoffset: 70;
    }
}

.alert-sign {
    stroke-width: 6.25;
    stroke-linecap: round;
    position: absolute;
    top: 40px;
    left: 68px;
    width: 15px;
    height: 70px;
    animation: 0.5s alert-sign-bounce cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

    .alert-sign .dot {
        stroke: none;
        fill: #FFC107;
    }

@keyframes alert-sign-bounce {
    0% {
        transform: scale(0);
        opacity: 0;
    }

    50% {
        transform: scale(0);
        opacity: 1;
    }

    100% {
        transform: scale(1);
    }
}


.kob-manual-link {
    color: #7cb342;
    cursor: pointer
}

    .kob-manual-link:hover {
        color: #07de07
    }


/*.dx-datagrid-header-panel
{
    padding:0px !important
}*/