/* custom */

.boostpress_customer_info{
    margin-bottom: 30px;    
}
.boostpress_customer_info h2{
    font-size: 18px;
    padding-bottom:0;
    color:#222;
}

label.error{display:none!important;}

#upload-slip .image-uploader.error{
    border: 1px solid red;
    cursor: pointer;
}

#upload-slip .image-uploader{
    border: 1px solid #555;
}

.boostpress_order_detail h2{
    font-size: 18px;
    padding-bottom:0;
    color:#222;
}
.boostpress_row {
  display: grid;
  grid-template-columns: 50% 50%;
  padding:0;
}
.boostpress_row .boostpress_col {
    padding: 0 4% 0 0;
    font-size: 30px;
    text-align: left;
}
.boostpress_row .boostpress_col label{
    font-size: 15px;
    margin-top: 10px;
    margin-bottom: 0;
}
.coverbanknotiform p.intro {
    text-align: left;
    font-size: 15px;
    padding: 0 0 30px 0;
    margin: 0;
    color: #555;
}

.coverbanknotiform p.intro span {
    font-size: 15px !important;
    line-height: 16px;
    color: green;
    padding: 4px;
}

#banknotiform {
    margin: 10px 0 0 0;
}

.error label {
    background: red;
}

#banknotiform .coverint span {
    display: inline !important;
    float: none;
    background: #fff;
}
#banknotiform .coverint{
    display: block;
    width:100%;
}

#banknotiform .step1 {
    display: block;
    padding: 10px 0 20px 0;
}

#ui-id-1 {
    list-style: none;
}

#ui-id-1 {
    width: 150px!important;
}
.errormsg#errormsg-container {display:none;}
#banknotiform input.txtinput {
    border: none;
    display: inline;
    padding: 3px 0 3px 5px;
    font-size: 16px;
    margin: 0 0 0 0;
    width: 100%;
    background-color: #fff;
    padding: 2px;
    border: 1px solid #555;
}
#banknotiform select{
    border: 1px solid #555;
}


.coverbutton {
    width: 100%;
    text-align: center;
}
#banknotiform .step2 {
    display: block;padding:0 0 0 0;clear:both;clear:both;
}
#banknotiform .step3 {
    display:flex;padding: 0 0 20px 0;clear:both;
}

#banknotiform .boostpress_cover_amount{
    width:100%;
}

#banknotiform .step4 {
    display:flex;padding: 20px 0 20px 0;clear:both;
}

#banknotiform .bankicon{width:40px;}

#banknotiform .step4 > div{
    width:50%;
    padding:0 2% 0 0;
}

.coverinnertime #transfertime {
    margin-right: 4%;
}

#banknotiform .step4 .boostpress_covertime .coverinnertime{
    display:flex;
}

#banknotiform select.error {border:1px solid red;}

#banknotiform .step5 {
    display: block;padding: 20px 0 20px 0;clear:both;
}
.step2detail p {
    padding-bottom: 10px;
}

.step2detail table {
    border-top: 0;
    margin: 0;
    width: 100%;
    font-size: 18px;
    border-top: 0 solid !important;
}

.step2detail table tr td {
    font-size: 16px;
    font-weight: normal;
    border-left-width: 0 !important;
    border-right-width: 0 !important;
    text-align: left;
    border-bottom: 1px solid #222 !important;
    color:#222;
}

.boostpress_col label span{
    color:red;
}

.step2detail table tr td.radio {
    padding: 0;
    margin: 0;
    border-bottom: 2px solid #222;

}

td.radio input {
    width: 20px !important;
}

.tbloption {
    width: 100%;
}

@media only screen and (max-width: 720px) {
    .tbloption {
        width: 100% !important;
    }
    .step2detail span.bankname{
        display:block;
        padding: 3px 0 3px 0;
    }
    
}

.tbloption tr td {
    font-size: 15px !important;
    padding: 4px !important;
}

.tbloption img {
    margin-bottom: 0 !important;
    margin-right: 5px;
}

.btstandard {
    font-weight: normal !important;
    letter-spacing: 2px;
    font-weight: bold !important;
    margin-right: 0!important;
}

.bankname img {
    margin-bottom: 0;
}

#banknotiform .bt {
    padding: 25px 0 36px 0;
    margin: 20px 0 0 0;
    clear: both;
}
.uploadtext {margin:-20px 0 0 50px;}
.datepicker {
    width: 140px;
    background: url(../images/icon_calendar.png) no-repeat #fff 95% 11px;
}

#from-24hr {
    width: 82px;
}

.coverbanknotiform input.error {
    border: 1px solid red !important;
}

.coverbanknotiform label.error {
    color: red;
    display: block;
    font-size: 16px;
}

.coverint input#orderid {
    width: 200px;
    padding: 2px;
    background: #fff;
    margin: 0 0 0 50px;
    border: 1px solid #ccc;
}

.coverint input {
    width: 200px;
    margin: 0 0 0 50px;
    padding: 2px;
}

.error label {
    background: none!important;
    color: red!important;
}

.errormsg {
    float: left;
    width: 330px;
    text-align: left;
    padding: 0 20px 20px 0;
}

.banknotithankyou {
    margin: 0 0 40px 0;
}

.banknotithankyou p.thkintro {
    text-align: left;
    font-size: 16px !important;
    padding: 0 0 13px 0;
    margin: 0;
}

table.banknotithk_tbl {
    border: none;
    margin: 0 0 0 0;
    font-size: 18px;
}

table.banknotithk_tbl tr.banknotithk_tbl {
    background: #cccccc;
}

table.banknotithk_tbl tr.bg {
    background: #eee;
}

table.banknotithk_tbl tr td img {
   margin: 20px;
    width: 80%;
}

table.banknotithk_tbl tr td {
    text-align: left;
    height: 40px;
    font-size: 16px;
    padding: 0;
}

table.banknotithk_tbl tr td.col1 {
    width: 30%;
    padding: 10px 0 0 10px;
    font-weight: normal;
    font-size: 16px;
    vertical-align: top;
}

span#chkorderid {
    color: #e54242;
    font-size: 16px;
    padding: 0 0 0 5px;
}
.errormsg-container {color:red;}
.bt_title .ui-widget-header {
    color: #555;
    background: none;
    border: none;
}

.bt_title .ui-dialog-titlebar-close span {
    margin: -8px 0 0 -8px;
}

.bt_title .ui-widget-header .ui-icon {
    background-image: url(../images/ui-icons_222222_256x240.png);
}

.btblnoti td, .btblnoti th {
    border-width: 0;
}

.bubbletxt {
    margin: 20px 0 20px 0;
    font-size: 14px;
    text-align: left;
}
.covertime{
    float: left;
    padding:0 0 0 50px;
}
.covertime select{margin:0 20px 0 0;width:120px;float:left;display:block;}
.covertime .min{width:100px;float:left;display:block;}

div.coverslipfile {
    width: 94px;
    height: 94px;
     
}
div.coverslipfile input {
    display: block !important;
    width: 124px !important;
    height: 50px !important;
    opacity: 0;
    cursor: pointer;
    position: relative;
    top: -40px;
    left: 20px;
}
div.coverslipfile:before{
    content: 'Select file';
    background: #ccc;
    color: #fff;
    padding: 9px 44px;
    margin: 0 0 -6px 48px;
}

@media screen and (min-width: 801px) {
    .step2detail {
        padding: 0 0 0 0;
        width:98%;
    }
    #banknotiform select{
        width:98%;
    }
    .boostpress_cover_amount input{
        width:98%!important;   
    }
    .boostpress_uploadcover {
        width:98%;   
    }
    #banknotiform .bt {
        width:98%;   
    }
}

@media screen and (max-width: 800px) {
    .step2detail {
        padding: 0 0 0 0;
    }
}

.coverbanknotiform.roundtheme #banknotiform input[type='tel']{
    background-color: #eee;
    border: 1px solid #eee;
    border-radius: 8px;
    box-shadow: none;
    height:40px;
}
.coverbanknotiform.roundtheme #banknotiform input[type='email']{
    background-color: #eee;
    border: 1px solid #eee;
    border-radius: 8px;
    box-shadow: none;
    height:40px;
}

.coverbanknotiform.roundtheme #banknotiform input[type='text']{
    background-color: #eee;
    border: 1px solid #eee;
    border-radius: 8px;
    box-shadow: none;
    height:40px;
}
.coverbanknotiform.roundtheme #banknotiform select{
    background-color: #eee;
    border: 1px solid #eee;
    border-radius: 8px;
    box-shadow: none; 
    height:40px;  
    padding:0 0 0 0;
}
.coverbanknotiform.roundtheme #banknotiform #upload-slip .image-uploader{
    background-color: #eee;
    border: 1px solid #eee;
    border-radius: 8px;
    box-shadow: none;  
}
.coverbanknotiform.roundtheme #banknotiform .step2detail {
    background:#eee;
    padding: 20px 10px 30px 20px;
    border-radius: 10px;
}
.coverbanknotiform.roundtheme #banknotiform .step2detail table tr td{
    border-bottom: 1px solid #ccc;
    vertical-align: middle !important;
}
.tbloption tr.bg-loaded{
    background-color: transparent;
}
.tbloption tr.hdr td{
    background-color: transparent;
    border-top: 0;
}
#banknotiform label{
    height: 30px;
    line-height: 30px;
}
.coverbankiconandname{
    display: flex;justify-content:middle;align-items: center;
}

.bankoption { grid-area: bankoption; }
.banknameicon { grid-area: banknameicon; }
.bankaccountname { grid-area: bankaccountname; }
.bankaccountnumber { grid-area: bankaccountnumber; }

@media only screen and (max-width: 720px) {
.tbloption .hdr {display:none;}
.step2detail .tbloption .wc_banktransfer-bankinfo-promptpay .bankaccountnumber{
    width: 84vw;
    padding-left: 13vw !important;
}
.step2detail .tbloption .wc_banktransfer-bankinfo-promptpay .banknameicon{
    width: 34vw;border-bottom:0!important;
}
.step2detail .tbloption .wc_banktransfer-bankinfo-promptpay .bankaccountname{
    width: 34vw;border-bottom:0!important;display: flex;align-items: center;
}
.step2detail .tbloption .wc_banktransfer-bankinfo-promptpay .bankoption{
    width:8vw;border-bottom:0!important;display:flex;
}
.step2detail .tbloption .wc_banktransfer-bankinfo-promptpay{
    display:grid;
    grid-template-areas:
    'bankoption banknameicon bankaccountname'
    'bankaccountnumber bankaccountnumber bankaccountnumber';
    width: 84vw;
}
.coverbanknotiform.roundtheme #banknotiform .step2detail table tr td{
    border-top: 0 !important;
}
}