﻿/* Please see documentation at https://docs.microsoft.com/aspnet/core/client-side/bundling-and-minification\ 
for details on configuring this project to bundle and minify static web assets. */
body {
    padding-top: 50px;
    padding-bottom: 20px;
}

/* Wrapping element */
/* Set some basic padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

/* Carousel */
.carousel-caption p {
    font-size: 20px;
    line-height: 1.4;
}

/* Make .svg files in the carousel display properly in older browsers */
.carousel-inner .item img[src$=".svg"] {
    width: 100%;
}

/* QR code generator */
#qrCode {
    margin: 15px;
}

/* Hide/rearrange for smaller screens */
@media screen and (max-width: 767px) {
    /* Hide captions */
    .carousel-caption {
        display: none;
    }
}

.display_none{
    display:none !important;
}


.tab{float:left; width:600px; height:290px;}
.tabnav{font-size:0; width:600px; border:1px solid #ddd; padding:0;}
.tabnav li{display: inline-block;  height:46px; text-align:center; border-right:1px solid #ddd;}
.tabnav li a:before{content:""; position:absolute; left:0; top:0px; width:100%; height:3px; }
.tabnav li a.active:before{background:#7ea21e;}
.tabnav li a.active{border-bottom:1px solid #fff;}
.tabnav li a{ position:relative; display:block; background: #f8f8f8; color: #000; padding:0 30px; line-height:46px; text-decoration:none; font-size:16px;}
.tabnav li a:hover,
.tabnav li a.active{background:#fff; color:#7ea21e; }
.tabcontent{padding: 20px;  border:1px solid #ddd; border-top:none;overflow:hidden;}
.tabcontentbox{overflow:hidden;}

.disabled {
    pointer-events: none;

}
.disabled input{

    opacity: 0.5;
}
.disabled_none {
    opacity: 1;
    pointer-events: initial !important;
}
.disabled_none input{
    opacity: 1;
}
.meal_disabled {
    pointer-events: none;
    color: blue;
}

.seltable tbody tr:hover, .seltable tbody .tr_selected {
    background-color: aqua;
}

.form-control-short {
    display: block;
    float:left;
    height: 34px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
    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, -webkit-box-shadow ease-in-out .15s;
}

.A4Size {
    width: 840px;
    height: 1130px;
    display: flex;
    flex-direction: column;
}
.A4Size_Wide {
    width: 900px;
    height: 580px;
    display: flex;
    flex-direction: column;
    font-size: 11px;
    white-space: nowrap;
}

.print_row > div {
    border: 0.5px solid black;
}
.print_row {
    width: 100%;
    display: flex;
    flex-direction: row;
}


.last_item {
    flex-grow:1;
}
.logo_box {
    font-size: 40px;
    text-align: center;
    width: 60%;
}

.column2 {
    width: 50%;
}
.column3 {
    width: 33.334%;
}
.column6 {
    width: 16.667%;
}
.h100{
    height:8%;
}
.h25 {
    height: 2%;
}
.h50 {
    height: 4%;
}
.h125 {
    height: 10%;
}
.h150 {
    height: 12%;
}
.h275 {
    height: 22%;
}
.h25p {
    height: 25%;
}
.h_last {
    flex-grow: 1;
}
.tcenter {
    text-align: center;
    font-size:16px;
}
.tleft {
    text-align: left;
    font-size: 16px;
}
.logoimg {
    height: 80%;
}

.Block_Tb_Mobile_Show {
    display: none;
}
@media (max-width: 768px) {
    .table-block {
        border: 1px solid black;
        table-layout: fixed;
    }
    .table-block thead {
        display: none;
    }
    .table-block tr {
        border: 1px solid black;
        display: block;
    }
    .table-block tr .Block_Tb_Mobile_Show{
        display:block;
        width:100%;
        overflow:hidden;
    }
    .table-block .addhead .div_head { 
        width: 40%;
        float: left;
        font-weight:bold;
    }
    .table-block .Block_Tb_Pc_Show {
        display: none;
    }
    .table_wrap {
        border: 1px solid black;
    }

}


.table_wrap {
    width: 100%;
    min-height: 40vh;
    max-height: 50vh;
    margin: 0 auto;
    overflow-x: scroll;
}
.table_wrap .table {
    border-collapse: separate;
    border-spacing: 0;    
}

.table_wrap .table thead tr th {
    position: -webkit-sticky;
    position: sticky;
    top:0px;
    white-space: nowrap;
    background:white;
}
.table_wrap .table tbody tr td {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    word-break: break-all;
}
/*.table .col_sort {
    color:blue;
}*/
.table .col_sort_desc .sort_flag .desc {
    display: inline-block;
}

.table .col_sort_asc .sort_flag .asc {
    display: inline-block;
}

.table .sort_flag .asc {
    display: none;
}
.table .sort_flag .desc {
    display: none;
}


@media (min-width: 768px) {
    .table_wrap .table tbody tr td {
        max-width :50vw;
    }
}

.table > tbody > tr.active > td {
    background-color: #c0c0c0 !important;
}


@media(max-width:992px) {

    .mobile thead {
        display: none;
    }

    .mobile tr {
        display: block;
        box-sizing: border-box;
        width: 100%;
        /*padding: 5px 5px 0;*/
        border-top: 2px solid #ccc;
        clear: both;
    }

    .mobile th,
    .mobile td {
        display: block;
        float: left;
        box-sizing: border-box;
        /*border: 0;*/
        font-size: 12px;
        margin-bottom: 0px;
        padding: 0 1px;
        width: 100%;
        text-align: left;
    }

    .mobile th {
        width: 100%;
        background: none;
    }

    .mobile td:before {
        font-weight: 700;
        content: attr(data-label) " ";
        /*background-color: azure;*/
    }


    /*    tbody tr td:not(.index, .name, .desc):before {
        font-weight: 700;
        content: attr(data-label) " : ";
    }*/
}