html.loginOuter{ position: relative; }
body{
font-size: 14px;
line-height:normal;
font-family:Hiragino , "PingHei",STHeitiTC-Light, 微軟正黑體, "Microsoft JhengHei",微軟雅黑, 'Helvetica Neue', Helvetica, Arial, sans-serif;
}
body:lang(en){
font-family: "Arial";
}
h1,h2,h3,h4,h5,h6{
font-family:Hiragino , "PingHei",STHeitiTC-Light, 微軟正黑體, "Microsoft JhengHei",微軟雅黑, 'Helvetica Neue', Helvetica, Arial, sans-serif;
}
h1:lang(en),h2:lang(en),h3:lang(en),h4:lang(en),h5:lang(en),h6:lang(en){
/*font-family: "Arial";*/
}
.tooltip-inner{max-width:300px;min-width:200px;}
.radio label .iradio_square-red .tooltip-inner,
.checkbox label .icheckbox_square-red .tooltip-inner,
.radio label .iradio_square-custom .tooltip-inner,
.checkbox label .icheckbox_square-custom .tooltip-inner,
.radio label > div .tooltip-inner,
.checkbox label > div .tooltip-inner{ word-break: keep-all; white-space: nowrap;}
.login-page, .register-page{background: #DDDDDD; padding-bottom: 30px;height: 100%; min-height: 100%; }
.user_ib{ background: url(../images/icon_ib.png) left no-repeat; background-size:20px 20px; padding-left: 20px; display: inline-block;}
.user_trader{ background: url(../images/icon_trader.png) left no-repeat; background-size:20px 20px; padding-left: 20px; display: inline-block;}
.widget-user .user_ib{ background-size:40px 40px; width: 40px; height: 40px; display: inline-block;}
.widget-user .user_trader{ background-size:40px 40px; width: 40px; height: 40px; display: inline-block;}
.lang { display: inline-block; width: 100%;}
.lang ul{ float: right; font-size: 14px; font-weight: bold; line-height: 20px; margin-bottom: 0px;}
.lang li{ list-style: none; float: left; display: inline-block; padding: 0px 5px;}
.lang li:after{ content: ''; border-right:1px solid #999999; height: 14px; position:relative; top: 2px; display: inline-block; margin-left: 8px;}
.lang li:last-child:after{ border: 0px;}
.lang li a{ color: #000000;}
.lang li.active a,
.lang li a:hover{ color: #0073b7;}
.option_hr{ margin: 20px 0px; color: #777777; text-align: center; min-height: 20px; line-height:20px; }
.option_hr hr{ margin-top: -10px; margin-bottom:0px; border-top:1px solid #777777;}
.option_hr span{ padding: 0px 15px; background: #FFFFFF; display: inline-block; line-height:20px;}
.btn-wechat{background:#04be02; color:#FFFFFF;}
.btn-wechat:hover{background:#2ad928; color:#FFFFFF;}
h1,h2,h3,h4{ margin : 0px;}
h4{ margin-bottom: 10px;}
.box-header,
.box-body,
.box-footer{ padding: 10px 15px; background: none;}
.box-header{
-webkit-border-radius: 8px 8px 0px 0px;
-moz-border-radius: 8px 8px 0px 0px;
border-radius: 8px 8px 0px 0px;
}
.box-footer{ border-top:0px;
-webkit-border-radius: 0px 0px 8px 8px;
-moz-border-radius: 0px 0px 8px 8px;
border-radius: 0px 0px 8px 8px;
}
.login{ margin-top: 7%; color: #FFFFFF;}
.welcome_txt{font-size: 16px; font-weight: bold; text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7); line-height: 2em; padding-top: 20px;
text-align: justify; }
.welcome_txt .enlarge{ font-size: 1.4em;}
.login-logo{ width:100%; display:inline-block;}
.login-box img{ max-width: 200px; text-align: center; margin-bottom: 20px;}
.login-box .login-logo > img{ width: 260px; max-width: 100%; height: auto;}
.login-box, .register-box{ width: 550px; margin: 5% auto 2% auto; }
.login-box .box, .register-box .box{padding: 40px 10px;
-webkit-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.3);
-moz-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.3);
box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.3);
min-height: 300px;
}
.login-box-body, .register-box-body{ color: #0073b7; margin: 0px auto; display: inline-block; width: 100%; }
.wechat-box{ width: 400px; margin: 20px auto 0px auto; }
.wechat-box .box{padding: 30px 10px;
-webkit-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.3);
-moz-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.3);
box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.3);
}
.wechat-box-body{ padding:0px 20px;}
.img-wechatqr{text-align:center;}
.img-wechatqr img{max-width:300px; width:100%;}
.box-header h2{color: #0073b7; }
.register_real{ margin-top: 20px;}
.register_real .box{ padding-top: 0px;}
.main-sidebar .logo-large { display: block; }
.main-sidebar .logo-horizontal,
.main-sidebar .logo-icon{ display: none;}
.sidebar-mini.sidebar-collapse .main-sidebar .logo-large{ display: none;}
.sidebar-mini.sidebar-collapse .main-sidebar .logo-icon{ display: block;}
.main-sidebar .user-panel img.logo-large,
.main-sidebar .user-panel img.logo-horizontal {
width: auto;
max-width: 150px;
height: auto;
margin: 10px auto 12px;
}
.main-sidebar .user-panel img.logo-icon {
width: auto;
max-width: 32px;
height: auto;
margin: 10px auto;
}
.navbar-custom-menu > .navbar-nav > li{ font-size: 15px;}
.navbar-custom-menu > .navbar-nav > li a{ cursor: pointer;}
.navbar-custom-menu > .navbar-nav > li .icon_img { width: 30px; height: 30px; display: inline-block; margin-top: -5px; }
.navbar-nav>.user-menu>.dropdown-menu { width: 220px; text-align: right; padding: 5px;}
.navbar-nav>.user-menu>.dropdown-menu li{ padding: 5px; }
.navbar-nav>.user-menu>.dropdown-menu li label{ width:90px; text-align: left; float: left;}
.navbar-custom-menu .fa{ font-size: 20px; float: left; margin-right: 5px;}
.sidebar-menu,
.sidebar-menu .treeview-menu>li>a{ font-size: 16px; white-space: normal;}
/*.sidebar-menu:lang(en),*/
/*.sidebar-menu:lang(en) .treeview-menu>li>a{ font-size: 13px;}*/
.sidebar-menu .treeview-menu>li{ margin: 2px 0px 2px 0px;}
.sidebar-menu .treeview > span{line-height:20px;}
.sidebar-menu .icon_img{ width: 30px; height: 30px; display: inline-block; position:relative;top:8px; margin-top: -10px; margin-right: 5px;}
.sidebar-mini.sidebar-collapse .sidebar-menu .icon_img{margin-right: 0px; margin-left:5px;}
.label{ font-size: 0.9em; border-radius: 5px; padding: 4px 8px 4px 8px; display: inline-block; line-height: 1.3em; min-height: 15px;}
.widget-user .widget-user-header {
padding: 10px;
height: auto;
border-top-right-radius: 8px;
border-top-left-radius: 8px;
}
.widget-user .box-body{ padding: 0px 10px ;}
.widget-user .widget-user-header h4{ margin: 0px; line-height: 1.2em;}
.widget-user .acc_id{ font-weight: bold;}
.widget-user .box-footer { padding-top: 10px;
border-bottom-right-radius: 8px;
border-bottom-left-radius: 8px;
}
.siteName{ padding-left: 5px; line-height: 50px; margin: 0px; display:inline-block; font-weight: bold; color: #FFFFFF; }
.pageName{ line-height: 50px; display:inline-block; color: #336699;}
.content-wrapper{min-height: 1200px; position:relative;}
.content-wrapper, .right-side{background:#efefef; padding: 20px 60px 60px 20px;
}
.user_info{ min-height: 150px; }
.user_info li{ padding: 3px 5px 3px 3px; font-weight: bold; color: #555555; display: flex; }
.user_info li dd{ color: #000000; width: auto; display: inline-block;line-height: 30px; min-height: 30px;}
.user_info li dd.fd{ width: 130px; float: left; }
.user_info li dd.password_edit{ width: 200px; position: relative;}
.user_info li dd.password_edit input{ }
.more_info .user_info li{ padding: 3px 5px 3px 140px;}
.more_info .user_info li dd.fd{ width: 140px; float: left; margin-left: -140px;}
.select-page{ width: auto; float: right; display: inline-block; font-size: 12px; padding: 0px 5px; margin-left:10px; line-height: 1.5; height: 30px;}
.select-row{ width: auto; display: inline-block; font-size: 12px; padding: 0px 5px; margin:0px 5px; line-height: 1.5; height: 30px;}
.display-row{ margin-bottom: 10px;}
.desktop_shortcut{ background: #FFFFFF; padding: 5px 0px 0px 0px; position: fixed; right: 0px; top: 50%; margin-top: -180px; z-index: 10; }
.desktop_shortcut ul { width: 100%; display: inline-block; padding: 0px; margin: 0px; width: 80px;}
.desktop_shortcut ul li{ width: 100%; display: inline-block; list-style: none; text-align: center;margin: 0px auto;width: 80px; height: 60px; }
.desktop_shortcut .icon{ width: 26px; height: 26px; margin: 0px auto; display: block;}
.desktop_shortcut ul li a{width: 100%; cursor: pointer; font-size: 14px;}
.desktop_shortcut ul li a:hover,
.desktop_shortcut ul li a:hover .icon{ opacity: 0.6;}
.mobile_shortcut{ display: none;}
.icon_deposit{ background: url(../images/icon_deposit.png) no-repeat; background-size: 100%; }
.icon_withdrawal{ background: url(../images/icon_withdrawal.png) no-repeat; background-size: 100%; }
.icon_history{ background: url(../images/icon_history.png) no-repeat; background-size: 100%; }
.icon_position{ background: url(../images/icon_position.png) no-repeat; background-size: 100%; }
.icon_order{ background: url(../images/icon_order.png) no-repeat; background-size: 100%; }
.icon_order_history{ background: url(../images/icon_order_history.png) no-repeat; background-size: 100%; }
.icon_add_acc{ background: url(../images/icon_add_acc.png) no-repeat; background-size: 100%; }
.icon_add_acc{ background: url(../images/icon_add_acc.png) no-repeat; background-size: 100%; }
.img-id-card{ max-width: 250px; width: 100%;}
.dropdown-menu{ min-width: 80px;}
.dropdown-menu>li>a:hover{ color: #0073b7; background: #dddddd;}
.menu-lang>li>a{ color: #0073b7!important;}
.img-id-card{ max-width: 250px; width: 100%;}
.dropdown-menu{ min-width: 80px;}
.dropdown-menu>li>a:hover{ color: #0073b7; background: #dddddd;}
.menu-lang>li>a{ color: #0073b7!important;}
.price-down-txt, .price-down-text, .red-text{ color: #FF0000;}
.price-up-txt, .price-up-text, .green-text{ color: #009922;}
.blue-text{ color:#0066ff;}
.buy-label{ padding: 2px 8px; display: inline-block; background:#00cc00; color: #FFFFFF; border-radius: 5px; margin: -2px 0px;font-weight: 600;}
.sell-label{padding: 2px 8px; display: inline-block; background:#FF0000; color: #FFFFFF;border-radius: 5px;margin: -2px 0px;font-weight: 600;}
.deposit-label{padding: 2px 8px; display: inline-block; background:#00cc00; color: #FFFFFF; border-radius: 5px; margin: -2px 0px;}
.withdrawal-label{padding: 2px 8px; display: inline-block; background:#FF0000; color: #FFFFFF;border-radius: 5px;margin: -2px 0px;}
.tel-label{ padding: 2px 5px; font-size: 0.8em; background: #CCCCCC; border-radius: 3px;}
.btn-lang,
.sidebar-toggle{ font-size: 15px; line-height:20px;}
.summary{ font-weight: bold; background: #ffebe1; padding: 10px; margin: 10px 0px; }
.warning{ background: #f2dede; color:#a94442; padding: 10px; margin: 0px 0px 10px 0px; }
.img-logo{ width: 200px; margin: 10px auto 0px auto; display: inline-block; }
.btn-group{ width: 100%; margin-bottom: 10px;}
.info-body{}
.info-body h3{ margin-bottom: 10px;}
.info-body .time{ font-size: 0.8em; color: #555555;}
.label-normal{ border-radius: 5px; padding: 0px 5px;}
.tb .dropdown-menu{ left: inherit; right: 0px; min-width: 150px; }
.tb .dropdown-menu dd{ padding: 2px 5px;}
.group_ttl{ font-weight: bold; float: left; display: inline-block; line-height: 50px; color: #0073b7;}
.list_summary{}
.list_summary ul { display: inline-block; list-style: none; margin: 0px; line-height: 25px; padding: 0px;}
.list_summary ul li{display: inline-block; width: auto; float: left; padding: 3px 15px; text-align: center; min-width: 120px; }
.list_summary ul li .item_value{ display: inline-block; }
.list_summary ul li .fd{color: #00cc99;}
.list_summary ul li .fd:after{content: ':'; margin-right: 10px;}
.summary{}
.summary dl { display: inline-block; list-style: none; margin: 0px; line-height: 25px; padding: 0px;}
.summary dl dd{display: inline-block; width: auto; float: left; padding: 3px 15px; text-align: center; min-width: 120px;}
.summary dl dd .item_value{ display: inline-block; }
.summary dl dd .fd{color: #9b8143;}
.summary dl dd .fd:after{content: ':'; margin-right: 10px;}
.groups_option{width: auto; margin: 20px -10px 0px -10px; text-align: center;}
.all_groups ,
.selected_groups { width: 50%; display: inline-block; padding: 0px 10px; }
.selected_groups{ float: right;}
.all_groups ul,
.selected_groups ul{border: 1px solid #cccccc; background: #DDDDDD; padding: 5px;overflow: auto; height: 280px; list-style: none;}
.all_groups ul li,
.selected_groups ul li{ background: #FFFFFF; margin-bottom: 3px; line-height: 25px; padding: 0px 10px; font-size: 1.1em; cursor: move;}
.all_groups ul li:hover,
.selected_groups ul li:hover{background: #dffbfe;}
.all_groups ul li.ui-state-highlight,
.selected_groups ul li.ui-state-highlight{ background: #dffbfe; content: ''; display: inline-block; height: 25px; width: 100%; }
.select2-container--default .select2-selection--multiple .select2-selection__choice{ color: #333333;}
.select2-container--default .select2-selection--single{ border-radius:0px; height: 34px; border: 1px solid #cccccc; }
.select2-container--default .select2-selection--multiple{border-radius:0px;}
.select2-container--default .select2-selection--single .select2-selection__rendered{line-height: 34px; margin-top: -6px; padding-left: 0px;}
.select2-container--default .select2-selection--multiple .select2-selection__choice{ background-color: #e4e4e4; color: #000000; border: 1px solid #aaa; border-radius: 4px;}
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove{ color: #888888;}
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover{ color: #222222;}
.no-bg{ background: none;}
.more-info .row{ margin-bottom: 5px;}
.lang { display: inline-block; width: auto; float: right; position: relative;padding:5px 10px 5px 10px;
-webkit-border-radius: 0px 0px 5px 5px;
-moz-border-radius: 0px 0px 5px 5px;
border-radius: 0px 0px 5px 5px;
}
.lang > a{padding-right: 15px; color: #FFFFFF;}
.lang > a:after{ content:''; border-bottom: 4px solid transparent; border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 6px solid #FFFFFF; position: absolute; right:10px; top: 12px;}
.lang .menu-lang{ right: 0px; left: inherit;}
.img_success,
.img_fail{ width: 130px; margin-bottom: 30px; margin-top: 30px;}
.img-qrcode {
width: auto;
max-width: 250px;
}
.disclaimer{ padding: 15px; font-size: 0.9em;}
.disclaimer p{ margin: 0 0 1em;}
.disclaimer p:last-child{ margin-bottom: 0;}
@media (min-width:1400px) {
.i-info-circle{font-size: 26pt;position: absolute;}
.i-info-message{display:none;margin-left: 40px;font-weight: bolder;line-height: normal;position: absolute;font-size: initial;}
.i-div{height:44px;}
}
@media (max-width:1400px) {
body{ font-size: 12px;}
.i-info-circle{font-size: 26pt;position: absolute;}
.i-info-message{display:none;margin-left: 40px;font-weight: bolder;line-height: normal;position: absolute;font-size: initial;}
.i-div{height:44px;}
}
/*laptop */
@media (max-width:1199px) {
.content-wrapper, .right-side{padding: 10px 60px 60px 10px; }
.list_summary ul li{padding: 3px 10px; min-width:inherit;}
.login{ margin-top: 20px;}
.welcome_txt{font-size: 16px;padding-top: 0px; }
}
/* tablet */
@media (max-width:991px) {
.pageName,
.small-box h3{ font-size: 20px;}
.btn,
.form-control{ padding: 5px 5px;}
.main-sidebar, .left-side{width:180px;}
.content-wrapper, .right-side, .main-footer,
.main-header>.navbar{ margin-left: 180px;}
.content-wrapper, .right-side{padding: 0px; }
.navbar-custom-menu .navbar-nav>li>a{ padding-bottom: 12px;}
.navbar-nav>.user-menu .user-image{ margin-top: -3px;}
.navbar-custom-menu>.navbar-nav>li>.dropdown-menu{ right: 0px;}
.sidebar-menu > .treeview,
.sidebar-menu > .treeview > .treeview-menu > li > a,
.sidebar-menu a{ font-size:12px;}
.img-id-card{ width: 100%; display: inline-block;}
.desktop_shortcut{ display: none;}
.mobile_shortcut{ padding: 5px 0px 0px 0px; display: inline-block; position: relative; top: 0px; right: inherit; margin: 0px; width: 100%; background: #FFFFFF;}
.mobile_shortcut ul { width: 100%; display: inline-block; padding: 0px; margin: 0px;}
.mobile_shortcut ul li{ width: 33.3333%; float: left; display: inline-block; list-style: none; text-align: center;margin: 3px auto; height: auto;}
.mobile_shortcut .icon{ width: 26px; height: 26px; margin: 0px auto; display: block;}
.mobile_shortcut ul li a{width: 100%; cursor: pointer; font-size: 14px;}
.mobile_shortcut ul li a:hover,
.mobile_shortcut ul li a:hover .icon{ opacity: 0.6;}
.summary{ padding: 5px 10px;}
.user_info li dd { line-height: 25px; min-height: 25px;}
.user_info li dd.fd{ width: 150px; }
.list_summary ul li{padding: 3px 5px; }
.list_summary ul li .item_value{ display: block; }
.list_summary ul li .fd:after{content: ''; margin-right: 0px;}
.welcome_txt{font-size: 14px; line-height: 1.7em; padding: 0px 20px; }
.welcome_txt .enlarge{ font-size: 1.2em;}
.tb{ font-size: 12px;}
}
/* mobile */
@media (max-width: 767px) {
.box-header, .box-body, .box-footer{ padding: 10px;}
.main-sidebar, .left-side{width:200px;}
.content-wrapper, .right-side, .main-footer,
.main-header .navbar { margin: 0px; background:#efefef;}
.navbar-custom-menu .fa{ float: none;}
.sidebar-open .content-wrapper, .sidebar-open .right-side, .sidebar-open .main-footer {
-webkit-transform: translate(200px, 0);
-ms-transform: translate(200px, 0);
-o-transform: translate(200px, 0);
transform: translate(200px, 0);
}
.content-wrapper, .right-side{padding: 0px; }
.main-header{ position: fixed; width: 100%; background:#192136;}
.main-sidebar{ position: fixed;}
.content-wrapper{padding-top: 50px!important; border-radius:0px;}
.login-box, .register-box{ width: 100%; margin: 0px auto;}
.sidebar{ padding-top: 50px;}
.main-sidebar .logo-large,
.main-sidebar .logo-icon,
.sidebar-mini.sidebar-collapse .main-sidebar .logo-icon{ display: none; }
.main-sidebar .logo-horizontal{ display: block;}
.label { border-radius: 2px;}
table.dataTable thead > tr > th{ padding-right: 10px; line-height: 1;}
.table>tbody>tr>td, .table>tbody>tr>th, .table>tfoot>tr>td, .table>tfoot>tr>th, .table>thead>tr>td, .table>thead>tr>th{ padding: 5px 2px; line-height: 1.2em;}
table.dataTable thead .sorting:after, table.dataTable thead .sorting_asc:after, table.dataTable thead .sorting_desc:after{ top: 5px;}
.table_container{ overflow: auto;}
.table_container table{ min-width: 500px;}
.buy-label,
.sell-label{ line-height: 1em; padding: 4px 5px 4px 5px; border-radius:2px; height: 20px; }
.register_real{ padding: 20px 0px;}
.visible-xs { display: inline-block!important;}
.tb .dropdown-menu{ font-size: 12px; }
.group_ttl { display: block; float: none; text-align: center; line-height: 25px;}
.list_summary { margin: 0px -10px;}
.list_summary ul{ width:100%; line-height: 15px; }
.list_summary ul li{width: 33.3333%; padding: 2px 2px; margin-top: 5px;}
.all_groups ul li,
.selected_groups ul li{ line-height: 35px; }
.input-group{ margin-bottom: 5px;}
.login{ margin-top: 10px;}
.i-info-circle{font-size: 26pt;position: inherit;}
.i-info-message{display: inline-grid;margin-left: 20px;font-weight: bolder;line-height: normal;font-size: initial;}
.i-div{height:80px;}
}
/*mobile small*/
@media (max-width: 500px) {
.img-logo{ width: 170px; }
.login-logo, .register-logo{ margin-bottom: 20px;}
body{ font-size: 3vw;}
h3{ font-size:3.8vw;}
.siteName{font-size: 4.6vw;}
.pageName{ font-size: 3.6vw; padding-left: 10px; }
h4{ font-size: 4vw;}
.tb ,
.tb_custom,
.tb ul.tb_thead{ font-size: 2.5vw; }
.all_groups ,
.selected_groups { padding: 0px 5px;}
.nav>li>a{ padding: 10px;}
}
/*Form style
--------------------------------------------------------------
*/
.btn,
.form-control{ font-size: 14px; line-height: 20px;}
.btn-price{ font-size: 1.3em; line-height: 40px; border-radius: 6px; width: 100%; }
.ps,
.form-horizontal .form-group .ps{ font-size: 0.9em; color: #555555; line-height: 1.3em;}
.num-input{ width: auto; max-width: 100px; display: inline-block; padding: 3px 0px; height: 25px; text-align: center;}
.star{ color: #FF0000; margin-right: 2px;}
.form-control[readonly]{ background: #FFFFFF;}
.form-control.input-readonly{ border: 0px; padding-left: 0px;}
.row,
.form-horizontal .form-group{ margin-left:-10px; margin-right: -10px; }
.form-group{ line-height: 34px; }
.form-horizontal .has-feedback .form-control-feedback { left: 10px; right: inherit; }
.has-feedback .form-control { padding-left: 30px; padding-right: 5px;}
.form-inline { margin: 0px -10px;}
.form-inline .select_item{ padding:0px 10px; float: left; display: inline-block;}
.col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9{ padding-left:10px; padding-right: 10px; }
.input-go{
position: relative;
padding-right: 50px;
width: 120px;
float: right;
margin-left: 20px;
}
.input-go .form-control{
width: 100%;
height: 30px;
line-height: 30px;
padding: 0px 5px;
}
.btn-go{
position:absolute;
top: 0px;
right: 0px;
width: 50px;
height: 30px;
padding: 5px 5px;
font-size: 12px;
line-height: 1.5;
border-radius: 3px;
border-top-left-radius: 0;
border-bottom-left-radius: 0;
min-width: inherit !important;
}
.has-captcha .form-control-captcha {
}
.upload_file{ display: inline-block;}
.upload_file input[type="file"]{ position: absolute; top: 0px; left: 0px; visibility: hidden;}
.upload-img{ background: #dddddd; border: 1px solid #aaaaaa; height: 200px; margin-bottom: 10px; position: relative; overflow: hidden; position: relative; text-align: center;}
.upload-img img{ position: absolute; top:50%; left: 50%; z-index: 100; max-width: 100%; max-height: 100%;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
top:0%\9;
left:0%\9;
position: relative\9;
}
.upload-img .tips{ position: absolute; top: 50%; margin-top: -20px; line-height: 40px; color: #777777; width: 100%; text-align: center; font-weight: bold; left: 0px;}
.form-group.has-error .form-control,
.has-error .form-control{
border-color: #FF0000;
box-shadow: none;
}
.col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9{ }
.form-horizontal .radio, .form-horizontal .checkbox,
.radio{ margin-right: 20px; padding-top: 0px; display: inline-block;}
.radio label .iradio_square-blue,
.checkbox label .icheckbox_square-blue,
.radio label .iradio_square-custom,
.checkbox label .icheckbox_square-custom,
.radio label > div,
.checkbox label > div{ margin-right: 5px; position: relative; top: -2px;}
.form-control[disabled]{ background: #cccccc; opacity: 0.8;}
.form-horizontal label{ text-align: right; }
.form-horizontal .control-label{ line-height: 24px; padding-top: 5px; }
.form-horizontal.form-label-left label{ text-align: left; }
.has-captcha{ position: relative;}
.has-captcha .form-control{ width: 120px; display: inline-block;}
.has-captcha .form-control-captcha{ display: inline-block;}
.has-captcha .form-control-captcha img{ width: 80px; height: 30px;}
.control-label{ float: left; display: inline-block; padding-top: 5px; font-weight: 600; line-height: 24px; padding-bottom: 5px;}
.form-horizontal .form-group p{ line-height: 24px; padding-top: 5px;}
.filter-form{ display:inline-block; width:100%; line-height:normal;}
.filter-form .bg_search{ height:32px; color:#888888; display:inline-block; line-height:32px; float:left; position:relative; margin-right:20px; font-weight:bold; font-size:16px; }
.filter-form .btn{ min-width:inherit; display: inline-block;float: left; margin-right: 10px; margin-bottom: 15px; }
.filter-form .input-item{padding:0px 20px 10px 0px; display: inline-block; float: left; }
.filter-form .control-label{ float:left;}
.filter-form .form-control{ width:auto; max-width:200px; float:left; margin-bottom:0px;}
.filter-form select.form-control{ max-width: inherit;}
.filter-form .input-item > .select2-container{ display: inline-block; min-width: 180px; width: auto; float: left; }
.filter-form .select2-container > .select2-container{ width: 100% !important;}
.filter-form .input-item > .select2-container select.js-tags{ max-height: 32px;}
.filter-form .input-item > .select2-container select.js-tags option{ visibility: hidden; }
.filter-form .input-group{ width:max-content;}
.filter-form .input-group .form-control{margin:0px; float: none; }
.filter-form .input-group.mobile-time{display: none;}
.filter-form .input-group input[type=datetime-local]{width: auto; float: left; padding-right: 5px;}
.filter-form .input-group-pl{ width: 160px; display: inline-flex; flex-wrap: nowrap; }
.filter-form .input-group-addon{ padding: 6px 5px; font-size:inherit;}
.filter-form .input-group-select{ display: inline-block; width: auto;}
.filter-form .input-group-select .form-control,
.filter-form .input-group-select > .select2-container{ min-width: 100px; margin-right: 5px; float: left;}
.input-group .select2-container--default{ margin-top: -2px !important;}
/*.input-group{ width: 100%;}*/
.input-group .input-tel-area{ max-width: 45px;}
.input-group .input-tel-num{max-width: 700px; }
.input-group .input-group-addon{ min-width: 50px;}
.input-group .input-group-addon.no-border{ min-width:inherit; width: auto;}
.input-group-sm{line-height: 28px;}
.input-group-sm>.form-control, .input-group-sm>.input-group-addon, .input-group-sm>.input-group-btn>.btn {
height: 28px;
font-size: 14px;
padding: 3px 10px;
line-height: 1em;
}
@media (max-width:1400px){
.btn,
.form-control{ font-size: 12px;}
}
@media (max-width:1199px){
.filter-form { margin: 0px -10px 10px -10px; text-align: right; width: auto; display: block;}
.filter-form .input-item{ width: 100%; padding: 0px 10px 5px 10px; text-align: left; float: none; }
.filter-form .input-item > .select2-container,
.filter-form .form-control{ width: 70%; max-width:inherit;}
.filter-form .control-label{ width: 30%; min-width: 0px; margin-bottom: 0px;}
.filter-form .form-control.full-xs,
.filter-form .control-label.full-xs{ width: 100%; }
/*.filter-form .input-group{ width: 200px;}*/
.filter-form .input-group{ width: 70%; float: left; display: inline-block; }
.filter-form .input-group .input-group-addon{ width: 10%; float: left; display: inline-block; padding: 6px 0px 0px 0px;}
.filter-form .input-group-select > .select2-container,
.filter-form .input-group .form-control { width: 45%; float: left; display: inline-block; min-width: inherit;}
.num-input{ width: 100%;}
.filter-form .input-group-select {width: 70%; display:table;}
.filter-form .input-group-select .form-control{ width: 47%; margin-right: 0px; }
.filter-form .input-group-select .form-control:last-child{ float: right;}
.filter-form .filter-form-btn{ padding: 0px 10px;}
.filter-form .btn{ float: none; }
}
@media (max-width:991px){
.btn,
.form-control{ padding: 5px 5px;}
.filter-form { margin: 0px 0px 10px 0px; text-align: right; display: block; width: auto; overflow: hidden;
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
transition: all 0.5s ease;}
.filter-form .input-item{ width: 100%; padding: 0px 0px 5px 0px; text-align: left; float: none; }
.filter-form .control-label{ width: 30%; min-width: 0px; margin-bottom: 0px;}
.filter-form .form-control,
.filter-form .input-group-select,
.filter-form .input-item > .select2-container,
.filter-form .input-group{ width: 70%; max-width:inherit;}
.filter-form .input-group-select .select2-container > .select2-container--default{ width: 100% !important;}
.filter-form .long-label .form-control{ width: 60%; max-width:inherit;}
.filter-form .long-label .control-label{ width: 40%; min-width: 0px; margin-bottom: 0px;}
.filter-form .form-control.full-xs,
.filter-form .control-label.full-xs{ width: 100%; }
/*.filter-form .input-group{ width: 200px;}*/
.filter-form .input-group{ width: 70%; float: left; display: inline-block; }
.filter-form .input-group .input-group-addon{ width: 10%; float: left; display: inline-block; padding: 6px 0px 0px 0px;}
.filter-form .input-group .form-control { width: 45%; float: left; display: inline-block;}
.num-input{ width: 100%;}
.filter-form .input-group-select {width: 70%; display:table;}
.filter-form .input-group-select > .select2-container,
.filter-form .input-group .form-control { width: 45%; float: left; display: inline-block; min-width: inherit;}
.num-input{ width: 100%;}
.filter-form .input-group-select .form-control{ width: 47%; margin-right: 0px; }
.filter-form .input-group-select .form-control:last-child{ float: right;}
.btn_filter{ display: block; width: 100%; margin-bottom: 20px;}
.btn_filter .show-txt,
.btn_filter.clicked .close-txt{ display: block;}
.btn_filter.clicked .show-txt,
.btn_filter .close-txt{ display: none;}
.filter-form.active{ max-height: 2000px; overflow:visible;}
.filter-form .filter-form-btn{ display: block; width: auto; margin: 0px -10px;}
.filter-form .filter-form-btn > div{ width: 50%; padding:10px 10px 10px 10px; float: left; margin: 0px; }
.filter-form .filter-form-btn > div.btn1Div{ width: 100%; }
.filter-form .btn{ width:100%; margin-bottom: 5px; }
.upload-img{ height: 150px;}
}
@media (max-width: 767px) {
.form-group{ margin-bottom: 0px; }
.form-group .form-control,
.upload_file,
.form-horizontal .radio,
.form-horizontal .checkbox,
.radio{ margin-bottom: 10px; }
.input-group .form-control{ margin-bottom: 0px;}
.form-horizontal label{ text-align: left; }
.form-horizontal .control-label,
form .control-label{clear: left; margin-bottom: 0px;}
.filter-form { margin: 0px 0px 10px 0px;}
.filter-form .input-item{display: inline-block; float: none; width: 100%; padding: 0px; margin-bottom: 3px;}
.filter-form .btn{ min-width:inherit; }
.filter-form .input-group-select .select2-container > .select2-container--default{ width: 100% !important;}
.filter-form .filter-form-btn {margin: 0px -5px 0px -5px; width: auto; padding:0px; display: block;}
.filter-form .filter-form-btn > div{ padding: 0px 5px 10px 5px;}
.form-group .col-xs-9{ }
.col-pull-xs-1,.col-pull-xs-2,.col-pull-xs-3,.col-pull-xs-4,.col-pull-xs-5,.col-pull-xs-6,.col-pull-xs-7,
.col-pull-xs-8,.col-pull-xs-9,.col-pull-xs-10,.col-pull-xs-11,.col-pull-xs-12{ padding-top:5px;}
.form-inline{ margin: 0px -5px;}
.form-inline .select_item{ width: 33.3333%; padding: 0px 5px; }
.form-group .radio:last-child{ margin-right: 0px;}
.num-input{ margin-top: -2px;}
.upload-img{ height: 130px;}
}
@media (max-width: 500px) {
.btn, .form-control{ font-size: 3.2vw;}
.row,
.form-horizontal .form-group{ margin-left:-5px; margin-right: -5px; }
.col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9{ padding-left:5px; padding-right: 5px; }
.upload-img{ height: 80px;}
}
/*Modal style
--------------------------------------------------------------
*/
.box {
position: relative;
background: #ffffff;
margin-bottom: 20px;
width: 100%;
box-shadow:none;
}
.modal-header{ border: 0px;}
.modal-header.bg-gold,
.modal-header.bg-custom-header{
color: #FFFFFF;
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#008db0), to(#008e7c));
background: -webkit-linear-gradient(left, #008db0, #008e7c);
background: -moz-linear-gradient(left, #008db0, #008e7c);
background: -o-linear-gradient(left, #008db0, #008e7c);
background: -ms-linear-gradient(left, #008db0, #008e7c);
background: linear-gradient(left, #008db0, #008e7c);
background-color: #008db0;
}
.modal-dialog{ margin: 0px auto 0px auto; position:absolute; top: 50%; left: 50%;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
width: 1100px;
}
.modal-content {
-webkit-box-shadow:none;
box-shadow: none;
overflow: hidden;
}
.modal-header .close{ opacity: 1; color: #FFFFFF;}
.modal-header .close:hover{ opacity: 0.7;}
.modal-dialog.auto-width-dialog{ width: auto;}
.modal-dialog.auto-width-dialog{ width: auto;}
.modal-dialog.small-dialog{
width: 300px;
position:absolute;
top:45%;
left:0;
right:0;
bottom:0;
margin:auto;}
.modal.fade .modal-dialog {
-webkit-transition: -webkit-transform .3s ease-out;
-o-transition: -o-transform .3s ease-out;
transition: transform .3s ease-out;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.modal.in .modal-dialog{
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%); }
.modal-footer .load_entries, .box-footer .load_entries {
float: left;
text-align: left;
display: inline-block;
width: 30%;
}
.modal-footer .pagination, .box-footer .pagination {
float: right;
display: inline-block;
margin: 0px auto;
}
.modal-dialog .modal-body{ max-height: 660px; overflow-y: auto; overflow-x: hidden;}
@media (max-height:1000px) {
.modal-dialog .modal-body{ max-height: 660px; }
}
@media (max-height:800px) {
.modal-dialog .modal-body{ max-height: 520px;}
}
@media (max-height:600px) {
.modal-dialog .modal-body{ max-height: 400px;}
}
@media (max-height: 500px) {
.modal-dialog .modal-body{ max-height:440px; overflow: auto;}
}
@media (max-width: 1199px) {
.modal-dialog{ width: 900px;}
}
@media (max-width:991px) {
.modal-dialog{ width: 650px;}
.modal-dialog.small-dialog { width: 300px;}
}
@media (max-width: 767px) {
.modal-header,
.modal-body{ padding: 10px 15px 5px 15px;}
.modal-footer{ padding: 5px 15px;}
.small-dialog .modal-header{ padding: 15px;}
.modal-header .close{ margin-top: 0px;}
.modal.in .modal-dialog.small-dialog{ width: 280px; left: 50%; margin-left: -140px;}
.modal.fade .modal-dialog ,
.modal.in .modal-dialog,
.modal-dialog{ width: 100%; top:50%; left: 0%;
-webkit-transform: translate(0%, -50%);
-moz-transform: translate(0%, -50%);
-o-transform: translate(0%, -50%);
-ms-transform: translate(0%, -50%);
transform: translate(0%, -50%);
margin: 0px;
}
.modal-footer.text-center{ text-align: center;}
.box { border: 0px;}
}
@media (max-width: 500px) {
.modal-footer .load_entries, .box-footer .load_entries{ line-height: 30px; height: 30px;}
.modal-footer .pagination, .box-footer .pagination {
clear: both;
float: none;
display: inline-block;
width: auto;
margin: 20px auto 0px auto;
}
}
/*
Button style
--------------------------------------------------------------
*/
.btn{min-width: 100px;}
.button-ontop{ text-align: right;}
.button-ontop .btn{ margin-bottom: 10px;}
.button-ontop-left{ text-align: left; display: inline-block; margin-left: 20px;}
.btn .fa,
.btn .ion {min-width: 15px; display: inline-block;}
.btn-sm,
.btn-txt{ margin:5px 3px; min-width: inherit; border-radius:3px; padding: 6px 12px; }
.btn_reset_pwd{ margin-top: 5px; display: inline-block;}
.bg-grey{ background: #888888;color: #FFFFFF;}
.bg-greyLight{color: #0073b7;}
.btn3-group{ text-align: center;}
.btn3-group .btn{ width: 28%; margin: 0px 2px; min-width: inherit;}
.btn-primary{
background: -webkit-gradient(linear, left top, right top, from(#35b2f7), to(#2792cd));
background: -webkit-linear-gradient(top, #35b2f7, #2792cd);
background: -moz-linear-gradient(top, #35b2f7, #2792cd);
background: -o-linear-gradient(top, #35b2f7, #2792cd);
background: -ms-linear-gradient(top, #35b2f7, #2792cd);
background: linear-gradient(top, #35b2f7, #2792cd);
background-color: #35b2f7;
border:1px solid #35b2f7;}
.btn-primary:hover,
.btn-primary:active,
.btn-primary:focus,
.btn-primary:active:focus{ background: #67c9ff; outline: none; }
.bg-gold {
background-color: #8b5200;
color: #FFFFFF;
}
.btn-gold {
background-color: #ba8619;
color: #FFFFFF;
border-color: #a5762b;
}
.btn-gold:hover,
.btn-gold:active,
.btn-gold.hover,
.btn-gold:focus,
.btn-gold.focus{
background: #cf9d4b;
color: #FFFFFF;
border-color: #a5762b;
}
.btn.bg-blue{
background: -webkit-gradient(linear, left top, right top, from(#0073b7 ), to(#004873));
background: -webkit-linear-gradient(top, #0073b7 , #004873);
background: -moz-linear-gradient(top, #0073b7 , #004873);
background: -o-linear-gradient(top, #0073b7 , #004873);
background: -ms-linear-gradient(top, #0073b7 , #004873);
background: linear-gradient(top, #0073b7 , #004873);
background-color: #0073b7 ;
}
.btn.bg-blue:hover,
.btn.bg-blue:active,
.btn.bg-blue:focus,
.btn.bg-blue:active:focus{ background: #2c92cf !important; outline: none; }
.btn-gold {
background-color: #ba8619;
color: #FFFFFF;
border-color: #a5762b;
}
.btn-gold:hover,
.btn-gold:active,
.btn-gold.hover {
background: #cf9d4b;
color: #FFFFFF;
border-color: #a5762b;
}
.bg-dblue {
background: #0000ff;
color: #FFFFFF;
}
button.btn-icon{ width: 30px; height: 30px; padding: 0px; display: inline-block; border: 0px; background: none; color: #0073b7;}
button.btn-icon .fa{ font-size: 1.2em; }
button.btn-icon:hover{color: #cf9d4b;}
.btn.disabled, .btn[disabled], fieldset[disabled] .btn{ opacity: 0.4;}
.btn-transparent{ background: none; border: 0px; color: #FFFFFF;}
.btn-transparent:hover,
.btn-transparent:active{ color: #FFFFFF;}
button.close{ opacity: 0.4; margin-left: 10px;}
.btn-con{ color: #008d4c; cursor: pointer; width: 20px; height: 20px; font-size: 20px; display: inline-block; top: 2px; position: relative; z-index: 5; margin-right: -3px;}
.btn-con:hover{ color: #20cd7d;}
.btn-con .fa-minus-square{ display: none;}
.bottom-form-btn{ display: inline-block; width: 100%;}
.bottom-form-btn >div{ display: inline-block; float: left;width: 50%; }
.bottom-form-btn >div.btn1Div{ width: 100%; float: none; }
.bottom-form-btn >div:last-child{ text-align: right;}
@media( max-width:1400px){
.btn{ padding: 6px;}
.btn-sm,
.btn-txt{padding: 6px;}
}
@media (max-width:1199px) {
.btn-sm{ padding: 0px 0px; border-radius: 3px; width: 30px; height: 30px;text-align: center;}
.btn-sm .fa,
.btn-sm .ion{ width: auto; margin:0px; font-size: 15px; line-height: 30px; }
.btn-sm .hidden-xs{ display:none;}
}
@media (max-width:991px) {
.btn{min-width:inherit;}
.btn-sm .fa,
.btn-sm .ion{}
}
@media (max-width: 767px) {
.btn-txt{ margin-bottom: 0x; padding: 5px 5px; text-align: center;}
.btn-sm .fa,
.btn-sm .ion{ width: auto; display: inline-block; font-size: 16px; margin-right: 0px; }
.button-ontop{ text-align: left; padding: 10px 10px 0px 10px;}
.button-ontop-left{ display: block; margin:0px 0px 0px 0px; padding: 10px 0px 0px 0px; clear: both;}
.btn-block-sm{ width: 100%;}
}
@media (max-width: 500px) {
.btn-sm{ min-width: inherit;}
.btn-block-xs{ width: 100%; margin-bottom: 10px;}
.bottom-form-btn{ display: block; width: auto; margin: 0px -10px 0px -10px;}
.bottom-form-btn >div{ padding: 0px 10px; }
.bottom-form-btn .btn{ width: 100%; margin-bottom: 10px; }
.button-ontop-left{ padding: 10px 5px 0px 5px;}
}
/*
Datetimepicker
--------------------------------------------------------------
*/
.bootstrap-datetimepicker-widget {-webkit-box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.6);
-moz-box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.6);
box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.6);
}
.bootstrap-datetimepicker-widget a.btn,
.bootstrap-datetimepicker-widget a.btn:hover,
.datepicker .next,
.datepicker .prev{ color: #0073b7;}
.datepicker table tr td.active:active, .datepicker table tr td.active:hover:active, .datepicker table tr td.active.disabled:active, .datepicker table tr td.active.disabled:hover:active, .datepicker table tr td.active.active, .datepicker table tr td.active:hover.active, .datepicker table tr td.active.disabled.active, .datepicker table tr td.active.disabled:hover.active, .open .dropdown-toggle.datepicker table tr td.active, .open .dropdown-toggle.datepicker table tr td.active:hover, .open .dropdown-toggle.datepicker table tr td.active.disabled, .open .dropdown-toggle.datepicker table tr td.active.disabled:hover,
.bootstrap-datetimepicker-widget table td span.active{background: #0073b7;}
.bootstrap-datetimepicker-widget table td.today{ background: #dddddd;}
.bootstrap-datetimepicker-widget table td.today:before {
content: '';
display: inline-block;
border: solid transparent;
border-width: 0 0 7px 7px;
border-bottom-color: #0073b7;
border-top-color: rgba(0,0,0,0.2);
position: absolute;
bottom: 4px;
right: 4px;
}
.bootstrap-datetimepicker-widget table td.day:not(.active):hover,
.bootstrap-datetimepicker-widget table td.hour:not(.active):hover,
.bootstrap-datetimepicker-widget table td.minute:not(.active):hover {
background: #e2f4ff !important;
}
.bootstrap-datetimepicker-widget .btn{ margin: 0px!important; float: none; width: 54px;}
.bootstrap-datetimepicker-widget.timepicker-sbs{ max-width: 300px;}
.datepicker.col-md-6,
.timepicker.col-md-6{ width: 100%;}
.datepicker{ margin-top: -1px; padding-top: 5px; border-bottom:1px solid #eeeeee; padding-bottom: 5px; }
.bootstrap-datetimepicker-widget table td{ line-height: 22px; height: 22px; padding: 3px !important;}
.bootstrap-datetimepicker-widget table td span{line-height: 22px; height: 22px;}
/*special*/
.bootstrap-datetimepicker-widget .timepicker-picker table td.separator{ width: 15px;}
.bootstrap-datetimepicker-widget .timepicker-picker table td:first-child{ text-align: right;}
.bootstrap-datetimepicker-widget .timepicker-picker table td:last-child{ text-align: left;}
.bootstrap-datetimepicker-widget .timepicker-minute{ text-align: center;}
.bootstrap-datetimepicker-widget .timepicker-hour{ text-align: center;}
.bootstrap-datetimepicker-widget a[data-action] { padding: 3px 0;}
@media (max-width:991px){
.bootstrap-datetimepicker-widget,
.bootstrap-datetimepicker-widget.dropdown-menu {width: 280px !important;}
}
@media (max-width:767px){
.bootstrap-datetimepicker-widget { left: 25% !important; -webkit-transform: translate(-50%, 0px);
-moz-transform: translate(-50%, 0px);
-o-transform: translate(-50%, 0px);
-ms-transform: translate(-50%, 0px);
transform: translate(-50%, 0px);
}
.bootstrap-datetimepicker-widget.dropdown-menu.pull-right:before {
display:none;
}
.bootstrap-datetimepicker-widget.dropdown-menu.pull-right:after {
display:none;
}
.bootstrap-datetimepicker-widget table{font-size: 13px !important; }
}
/*
* Custom Skin
* ------------
*/
.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a > span:not(.pull-right), .sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > .treeview-menu, .sidebar-mini.sidebar-collapse .sidebar-menu > li.ee > .treeview-menu{ width: 250px; margin-left: 0px;}
.sidebar-mini.sidebar-collapse .treeview-menu > li > a{ white-space:normal;}
.main-footer{ border: 0px; background: none; font-size: 12px; font-family: Arial; padding: 15px 0px;}
.index-footer{ font-size: 12px; color: #999999; font-family: Arial; padding: 10px 20px; position: absolute; bottom:0px; left: 0px; width: 100%;}
.main-footer .cs-hotline{ float: left; }
.main-footer .vesion{ text-align: right;}
.main-footer .cs-hotline b,
.main-footer .vesion b{ padding: 0px 10px;}
.main-footer .version-txt,
.index-footer .version-txt{ }
.main-sidebar, .left-side{ padding-top: 0px;}
.skin-custom .main-header .navbar {
background:none;
}
.skin-custom .main-header .navbar .nav > li > a {
color: #ffffff;
}
.skin-custom .main-header .navbar .nav > li > a:hover,
.skin-custom .main-header .navbar .nav > li > a:active,
.skin-custom .main-header .navbar .nav > li > a:focus,
.skin-custom .main-header .navbar .nav .open > a,
.skin-custom .main-header .navbar .nav .open > a:hover,
.skin-custom .main-header .navbar .nav .open > a:focus,
.skin-custom .main-header .navbar .nav > .active > a {
background: rgba(0, 0, 0, 0.1);
color: #f6f6f6;
}
.skin-custom .main-header .navbar .sidebar-toggle {
color: #ffffff;
}
.skin-custom .main-header .navbar .sidebar-toggle:hover {
color: #f6f6f6;
background: rgba(0, 0, 0, 0.1);
}
.skin-custom .main-header .navbar .sidebar-toggle {
color: #fff;
}
.skin-custom .main-header .navbar .sidebar-toggle:hover {
background: rgba(0, 0, 0, 0.1);
}
@media (max-width: 767px) {
.skin-custom .main-header .navbar .dropdown-menu li.divider {
background-color: rgba(255, 255, 255, 0.1);
}
.skin-custom .main-header .navbar .dropdown-menu li a {
color: #0073b7;
}
.skin-custom .main-header .navbar .dropdown-menu li a:hover {
background: #dddddd;
}
}
.skin-custom .main-header li.user-header {
background-color: #2d9bdc;
}
.skin-custom .content-header {
background: transparent;
padding: 0px 15px 0 15px;
}
.skin-custom .wrapper {
background: -webkit-gradient(linear, left top, right top, from(#364876), to(#141f2e));
background: -webkit-linear-gradient(top, #364876, #141f2e);
background: -moz-linear-gradient(top, #364876, #141f2e);
background: -o-linear-gradient(top, #364876, #141f2e);
background: -ms-linear-gradient(top, #364876, #141f2e);
background: linear-gradient(top, #364876, #141f2e);
background-color: #141f2e;
}
.skin-custom .user-panel > .info,
.skin-custom .user-panel > .info > a {
color: #fff;
}
.skin-custom .sidebar-menu > li.header {
color: #4b646f;
background: #1a2226;
}
.skin-custom .sidebar-menu > li > a {
border-left: 3px solid transparent;
}
.skin-custom .sidebar-menu > li > a {
padding: 12px 5px 12px 15px;
}
.skin-custom .sidebar-menu > li:hover > a,
.skin-custom .sidebar-menu > li.active > a {
color: #FFFFFF;
background: rgba(0,0,0,0.5);
border-left-color: #004a76;
}
.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a,
.sidebar-mini.sidebar-collapse .sidebar-menu > li.active > a { background: #172034;}
.skin-custom .sidebar-menu > li > .treeview-menu {
margin: 0px;
padding: 0px;
background: rgba(0,0,0,0.3);
}
.skin-custom .sidebar a {
color: #FFFFFF;
}
.skin-custom .sidebar a:hover {
background: rgba(255,255,255,0.3);
}
.skin-custom .treeview-menu > li > a {
color:#FFFFFF
}
.skin-custom .treeview-menu > li.active > a,
.skin-custom .treeview-menu > li > a:hover {
color: #FFFFFF;
background: rgba(255,255,255,0.3);
}
.skin-custom .sidebar-form {
border-radius: 3px;
border: 1px solid #374850;
margin: 10px 10px;
}
.skin-custom .sidebar-form input[type="text"],
.skin-custom .sidebar-form .btn {
box-shadow: none;
background-color: #374850;
border: 1px solid transparent;
height: 35px;
-webkit-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}
.skin-custom .sidebar-form input[type="text"] {
color: #666;
border-top-left-radius: 2px;
border-top-right-radius: 0;
border-bottom-right-radius: 0;
border-bottom-left-radius: 2px;
}
.skin-custom .sidebar-form input[type="text"]:focus,
.skin-custom .sidebar-form input[type="text"]:focus + .input-group-btn .btn {
background-color: #fff;
color: #666;
}
.skin-custom .sidebar-form input[type="text"]:focus + .input-group-btn .btn {
border-left-color: #fff;
}
.skin-custom .sidebar-form .btn {
color: #999;
border-top-left-radius: 0;
border-top-right-radius: 2px;
border-bottom-right-radius: 2px;
border-bottom-left-radius: 0;
}
.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > .treeview-menu{ margin-top: -4px; margin-left: 0px; background: #202c45;}
.sidebar-mini.sidebar-collapse .sidebar-menu > li > a > .fa{ font-size: 16px; text-align: center;}
.sidebar-mini.sidebar-collapse .sidebar-menu > li > a > img{ margin-left: 5px;}
.box-widget{ border-radius: 0px;}
@media (max-width:991px) {
.skin-custom .content-header { padding: 15px 15px 0 15px; }
}
@media (max-width:762px) {
.main-footer{ padding: 10px 15px; text-align: left;}
.main-footer{ padding: 10px; font-size: 3vw; }
.main-footer .cs-hotline{ float: none; }
.main-footer .vesion{ float: none; text-align: left; }
}
@media (max-width:500px) {
.skin-custom .content {
padding: 15px 0px 0px 0px;
}
}
/*
Table style
----------------------------------------
*/
.tb{ display: table; width: 100%; border-collapse: collapse; }
.tb .group_user{ display: table-row-group;}
.tb ul{ width:auto; display:table-row; margin: 0px; padding: 0px; border-bottom: 1px solid #eeeeee;}
table.tb_custom { width: 100%; margin-bottom: 20px; border-collapse: collapse; }
table.tb_custom th,
table.tb_custom td,
.tb ul li{ padding: 8px 5px;line-height: 20px; display:table-cell; float: none; position: relative; }
/*
2021-11-30, Updated by DLDR. Case#: P191035-1410
*/
#uli li { padding: 0}
table.tb_custom th,
table.tb_custom td{ text-align: center;}
table.tb_custom td.text-right{ text-align: right !important;}
table.tb_custom td.text-left{ text-align: left !important;}
table.tb_custom td.text-center{ text-align: center !important;}
/*table.tb_custom tbody tr:nth-child(odd),*/
.tb ul:not(.tb_thead):nth-child(odd){ background: #efefef;border-bottom: 1px solid #e1e1e1; }
table.tb_custom tr.bg_grey{background: #efefef; }
table.tb_custom tbody tr:hover,
.tb ul:not(.tb_thead):hover,
.tb ul.selected{ background: #e6f4fd;}
table.tb_custom > thead tr,
.tb > ul.tb_thead{ color: #999999; font-weight: bold; text-align: center; }
table.tb_custom th,
.tb > ul.tb_thead li { }
.tb ul li.action{ text-align: center; position: relative;}
.tb ul li.action button{ margin-right: 5px;}
table.tb_custom .ex_time,
.tb ul li .ex_time{ display: block; font-size: 0.7em;}
.tb .sub_lv{ display: none; }
.tb .sub_lv.lv2,
.tb .sub_lv.lv3,
.tb .sub_lv.active{ display: table-row; }
.tb .sub_lv li:nth-child(1):before{ position:relative; top: 0px; left: 0px; width: 10px; height: 10px; content: ''; border-bottom: 2px solid #BBBBBB; display:inline-block; z-index: 4; float: left; margin-right: 5px; }
.tb .sub_lv.with_sub_lv li:nth-child(1):before{ border-bottom: 2px solid #555555; border-left:2px solid #555555;}
.tb .sub_lv li:nth-child(1){ padding-left: 10px; padding-right:0px;}
.tb .sub_lv.lv3 li:nth-child(1){ padding-left: 30px;}
.tb .sub_lv.lv4 li:nth-child(1){ padding-left: 50px;}
.tb .sub_lv.lv5 li:nth-child(1){ padding-left: 70px;}
.tb .sub_lv.lv6 li:nth-child(1){ padding-left: 90px;}
.tb .sub_lv.lv7 li:nth-child(1){ padding-left: 110px;}
.tb .sub_lv.lv8 li:nth-child(1){ padding-left: 130px;}
.tb .sub_lv.lv9 li:nth-child(1){ padding-left: 150px;}
.tb .sub_lv.lv10 li:nth-child(1),
.tb .sub_lv.lv11 li:nth-child(1),
.tb .sub_lv.lv12 li:nth-child(1),
.tb .sub_lv.lv13 li:nth-child(1),
.tb .sub_lv.lv14 li:nth-child(1),
.tb .sub_lv.lv15 li:nth-child(1),
.tb .sub_lv.lv16 li:nth-child(1){ padding-left: 170px;}
.tb.tb-small > ul li{ padding: 3px 2px;}
.tb-rebate ul li:nth-child(3),
.tb-rebate ul li:nth-child(4),
.tb-rebate ul li:nth-child(5),
.tb-rebate ul li:nth-child(6),
.tb-rebate ul li:nth-child(7){ text-align: center;}
.table_container{ overflow: auto; }
.tb-clients > ul:not(.tb_thead):nth-child(odd){ background: none; }
.tb-clients > ul li.more{ display: none; text-align: center;}
.tb-clients > ul:not(.tb_thead) li:nth-child(2),
.tb-clients > ul:not(.tb_thead) li:nth-child(3),
.tb-clients > ul:not(.tb_thead) li:nth-child(4){ word-break:break-all;}
.tb-rebate-user ul li:nth-child(1){ padding-left: 5px; text-align: left;}
.tb-rebate-user ul li:nth-child(2),
.tb-rebate-user ul li:nth-child(3),
.tb-rebate-user ul li:nth-child(4){ text-align: center;}
.tb-rebate-user ul li:nth-child(5),
.tb-rebate-user ul li:nth-child(6){ text-align: right;}
.tb-payment ul li:nth-child(1),
.tb-payment ul li:nth-child(2),
.tb-payment ul li:nth-child(5),
.tb-payment ul li:nth-child(6),
.tb-payment ul li:nth-child(7){ text-align: center;}
.tb-payment ul li:nth-child(3){ text-align: right;}
.tb-bank-info ul li{text-align:center;}
.tb-positions ul li{ text-align: center;}
.tb-positions ul li:nth-child(8){ text-align: right;}
.tb-pending-order ul li:nth-child(1) { text-align: left;}
.tb-pending-order ul li:nth-child(2),
.tb-pending-order ul li:nth-child(3),
.tb-pending-order ul li:nth-child(4),
.tb-pending-order ul li:nth-child(5),
.tb-pending-order ul li:nth-child(6),
.tb-pending-order ul li:nth-child(7),
.tb-pending-order ul li:nth-child(8){ text-align: center;}
.tb-history ul li:nth-child(1) { text-align: left;}
.tb-history ul li:nth-child(2),
.tb-history ul li:nth-child(3),
.tb-history ul li:nth-child(4),
.tb-history ul li:nth-child(5),
.tb-history ul li:nth-child(6),
.tb-history ul li:nth-child(7){ text-align: center;}
.tb-history ul li:nth-child(8){ text-align: right;}
.tb-history ul li:nth-child(9){ text-align: center;}
.tb-history ul li:nth-child(10){ text-align: center;}
.tb-client-asset ul li:nth-child(1),
.tb-client-asset ul li:nth-child(2),
.tb-client-asset ul li:nth-child(10),
.tb-client-asset ul li:nth-child(11){ text-align: center;}
.tb-client-asset ul li:nth-child(3),
.tb-client-asset ul li:nth-child(4),
.tb-client-asset ul li:nth-child(5),
.tb-client-asset ul li:nth-child(6),
.tb-client-asset ul li:nth-child(7),
.tb-client-asset ul li:nth-child(8),
.tb-client-asset ul li:nth-child(9){ text-align: right;}
.tb-client-payment ul li:nth-child(1),
.tb-client-payment ul li:nth-child(2),
.tb-client-payment ul li:nth-child(3),
.tb-client-payment ul li:nth-child(6),
.tb-client-payment ul li:nth-child(7),
.tb-client-payment ul li:nth-child(8),
.tb-client-payment ul li:nth-child(9),
.tb-client-payment ul li:nth-child(10){ text-align: center;}
.tb-client-payment ul:not(.tb_thead) li:nth-child(3){ text-align: right;}
.tb-approval ul:not(.tb_thead) li:nth-child(2),
.tb-approval ul:not(.tb_thead) li:nth-child(3),
.tb-approval ul:not(.tb_thead) li:nth-child(4){ text-align: center;}
.tb-ps-position ul:nth-child(odd):not(.tb_thead) {
background: none;
}
table.tb_custom.tb_hedging tr:odd-child td:nth-child(1){ text-align: center !important;}
table.tb_custom.tb_hedging tbody tr{ background: none; }
table.tb_custom.tb_hedging tbody tr:nth-child(2n-2){ border-bottom: 1px solid #999999; }
table.tb_custom.tb_hedging tbody tr.bg_grey{background: #efefef; border-bottom: 1px solid #999999; }
table.tb_custom.tb_hedging tbody tr.bg_grey td[rowspan] {border-bottom: 1px solid #999999; border-top: 1px solid #999999; }
table.tb_custom.tb_hedging tbody tr td:nth-child(1){ text-align: center;}
.tb-approval ul:not(.tb_thead) li:nth-child(2),
.tb-approval ul:not(.tb_thead) li:nth-child(3),
.tb-approval ul:not(.tb_thead) li:nth-child(4){ text-align: center;}
.tb-ps-position ul:nth-child(odd):not(.tb_thead) {
background: none;
}
@media (max-width:1199px) {
.tb-clients > ul li.more{display: table-cell;}
}
@media (max-width:991px) {
.table_container table.tb_custom,
.table_container div.tb_custom{ width: 1000px;}
table.tb_custom th,
table.tb_custom td{ padding: 2px 2px; }
table.tb_custom th,
table.tb_custom td,
.tb ul li{ padding: 4px 4px;}
.tb-clients ul li:nth-child(1) { min-width: 130px;}
.tb .sub_lv.lv3 li:nth-child(1){ padding-left: 10px;}
.tb .sub_lv.lv4 li:nth-child(1){ padding-left: 20px;}
.tb .sub_lv.lv5 li:nth-child(1){ padding-left: 30px;}
.tb .sub_lv.lv6 li:nth-child(1){ padding-left: 40px;}
.tb .sub_lv.lv7 li:nth-child(1){ padding-left: 50px;}
.tb .sub_lv.lv8 li:nth-child(1){ padding-left: 60px;}
.tb .sub_lv.lv9 li:nth-child(1){ padding-left: 70px;}
.tb .sub_lv.lv10 li:nth-child(1),
.tb .sub_lv.lv11 li:nth-child(1),
.tb .sub_lv.lv12 li:nth-child(1),
.tb .sub_lv.lv13 li:nth-child(1),
.tb .sub_lv.lv14 li:nth-child(1),
.tb .sub_lv.lv15 li:nth-child(1),
.tb .sub_lv.lv16 li:nth-child(1){ padding-left: 80px;}
.tb-clients ul li:nth-child(4){display: none;}
}
/* mobile */
@media (max-width: 767px) {
.tb{ display: block; width: auto; margin: 0px -10px;}
.tb .group_user{ display:inline-block; width: 100%; }
.tb ul{ width: 100%; display: inline-block; position: relative; padding: 7px 5px 7px 5px; margin-bottom: -5px;}
.tb ul li{ float: left; display: inline-block; list-style: none; width: auto; padding: 5px 1px;word-break: break-all; min-height: 30px;}
.tb ul.tb_thead{ padding: 0px 10px; }
.tb ul.tb_thead li{color: #FFFFFF; font-weight: bold; text-align: left;}
.tb ul.tb_thead li.time{ display: none;}
.tb ul li.time{ position: absolute; bottom: 0px; left: 0px; padding: 0px 1px 0px 10px; width: 50%; font-size: 0.6em; display: block; color: #555555; line-height: 15px; min-height: 20px; text-align: left !important;}
.tb ul li.time2{ position: absolute; bottom: 0px; right: 0px; padding: 0px 10px 0px 1px; width: 50%; font-size: 0.6em; display: block; color: #555555; line-height: 15px; min-height: 20px; text-align: left !important;}
.tb .sub_lv{ display: none; }
.tb .sub_lv.lv2,
.tb .sub_lv.lv3,
.tb .sub_lv.active{ display: inline-block; }
.tb .sub_lv li:nth-child(1):before{ left: 2px; width: 8px; height: 8px; }
.tb ul li.action button{ margin-right: 0px;}
.table_container{ margin: 0px -10px;}
.tb-col-4 ul li{ width: 25%;}
.tb-col-5 ul li{ width: 20%;}
.tb ul li .ex_time{ font-size: 0.6em; line-height: 1em; }
.tb-col-6 ul li{ width: 33.3333%;}
.tb-col-7 ul li{ width: 25%;}
.tb-col-8 ul li{ width: 25%;}
.tb-col-10 ul li{ width: 20%;}
.tb-bank-info.tb-action ul{ min-height:85px;}
.tb-bank-info ul li{ text-align:left; }
.tb-bank-info ul li:nth-child(2){ width: 50%; }
.tb-bank-info ul li:nth-child(3){ width: 50%;}
.tb-bank-info ul li:nth-child(4){ width: 50%;}
.tb-bank-info ul li:nth-child(5){ width: 50%;}
.tb-bank-info ul li:nth-child(6){ display: none;}
.tb-message-box ul,
.tb-message-box ul.tb_thead{ padding-right: 15%;}
.tb-message-box ul li:nth-child(1){ width: 80%;}
.tb-message-box ul li:nth-child(4){ width: 20%;}
.tb-positions ul li{ width: 25%; text-align: left;}
.tb-positions ul li:nth-child(4),
.tb-positions ul li:nth-child(8){ text-align: right;}
.tb-payment ul li:nth-child(1){ width: 45%; text-align:left;}
.tb-payment ul li:nth-child(2){ width: 25%; text-align:left;}
.tb-payment ul li:nth-child(3){ width: 30%; text-align: right;}
.tb-payment ul li:nth-child(4){ width: 70%;}
.tb-payment ul li:nth-child(7){ width: 30%; text-align: right;}
.tb-rebate-user ul li:nth-child(1){ }
.tb-rebate-user ul li:nth-child(2){ width: 50%; text-align: left;}
.tb-rebate-user ul li:nth-child(3){ width: 50%; text-align: left;}
.tb-rebate-user ul li:nth-child(4){ width: 50%; text-align: left;}
.tb-rebate-user ul li:nth-child(5){ width: 25%; text-align: left;}
.tb-rebate-user ul li:nth-child(6){ width: 25%; text-align: left;}
.tb-rebate-user ul.tb_thead .btn-sm{ margin-bottom: 0px;}
.tb-check ul,
.tb-check ul.tb_thead{ padding-left: 45px;}
.tb-check ul.tb_thead li.check{ width: 45px; position: absolute; left: 5px; top: 0px;}
.tb-check ul li.check{ width: 45px; position: absolute; left: 5px; top: 5px;}
.tb-time ul{ padding-bottom: 15px;}
.tb-action ul,
.tb-action .group_user > ul{ padding-right: 50px; min-height: 45px;}
.tb-action ul.tb_thead{ padding-right: 50px; min-height: inherit;}
.tb-action ul.tb_thead li.action{ display: none;}
.tb-action ul li.action{ width: 50px; padding: 0px; position: absolute; right: 0px; top: 5px; }
.tb-action ul li.action .btn-sm:last-child{ margin-bottom: 0px; }
.tb-pending-order ul li:nth-child(2), .tb-pending-order ul li:nth-child(3), .tb-pending-order ul li:nth-child(5), .tb-pending-order ul li:nth-child(6), .tb-pending-order ul li:nth-child(7), .tb-pending-order ul li:nth-child(8){text-align: left;}
.tb-pending-order ul li:nth-child(4){ text-align: right;}
.tb-pending-order ul li{ width: 25%; }
.tb-pending-order ul li:nth-child(5){ text-align: left;}
.tb-history ul li{ width: 25%; }
.tb-history ul li:nth-child(4),
.tb-history ul li:nth-child(8){ text-align: right;}
.tb-history ul li:nth-child(2),
.tb-history ul li:nth-child(3),
.tb-history ul li:nth-child(5),
.tb-history ul li:nth-child(6),
.tb-history ul li:nth-child(7){ text-align: left;}
.tb-clients ul{ border-bottom: 1px solid #efefef;}
.tb-clients ul:last-child{ border-bottom: 0px;}
.tb-clients > ul li {border-bottom: 0px;}
/*.tb-clients ul.with_sub_lv li:nth-child(2),
.tb-clients ul.with_sub_lv li:nth-child(4),
.tb-clients ul.with_sub_lv li:nth-child(5),
.tb-clients ul.with_sub_lv li:nth-child(6),
.tb-clients ul.with_sub_lv li:nth-child(7),
.tb-clients ul.with_sub_lv li:nth-child(8){display: none;}*/
.tb .sub_lv li:nth-child(1):before{ position:relative; top: 0px; left: 0px; width: 6px; height: 10px; content: ''; border-bottom: 2px solid #BBBBBB; border-left:0px solid #555555; display:inline-block; z-index: 4; float: left; margin-right: 4px; }
.tb .sub_lv.with_sub_lv li:nth-child(1):before{ border-bottom: 2px solid #555555; border-left:2px solid #555555;}
.tb-clients ul li:nth-child(1){ width: 90%;min-width: inherit; text-align: left;}
.tb-clients > ul li:nth-child(11){ display: inline-block; width: 10%;min-width: inherit; left: 0px; padding: 0px; text-align:center;}
.tb-clients > ul.tb_thead li:nth-child(11){padding: 5px 1px;}
.tb-clients ul li:nth-child(2),
.tb-clients ul li:nth-child(3),
.tb-clients ul li:nth-child(4),
.tb-clients ul li:nth-child(5),
.tb-clients ul li:nth-child(6),
.tb-clients ul li:nth-child(7),
.tb-clients ul li:nth-child(8),
.tb-clients ul li:nth-child(9),
.tb-clients ul li:nth-child(10){display: none;}
.tb .sub_lv li:nth-child(1){ padding-left: 5px; padding-right:0px;}
.tb .sub_lv.lv3 li:nth-child(1){ padding-left: 5px;}
.tb .sub_lv.lv4 li:nth-child(1){ padding-left: 15px;}
.tb .sub_lv.lv5 li:nth-child(1){ padding-left: 25px;}
.tb .sub_lv.lv6 li:nth-child(1){ padding-left: 35px;}
.tb .sub_lv.lv7 li:nth-child(1){ padding-left: 45px;}
.tb .sub_lv.lv8 li:nth-child(1){ padding-left: 55px;}
.tb .sub_lv.lv9 li:nth-child(1){ padding-left: 65px;}
.tb .sub_lv.lv10 li:nth-child(1),
.tb .sub_lv.lv11 li:nth-child(1),
.tb .sub_lv.lv12 li:nth-child(1),
.tb .sub_lv.lv13 li:nth-child(1),
.tb .sub_lv.lv14 li:nth-child(1),
.tb .sub_lv.lv15 li:nth-child(1),
.tb .sub_lv.lv16 li:nth-child(1){ padding-left: 75px;}
/*
.tb-client-asset ul li:nth-child(1){ width: 100%; text-align: left !important;}
.tb-client-asset ul li:nth-child(2){ width: 25%; text-align: left !important;}
.tb-client-asset ul li:nth-child(3){ width: 25%; text-align: left !important;}
.tb-client-asset ul li:nth-child(4){ width: 25%; text-align: left !important;}
.tb-client-asset ul li:nth-child(5){ width: 25%; text-align: left !important;}
.tb-client-asset ul li:nth-child(6){ width: 25%; text-align: left !important;}
.tb-client-asset ul li:nth-child(7){ width: 25%; text-align: left !important;}
.tb-client-asset ul li:nth-child(8){ width: 25%; text-align: left !important;}
.tb-client-asset ul li:nth-child(9){ position: absolute; top: 7px; right: 0px; width: 50%; color: #777777; text-align: left;}
.tb-client-asset ul.tb_thead li:nth-child(9){ top: 0px; color:#FFFFFF; text-align: left;}
*/
.tb-client-payment ul li:nth-child(1){ width: 40%; text-align: left !important;}
.tb-client-payment ul li:nth-child(2){ width: 60%;text-align: right !important;}
.tb-client-payment ul li:nth-child(3){ width: 20%;text-align: left !important;}
.tb-client-payment ul li:nth-child(4){ width: 40%; text-align:right;}
.tb-client-payment ul li:nth-child(5){ width: 40%; text-align:right;}
.tb-client-payment ul li:nth-child(6){ width: 25%; text-align:left;}
.tb-client-payment ul li:nth-child(7){ width: 50%; text-align: left !important;}
.tb-client-payment ul.tb_thead li:nth-child(9){ top: 0px; color:#FFFFFF; text-align: left; }
.tb-client-payment ul li:nth-child(10){ width: 25%; text-align: right !important;}
.tb-open-position ul li:nth-child(1){ width: 100%;}
.tb-open-position ul li:nth-child(2){ width: 25%;}
.tb-open-position ul li:nth-child(3){ width: 25%;}
.tb-open-position ul li:nth-child(4){ width: 25%;}
.tb-open-position ul li:nth-child(5){ width: 25%;}
.tb-open-position ul li:nth-child(6){ width: 25%;}
.tb-open-position ul li:nth-child(7){ width: 25%;}
.tb-open-position ul li:nth-child(8){ width: 25%;}
.tb-open-position ul li:nth-child(9){ width: 25%;}
.tb-open-position ul li:nth-child(10){ width: 25%; clear: left;}
.tb-open-position ul li:nth-child(11){ width: 25%;}
.tb-open-position ul li:nth-child(12){ position: absolute; top: 7px; right: 0px; width: 50%; color: #777777;}
.tb-open-position ul.tb_thead li:nth-child(12){ top: 0px; color:#FFFFFF; text-align: left; }
.tb-approval ul li:nth-child(1){ width: 40%;}
.tb-approval ul li:nth-child(3){ width: 30%; text-align: center;}
.tb-approval ul li:nth-child(4){ width: 30%;}
.tb-approval ul li:nth-child(5){ width: 25%; clear: left;}
.tb-approval ul li:nth-child(6){ width: 25%;}
.tb-approval ul li:nth-child(7){ width: 50%;}
.tb-rebate ul li:nth-child(1){ width: 25%;}
.tb-rebate ul li:nth-child(3){ width: 15%; text-align: center;}
.tb-rebate ul li:nth-child(4){ width: 21%; text-align: center;}
.tb-rebate ul li:nth-child(5){ width: 12%; text-align: center;}
.tb-rebate ul li:nth-child(6){ width: 15%; text-align: center;}
.tb-rebate ul li:nth-child(7){ width: 12%; text-align: center;}
.tb-rebate ul { position: relative; padding-bottom: 20px;}
.tb-rebate ul li:nth-child(2){ position: absolute; bottom:5px; left: 0px; width: 100%; padding: 0px 10px; font-size: 0.7em; min-height: 20px;}
.tb-rebate ul.tb_thead li:nth-child(2){ display: none;}
.tb-rebate tr td:nth-child(1){ width: 20%;}
.tb-rebate tr td:nth-child(2){ width: 15%; text-align: center;}
.tb-rebate tr td:nth-child(3){ width: 10%; text-align: center;}
.tb-rebate tr td:nth-child(4){ width: 21%; text-align: center;}
.tb-rebate tr td:nth-child(5){ width: 11%; text-align: center;}
.tb-rebate tr td:nth-child(6){ width: 13%; text-align: center;}
.tb-rebate tr td:nth-child(7){ width: 11%; text-align: center;}
.tb-ps-position ul li{ width: 25%; }
.tb-ps-position ul li:nth-child(1){ width: 40%; }
.tb-ps-position ul li:nth-child(2){ width: 60%; }
.tb-ps-position ul li:nth-child(6),
.tb-ps-position ul li:nth-child(10){ text-align: right;}
.tb-ps-position ul li:nth-child(3),
.tb-ps-position ul li:nth-child(4),
.tb-ps-position ul li:nth-child(5),
.tb-ps-position ul li:nth-child(7){ text-align: left;}
}
/*mobile small*/
@media (max-width: 500px) {
table.tb_custom{ margin-bottom: 10px;}
}
.alipay-iframe{
width: 100%;
min-height: 300px;
border:1px solid #DDDDDD;
}
.step-alipay{ display: inline-block;}
.payment-instruction{ display: inline-block; width: 100%; margin-bottom: 30px; padding: 10px; border: 1px solid #DDDDDD; border-radius: 5px;}
.payment-instruction > div{ float: left; width: 21%; display: inline-block; padding-left: 10px; padding-right: 40px; position: relative; text-align: center;}
.payment-instruction > div:last-child{width: 16%; padding-right:0px;}
.payment-instruction > div span{ display: inline-block; line-height: 20px; text-align: left; }
.payment-instruction > div .fa{ position: absolute; right:20px; top: 10px; font-size: 20px;}
.payment-instruction > div img{ width: 50px; margin-right: 5px; vertical-align: top;}
.vertify_code{ display: flex; width: 200px; margin: 0px auto 20px auto;}
.vertify_code > div{ flex: auto; padding: 0px 5px; text-align: center;}
.bank{ background: #fffdcf; padding: 15px; margin-bottom: 20px; word-break: break-word; }
@media (max-width:1199px) {
.payment-instruction > div{ padding-left: 0px; padding-right: 20px; }
.payment-instruction > div img{ width:30px; display:block; margin:0px auto;}
.payment-instruction > div span{ width:100%; text-align:center;}
.payment-instruction > div .fa{ right:5px;}
}
@media (max-width:767px) {
.payment-instruction > div,
.payment-instruction > div:last-child{ width:100%; float:none; margin-bottom:10px; text-align:left; }
.payment-instruction > div img{ display:inline-block; margin:0px 10px 0px 0px; width:50px; vertical-align: middle;}
.payment-instruction > div span{ width:auto; text-align:left; }
.payment-instruction > div span > br{ display:none;}
.bank{ padding: 10px 10px;}
}
.crm-datatable-thead tr th{
text-align: center !important;
}
.crm-datatable-thead li{
/* text-align: center !important;*/
}
.number-align{
text-align: right !important;
}
.fixed-align{
text-align: center !important;
}
.shortwords-align{
text-align: left !important;
}
.input-tel-area{
padding-right: 0px !important;
}
.crm-datatable-select-page{ width: auto; float: right; display: inline-block; font-size: 12px; padding: 0px 5px; margin-left:10px; line-height: 1.5; height: 30px;}
.display-row{ margin-bottom: 10px; display: -webkit-inline-box;}
.select-page{ width: auto; float: right; display: inline-block; font-size: 12px; padding: 0px 5px; margin-left:10px; line-height: 1.5; height: 30px;}
.select-row{ width: auto; display: inline-block; font-size: 12px; padding: 0px 5px; margin:0px 5px; line-height: 1.5; height: 30px;}
.btn-go {
position: absolute;
top: 0px;
right: 0px;
width: 50px;
height: 30px;
padding: 5px 5px;
font-size: 12px;
line-height: 1.5;
border-radius: 3px;
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
.input-go .form-control {
width: 100%;
height: 30px;
line-height: 30px;
padding: 0px 5px;
}
.input-go {
position: relative;
padding-right: 50px;
width: 120px;
float: right;
margin-left: 20px;
}
.referral_qr{
display:inline-block;
width: 210px;
height: 210px;
padding:5px;
background:#eeeeee;
border:1px solid #999999;
}
.referral_qr img{
width: 100%;
}
/*-------------Banner----------*/
.unslider-wrap{ height:auto !important; }
.banner{ margin: -20px -60px 20px -20px; }
@media( max-width:1199px) {
.banner{ margin: -10px -60px 20px -10px; }
}
.banner .owl-carousel .owl-item {
text-align: center;background:#000000; overflow:hidden; height:300px;
}
.owl-carousel.owl-loaded{ display:inline-block;}
.banner .owl-carousel .owl-item img { position:absolute; left:50%; top:50%;
display: inline-block; width: auto; max-width: 1878px; margin: 0 auto; max-height:300px;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.banner ul > li > a {
display: inline-block;
width: 100%;
text-align: center;
}
.banner ul > li > a > img { max-width: 100%; margin: 0 auto;}
.unslider{ position: relative; }
.unslider-arrow.prev,
.unslider-arrow.next{ position: absolute; width: 30px; height: 30px;
background: rgba(255,255,255,.4) !important; display: inline-block; top:50%; margin-top: -15px; line-height: 30px; text-align: center;}
.unslider-nav {
position: absolute;
bottom: 30px;
z-index: 99;
background: rgba(255,255,255,.4);
border-radius: 15px;
left: 50%;
transform: translate(-50%,0);
height: 20px;
padding-left: 9px;
padding-right: 9px;
}
.unslider-nav ol {
list-style: none;
text-align: center;
}
.unslider-nav ol li {
display: inline-block;
width: 6px;
height: 6px;
margin: 0 4px;
background: transparent;
border-radius: 5px;
overflow: hidden;
text-indent: -999em;
border: 2px solid #fff;
cursor: pointer;
}
.unslider-nav ol li.unslider-active {
background: #fff;
cursor: default;
}
.unslider-arrow.next{ right: 80px !important; }
.unslider-arrow.prev{ left: 80px !important;}
.unslider-nav ol li {
position: relative;
width: 10px !important;
height: 10px !important;
border: none !important;
background: rgba(255,255,255,.4) !important;
}
.unslider-nav ol li.unslider-active{
margin-top:1px;
width: 11px!important;
height: 11px!important;
background: url(../images/ku.png) center center no-repeat!important;
-webkit-animation: rotateDot 4500ms cubic-bezier(0.6, 0, 0.6, 1) 1;
-moz-animation: rotateDot 4500ms cubic-bezier(0.6, 0, 0.6, 1) 1;
-o-animation: rotateDot 4500ms cubic-bezier(0.6, 0, 0.6, 1) 1;
animation: rotateDot 4500ms cubic-bezier(0.6, 0, 0.6, 1) 1;
}
@keyframes rotateDot {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
@-webkit-keyframes rotateDot {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
@-moz-@keyframes rotateDot {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
.owl-carousel .owl-nav button.owl-prev,
.owl-carousel .owl-nav button.owl-next {
color: #0073b7;
font-size: 16px;
margin: 0px;
padding: 0px;
width: 36px;
height: 36px;
line-height: 36px;
background: rgba(255,255,255,.6) !important;
display: inline-block;
cursor: pointer;
border-radius: 5px;
top: 50%;
margin-top:-18px;}
.owl-theme .owl-nav [class*='owl-']:hover {
color: #2497d1;
text-decoration: none; }
.owl-nav div .fa{text-align: center;}
.owl-nav .owl-prev{
position: absolute;
left: 90px;
padding-right:3px;
}
.owl-nav .owl-next{
position: absolute;
right: 90px;
padding-left:3px;
}
.owl-theme .owl-dots{ position: absolute; bottom: 30px; left: 50%; transform: translate(-50%,0); padding:0px 7px; z-index: 50; width: auto; height: 20px; background: rgba(255,255,255,.4) !important; border-radius: 15px;}
.owl-theme .owl-nav{ margin: 0px; /* position:absolute;*/ top: 0px; width: 100%; height: 100%; }
.owl-theme .owl-dots .owl-dot span{ width: 11px; height: 11px; background: #FFFFFF; }
.owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span {
background: url(../images/ku.png) center center no-repeat!important;
-webkit-animation: rotateDot 6000ms cubic-bezier(0.6, 0, 0.6, 1) 1;
-moz-animation: rotateDot 6000ms cubic-bezier(0.6, 0, 0.6, 1) 1;
-o-animation: rotateDot 6000ms cubic-bezier(0.6, 0, 0.6, 1) 1;
animation: rotateDot 6000ms cubic-bezier(0.6, 0, 0.6, 1) 1; }
@media (max-width:991px) {
.banner{ margin: 0px;}
.banner .owl-carousel .owl-item { height:180px;}
.banner .owl-carousel .owl-item img { max-width: 1135px; max-height:180px; }
.owl-carousel.owl-loaded{ display:inline-block;}
.owl-carousel .owl-nav button.owl-prev,
.owl-carousel .owl-nav button.owl-next {width: 30px; height: 30px; line-height: 30px; font-size: 16px; margin-top:-15px;}
.unslider-arrow.next{ right: 20px !important; }
.unslider-arrow.prev{ left: 20px !important;}
.owl-nav .owl-prev{ left: 20px;}
.owl-nav .owl-next{ right: 20px;}
.owl-theme .owl-dots{ bottom:10px;}
}
@media (max-width:767px) {
.unslider-nav{ bottom:10px;}
}
/*------------end of Banner----------*/
/*-------------News----------*/
.news{ background: #FFFFFF; position:absolute; width: 100%; bottom: 0px; left: 0px;}
.news > .news-item{ padding-left: 120px; line-height: 39px; border-bottom: 1px solid #cccccc ; height: 39px;overflow: hidden;}
.news > div > label{ font-size: 20px; width: 110px; left: 0px; position:absolute; padding:0px 10px; color: #FFFFFF;
background-image: linear-gradient(to bottom right, #cdaa6f, #b5873b);
}
body:lang(en) .news > .news-item{ padding-left: 220px; }
body:lang(en) .news > div > label{ width: 200px; }
.news > div > a{ cursor: pointer;}
.new_list { padding: 0px;}
.new_list li{ list-style: none; border-bottom: 1px solid #CCCCCC; padding: 10px 0px;}
.new_list li a{ cursor: pointer;}
.new_list li .time{ color: #555555; font-size: 0.8em;}
.new_list li .news_ttl{ font-size: 1.3em; font-weight: bold;}
.new_list li .descript{ height: 25px; line-height: 25px; overflow: hidden; display: inline-block;}
@media (max-width:991px) {
.news{ position:relative; }
.news > .news-item{ padding: 0px; height: auto; }
.news > .news-item .owl-carousel{ padding: 0px 10px;line-height: 20px;}
.news > div > label{ position: relative; width: 100%;}
}
/*------------end of News----------*/
.welcome .box{ border-top:0px; margin: 0px; }
.welcome .img-logo{ margin:20px 0px; float: left;}
.img-mt4{ max-width: 500px; margin: 0px auto; width: 100%;}
.footer-link { padding: 0px; display: inline-block; width: 100%;}
.footer-link li{ float: left; padding-right: 10px; border-right:1px solid #aaaaaa; margin-right: 10px; display: inline-block;}
.footer-link li:last-child{ border: 0px;}
.footer-link li a{ color: #555555; text-decoration: none;}
.footer-link li a:hover{color:#111111;}
.btn-dl { display: inline-block; margin: 0px 10px; font-size: 20px;}
.btn-dl .fa{ font-size: 3em; display: block;}
.highlight-text{ color: #c45d2c;}
.btn-line{ border: 1px solid #c45d2c; font-size: 20px; line-height: 30px; padding: 5px 25px;}
.btn-line:hover{ border: 1px solid #da7240; color: #da7240;}
.btn-line-green{ background:#008B4F; color: #FFFFFF; font-size: 20px; line-height: 30px; padding: 5px 25px;}
.btn-line-green:hover{ background: #01b065; color: #FFFFFF;}
.about-us{ background:url(../images/bg-about-us.jpg) no-repeat; background-size:cover; padding: 40px 20px; margin-bottom: 10px; }
.about-us .btn{margin: 0px 10px;}
.tnc{ font-size: 11px;}