#header {
    background: #004183;
}
#header-top {
    padding-top: 20px;
    padding-bottom: 10px;
}
#header-top-logo {
    float: left;
}
#header-top-banner {
    float: left;
}
#header-top-banner .banner {
    width: 100%;
    height: 100px;
    margin: 0 auto;
    background: #f5f5f5;
    border: 1px solid #dadada;
    text-align: center;
}
#header-top-banner .banner .text {
    margin-top: 40px;
    margin-bottom: 10px;
    color: #aaa;
    font-size: 24px;
}
#header-top-welcome {
    float: right;
    width: 100%;
    color: #fff;
    text-align: right;
}
#header-top-right,
#header-middle-right {
    padding-right: 0;
}
#header-top-menu {
    float: right;
}
#menu-wrapper.container {
    padding-left: 0;
    padding-right: 0;
}
#menu-wrapper .navbar {
    background: transparent;
    border: none;
    margin: 0;
    padding: 0;
    border-radius: inherit;
}
#menu-wrapper .navbar .container {
    padding-left: 0;
    padding-right: 0;
    margin-left: 0;
    margin-right: 0;
}
#m-user a,
#m-module a.dropdown-toggle,
#m-info a {
    color: #fff;
}
#m-user a:hover,
#m-user a:active,
#m-module a:hover,
#m-module a:active,
#m-info a:hover,
#m-info a:active {
    background: #fff;
    color: #004183;
}
/*#header-top .nav>li>a {
    padding: 10px 7px;
}*/
#header-search .input-group {
    margin-top: 5px;
    border: solid 1px #E4E4E4;
    border-radius: 3px;
    background-color: #fff;
}
#header-search input{
    border: 0;
    box-shadow: none;
}
#header-search button{
    margin: 2px 0 0 0;
    background: none;
    box-shadow: none;
    border: 0;
    color: #666666;
    padding: 0 8px 0 10px;
    border-left: solid 1px #ccc;
}
#header-search button:hover{
    border: 0;
    box-shadow: none;
    border-left: solid 1px #ccc;
}
#header-search .glyphicon-search{
    font-size: 23px;
}
#header-menu {
    background: #fafafa;
    border-bottom: 1px solid #d7d7d7;
}
#header-menu a {
    color: #004183;
}
/*.container {
    width: 94%;
}*/
#middle {
    margin: 15px 0 15px 0;
}
.forget-password {
    margin-left: 10px;
}
/*
 * ajax loader
*/
#ajax-loader {
    visibility: hidden;
    /*background-color: rgba(255,255,255,0.7);*/
    position: absolute;
    z-index: 999999 !important;
    width: 100%;
    height:100%;
}
#ajax-loader img {
    position: relative;
    width: 96px;
    height: 96px;
    top:45%;
    left:50%;
}

.nested-grid-loader {
    margin: 5px;
    width: 24px;
    height: 24px;
}
.img-responsive,
.nested-grid-loader img{
    max-width: 100%;
    max-height: 100%;
}
.nested-grid-empty {
    padding: 5px;
    background: #eee;
    border: 1px solid #ddd;
}
.form-toolbar-bottom {
    padding-top: 10px;
}
.form-toolbar-bottom .btn {
    margin-right: 10px;
}
/*
 * scroller grid
 * the grid column should be auto width
 */
.grid-scroller table.items tbody {
    display: block;
    max-height: 400px;
    overflow-y: auto;
}
.grid-scroller-500 table.items tbody {
    max-height: 500px;
}
.grid-scroller table.items tbody tr {
    display:table;
    width:100%;
    table-layout:fixed;/* even columns width , fix width of table too*/
}
.grid-scroller table.items thead {
    display:table;
    table-layout:fixed;/* even columns width , fix width of table too*/
    width: calc( 100% - 17px )/* scrollbar is average 1em/16px width, remove it from thead width */
}

.tab-label:before {
    margin-right: 7px;
}
.wz-treeview .tree-item-title.fa:before {
    margin-right: 5px;
}
#login-banner {
    padding-left: 0;
    height: 357px;
    border: 1px solid #d7d7d7;
    background: #eee;
}
#footer {
    border-top: 1px solid #d7d7d7;
    padding: 10px 0;
    text-align: center;
    font-size: 13px;
    color:#777;
}
/*
 * permision
 */
#permission-treeview {
    border: 1px solid #ddd;
}
.wz-treeview .pm-data {
    cursor: pointer;
    padding: 2px 0 0 2px;
}
.wz-treeview .pm-data.active {
    background: #0088CC;
    color: #ffffff;
}
#footer a {
    color:#777;
}
img.logo {
    max-width: 100%;
}
.fa {
    font-size: 17px;
    margin-right: 3px;
}
.btn .fa {
    font-size: 15px;
}
.page-title {
    margin-top: 0;
    margin-bottom: 10px;
    padding: 7px 0;
    border-bottom: 1px solid #0078D7;
    font-size: 20px;
}
h2 {
    font-size: 18px;
}
.grid-label {
    text-decoration: underline;
    margin-right: 5px;
}
.grid-date {
    width: 90px;
    text-align: center;
}
.grid-img {
    width: 50px;
    cursor: pointer;
}
.grid-img img {
    width: 100%;
    max-width: 100%;
}
.grid-img-100 {
    width: 100px;
}
.grid-buttons {
    text-align: center !important;
    vertical-align: middle !important;
    padding-left: 7px;
    padding-right: 7px;
}
.grid-buttons img {
    width: 48px;
    cursor: pointer;
}
.grid-buttons a {
    margin-left: 7px;
    margin-right: 7px;
}
.grid-buttons a i.glyphicon {
    font-size: 22px;
    padding: 3px 0;
} 
.grid-buttons-1 { /* one button in the column */
    width: 55px;
}
.grid-buttons-2 { /* two buttons in the column */
    width: 110px;
}
.grid-buttons-3 { /* three buttons in the column */
    width: 165px;
}
.form-date {
    min-width:125px !important;
    width:125px !important;
}
.form-checkbox {
    margin: 10px 5px 0px 5px !important
}
.checbox-label {
    display: inline-block !important;
    margin-left: 5px;
    margin-right: 5px;
}
.well-bg {
    background:#f5f5f5;
}
.tab-well-border .tab-content {
    border: 1px solid #e3e3e3;
    border-top:none;
    border-radius: 0px 0px 4px 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.05);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.05);
}
.panel-heading .glyphicon {
    margin-right:5px;
}
.detail-view.th-190 th {
    width:190px;
}
.alert i.fa {
    float:left;
    margin-right:5px;
}
.grid-empty {
    padding: 10px;
    background: #eee;
    border-radius: 5px;    
}
.grid-checkbox {
    border: none;
    height: 25px;
    box-shadow: none;
}
.grid-notice-red {
    color: #F00;
}
.grid-alert .alert {
    margin-top: 20px;
    margin-bottom: 0 !important;
    margin-left: 5px;
    margin-right: 5px;    
}
.form-group {
    margin-bottom: 5px;
}
.tooltip-link {
    cursor: pointer;
}
.tooltip-inner {
    text-align: left;
}
.detail-view-th-240 th {
    width: 240px !important;
}
.detail-view th {
    padding-right: 10px !important;
}
.dropdown-menu .divider {
    margin: 5px 0;
}
.section-title {
    float: left;
    width: 100%;
    margin: 30px 0 10px 0;
    padding-bottom: 5px;
    padding-left: 5px;
    border-bottom: 1px solid #e7e7e7;
    color: #666;
    font-size: 20px;
}
.modal-body,
.modal-footer {
    padding: 10px;
}
.modal .page-title {
    margin-top: 0;
}
.grid-cell-desc {
    opacity: 0.8;
}
.user-hint {
    margin: 0 0 5px !important;
}
.currency-number {
    font-size: 14px;
}
.currency-neg {
    color: red;
}
#print-wrapper a {
    float: right;
    margin: 0 10px 10px 0;
    font-size: 14px;
}
#print-wrapper a img {
    margin-right: 5px;
}
.grid-datetime {
    width: 125px;
    text-align: center;
}
.grid-username {
    width: 100px;
}
/* multi level menu */
.dropdown-submenu {
    position: relative;
}
.dropdown-submenu>.dropdown-menu {
    top: 0;
    left: 100%;
    margin-top: -6px;
    margin-left: -1px;
    -webkit-border-radius: 0 6px 6px 6px;
    -moz-border-radius: 0 6px 6px;
    border-radius: 0 6px 6px 6px;
}
.dropdown-submenu:hover>.dropdown-menu {
    display: block;
}
.dropdown-submenu>a:after {
    display: block;
    content: " ";
    float: right;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid;
    border-width: 5px 0 5px 5px;
    border-left-color: #ccc;
    margin-top: 5px;
    margin-right: -10px;
}
.dropdown-submenu:hover>a:after {
    border-left-color: #fff;
}
.dropdown-submenu.pull-left {
    float: none;
}
.dropdown-submenu.pull-left>.dropdown-menu {
    left: -100%;
    margin-left: 10px;
    -webkit-border-radius: 6px 0 6px 6px;
    -moz-border-radius: 6px 0 6px 6px;
    border-radius: 6px 0 6px 6px;
}
.btn-def-link {
    float: right;
    margin-bottom: 10px;
}
.grid-acc-acc {
    display: block;
    float: left;
    width: 100px;
    margin-right: 10px;
}
.grid-acc-name {
    display: block;
    /*float: left;*/
}
.row-seperator {
    margin-top: 25px;
    margin-left: 15px;
    border-top: 1px solid #a4bed4;
}
.modal .grid-view {
    padding-top: 0;
}
.panel .grid-view:first-child {
    padding-top:0px;
}

/*
 * editable
 */
.editable:after {
    font-family: 'Glyphicons Halflings';
    content: "\e065";
    padding-left:5px;
    color:#999;
    font-size:12px;
    /*	content: " (click to edit)";
    font-style:italic;*/
}
/*.editable.required:before {
        font-family: 'Glyphicons Halflings';
        content: "\e006";
        vertical-align:top;
        padding-right:5px;
        color:red;
        font-size:7px;
        font-style:normal;
}*/
.editable-buttons .btn-primary.editable-submit .glyphicon-ok {
    font-family:inherit;
    font-style:normal;
}
.editable-buttons .btn-primary.editable-submit .glyphicon-ok:before {
    content:"OK";
}
.editable-clear-x {
    margin-right: 10px;
}
.editable-empty,
.editable-empty:hover,
.editable-empty:focus {
    color: #DD1144 !important;
}
.editable-container .popover-title,
.editable-container .popover-content {
    color: #000000;
}

/*
 * tabs
 */
.nav-tabs>li>a {
    padding: 6px 10px 4px 10px;
    font-size: 12px;
    font-weight: bold;
}
.nav-tabs>li.active>a,
.nav-tabs>li.active>a:hover,
.nav-tabs>li.active>a:focus {
    color: #fff;
    background-color: #428bca;
    border: 1px solid #fff;
}
.wz-tab-sub .nav-tabs>li.active>a,
.wz-tab-sub .nav-tabs>li.active>a:hover,
.wz-tab-sub .nav-tabs>li.active>a:focus {
    color: #555;
    background-color: #fff;
    border: 1px solid #ddd;
    border-bottom-color: transparent;
}

/*
 * form
 */
.form label {
    margin-top: 4px;
    margin-bottom: 0;
    font-size: 12px;
    font-weight: 500;
}
.form input[type=text],
.form input[type=number],
.form input[type=email],
.form input[type=password],
.form input[type=date],
.form select,
.form textarea {
    display: block;
    width: 100%;
    min-height: 25px;
    height: auto;
    padding: 2px 2px;
    font-size: 13px;
    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;
}
.text-primary input, .text-primary select, .text-primary textarea,
.text-info input, .text-info select, .text-info textarea,
.text-success input, .text-success select, .text-success textarea,
.text-warning input, .text-warning select, .text-warning textarea,
.text-danger input, .text-danger select, .text-danger textarea {
    color: inherit !important;
}
.form-inline input[type=text],
.form-inline input[type=number],
.form-inline input[type=email],
.form-inline input[type=password],
.form-inline input[type=date],
.form-inline select,
.form-inline textarea,
.form-inline .erp-form-control {
    display: inline-block;
    width: auto;
    margin-left: 5px;
    margin-right: 5px;
}
.form .erp-form-control {
    min-height: 25px;
    padding: 2px 2px;    
}
.input-number {
    text-align: right;
}
.form input[type=date],
.form input.input-date {
    text-align: center;
    /*
    width: auto;
    min-width: auto;
    */
}
.datepicker thead tr:first-child th,
.datepicker tfoot tr th {
    color: #428bca;
}
table.form-tbl {
    width: 100%;
    border-spacing: 0px; /* cellspacing */
}
table.form-tbl th,
table.form-tbl td {
    padding: 4px; /* cellpadding */
}
div.doc-no {
    float: left;
}
.doc-no input.doc-code {
    float: left;
    width: 34px;
    text-align: center;
}
.doc-no select.doc-code {
    float: left;
    width: 50px;
}
.doc-no input.doc-year {
    float: left;
    width: 50px;
    text-align: center;
    margin: 0 2px;
}
.doc-no input.doc-num {
    float: left;
    width: 62px;
    text-align: right;
}
.form inputs.doc-date,
.form input.input-date.doc-date{
    /*width: 158px;*/
    /*width: auto; */
    text-align:center;
}
input.arabic {
    text-align: right;
}
.tableright input {
    text-align: right;
}
.tableright td{
    text-align: right;
}
.tableright td:first-child{
    text-align: left;
}

/*
 * panel list
 */
.grid-column-row {
    line-height: 17px;
}
.doc-grid-thedate {
    display: inline-block;
    width: 130px;
}
.doc-detail-count {
    display: inline-block;
    width:90px;
    margin-left: 10px;
    padding-left: 10px;
    border-left: 1px solid;
}
.doc-grid-amount {
    display: inline-block;
}

/*
 * form data
 */
.form-data {
    margin-bottom: 10px;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 0;
    border: 1px solid #d7d7d7;
    /*background: #F4F9FD;*/
}
.form-summary {
    padding-right: 0;
}
.form-block {
    float: right;
    width: 100%;
    padding: 15px;
    margin-bottom: 15px;
    background: #F4F9FD;
    border: 1px solid #d7d7d7;
}
.form-block-header {
    padding-bottom: 10px;
    margin: 0 0 10px 0;
    border-bottom: 1px solid #0078D7;
}
h4.form-block-header {
    padding-bottom: 5px;
    margin: 20px 0 10px 0;
    font-size: 13px;
    font-weight: bold;
}
.form-block-header.no-border {
    border-bottom: 0;
    margin-bottom: 0;
}
.form-block-header .btn .fa {
    margin-top: 3px;
}
.form-block-header .alert {
    padding: 4px 5px;
    font-size: 14px;
}
.form-block-header .alert-success {
    background-color: #3c763d;
    border-color: #3c763d;
    color: #fff;
}
.form-block-header .alert-danger {
    background-color: #a94442;
    border-color: #a94442;
    color: #fff;
}
.form-block-header .alert-warning {
    background-color: #8a6d3b;
    border-color: #8a6d3b;
    color: #fff;
}
.form-block-header .bootstrap-switch .bootstrap-switch-handle-on, 
.form-block-header .bootstrap-switch .bootstrap-switch-handle-off,
.form-block-header .bootstrap-switch .bootstrap-switch-label {
    line-height: 15px;
}
.form-block-header-sub {
    float: left;
    width: 100%;
    margin: 5px 0;
    padding-bottom: 10px;
    border-bottom: 1px solid #d7d7d7;
    font-size: 16px;
    font-weight: bold;
    line-height: 2;
}
.form-block .grid-view {
    padding-top: 0;
    padding-bottom: 0px;
}
.form-section {
    margin: 10px 0 10px 0;
    padding-bottom: 10px;
    border-bottom: 1px solid #e7e7e7;
}

/*
 * select2
 */
.form .select2-container {
    width: 100% !important;
}
.form .erp-form-control.select2-container {
    padding: 0 0;
}
.form .select2-container .select2-choice {
    height: 25px;
    line-height: 1;
}
.form .select2-container .select2-choice .select2-arrow,
.form .select2-container .select2-choice div {
    border-left: none;
}
.form .select2-container .select2-choice .select2-arrow b,
.form .select2-container .select2-choice div b {
    background-position: 0 0;
}
.form .select2-chosen, .form .select2-choice > span:first-child, .form .select2-container .select2-choices .select2-search-field input {
    padding: 6px 6px;
}

/*
 * checkbox and radio
 * overwrite bootstrap.min.css
 */
.radio, .checkbox {
    min-height: auto;
    margin-top: 0;
    margin-bottom: 0;
}

/*
 * grid
 */
.grid-scrollable .grid-view {
    height: 300px;
    max-height: 300px;
    overflow-y: scroll;
}
.grid-view .pager {
    margin-top: 5px;
    margin-bottom: 5px;
}
.grid-view ul.pagination {
    margin: 5px 0;
}
.grid-view .summary {
    font-size:12px;
}
.grid-view-summary-bottom .summary {
    margin-top: 10px;
    margin-bottom: 0;
    text-align: left;
}
/*
 * conflicts with editable date in the grid e.g index/webInterface
 */
/*
.grid-view table.items tr.selected,
.grid-view table.items tr:hover.selected,
.grid-view table.items tr.selected td,
.grid-view table.items tr.selected td a {
    background: #5bc0de !important;
    color: #fff !important;
}*/
.grid-view table.items tr.even {
    background: #fff !important;
}
.grid-view table.items tr.odd,
.table-striped>tbody>tr:nth-child(odd)>td,
.table-striped>tbody>tr:nth-child(odd)>th {
    background: #E7EEF8 !important;
}
.grid-view table.items tbody tr:hover {
    background: #A5BFD5 !important;
}
.grid-view table.items th,
.grid-view table.items td {
    border-color: #ddd !important;
    vertical-align: middle;
    font-size: 13px;
}
.grid-view table.items th {
    padding-top: 8px;
    padding-bottom: 8px;
    background: #e0e9f5 !important;
    color: #3c8dbc !important;
    font-size: 13px;
}

.grid-view table.items th a {
    color: #3c8dbc !important;
    font-size: 13px;
}
.grid-view .filter-container .form-control,
.grid-view .filter-container select,
.grid-view .filter-container input {
    display: block;
    width: 100%;
    height: 25px;
    padding: 2px;
    font-size: 13px;
    line-height: 1.25;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 0;
    -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;
}
.grid-view .merge {
    font-weight: bold;
    text-align: center;
}
.grid-col-xs {
    width: 30px;
}
.grid-col-sm {
    width: 75px;
}

/*
 * vertical scrollable grid
 */
.grid-view-vscroll table.items thead {
    width: calc( 100% - 1em )/* scrollbar is average 1em/16px width, remove it from thead width */
}
.grid-view-vscroll table.items tbody {
    display: block;
    height: 400px;
    overflow: auto;
}
.grid-view-vscroll table.items thead,
.grid-view-vscroll table.items tbody tr {
    display: table;
    width: 100%;
    table-layout: fixed;/* even columns width , fix width of table too*/
}

/*
 * jqx
 */
.jqx-widget,
.jqx-widget-content {
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif !important;
}
.jqx-grid-column-header {
    font-weight: bold;
    font-size: 12px;
}
.jqx-grid-toolbar a.btn {
    color: #fff;
}

/*
 * modal
 */
.modal-content {
    min-width: 400px;
}
.modal-content .no-modal {
    display: none;
}
body.modal-open .jqx-grid-content>.jqx-enableselect {
    z-index: 1 !important;
}

/*
 * product
 */
#btn-prd-image-add {
    position: absolute;
    top: 83px;
    right: 24px;
    z-index: 999;
}
.modal{
    overflow-y: auto !important;
}
.product-image {
    max-width: 100%;
}
#prd-image-gallery .galleria-container {
    max-width: 100% !important;
}
.no-image {
    display: block;
    padding: 50px 0;
    margin: 0;
    text-align: center;
}

/*
 * file upload
*/
.file-attached-wrapper {
    margin-top: 30px;
}
.wz-upload-form {
    margin-bottom: 20px;
}
.wz-upload-form .btn-mini {
    padding: 3px 6px;
}
#wz-upload-buttonbar .progress {
    margin-bottom: 10px;
}
#wz-upload-buttonbar .fileupload-progress {
    display: none;
}
#wz-upload-available {
    border: 1px solid #d7d7d7;
}
#wz-upload-drop,
#wz-upload-paste {
    border-bottom: none;
}
#wz-upload-drop h4,
#wz-upload-paste h4 {
    padding: 20px;
    color: #aaaaaa;
}
.wz-upload-row td.process-td {
    width: 100px;
}
.wz-upload-row td.start,
.wz-upload-row td.cancel {
    width: 75px;
}
.wz-download-row td.preview img {
    max-width: 85px;
}
.wz-download-row td.delete {
    width: 75px;
}

/*
 * global
 */
.display-none, .wz-hidden {display:none;}
.float-none, .f-none {float: none;clear: both;}
.float-left, .f-left {float: left;}
.float-right, .f-right {float: right;}
.align-left {text-align:left;}
.align-right {text-align:right;}
.align-center {text-align:center;}
.padding-5 {padding: 5px;}
.padding-5-0 {padding: 5px 0;}
.padding-0-5 {padding: 0 5px;}
.padding-10 {padding: 10px;}
.padding-10-0 {padding: 10px 0;}
.padding-0-10 {padding: 0 10px;}
.padding-20 {padding: 20px;}
.padding-20-0 {padding: 20px 0;}
.padding-0-20 {padding: 0 20px;}
.padding-top-0 {padding-top: 0;}
.padding-top-5 {padding-top: 5px;}
.padding-top-10 {padding-top: 10px;}
.padding-top-15 {padding-top: 15px;}
.padding-top-20 {padding-top: 20px;}
.padding-top-30 {padding-top: 30px;}
.padding-left-0 {padding-left: 0;}
.padding-left-5 {padding-left: 5px;}
.padding-left-10 {padding-left: 10px;}
.padding-left-15 {padding-left: 15px;}
.padding-left-20 {padding-left: 20px;}
.padding-left-30 {padding-left: 30px;}
.padding-bottom-0 {padding-bottom: 0;}
.padding-bottom-5 {padding-bottom: 5px;}
.padding-bottom-10 {padding-bottom: 10px;}
.padding-bottom-15 {padding-bottom: 15px;}
.padding-bottom-20 {padding-bottom: 20px;}
.padding-bottom-30 {padding-bottom: 30px;}
.padding-right-0 {padding-right: 0;}
.padding-right-5 {padding-right: 5px;}
.padding-right-10 {padding-right: 10px;}
.padding-right-15 {padding-right: 15px;}
.padding-right-20 {padding-right: 20px;}
.padding-right-30 {padding-right: 30px;}
.no-padding-left {padding-left: 0;}
.no-padding-right {padding-right: 0;}
.no-padding {padding-left: 0 !important; padding-right: 0 !important;}
.no-padding-all {padding-top: 0 !important; padding-bottom: 0 !important; padding-left: 0 !important; padding-right: 0 !important;}
.margin-5 {margin: 5px;}
.margin-5-0 {margin: 5px 0;}
.margin-0-5 {margin: 0 5px;}
.margin-10 {margin: 10px;}
.margin-10-0 {margin: 10px 0;}
.margin-0-10 {margin: 0 10px;}
.margin-20 {margin: 20px;}
.margin-20-0 {margin: 20px 0;}
.margin-0-20 {margin: 0 20px;}
.margin-top-0 {margin-top: 0;}
.margin-top-5 {margin-top: 5px;}
.margin-top-10 {margin-top: 10px;}
.margin-top-15 {margin-top: 15px;}
.margin-top-20 {margin-top: 20px;}
.margin-top-30 {margin-top: 30px;}
.margin-left-0 {margin-left: 0;}
.margin-left-5 {margin-left: 5px;}
.margin-left-10 {margin-left: 10px;}
.margin-left-15 {margin-left: 15px;}
.margin-left-20 {margin-left: 20px;}
.margin-left-30 {margin-left: 30px;}
.margin-bottom-0 {margin-bottom: 0;}
.margin-bottom-5 {margin-bottom: 5px;}
.margin-bottom-10 {margin-bottom: 10px;}
.margin-bottom-15 {margin-bottom: 15px;}
.margin-bottom-20 {margin-bottom: 20px;}
.margin-bottom-30 {margin-bottom: 30px;}
.margin-right-0 {margin-right: 0;}
.margin-right-5 {margin-right: 5px;}
.margin-right-10 {margin-right: 10px;}
.margin-right-15 {margin-right: 15px;}
.margin-right-20 {margin-right: 20px;}
.margin-right-30 {margin-right: 30px;}
.w-50 {width: 50px !important;}
.w-75 {width: 75px !important;}
.w-100 {width: 100px !important;}
.w-150 {width: 150px !important;}
.position-relative {
    position: relative;
}
.fit {
    width: fit-content;
}
.align-left {
    text-align: left;
}
.align-center {
    text-align: center;
}
.align-right {
    text-align: right;
}
.no-border {border: none;}
.label-no-bold label,
label.label-no-bold {
    font-weight: normal;
}
.text-bold {
    font-weight: bold !important;
}
.info {font-size:12px; color:#aaa;}
.italic {font-style:italic;}
.font-red, .color-red {color:#F00;}
.font-pink, .color-pink {color:pink;}
.font-green {color:#090;}
/*.data-more {
    display: none;
}*/
button[data-more-target],
button[data-more-target]:hover,
button[data-more-target]:focus {
    border: none !important;
    border-color: transparent !important;
    outline: none;
    outline-offset: 0;
}
.input-encoded-btn {
    padding: 0 5px;
    color: #333333;
}
/*
 * sub
 */
.sub-total-qty-wrapper {
    margin-bottom: 10px;
}
.sub-total-qty-wrapper label {
    float: left;
}
.sub-total-qty-wrapper .sub-total-qty {
    float: left;
    display: inline-block;
    width: 100px;
    margin-left: 10px;
}

/*
* wz form
*/
.wz-form {
    position: relative;
    padding: 0;
}
.wz-form-top {
    float: left;
    width: 100%;
    padding: 0;
}
.wz-form-middle {
    float: left;
    width: 100%;
    padding: 0;
}
.wz-form-footer {
    float: left;
    width: 100%;
    padding: 0;
}
.wz-form-left {
    padding-left: 0 !important;
}
.wz-form-right {
    padding-right: 0 !important;
}
.wz-form-col {
    margin-bottom: 5px;
}
.wz-doc-summary .wz-form-col {
    margin-bottom: 1px;
}
.wz-form-label {
    padding-left: 0;
    padding-right: 0;
}
.wz-form-input {
    padding-right: 0;
}
.wz-form-detail {
    padding: 0;
    margin: 10px 0;
}
.epanel .wz-form .nav-tabs {
    margin-top: 0;
}
.wz-form-toolbar {
    margin-top: 15px;
    padding: 10px 0 0 0;
    border-top: 1px solid #ddd;
}

/*
 * tabs
 */
.wz-tab .tab-content {
    padding-top: 10px;
}

/*
 * search
 */
div.form-search {
    padding-left: 15px;
    padding-right: 15px;
    padding-top: 15px;
    padding-bottom: 15px;
    margin-bottom: 15px;
    border: 1px solid #ddd;
}
table.tbl-search {
    width: 100%;
    max-width: 100%;
}
.wz-grid-criteria {
    float: left;
    width: 100%;
    padding: 5px 10px 2px 10px;
    margin-bottom: 2px;
    border: 1px solid #a4bed4;
    border-radius: 3px;
    font-weight: bold;
    font-size: 11px;
    font-style: italic;
}
.wz-criteria {
    padding: 5px;
    margin-bottom: 5px;
    background: #eee;
    border: 1px solid #a4bed4;
    border-radius: 3px;
    font-weight: bold;
    font-size: 12px;
}

/*
 * sales
 */
.doc-amounts {
    background: none !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    /*font-size: 16px !important;*/
}
#doc_disc_pc, #doc_discount {
    /*font-size: 16px !important;*/
}
.doc-amounts#doc_net_amount {
    border-top: double 3px #000 !important;
    font-weight: bold;
}
.doc-amounts#doc_balance_ro {
    color: #428bca !important;
    cursor: pointer !important;
    font-weight: bold;
}
button.doc-description-tpl {
    margin-left: 5px;
}
button.doc-description-tpl .fa {
    margin-left: 0;
    margin-right: 0;
}
.doc-link {
    display: inline-block;
    margin-top: 4px;
}
.f2function .erp-form-control{
    border: none !important;
}
.modal-dialog{
    width: 100%;
    /*text-align: center;*/
}
.erp-modal .modal-content{
    float: none;
    display: inline-block;
}
/*
 * interface
 */
.btn-interface-lock {
    padding-top: 3px;
    padding-bottom: 3px;
}

/*
 * media
 */
@media (min-width: 1201px) {
    /*    .container {
            width: 100%;
        }*/
}

@media (max-width: 768px) {
    .nav>li>a {
        padding: 10px 10px;
    }

    /*
     * wz form
     */
    .wz-form-left {
        padding-right: 0;
    }
    .wz-form-right {
        padding-left: 0
    }
    .wz-form-input {
        padding-left: 0;
    }
    div.doc-no {
        width: 100%;
    }
    /*    .doc-no input.doc-code {
            width: 25%;
        }
        .doc-no input.doc-year {
            width: 25%;
        }
        .doc-no input.doc-num {
            width: 50%;
        }*/
}

/* print preview */
@media print {
    /* show navbar menu, was hidden by bootstrap */
    .navbar {
        display: block !important;
        border-width:0 !important;
    }
    .navbar-toggle {
        display:none;
    }    
    /* hidden sections in print */
    #print-wrapper,
    #footer {
        display: none;
        visibility: hidden;
    }
    .grid-view {
        max-width: 100%;
        overflow-x: scroll;
    }
    /* hide the href from a description, was set to default ("attr(href)")" */
    a[href]:after {
        /*content:" ("attr(href)")";*/ 
        content:"" !important;
        color:#868686;
        background-color:inherit;
        font-style:italic;
        size:90%;
    }
}