::-webkit-input-placeholder {color:#bbb!important;}
::-moz-placeholder          {color:#bbb!important;}/* Firefox 19+ */
:-moz-placeholder           {color:#bbb!important;}/* Firefox 18- */
:-ms-input-placeholder      {color:#bbb!important;}

:focus::-webkit-input-placeholder {color: transparent!important;}
:focus::-moz-placeholder          {color: transparent!important;}
:focus:-moz-placeholder           {color: transparent!important;}
:focus:-ms-input-placeholder      {color: transparent!important;}

[readonly] {
    background-color: #ffffff!important;
}

body {
    font-family: 'Arial';
    font-size: 14px;
    overflow-x: hidden;
    background-color: #eee;
}

.body-main {
    display:flex;
    min-width: 100%;
    min-height: 100%;
}

.main-left-menu {
    min-width: 210px;
    min-height: 100%;
    background-color: #ffffff;
    display: flex;
    align-items: flex-end;
    flex-direction: column;
}

.main-left-menu .icon {
    fill: #bbb;
    margin-bottom:-1px;
}

.main-left-menu-panel {
    min-width: 210px;
    min-height: 100%;
}

.main-left-menu .logo {
    width:100%;
    background-color: #fff;
    font-size: 40px;
    text-align: center;
    padding-top:0px;
}


.main-center {
    display: flex;
    flex-grow: 1;
    min-height: 100%;
    flex-direction: column;
    background-color: #eee;
    overflow-x: hidden;
}

.main-top-menu {
    display:inline-block;
    width:100%;
    min-height: 50px;
    background-color: #F8F9FA!important;
}   

.main-content {
    min-width: 100%;
    padding: 30px 30px;    
}

.main-content-list {
    min-width:100%;
    max-width:100%;
    overflow:hidden;
}

.list-group-item.grouped {
    font-weight: bold;
    color: #333;
    padding: .45rem 1.25rem;
    background-color: #ddd;
    border: none;
    margin: 0px;
}

.list-group-item.grouped:hover {
    border: none;
}

.list-group-item.grouped .icon {
    fill:#333;
    margin-bottom:-2px;
}

.card640 {
    max-width: 640px;
    min-width: 320px;
    flex-grow: 1;
}

.card-body .row {
    border-bottom: 1px solid #ddd;
}

.card-body .row:last-child {
    margin-bottom: 30px;
    border-bottom: 0px;
}

.label,
.label {
    padding: .5rem;
    font-weight: bold;
}

.label:after,
.label:after {
    content: ':';
}

.value,
.value{
    padding: .5rem;
}

.row-thin {
    margin: 0rem 0px;
}

.row-thin > * {
    margin: -0.5rem 0px;
}

.row-wide {
    margin: 0.5rem 0px;
}

.icon {
    display: inline-block;
    width:16px;
    height:16px;
}

.form-group label:after {
    content: ':';
}

.form-group label.form-check-label:after {
    content: '';
}

.form_btn_load {
    position:absolute;
    left:0px;
    top:0px;
    display:none;
    width:100%;
    height:100%;
    background-color:#eee;
    text-align:center;
    padding:9px;
    border:1px solid #ddd;
}

label[data-toggle="tooltip"] {    
    border-bottom: 1px dashed #000;
    line-height: 1.1rem;
}

#m_chars, #m_parts {
    font-weight: bold;
    color: #000;
}

.message-counter {
    display: flex;
    flex-wrap: wrap;
}

.message-counter > .counter {
    flex-grow: 1;
    text-align: right;
}

.card-info-h5 {
    padding: .75rem 0px;
}

.card-info {
    background-color: #fff;
    margin-bottom: 15px;
}

.card-info td {
    text-align: center;
}

.card-info th {
    font-weight: normal;
    text-align: center;
    border-top: 0px;
}

.card-info table {
    margin:0px;
}

.dropdown-menu {
    right: 0; 
    left: auto;
    box-shadow: rgba(0, 0, 0, 0.14) 0px 4px 5px 0px, rgba(0, 0, 0, 0.12) 0px 1px 10px 0px, rgba(0, 0, 0, 0.2) 0px 2px 4px -1px;
}

.tooltip .tooltip-inner {
    background-color: #fff;
    color: #000;
    font-family: 'Arial';
    font-size: 0.75rem;
    border: 1px solid #ccc;
    box-shadow: rgba(0, 0, 0, 0.14) 0px 4px 5px 0px, rgba(0, 0, 0, 0.12) 0px 1px 10px 0px, rgba(0, 0, 0, 0.2) 0px 2px 4px -1px;
}

.tooltip .arrow:before {    
    border-right-color: #ccc; 
}

.tooltip .arrow::after {
    position:absolute;
    content:'';
    left:-0.3rem;
    border-color: transparent;
    border-width: 0.4rem;
    border-style: solid;
    border-right-color: #fff;
}

.tooltip.bs-tooltip-top .arrow::after {
    position:absolute;
    content:'';
    top: -0.1px;
    left:0rem;
    border-color: transparent;
    border-width: 0.4rem;
    border-style: solid;
    border-top-color: #fff;
    background-color: transparent;
}

.form-disabled {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.5);
    z-index:50;
}

.form-waiter {
    display: none;
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.75);
    z-index:50;
    text-align: center;
}

.form-waiter-contaner {
    display: inline-block;
    text-align: center;
    margin: 35% 10%;
    background-color: #fff;
    width: auto;
    padding: 3% 10%;
    box-shadow: rgba(0, 0, 0, 0.14) 0px 4px 5px 0px, rgba(0, 0, 0, 0.12) 0px 1px 10px 0px, rgba(0, 0, 0, 0.2) 0px 2px 4px -1px;
}

.form-waiter-label {
    line-height: 16px;
    margin-bottom:20px;
}


.visible-top-email {
    display: none;
}

.visible-top-payment {
    display: none;
}

.table thead th {
    vertical-align: middle;
}

.table {
    margin-bottom: 0px;
}

.table-row-ahref {
    position: absolute;
    display: inline-block;
    left: 0px;
    width: 100%;
}

.sort {
    width:100%;
    padding: .375rem .3rem;
}

.sort svg {
    margin-left: 3px;
    margin-bottom: -4px;
}

.action-table {
    max-width:100%;
}

.action-table th {
    margin: 0px;
    padding: 2px 1px;
}

.action-table td {
    text-align: center;
    padding: 0.75rem;
}

.first-cell {
    padding: 0px!important;
    height: 100%!important;
    margin: 0px!important;
    max-width: 0px!important;
    vertical-align: bottom;
}    

table, tr {
    position: relative;
}


.tab-pane {
    padding: 15px;
    border: 1px solid #dee2e6;
    border-top: 0px;
    border-bottom-left-radius: .25rem;
    border-bottom-right-radius: .25rem;
}

.time-select .dropdown-menu {
    padding: 5px;
    width: auto;
    min-width: auto;
}

.time-select .dropdown-menu input {
    display:inline-block;
    width: 50px;
    margin: 5px 0px;
    text-align: center;
}

.time-select .dropdown-menu a {
    width: 50px;
}

.time-select .dropdown-menu div {
    white-space: nowrap;
}

.time-select .dropdown-menu span {
    display: inline-block;
    width:10px;
    text-align: center;
}

.daterangepicker.ltr .ranges, .daterangepicker.ltr .calendar {
    float: left;
}

.daterangepicker .daterangepicker_input {
    position: relative;
}

.daterangepicker .input-mini {
    padding-left: 30px;
    margin-bottom: 5px;
}

.daterangepicker .daterangepicker_input i {
    position: absolute;
    left: 8px;
    top: 10px;
}

.daterangepicker.dropdown-menu {
    padding: 10px;
    z-index: 10;
    max-width: 90%;
}

.calendar-table {
    
}

.calendar-table th {
    text-align: center;
}

.calendar-table td {
    padding: 2px 7px;
    border: 1px solid #eee;
    cursor: pointer;
    text-align: center;
}

.calendar-table .weekend {
    background-color: #eee;
}

.calendar-table .available {
    color: #333;
}

.calendar-table .in-range {
    background-color: #ddf;
}

.calendar-table .off.available {
    color: #ccc;
}

.calendar-table .active {
    color: #fff;
    background-color: #0062cc;
}

.calendar-table .today {
    outline: 1px solid #000;
    outline-offset: -1px;
}

.calendar-table .monthselect, .calendar-table .yearselect {
    padding: 3px 7px;
    border: 1px solid #ccc;
}

.calendar-table .next, .calendar-table .prev {
    cursor: pointer;
}

.calendar-table .next:hover, .calendar-table .prev:hover {
    background-color: #eee;
}

.calendar.left {
    margin-right: 10px;
    margin-bottom: 10px;
}

label.no-points:after, .label.no-points:after {
    content: '';
}


.report-popover {
    box-shadow: rgba(0, 0, 0, 0.14) 0px 4px 5px 0px, rgba(0, 0, 0, 0.12) 0px 1px 10px 0px, rgba(0, 0, 0, 0.2) 0px 2px 4px -1px;
}

.table-hover tr:hover td, .table-hover tr.active {
    background-color: rgba(0,123,255,1)!important;
    color: #fff;
}


.toolbar {
    display: flex;
    flex-wrap: wrap;
    max-width: 100%;
    min-width: 100%;
    margin-bottom: 10px;
    margin-left: -20px;
    margin-right: -20px;
}

.toolbar-item {
    display: flex;
    padding: 10px 0px;
    margin-left: 20px;
}

.toolbar-item:last-child {
    margin-right: -20px;
}

.toolbar-item .label {
    padding-left: 0px;
}

.toolbar-item {
    display: flex;
} 

.size_arrow svg {
    width:20px;
    height:20px;
    fill:#000;
    margin-bottom:-4px;
}

.size_arrow.disabled svg {
    fill: #eee;
}

.btn-size {
    width: 55px;
    border-radius: 0px;
}

.dropdown-menu.size {
    min-width:0px;
    width:100%;
}

.dropdown-menu.size .dropdown-item {
    padding: 0.5rem 0px;
    text-align: center;
}

.row-min-select {
    display:inline-block;
    margin: -2px 0px;
}

.row-min-select a {
    padding: 0.5rem 2px;
}

.row-min-select input {
    display: none;
    width: 5rem;
    margin: -0.5rem 0px;
    text-align: center;
}

.table-responsive {
    opacity: 0;
    min-height: 300px;
}

.popover {
    box-shadow: rgba(0, 0, 0, 0.14) 0px 4px 5px 0px, rgba(0, 0, 0, 0.12) 0px 1px 10px 0px, rgba(0, 0, 0, 0.2) 0px 2px 4px -1px;
}

.td-user-info {
    position: relative;
}

.td-user-info .btn {
    position: absolute;
    background-color: rgba(0,0,0,0);
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
    font-size: 0px;
}

.td-user-info:hover {
    text-decoration: underline;
}

.td-user-info:hover a {
    background-color: rgba(0,0,0,0.15);
}

.modal-footer {
    flex-wrap: wrap;
}

.modal-footer .btn-left {
    flex-grow: 1;
    margin: 0px;
}

.modal-footer button, 
.modal-footer a {
    margin: 10px 0px;
}

@media (max-width: 480px) {
    .toolbar {
        align-items: stretch;
        flex-direction: column;
    }
    .toolbar-item {
        flex-wrap: wrap;
        margin-right: -20px;
        flex-grow: 1;
    }

    .toolbar-item > * {
        flex-grow: 1;
    }
    
    .modal-footer button, 
    .modal-footer a {
        width:100%;
        margin: 10px 0px!important;
    }
}


@media (min-width:800px) {
    .visible-top-email {
        display: block;
    }
}

@media (min-width:576px) {
    .login-dialog {
        max-width: 350px;
    }
    
    .modal-dialog .modal-content {
        box-shadow: 0 0 10px rgba(0,0,0,0.5);
    }    
}

@media (max-width:600px) {
    .daterangepicker.ltr .ranges, .daterangepicker.ltr .calendar {
        float: none;
    }
   
}

@media (max-width:768px) {
    .main-left-menu {        
        min-width: 0px;
        width: 0px;
        padding-top:58px;
    }
    
    .main-top-menu {
        position:fixed;
        z-index:1000;
        left:0px;
        box-shadow: rgba(0, 0, 0, 0.14) 0px 4px 5px 0px, rgba(0, 0, 0, 0.12) 0px 1px 10px 0px, rgba(0, 0, 0, 0.2) 0px 2px 4px -1px;
    }
    
    .main-content {
        padding: 0px;
    }
    
    .main-content-list {
        display: inline-block;
        min-width:100%;
        padding-top: 55px;
    }
    
    .table-responsive {
        margin-left: -20px;
        margin-right: -20px;
        width: calc(100% + 40px);
    }
}

.visible-xs,
.visible-sm,
.visible-md,
.visible-lg {
    display: none;
}

.novisible-xxs,
.novisible-xs,
.novisible-sm,
.novisible-md,
.novisible-lg {
    display: inline-block;
}

@media (min-width:420px) {
    .visible-top-payment {
        display: inline-block;
    }
}

@media (max-width:419px) {
    .novisible-xxs {
        display: none;
    }    
}

@media (min-width: 420px) and (max-width: 767px)  {
    .visible-xs {
        display: block;
    }
    .novisible-xs {
        display: none;
    }
}
  
@media (min-width: 768px) and (max-width: 991px) {
    .visible-sm {
        display: block;
    }
    .novisible-sm {
        display: none;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .visible-md {
        display: block;
    }
    .novisible-md {
        display: none;
    }
}

@media (min-width: 1200px) {
    .visible-lg {
        display: block;
    }
    .novisible-lg {
        display: none;
    }
}