/* Style the tab */
 .tab {
    overflow: hidden;
    border: 1px solid #ccc;
    background-color: #f1f1f1;
    border-radius: 0.25rem 0.25rem 0 0;
}

/* Style the buttons inside the tab */
.tab button {
    background-color: inherit;
    float: left;
    border: none;
    outline: none;
    cursor: pointer;
    padding: 6px 16px;
    transition: 0.3s;
    font-size: 17px;
    background-color: #FFF;
    color: #1192f6;
}

/* Change background color of buttons on hover */
.tab button:hover {
    background-color: #1192f6 !important;
    font-weight: bold;
    color: white;
}

/* Create an active/current tablink class */
.tab button.active {
    background-color: #1192f6 !important;
    font-weight: bold;
    color: white;
}

/* Style the tab content */
.tabcontent {
    display: none;
    padding: 6px 12px;
    border: 1px solid #ccc;
    border-top: none;
}


/* Style the tab */
.tab_1 {
    overflow: hidden;
    border: 1px solid #ccc;
    background-color: #f1f1f1;
    border-radius: 0.25rem 0.25rem 0 0;
}

/* Style the buttons inside the tab */
.tab_1 button {
    background-color: inherit;
    float: left;
    border: none;
    outline: none;
    cursor: pointer;
    padding: 14px 16px;
    transition: 0.3s;
    font-size: 17px;
    background-color: #FFF;
    color: #1192f6;
}

/* Change background color of buttons on hover */
.tab_1 button:hover {
    background-color: #1192f6 !important;
    font-weight: bold;
    color: white;
}

/* Create an active/current tablink class */
.tab_1 button.active {
    background-color: #1192f6 !important;
    font-weight: bold;
    color: white;
}

/* Style the tab content */
.tabcontent_1 {
    display: none;
    padding: 6px 12px;
    border: 1px solid #ccc;
    border-top: none;
}

.check {
    margin-top: 29px;
}

.modal-header h4.modal-title {
    font-family: THSarabunNew !important;
    font-size: 21px;
}

.modal-body label {
    font-family: THSarabunNew !important;
}

.modal-header {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
    background-color: #FFF;
    color: black;
}

.modal-header .close {
    margin-right: 0 !important;
    padding: 9px 0px 0px 5px !important;
}

.modal-dialog {
    max-width: 870px !important;
}



.modal-footer {
    border-top: none !important;
    position: relative;
    bottom: 10px;
    display: block !important;
    margin-left: auto;
    margin-right: auto;
    padding: 0 !important;
}

/* [type="checkbox"]:checked,
[type="checkbox"]:not(:checked) {
    position: absolute;
}

[type="checkbox"]:checked,
[type="checkbox"]:not(:checked) {
    position: relative;
    padding-left: 28px;
    cursor: pointer;
    line-height: 20px;
    display: inline-block;
    color: #666;
}

[type="checkbox"]:checked::before,
[type="checkbox"]:not(:checked)::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 18px;
    height: 18px;
    border: 1px solid #1192f6;
    background: #fff;
}

[type="checkbox"]:checked::after,
[type="checkbox"]:not(:checked)::after {
    content: '';
    width: 14px;
    height: 14px;
    background: #1192f6;
    position: absolute;
    top: 2px;
    left: 2px;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

[type="checkbox"]:not(:checked)::after {
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
}

[type="checkbox"]:checked::after {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
} */

.search-button-modal-1 {
    margin-bottom: 15px;
    padding-left: 25px;
    padding-right: 25px;
    line-height: 15px !important;
    height: 33px !important;
}

.header-title {
    font-size: 21px;
    font-weight: bold;
    color: #233338;
}

.order {
    padding-left: 14px !important;
}

.times {
    color: black;
    top: 1px;
    position: relative;
    font-size: 35px;
}


select.select3 {

    padding: 5px !important;
    padding-right: 0 !important;

    line-height: 1;
    border-bottom: 1px solid #cdd5da;
    border-top: none;
    border-left: none;
    border-right: none;
    border-radius: 0 !important;
    height: 30px !important;
    background: url(../images/tran-arrow.png) no-repeat right;
    background-size: 14px 9px;
    -webkit-appearance: none;
    background-position-x: 219px;
    background-position-y: 13px;
    cursor: pointer;
}

select.select3:focus {
    border-bottom: 1px solid #cdd5da;
    border-top: none;
    border-left: none;
    border-right: none;
}

.baht {
    font-size: 19px;
    padding-right: 7px;
    border: 1px solid #cdd5da;
    background-color: #e9ecef;
    border-left: none !important;
    color: #C7CCCE !important;
}

.baht-table {
    font-size: 19px;
    padding-right: 7px;
    border: 1px solid #cdd5da;
    background-color: #fff;
    color: #C7CCCE !important;
    border-left: none !important;
    border-radius: 0rem 0.25rem 0.25rem 0rem;
}

.baht2 {
    font-size: 19px;
    padding-right: 7px;
    border: 1px solid #cdd5da;
    background-color: #e9ecef;
    border-left: none !important;
    color: #C7CCCE !important;
    border-radius: 0rem 0.25rem 0.25rem 0rem;
}

.baht3 {
    font-size: 19px;
    padding-right: 7px;
    border: 1px solid #cdd5da;
    background-color: #e9ecef;
    color: #C7CCCE !important;
    border-left: none !important;
    border-radius: 0rem 0.25rem 0.25rem 0rem;
}


/* 
.search-button {
   color: #cdd5da !important;
   border-top: none !important;
   border-left: none !important;
   border-right: none !important;
   border-bottom: 1px solid #cdd5da !important;
   background-color: transparent !important;
   border-radius: 0 !important;
   height: 30px !important;
}

input.form-control.input-search {
   border-top: none;
   border-left: none;
   border-right: none;
   border-radius: 0 !important;
   padding: 0 !important;
   padding-left: 5px !important;
}

input.form-control.input-search:focus {
   border-top: none;
   border-left: none;
   border-right: none;
   border-bottom: 1px solid #cdd5da !important;
   border-radius: 0 !important;

}

.date-button {
   color: #cdd5da !important;
   border-top: none !important;
   border-left: none !important;
   border-right: none !important;
   border-bottom: 1px solid #cdd5da !important;
   background-color: transparent !important;
   border-radius: 0 !important;
   height: 30px !important;
}

input.form-control.input-date {
   border-top: none;
   border-left: none;
   border-right: none;
   border-radius: 0 !important;
   padding: 0 !important;
   padding-left: 5px !important;
}

input.form-control.input-date:focus {
   border-top: none;
   border-left: none;
   border-right: none;
   border-bottom: 1px solid #cdd5da !important;
   border-radius: 0 !important;

}

.tools a {
   margin-left: 0 !important;
}

i.fa.fa-circle {
   font-size: 13px !important;
   padding-right: 5px;
   color: #7ED321;
}

.tr-row-two td {
   color: #67BBFA !important;
}

i.fa.fa-circle.wait {
   color: #4A90E2;
}

i.fa.fa-circle.temp {
   color: #F5A623;
}

.user-data {
   float: right;
   font-size: 19px !important;
   text-align: right;
   background-color: transparent !important;
   border: none !important;
}

.name-card {
   padding-right: 3px !important;
   padding-bottom: 0px !important;
}

.non-border-card {
   border-radius: 0px !important;
}

.btn-search {
   border-radius: 0 0.25rem 0.25rem 0;
   margin-left: -1px;
   margin-top: -1px;
   height: 32px !important;
   background-color: #CDD5DA !important;
}

i.fa.fa-search {
   color: #69777E !important;
   font-size: 15px !important;
}

.btn-gen {
   margin-left: -1px;
   margin-top: 0px !important;
   height: 30px !important;
   background-color: #CDD5DA !important;
   border-radius: 0 0.25rem 0.25rem 0 !important;
}

.group-gen {
   padding-top: 10px !important;
   padding-right: 12px !important;
   border-radius: 0 0.25rem 0.25rem 0 !important;
}


#gridCheck1 {
   height: 17px;
   width: 17px;
}

#gridCheck2 {
   height: 17px;
   width: 17px;
}

#gridCheck3 {
   height: 17px;
   width: 17px;
}

#gridCheck4 {
   height: 17px;
   width: 17px;
}

#gridCheck5 {
   height: 17px;
   width: 17px;
}

#gridCheck6 {
   height: 17px;
   width: 17px;
}

#gridCheck7 {
   height: 17px;
   width: 17px;
}

select.select4 {
   padding: 5px !important;
   padding-right: 0 !important;
   line-height: 1;
   border: 1px solid #cdd5da;
   border-radius: 0.25rem !important;
   height: 30px !important;
   background: url(../images/grey-arrow-1.png) no-repeat right;
   background-size: 30px 30px;
   -webkit-appearance: none;
   background-position-x: 198px;
   cursor: pointer;
   background-color: #fff;
}

select.select4:focus {
   border: 1px solid #cdd5da;
}


.input-15 {
   border-right: none !important;
}

.special {
   background-color: white;
   padding: 20px;
   margin: 10px 0 10px 8px;
   display: block;
}

div.scroll {
   overflow-x: auto;
}

select.select5 {
   padding: 5px !important;
   padding-right: 0 !important;
   line-height: 1;
   border: 1px solid #cdd5da;
   border-radius: 0.25rem !important;
   height: 30px !important;
   background: url(../images/grey-arrow-1.png) no-repeat right;
   background-size: 30px 30px;
   -webkit-appearance: none;
   background-position-x: 68px;
   cursor: pointer;
   background-color: #fff;
}

select.select5:focus {
   border: 1px solid #cdd5da;
}

select.select6 {
   padding: 5px !important;
   padding-right: 0 !important;
   line-height: 1;
   border: 1px solid #cdd5da;
   border-radius: 0.25rem !important;
   height: 30px !important;
   background: url(../images/grey-arrow-1.png) no-repeat right;
   background-size: 30px 30px;
   -webkit-appearance: none;
   background-position-x: 118px;
   cursor: pointer;
   background-color: #fff;
}

select.select6:focus {
   border: 1px solid #cdd5da;
}


select.select7 {
   padding: 5px !important;
   padding-right: 0 !important;
   line-height: 1;
   border: 1px solid #cdd5da;
   border-radius: 0.25rem !important;
   height: 30px !important;
   background: url(../images/grey-arrow-1.png) no-repeat right;
   background-size: 30px 30px;
   -webkit-appearance: none;
   background-position-x: 350px;
   cursor: pointer;
   background-color: #fff;
}

select.select7:focus {
   border: 1px solid #cdd5da;
}



.search-icon:hover {
   color: #1192f6 !important;
}


.custom-btn {
   border: 1px solid black !important;
   color: black !important;
   background-color: #FFF !important;
   margin-bottom: 15px;
   padding-left: 40px !important;
   padding-right: 40px !important;
   line-height: 15px !important;
   height: 33px !important;
}

.custom-submit {
   margin-bottom: 15px;
   padding-left: 40px !important;
   padding-right: 40px !important;
   line-height: 15px !important;
   height: 33px !important;
   border: 1px solid #1192f6 !important;
   color: white !important;
   background-color: #1192f6 !important;
}

.custom-btn-search {
   padding-left: 9px !important;
   padding-right: 9px !important;
   padding-top: 3px !important;
}

.info-table:focus {
   background-color: #1192f6 !important;
   color: white !important;
}

.info-table:hover {
   background-color: #1192f6 !important;
   color: white !important;
}

select.select8 {
   padding: 5px !important;
   padding-right: 0 !important;
   line-height: 1;
   border: 1px solid #cdd5da;
   border-radius: 0.25rem !important;
   height: 30px !important;
   background: url(../images/grey-arrow-1.png) no-repeat right;
   background-size: 30px 30px;
   -webkit-appearance: none;
   background-position-x: 281px;
   cursor: pointer;
   background-color: #fff;
}

select.select8:focus {
   border: 1px solid #cdd5da;
}

[type="radio"]:checked,
[type="radio"]:not(:checked) {
   position: absolute;
}

[type="radio"]:checked,
[type="radio"]:not(:checked) {
   position: relative;
   padding-left: 28px;
   cursor: pointer;
   line-height: 20px;
   display: inline-block;
   color: #666;
}

[type="radio"]:checked::before,
[type="radio"]:not(:checked)::before {
   content: '';
   position: absolute;
   left: 0;
   top: 0;
   width: 18px;
   height: 18px;
   border: 1px solid #1192f6;
   background: #fff;
   border-radius: 50%;
}

[type="radio"]:checked::after,
[type="radio"]:not(:checked)::after {
   content: '';
   width: 14px;
   height: 14px;
   background: #1192f6;
   position: absolute;
   top: 2px;
   left: 2px;
   -webkit-transition: all 0.2s ease;
   transition: all 0.2s ease;
   border-radius: 50%;
}

[type="radio"]:not(:checked)::after {
   opacity: 0;
   -webkit-transform: scale(0);
   transform: scale(0);
}

[type="radio"]:checked::after {
   opacity: 1;
   -webkit-transform: scale(1);
   transform: scale(1);
}

.blue {
   color: #1192f6 !important;
}

select.select9 {
   padding: 5px !important;
   padding-right: 0 !important;
   line-height: 1;
   border: 1px solid #cdd5da;
   border-radius: 0.25rem !important;
   height: 30px !important;
   background: url(../images/grey-arrow-1.png) no-repeat right;
   background-size: 30px 30px;
   -webkit-appearance: none;
   background-position-x: 216px;
   cursor: pointer;
   background-color: #fff;
}

select.select9:focus {
   border: 1px solid #cdd5da;
}

.trash-page2 {
   padding: 0px 6px !important;
   font-size: 12px !important;
   height: 22px !important;
   margin-top: -1px !important;
   float: right;
}

select.select10 {
   padding: 5px !important;
   padding-right: 0 !important;
   line-height: 1;
   border: 1px solid #cdd5da;
   border-radius: 0.25rem !important;
   height: 30px !important;
   background: url(../images/grey-arrow-1.png) no-repeat right;
   background-size: 30px 30px;
   -webkit-appearance: none;
   background-position-x: 198px;
   cursor: pointer;
   background-color: #fff;
}

select.select10:focus {
   border: 1px solid #cdd5da;
}

.submit-cancel {
   margin-left: auto;
   margin-right: auto;
   display: block;
   text-align: center;
   margin-top: 10px;
   position: relative;
   top: 14px;
}

select.select11 {
   padding: 5px !important;
   padding-right: 0 !important;
   line-height: 1;
   border: 1px solid #cdd5da;
   border-radius: 0.25rem !important;
   height: 30px !important;
   background: url(../images/grey-arrow-1.png) no-repeat right;
   background-size: 30px 30px;
   -webkit-appearance: none;
   background-position-x: 138px;
   cursor: pointer;
   background-color: #fff;
}

select.select11:focus {
   border: 1px solid #cdd5da;
}

select.select12 {
   padding: 5px !important;
   padding-right: 0 !important;
   line-height: 1;
   border: 1px solid #cdd5da;
   border-radius: 0.25rem !important;
   height: 30px !important;
   background: url(../images/grey-arrow-1.png) no-repeat right;
   background-size: 30px 30px;
   -webkit-appearance: none;
   background-position-x: 79px;
   cursor: pointer;
   background-color: #fff;
}

select.select12:focus {
   border: 1px solid #cdd5da;
} */