﻿

.input-group {
    margin-top: 1px;
    margin-bottom: 1px;
}
.tab-header
        ,.tab-customer
        ,.tab-article {
    background-color:  whitesmoke;
}
    .divsaledashboard {
            overflow-y: scroll;
            overflow-x: scroll;

        }

input[type=text].form-control 
    ,input[type=email].form-control{
     background: Cornsilk;
     font-size: 18px;
}
input[type=email].form-control {
     background: Cornsilk;
     font-size: 18px;
}

.spannumeric {
            background: #f9f9f9;
            text-align:right;

        }

     #cont {
            height: 50vh;
            width: 100%;
            overflow-y: scroll;
            overflow-x: scroll;
        }

        .row-data {
            cursor: pointer;
        }

        body {
            font-family: Arial, Helvetica, sans-serif;
        }

        .label-shipped {
            background-color: #EB70FF;
        }

        .close:hover,
        .close:focus {
            color: #000;
            text-decoration: none;
            cursor: pointer;
        }

        .items a {
            display: block;
            cursor: pointer;
        }

        .backup_picture {
            width: 50px;
            height: 50px;
        }

        /*#showskumodal {
           overflow: visible;
            position: absolute;
            width: 100%;
            height:100%;
        }*/



        .close {
            color: #aaa;
            float: right;
            font-size: 15px;
            font-weight: bold;
        }

            .close:hover, .close:focus {
                color: black;
                text-decoration: none;
                cursor: pointer;
            }

        .signup {
            border-color: #DD8705;
        }

            .signup .panel-body label {
                font-weight: normal;
            }

            .signup .panel-heading {
                color: #FDFD2E;
            }

            .signup .panel-footer {
            }

        .btn-submit {
            margin-right: 5px;
        }

        #tdetail table, #SkuDataTable table, #tdetail3 table, #orderlist table {
            width: 100%;
            border-collapse: collapse;
        }

        #tdetail th, #SkuDataTable th, #tdetail3 th, #orderlist th {
            border: 1px;
            text-align: center;
            padding: 8px;
            background: palegreen;
            color: black;
        }

        #tdetail tr:nth-child(odd), #SkuDataTable tr:nth-child(odd), #tdetail3 tr:nth-child(odd), #orderlist tr:nth-child(odd) {
            background-color: #FFFFFF;
        }

       

        .tdl {
            text-align: left;
            padding: 8px;
        }

        .tdr {
            text-align: right;
            padding: 8px;
        }

        .tdc {
            text-align: center;
            padding: 8px;
        }

        #mqrcode1 {
            display: none;
            /*background-color:red;
                 left :-9999px;*/
        }

        .textfill { /*text ที่ ต้องกรอก*/
            background-color: lightyellow;
        }

        /*สำหรั mobile */
        @media only screen and (max-width: 760px), (min-device-width: 768px) and (max-device-width: 1024px) {

            #container {
                width: 95vw;
            }

            #mqrcode {
                display: none;
            }

            #mqrcode1 {
                display: block;
            }

            .modal-body {
                width: 95vw;
            }

            /*.sidebar-menu {
                display: none;
            }*/

            /*#tdetail table,
            #tdetail thead,
            #tdetail tbody,
            #tdetail th,
            #tdetail td,
            #tdetail tr,*/
            /*#orderlist table,
            #orderlist thead,
            #orderlist tbody,
            #orderlist th,
            #orderlist td,
            #orderlist tr*/ 
            #tdetail3 table,
            #tdetail3 thead,
            #tdetail3 tbody,
            #tdetail3 th,
            #tdetail3 td,
            #tdetail3 tr
            
            {
                display: block;
            }

                /*#tdetail thead tr,*/
                /*#orderlist thead tr*/  
                #tdetail3 thead tr
                {
                    position: absolute;
                    top: -9999px;
                    left: -9999px;
                    background: red;
                }
            /*#tdetail tr { border: 1px solid #ccc; }*/

            /*#tdetail td,
            #orderlist td*/ 
            #tdetail3 td
            {
                /* Behave  like a "row" */
                border: none;
                border-bottom: 1px solid #eee;
                position: relative;
                padding-left: 35%;
                white-space: normal;
                text-align: left;
            }

                /*#tdetail td:before,
                #orderlist td:before*/ 
                #tdetail3 td:before
                {
                    /* Now like a table header */
                    position: absolute;
                    /* Top/left values mimic padding */
                    top: 6px;
                    left: 6px;
                    width: 100%;
                    padding-right: 10px;
                    white-space: nowrap;
                    text-align: left;
                    font-weight: bold;
                }

                /*#tdetail td:before,
                #orderlist td:before*/
                #tdetail3 td:before
                 {

                    content: attr(data-title);
                }

            /*#tdetail tr:nth-child(odd),
            #orderlist tr:nth-child(odd)*/
            #tdetail3 tr:nth-child(odd)
            {
                background-color: #FFFFFF;
            }

            .tdl {
                padding: 6px;
                text-align: center;
            }

            .tdr {
                padding: 6px;
                text-align: center;
            }

            .tdc {
                padding: 6px;
                text-align: center;
            }
        }

        .header-line {
            text-align: left;
            color: #AAA;
        }

        .space-input {
            padding-bottom: 10px;
        }

        #show-email-status {
            padding-left: 15px;
        }

        .hidden {
            /*visibility:hidden;*/
        }

        .show {
            visibility: visible;
        }

        .require {
            border: 1px solid #FF0000;
        }

        .show-status {
            font-size: 10px;
        }

        .row {
            width: 95%;
            margin: 0 auto 0 auto;
        }

        .wildcard {
            color: #AAA;
            float: left;
        }



        body {
            font-family: Arial;
        }

        /* Style the tab */
        .tab {
            overflow: hidden;
            border: 1px solid #ccc;
            background-color: #f1f1f1;
        }

            /* Style the buttons inside the tab */
            .tab button {
                background-color: inherit;
                float: left;
                border: none;
                outline: none;
                cursor: pointer;
                padding: 14px 16px;
                transition: 0.3s;
                font-size: 17px;
            }

                /* Change background color of buttons on hover */
                .tab button:hover {
                    background-color: #ddd;
                }

                /* Create an active/current tablink class */
                .tab button.active {
                    background-color: #ccc;
                }

        /* Style the tab content */
        .tabcontent {
            display: none;
            padding: 6px 12px;
            border: 1px solid #ccc;
            border-top: none;
        }
