:root{--clr:#e79c5e; --clrhover: #d38748)}
.theme-ubkttw {--clr: #b20000; --clrhover: #ca0909}
html{ overflow: hidden; }
body{ font-family: RobotoR; font-size: 14px; color: #333; overflow: auto; background: #f5f5f5; }
a{ transition: 0.3s all ease-in-out; -moz-transition: 0.3s all ease-in-out; color: inherit; }
label{ font-weight: normal; font-family: RobotoB; }
/*CSS dành cho khối ảnh*/
.wImage{ position: relative; overflow: hidden; }
.wImage:before{ content: ""; display: block; padding-bottom: 66.66%; }
.wImage .image{ height: 100%; left: 0; position: absolute; top: 0; width: 100%; }
.wImage .image.cover img{ height: 100%; object-fit: cover; width: 100%; }
.wImage .image img,
.wImage .image img.owl-lazy{ display: block; margin: auto; max-height: 100%; max-width: 100%; vertical-align: middle; position: relative; top: 50%; transform: translateY(-50%); -moz-transform: translateY(-50%); transition: 0.5s all ease-in-out; -moz-transition: 0.5s all ease-in-out; }
.navbar-fixed-top .navbar-brand{ padding: 5px 0; }
.navbar-fixed-top .navbar-brand img{ width: auto; max-width: 200px; }
.theme-blue:before,
.theme-blue:after,
#wrapper:before,
#wrapper:after{ display: none; }
.theme-blue .page-loader-wrapper{ background: rgba(23, 106, 173, 0.9); }
.page-loader-wrapper img{ width: auto; }
.navbar-fixed-top{ top: 0; }
.user-account{ border-bottom: 1px dashed #dadada; padding-bottom: 20px; margin-bottom: 5px; }
.user-account .wImage{ width: 50px; border-radius: 50%; display: inline-block; vertical-align: middle; margin-right: 5px; }
.user-account .wImage:before{ padding-bottom: 100%; }
.user-account .dropdown{ vertical-align: middle; }
.user-account .dropdown .dropdown-menu{ background: rgba(23, 106, 173, 0.8); padding: 10px; }
.user-account .dropdown .dropdown-menu li a{ color: #fff; padding: 5px 0; }
.user-account .dropdown .dropdown-menu li a:hover{ margin-left: 3px; }
#left-sidebar .nav-tabs .nav-link.active,
.sidebar-nav .metismenu > li i{ color: #ff7700; }
.sidebar-nav .metismenu > li.active > a{ border-color: #ff7700; }
.pagination{ display: table; margin: auto; }
.table thead th{ text-align: center; }
#loading{ position: fixed; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.4); z-index: 9999; display: none; }
#loading .lds-ring{ display: inline-block; height: 100px; position: absolute; width: 100px; top: 50%; left: 50%; margin-left: -50px; margin-top: -50px; }
#loading .lds-ring div{ animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite; border: 6px solid #fff; border-color: #fff transparent transparent transparent; border-radius: 50%; box-sizing: border-box; display: block; height: 70px; margin: 6px; position: absolute; width: 70px; }
#loading .lds-ring div:nth-child(1){ animation-delay: -0.45s; }
#loading .lds-ring div:nth-child(2){ animation-delay: -0.3s; }
#loading .lds-ring div:nth-child(3){ animation-delay: -0.15s; }
@keyframes lds-ring{
    0%{ transform: rotate(0deg); }
    100%{ transform: rotate(360deg); }
}
.commonTool{ margin-bottom: 15px; }
.fl{ float: left; }
.fr{ float: right; }
.cb{ clear: both; }
.lh35{ line-height: 35px; }
.mb0{ margin-bottom: 0; }
.sweet-alert button{ margin: 0 5px 15px 5px; }
a:hover,
a:focus{ color: inherit; }
table .fancy-checkbox{ margin: 0; }
#Browser{ color: #fff; }
.multiselect-container{ width: 100% !important; }
.sapxep .fa{ float: right; margin-top: 2px; }
.auth-main:after,
.auth-main:before{ display: none; }
.auth-box{ margin: auto; width: auto; }
.auth-box .top{ margin: auto; display: block; }
.auth-box .top img{ max-width: 100%; width: auto; display: block; margin: auto; }
.auth-box .top span{ font-family: UTMBebas; font-size: 25px; text-align: center; display: block; text-shadow: 0 0 10px #fff; }
.auth-box .top p{ margin-bottom: 5px; }
.auth-box .top span:first-child{ font-size: 27px; }
.auth-box .card{ width: 400px; margin: 10px auto; display: table; }
.auth-box .card .body{ padding-top: 5px; }
.auth-box .skype{ display: table; margin: 10px auto; margin-bottom: 5px; }
.auth-box .powerby{ position: fixed; bottom: 10px; right: 10px; }
.auth-box .info{ padding-top: 20px; background: url(/assets/custom/icon/footer_boder.png) center top no-repeat; }
.auth-box .info a{ font-family: RobotoB; }
.sr-only{ position: static; width: auto; height: auto; }
.title_login{ padding: 0 !important; }
.title_login .lead{ font-family: UTMViceroyJF; text-align: center; font-size: 30px; }
.theme-blue .auth-main .btn-primary{ font-family: "RobotoB"; text-transform: uppercase; }
.theme-blue .auth-main .btn-primary:hover{ background: #0062cc; }
.w200px{ width: 200px; }
.w100px{ width: 100px; }
.w120px{ width: 120px; }
.w150px{ width: 150px; }
.w70px{ width: 70px; }
.w50px{ width: 50px; }
.btn.fa{ font-family: Arial; }
.btn.fa:before{ font: normal normal normal 14px/1 FontAwesome; font-weight: 900; }
.c000{ color: #000; }
.c000:hover{ color: #0062cc; }
#searchForm{ width: 400px; }
.padR-0{ padding-right: 0; }
#main-content .header,
#main-content .body{ padding-bottom: 0; }
#main-content .card,
#main-content .commonTool{ margin-bottom: 0; }
#main-content{ width: 100%; padding-top: 10px; }
#pageSize{ width: 70px; margin-right: 10px; height: 29px; padding: 0 10px; }
#pageSize,
#paginationholder,
#paginationholderCanBo{ float: left; }
#paginationholder .disabled a,
#paginationholderCanBo .disabled a{ color: #fff; }
#gridData .fancy-checkbox input[type="checkbox"] + span:before{ margin-right: 0; }
#gridData table thead th{ cursor: pointer; }
#header{ background: var(--clr); border-bottom: none; color: #fff; position: relative; z-index: 1000; }
#header.navbar-fixed-top{ position: sticky; }
#header.navbar-fixed-top .navbar-brand{ display: flex; justify-content: space-between; width: 100%; padding: 0; margin: 0; }
#header .slogan{ margin-left: 10px; text-transform: uppercase; font-size: 15px; color: #fff; font-family: UTMHelvetIns; line-height: 22px; }
#header .slogan span{ display: block; }
#header .logo{ display: flex; padding: 0px 0 3px 0; align-items: center; }
#menuMain{ padding-left: 40px; flex: 1; display: flex; justify-content: space-between; position: relative; z-index: 1001; /*max-width: 100%; overflow: hidden; -- Cho vào menu hover vào không hiện */ }
#menuMain ul{ padding: 0; margin: 0; list-style: none; width: 100%; display: flex; justify-content: flex-end; }
#menuMain ul li{ display: inline-block; position: relative; white-space: nowrap; }
#menuMain ul li > a{ display: flex; color: #fff; text-transform: uppercase; font-family: RobotoB; font-size: 12px; height: 100%; align-items: center; justify-content: center; padding: 0 10px; }
#menuMain ul.left li{ flex: auto; text-align: center; height: 100%; }
#menuMain ul.left li:hover > a,
#menuMain ul li ul li > a:hover{ background: var(--clrhover); }
#menuMain ul li ul{ position: absolute; top: 100%; visibility: hidden; opacity: 0; transition: 0.3s all ease-in-out; -moz-transition: 0.3s all ease-in-out; background: var(--clr); z-index: 10; min-width: 200px; padding: 0; left: 0; display: block; }
#menuMain ul li ul li a{ display: block; padding: 10px 5px; }
#menuMain ul.left li ul li a{ text-align: left; }
#menuMain ul li ul li{ display: block; padding: 0 !important; }
#menuMain>ul>li:hover>ul{ top: 100%; visibility: visible; opacity: 1; }
#menuMain ul li i{ font-size: 16px; }
#menuMain ul.right li{ padding: 0 5px; }
#menuMain ul.right li ul{ left: inherit; right: 0; }
#menuMain ul.right > li > a{ padding: 0 5px; }
#menuMain ul li ul i{ margin-right: 4px;  }
#menuMain ul.right li ul i{ width: 20px; }
#menuMain ul.right li ul a:before{ margin-right: 17px; }
#menuMain ul.right li ul li:last-child a:before{ margin-right: 15px; }
#notifications{ width: 350px; background: #fff !important; border: 1px solid #dadada; overflow-y: auto; position: fixed; right: -100%; top: 70px; min-width: 0; transition: 1s all ease-in-out; display: block; opacity: 1; visibility: visible; z-index: 1000; max-width: 100%; padding: 0; }
#notifications.active{ right: 0; }
/*#notifications li{ border-bottom: 1px dashed #d38654; background: #f9eee2; }*/
#notifications li{ border-bottom: 1px dashed #d38654; }
#notifications li a{ padding: 10px 5px; display: block; }
#notifications li.empty{ font-size: 15px; color: #000; }
#notifications li .timestamp{ font-size: 12px; color: #666666; margin-top: 5px; }
#notifications li .text{ white-space: normal; }
#notifications .media{ margin-bottom: 0; padding: 5px 0; box-sizing: border-box; display: flex; }
#notifications .media .media-left img{ width: 37px; height: 37px; display: block; }
#notifications .media .media-body{ color: #333; text-transform: none; font-weight: normal; font-family: RobotoR; line-height: 20px; padding-left: 15px; }
#notifications .footer{ position: sticky; bottom: 0; left: 0; background: #fff; display:flex; }
#notifications .footer a{ text-align: center; color: #333; font-size: 12px; text-transform: uppercase; font-weight: bold; width: 150px; cursor: pointer; }
#notifications .footer .more_right{flex: 1; color: #333; padding: 8px 5px; cursor:default; font-size: 13px; align-self: flex-end; }
#notifications .footer .more_right input{margin-left:10px;}
#notifications li:hover{ background: #f9eee2 !important; }
#notifications li:hover .media-body,
#notifications li.footer .more:hover,
#notifications li.footer .more_right:hover,
#notifications li:hover span.timestamp{ color: var(--clr) !important; }
#notifications li span,
#notifications a{ transition: none; -moz-transition: none; }
#notifications li.active{ background: var(--clr); }
#notifications li.active .media-body, #notifications li.active span.timestamp{ color: #fff;}
#notifications li.new .media-left:after{ content: "Mới"; display: block; color: #22af46; font-size: 13px; text-align: center; margin-top: 2px; font-family: RobotoB; }
#left-sidebar,
#main-content{ margin-top: 0; overflow-y: auto; box-sizing: border-box; padding-right: 0; }
#left-sidebar{ width: 240px; box-shadow: 0 0 10px #dadada inset; position: static; float: left; }
#left-sidebar.hide{ display: none; }
#left-sidebar .searchUnit{ width: 220px; margin-bottom: 10px; }
#left-sidebar .hide{ display: none; }
#left-sidebar span{ transition: none; -moz-transition: none; }
#main-content{ padding-left: 0; height: 100%; flex: 1; float: right; max-width: 100%; padding-bottom: 0; }
/*#main-content.full { width: 100%}*/
/*.mCSB_scrollTools .mCSB_draggerContainer {left: 10px}*/
.mCSB_container_wrapper > .mCSB_container{ padding-right: 0; }
.mCSB_container{ overflow: visible; }
.mCSB_container_wrapper{ margin-right: 5px; }
.mCSB_scrollTools .mCSB_draggerRail,
.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ width: 8px; }
.titleWelcome{ font-family: RobotoB; text-transform: uppercase; font-size: 15px; border-bottom: 1px solid #dadada; padding-bottom: 10px; }
#statistical{ margin: 5px 0 15px 0; }
#statistical .item{ display: block; box-sizing: border-box; padding: 5px 10px; font-family: RobotoB; border: 2px solid #dadada; border-radius: 4px; transition: 0.3s all ease-in-out; -moz-transition: 0.3s all ease-in-out; background: url(/assets/custom/icon/file.png) right 5px center no-repeat; background-size: auto 70%; position: relative; overflow: hidden; }
#statistical .item:after{ content: "Xem tất cả"; position: absolute; line-height: 64px; bottom: 0; left: 0; display: block; width: 100%; text-align: center; color: #fff; opacity: 0; visibility: hidden; transition: 0.3s all ease-in-out; -moz-transition: 0.3s all ease-in-out; height: 100%; background: rgba(0, 0, 0, 0.7); z-index: 2; }
#statistical .item p{ margin-bottom: 0; line-height: 25px; }
#statistical .item p.number{ color: red; font-size: 18px; }
#statistical .item p.name{ color: #AAB5BC; font-size: 12px; }
#statistical .item:hover{ background-size: auto 80%; }
#statistical .item:hover:after{ bottom: 0; visibility: visible; opacity: 1; }
.commontitle{ font-family: RobotoB; padding-bottom: 7px; margin-bottom: 10px; font-size: 15px; border-bottom: 1px solid #dadada; position: relative; text-transform: uppercase; display: block; }
.commontitle:after{ content: ""; position: absolute; bottom: -1px; height: 2px; width: 150px; background: var(--clr); display: block; left: 0; }
#birthday .group{ height: 380px; overflow: auto; }
#birthday .wImage:before{ padding-bottom: 150%; }
#birthday .item{ border-bottom: 1px dotted #dadada; padding-bottom: 10px; margin-bottom: 10px; }
#birthday ul{ padding: 0; margin: 0; list-style: none; }
#birthday ul li{ line-height: 19px; margin-bottom: 3px; font-size: 13px; }
#birthday .chitiet{ float: right; }
#birthday .chitiet:hover{ color: var(--clr); }
.block-header{ margin: 0; }
#main-content .card{ box-shadow: none; background: transparent; }
#main-content .card .header{ padding: 0; margin-top: 15px; }
#main-content .card .body{ padding: 20px 0; font-weight: normal; color: inherit; }
.pl4{ padding-left: 4px; }
.dropdown-menu li{ font-size: 14px; }
.dropdown-menu li:active{ background: var(--clr); color: #fff; }
.dropdown-menu li:active a{ color: #fff; }
.btn { font-size: 13px; height: 35px; display: inline-flex!important; align-items: center; justify-content: center; padding: 0 15px!important}
table .btn {height: 25px}
.btn:before,.btn>*:first-child {margin-right: 3px}
.flex{ display: flex; flex-direction: row; }
table th{ font-family: RobotoB; font-weight: bold; }
table th[style*="normal"]{ font-family: RobotoR; font-weight: normal; }
.fwb{ font-family: RobotoB; font-weight: bold; }
.fwb[style*="normal"]{ font-family: RobotoR; font-weight: normal; }
.commonHead{ background: #0581b7; line-height: 20px; color: #fff; font-size: 12px; margin-bottom: 10px; width: 100%; padding: 5px 10px; font-family: RobotoB; }
#left-sidebar .commonHead{ width: 220px; }
.pintab .fa{ margin-left: 3px; }
#pintab{ position: fixed; line-height: 20px; z-index: 10; left: 10px; bottom: 0; }
#pintab ul{ padding: 0; margin: 0; list-style: none; }
#pintab ul li{ white-space: normal; display: inline-block; }
#pintab ul li a{ background: #333; color: #fff; display: block; padding: 5px 10px; font-size: 13px; }
#pintab ul li a:hover{ background: var(--clr); }
.colRight{ float: right; }
.colRight .commonHead{ margin-bottom: 5px; }
.w220px{ width: 220px; }
.colRight .w220px{ margin-left: 10px; }
#ListDauMuc{ margin-bottom: 7px; }
#ListDauMuc ul{ padding: 0; margin: 0; list-style: none; }
#ListDauMuc ul li{ border-bottom: 1px dashed #dadada; }
#ListDauMuc ul li:last-child{ border: none; }
#ListDauMuc ul li a{ display: block; padding: 4px 5px; position: relative; left: 0; font-size: 13px; box-sizing: border-box; font-family: RobotoB; }
#ListDauMuc ul li a:hover,
#ListDauMuc ul li.active a{ background: var(--clr); outline: none; color: #fff; }
#ListChucNang ul{ padding: 0; margin: 0; list-style: none; }
#ListChucNang ul li{ margin-bottom: 7px; }
#ListChucNang ul li .btn{ width: 100%; font-size: 12px; padding: 0.2rem 0.75rem; }
#FormInput{ flex: 1; overflow-y: auto; padding-right: 10px; }
#PhieuHC a:hover{ transition: 0.3s all ease-in-out; -moz-transition: 0.3s all ease-in-out; }
#PhieuHC{ font-family: RobotoR; background: #fff; font-size: 14px; position: relative; padding-bottom: 20px; }
#PhieuHC p{ margin: 0; }
#PhieuHC .item{ display: flex; width: 100%; }
#PhieuHC .labelForm{ line-height: 27px; font-weight: normal; font-family: RobotoR; }
#PhieuHC .iptForm{ -webkit-flex: 1; -ms-flex: 1; flex: 1; margin-left: 7px; }
#PhieuHC .iptForm input,
#PhieuHC .iptForm select,
#PhieuHC button.multiselect,
#PhieuHC .select2-container .select2-choice{ height: 25px; width: 100%; border: none; border-bottom: 1px dotted #333; line-height: 23px; outline: none; color: #6078c1; outline: none; text-align: left; box-shadow: none; }
#PhieuHC button.multiselect{ padding: 0; }
#PhieuHC .multiselect-container input{ width: inherit; height: 20px; }
#PhieuHC .datepicker-group{ display: flex; }
#PhieuHC .datepicker-group input{ flex: 1; }
#PhieuHC .select2-container .select2-choice,
#PhieuHC .select2-container-multi .select2-choices{ font-size: 14px; line-height: 25px; padding: 0; }
#PhieuHC .select2-container .select2-choice .select2-arrow b{ background-position: 0 7px; }
#PhieuHC .datepicker-group .btn-outline-secondary{ height: 25px; line-height: 25px; padding: 0; border: none; border-bottom: 1px dotted #333; border-radius: 0; background: transparent !important; outline: none; box-shadow: none; }
#PhieuHC .iptForm textarea,
#PhieuHC .datepicker-group .btn-outline-secondary:hover{ color: #6078c1; }
#PhieuHC .iptForm select{ height: 25px; }
#PhieuHC .iptForm .select2-container .select2-choice,
#PhieuHC .iptForm .select2-container-multi .select2-choices{ border: none; border-bottom: 1px dotted #333; outline: none; box-shadow: none; }
.modal .select2-container--default .select2-selection--single,
.modal .select2-container--default .select2-selection--multiple{ border-color: #ced4da; height: 35px; outline: none; }
.modal .select2-container--default .select2-selection--single .select2-selection__arrow{ height: 32px; }
.modal .select2-container--default .select2-selection--single .select2-selection__rendered{ line-height: 35px; }
#PhieuHC .iptForm .select2-container--default .select2-selection--single .select2-selection__rendered,
.modal .select2-container--default .select2-selection--single .select2-selection__rendered{ color: #6078c1; }
#PhieuHC .titleHead{ max-width: 50%; margin: 30px auto 20px auto; line-height: 27px; position: absolute; left: 50%; transform: translateX(-50%); -moz-transform: translateX(-50%); top: 20px; }
#PhieuHC .title{ font-family: RobotoB; text-transform: uppercase; font-size: 16px; margin-bottom: 5px; margin-top: 10px; position: relative; padding-bottom: 7px; display: inline-block; }
#PhieuHC .title:after{ content: ""; height: 2px; width: 100%; background: var(--clr); display: block; bottom: 0; left: 0; position: absolute; }
#PhieuHC .smart-form th:first-child,
#PhieuHC .smart-form th:last-child{ min-width: auto; }
#PhieuHC .smart-form th{ text-align: center; font-size: 14px; padding: 10px; min-width: 100px; }
#PhieuHC .smart-form label{ float: left; line-height: 27px; }
#PhieuHC .item.textarea{ display: block; }
#PhieuHC .item.textarea .iptForm{ margin-left: 0; position: relative; }
#PhieuHC .item.textarea .iptForm textarea{ width: 100%; max-width: 100%; min-height: 100px; box-sizing: border-box; padding: 10px; }
#PhieuHC .select2-container .select2-choice .select2-arrow{ background: transparent; border: none; }
#PhieuHC .lstbutton{ margin-left: 10px; margin-bottom: 10px; white-space: nowrap; }
#PhieuHC .QRCode{ float: right; max-width: 25%; }
#PhieuHC .QRCode img{ width: 200px; margin: auto; height: auto; max-width: 100%; margin-bottom: 10px; }
#PhieuHC .QRCode input{ border: none; border-bottom: 1px dotted #333; height: 20px; box-sizing: border-box; padding: 0 10px; width: 100%; text-align: center; outline: none; }
#PhieuHC .Photo{ max-width: 25%; float: left; position: relative; border: 1px solid #dadada; }
#PhieuHC .Photo .wImage{ width: 150px; }
#PhieuHC .Photo .wImage:before{ padding-bottom: 150%; }
#PhieuHC .Photo #Upload{ position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); -moz-transform: translateX(-50%); }
#PhieuHC .lstbuttonsave{ position: fixed; right: 60px; bottom: 10px; }
#PhieuHC .dieuhuong{ position: fixed; right: -330px; top: 50%; transform: translateY(-50%); -moz-transform: translateY(-50%); background: #3276b1; box-sizing: border-box; ; padding: 10px; transition: 0.5s all ease-in-out; -moz-transition: 0.5s all ease-in-out; }
#PhieuHC .dieuhuong ul{ padding: 0; margin: 0; list-style: none; }
#PhieuHC .dieuhuong ul li{ line-height: 22px; margin-bottom: 3px; }
#PhieuHC .dieuhuong ul a{ color: #fff; font-family: RobotoB; display: block; }
#PhieuHC .dieuhuong ul a.active,
#PhieuHC .dieuhuong ul a:hover{ color: yellow; }
#PhieuHC .dieuhuong:before{ content: "Danh mục hồ sơ"; position: absolute; transform: rotate(-90deg); -moz-transform: rotate(-90deg); background: #3276b1; left: -122px; top: 97px; width: 220px; display: block; color: #fff; text-align: center; font-family: RobotoB; font-size: 15px; line-height: 25px; border-bottom: 2px solid #fff; }
#PhieuHC .dieuhuong:hover{ right: 0; }
#PhieuHC table textarea{ overflow: hidden; resize: none; border: none; outline: none; height: 25px; line-height: 25px; background: url(/assets/custom/icon/bgInputText.png) bottom left; background-size: auto 25px; width: 100%; }
#PhieuHC .commonTool{ display: none; }
.modal label.control-label{ margin-bottom: 0; font-family: RobotoR; font-weight: normal; line-height: 18px; padding-right: 0; min-height: 34px; display: table; }
.modal label.control-label span{ vertical-align: middle; display: table-cell; }
.modal label.control-label span span{ display: inline; }
.modal input,
.modal textarea,
.modal select{ color: #6078c1; }
.modal-title{ font-size: 20px; }
.modal-header{ padding: 10px 20px; }
.padL-0{ padding-left: 0; }
.padR-5{ padding-right: 5px; }
.padL-5{ padding-left: 5px; }
.fs15{ font-size: 15px; }
.wspn{ white-space: nowrap; }
#PhieuHC .btnfix{ position: sticky; position: -webkit-sticky; text-align: right; margin-top: 10px; bottom: 0; }
#PhieuHC .btnfix button{ margin-right: 10px; }
#PhieuHC .date .input-group-append{ width: auto; }
#InfoHoSo{ font-size: 13px; }
#InfoHoSo .group{ margin-bottom: 10px; }
#InfoHoSo .group .wImage{ width: 80px; float: left; }
#InfoHoSo .group .wImage:before{ padding-bottom: 150%; }
#InfoHoSo .group .info{ width: calc(100% - 90px); float: right; padding: 0; margin: 0; list-style: none; }
#InfoHoSo .group .info label{ margin-bottom: 2px; font-weight: normal; font-family: RobotoB; }
#InfoHoSo .group .info li{ line-height: 17px; margin-bottom: 3px; }
#PhieuHCTemp{ display: none; }
#ThongTinChung .Photo table{ display: none; }
#ThongTinChung .Photo .fileupload-buttonbar{ margin: 0; position: absolute; bottom: -5px; left: 50%; transform: translateX(-50%); -moz-transform: translateX(-50%); }
.btn-group{ width: 100%; }
.multiselect-container label{ font-family: RobotoR; }
.lh34{ line-height: 34px !important; }
/* width */
::-webkit-scrollbar{ width: 10px; height: 10px; }
/* Track */
::-webkit-scrollbar-track{ background: #f1f1f1; }
/* Handle */
::-webkit-scrollbar-thumb{ background: #d1d1d1; }
/* Handle on hover */
::-webkit-scrollbar-thumb:hover{ background: var(--clr); }
#basicForm{ width: 100%; }
.multiselect-container{ width: 100% !important; }
.search-input{ width: 100%; height: 30px; margin-bottom: 5px; border-radius: 4px; box-sizing: border-box; padding: 0 10px; border: 1px solid #dadada; }
.custom-header{ line-height: 30px; text-align: center; background: #333; color: #fff; font-family: "RobotoB"; display: block; }
/*#colRightHoSo { margin-left: 10px; }
#colRightHoSo:before { content: ""; width: 5px; background: #dadada; height: 100%; display: block; float: left}
#colRightHoSo .w220px { width: 220px;float: right; margin-left: 5px; min-width: 220px}*/
.modal button.close{ outline: none; }
#PhieuHC .row1{ margin-right: -10px; }
.lstUnitDieuDong{ height: 400px; overflow: auto; width: calc(50% - 10px); float: left; }
.tabHead{ padding: 0; margin: 0; list-style: none; border-bottom: 1px solid #dadada; }
.tabHead li{ display: inline-block; margin-right: 5px; border: 1px solid #dadada; border-top: 2px solid #dadada; border-bottom: none; margin-bottom: -1px; position: relative; z-index: 1; background: #fff; }
.tabHead li a{ display: block; padding: 7px 15px; }
.tabHead li:hover,
.tabHead li.active{ background: var(--clr); border-color: var(--clr); font-family: RobotoB; }
.tabHead li:hover a,
.tabHead li.active a{ color: #fff; }
.pad0{ padding: 0; }
#ListCanbo,
#gridData tr.active{ background: #dedede; }
#gridData tr.active td{ border-color: #fff !important; }
.modal.show{ overflow-y: auto !important; }
.DetailsView .control-label{ min-height: 0 !important; }
.DetailsView .table-uploadvx{ margin: 0; }
.w100{ width: 100% !important; }
.badge-fff{ border-color: #fff; color: #fff; }
.icon-bell{ position: relative; }
.notification-dot{ -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; width: 8px; height: 8px; position: absolute; top: -2px; right: -2px; background-color: red; }
.fwn{ font-family: RobotoR; }
.w80{ width: 80%; max-width: 100%; }
.w90{ width: 90%; max-width: 100%; }
.xtc{ position: relative; bottom: -5px; }
.xtc:hover{ color: red; }
.dsbaocao{ overflow-y: auto; background: url(/assets/custom/icon/loadingnew.gif) center no-repeat; min-height: 100px; background-size: 200px auto; }
.dsbaocao .table{ margin-bottom: 0; }
input.errorValue,
input.errorValue.parsley-success,
input.errorValue:focus,
input.errorValue.parsley-success:focus,
input.errorValue1,
input.errorValue1.parsley-success,
input.errorValue1:focus,
input.errorValue1.parsley-success:focus{ border-color: red !important; border: 1px solid red !important; background: #fff; }
.highcharts-credits{ display: none !important; }
.titleBieuHome{ text-transform: uppercase; display: block; font-family: RobotoB; font-size: 15px; background: var(--clr); color: #fff; line-height: 30px; text-align: center; font-size: 14px; }
.itemHome{ border: 1px solid var(--clr); box-sizing: border-box; border-radius: 10px 10px 0 0; overflow: hidden; }
.itemHome table{ border: none; }
.itemHome .bieudoHome{ padding: 10px; box-sizing: border-box; }
.nameHome:hover{ color: var(--clr); }
#BieuDoHome .nav-tabs-new2{ text-align: center; display: block; }
#BieuDoHome .nav-tabs-new2 > li{ float: none; display: inline-block; }
#BieuDoHome .nav-tabs-new2 > li > a{ padding: 5px 7px; font-size: 13px; border-radius: 5px 5px 0 0; margin-right: 0; }
#BieuDoHome .nav-tabs-new2 > li > a.active{ background: var(--clr); color: #fff; border: none; }
#BieuDoHome .tab-content{ padding: 0; margin-top: 15px; }
table th{ vertical-align: middle !important; }
#footer{ background: var(--clr); color: #fff; line-height: 22px; text-align: center; font-family: RobotoB; position: fixed; bottom: 0; width: 100%; left: 0; padding: 5px 0; z-index: 3; }
.contentHome{ margin-bottom: 15px; }
.nutchucnangbt{ position: sticky; bottom: 10px; display: flex; justify-content: space-between; align-items: flex-end; }
#flexBody{ padding-bottom: 35px; background: #f5f5f5; }
.icohistory:before{ content: url(/Assets/custom/icon/ico-history.png); background-size: 50%; height: 33px; width: 39px; border-color: #607d8b; }
.icohistory:hover{ background: url(/Assets/custom/icon/ico-historyhv.png) center no-repeat; background-size: 50%; background-color: #607d8b; }
.pagination > .active > a,
.pagination > .active > span{ color: #fff; }
/*#flexBody.homePage {padding-bottom: 0}*/
.tkSoLuong{ padding: 0; margin: 0; margin-bottom: 10px; position: absolute; top: 0px; }
.tkSoLuong li{ display: inline-block; margin-right: 20px; padding-bottom: 10px; border-bottom: 2px solid transparent; cursor: pointer; }
.tkSoLuong li.active,
.tkSoLuong li:hover{ border-bottom: 2px solid var(--clr); }
.tkSoLuong li .count{ font-size: 17px; font-family: RobotoB; }
#PrPDF{ position: relative; }
.table_head{ position: sticky; top: -9px; left: 0; background: #fff; margin: 0; margin-bottom: -2px; }
#TableBieu,
.table_head,.TableBieu{ /*table-layout: fixed;*/border-collapse: collapse; }
/*#TableBieu thead {display: none}*/
#overlay{ position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.7); z-index: 1000; display: none; }
.inputYear.active{ position: relative; z-index: 1001; color: #fff; }
.inputYear{ display: flex; height: 100%; }
.inputYear input{ padding: 0 10px; box-sizing: border-box; width: 150px; height: 30px; border-radius: 4px; border: 1px solid red; box-shadow: 0 0 10px #eee; outline: none; }
.inputYear input.form-control{ width: 100%; height: 34px; }
.inputYear{ position: relative; display: flex; align-items: center; }
.inputYear > span{ white-space: nowrap; margin-right: 4px; }
.inputYear .arrowDown{ position: absolute; top: calc(-100% - 25px); width: 40px; left: 50%; margin-left: -20px; -webkit-animation: bounce 2s infinite ease-in-out; animation: bounce 2s infinite ease-in-out; }
.inputYear .btnDiv{ position: absolute; top: calc(100% + 10px); left: 50%; transform: translateX(-50%); white-space: nowrap; }
@keyframes bounce{
    0%{ transform: translateY(-5px); }
    25%{ transform: translateY(3px); }
    50%{ transform: translateY(-5px); }
    75%{ transform: translateY(3px); }
    100%{ transform: translateY(-5px); }
}
#inputYear .arrowDown,
#inputYear .btnDiv{ display: none; }
.processBar{ padding: 0; margin: 0; list-style: none; margin-top: 7px; white-space: nowrap; }
.processBar li{ display: inline-block; font-size: 11px; position: relative; }
.processBar li .name{ padding: 2px 7px; background: #efefef; border-radius: 20px; cursor: pointer; }
tr:hover .processBar li .name{ background: #fff; }
.processBar li.active .name{ background: #21B632 !important; color: #fff; }
.processBar li .info{ position: absolute; background: #fff; box-shadow: 0 0 10px #dcdcdc; z-index: 2; padding: 10px; white-space: nowrap; font-size: 13px; line-height: 20px; bottom: 100%; display: none; border: 1px solid #21B632; }
.processBar li:hover .info{ display: block; }
/*Start Chat*/
#listFriend{ position: fixed; height: calc(100vh - 112px); width: 250px; right: -250px; top: 0; background: #fff; top: 70px; display: flex; flex-direction: column; border: 1px solid rgba(0, 0, 0, 0.125); transition: 0.5s all ease-in-out; z-index: 10; }
#listFriend.ac{ right: 0; }
#listFriend .lst{ flex: 1; overflow: hidden; display: flex; flex-direction: column; }
.conversation-list{ height: 250px; list-style: none; overflow: auto; padding: 0px; }
.conversation-list li{ margin-bottom: 10px; display: flex; align-items: flex-start; flex-wrap: wrap; }
.conversation-list li.odd{ flex-direction: row-reverse; }
.conversation-list .chat-Photo{ display: inline-block; float: left; text-align: center; width: 40px; }
.conversation-list .chat-Photo img{ border-radius: 100%; width: 100%; }
.conversation-list .chat-Photo i{ font-size: 12px; font-style: normal; }
.conversation-list .ctext-wrap i{ color: #1a2942; display: block; font-size: 12px; font-style: normal; font-family: "RobotoB"; position: relative; }
.conversation-list .conversation-text{ font-size: 13px; margin-left: 8px; width: 78%; display: flex; flex-direction: column; align-items: flex-start; }
.conversation-list .ctext-wrap{ -moz-border-radius: 3px; -webkit-border-radius: 3px; background: #F5F5F5; border-radius: 3px; display: inline-block; padding: 5px; position: relative; max-width: 100%; overflow-wrap: break-word; }
.conversation-list .ctext-wrap p{ margin: 0px; padding-top: 3px; }
.conversation-list .ctext-wrap:after{ border: solid transparent; border-color: rgba(213, 242, 239, 0); border-right-color: #F5F5F5; border-width: 5px; content: " "; height: 0; margin-top: -5px; pointer-events: none; position: absolute; right: 100%; top: 20%; width: 0; }
.conversation-list .odd .chat-Photo{ float: right !important; }
.conversation-list .odd .conversation-text{ margin-left: 0; margin-right: 8px; text-align: right; width: 78% !important; align-items: flex-end; }
.conversation-list .odd .ctext-wrap{ background: #e8e9ec !important; text-align: left; }
.conversation-list .odd .ctext-wrap i{ color: #acacac; }
.conversation-list .odd .ctext-wrap:after{ border-color: rgba(238, 238, 242, 0) !important; border-left-color: #e8e9ec !important; left: 100% !important; top: 20% !important; }
.conversation-list .username{ font-family: "RobotoB"; font-size: 8px; color: #fff !important; padding: 3px 5px; background: var(--clr); display: inline-block; border-radius: 5px; margin-bottom: -3px; position: relative; z-index: 2; }
.conversation-list .odd .username{ text-align: right; }
.chat-send{ padding-left: 0px; padding-right: 30px; }
.chat-send button{ width: 100%; }
.chat-inputbar{ padding: 0 15px; }
.contacts-list .list-group-item{ border: none; }
.contacts-list .list-group-item:hover{ background: #f5f5f5; }
.contacts-list .Photo{ display: inline-block; float: left; margin-right: 5px; width: 30px; }
.contacts-list .Photo img{ border-radius: 50%; width: 100%; }
.contacts-list .list-group-item span.name{ color: #707780; display: inline-block; float: left; overflow: hidden; padding: 0 5px; text-overflow: ellipsis; white-space: nowrap; flex: 1; }
.contacts-list i.online{ color: #a0d269; }
.contacts-list i{ color: #ddd; float: right; font-size: 9px; line-height: 35px; }
.contact-list i.offline{ color: #dadada; }
.contact-list i.away{ color: #ffd740; }
#listchat{ bottom: 0; position: absolute; right: 100%; z-index: 99999999; }
#listchat .chatonline.new .panel-heading{ -webkit-animation: changebackground 2s infinite; animation: changebackground 2s infinite; }
#listchat .chatonline.new *{ color: #333; }
#listchat .panel{ margin-bottom: 0; }
.conversation-list .chat-avatar{ display: inline-block; text-align: center; width: 40px; height: 40px; margin-top: 10px; border-radius: 50%; border: 1px solid #dcdcdc; position: relative; overflow: hidden; }
#listchat .chatonline{ bottom: 0; display: inline-block; margin-right: 10px; position: absolute; vertical-align: bottom; width: 270px; background: #fff; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); border-radius: 10px 10px 0 0; }
#listchat .chatonline.inputing .conversation-list ~ .clearfix{ position: relative; }
#listchat .chatonline.inputing .conversation-list ~ .clearfix:before{ content: ""; height: 40px; background: url(../icon/typing.gif) no-repeat; width: 100%; background-size: auto 100%; display: block; margin-top: -20px; margin-bottom: 10px; position: absolute; left: 0; bottom: 0; pointer-events: none; }
#listchat .chatonline:nth-child(1){ right: 0; }
#listchat .chatonline:nth-child(2){ right: 280px; }
#listchat .chatonline:nth-child(3){ right: 560px; }
#listchat .chatonline:nth-child(4){ right: 840px; }
#listchat .chatonline:nth-child(5){ right: 1120px; }
#listchat .chatonline:nth-child(6){ right: 1400px; }
#listchat .chatonline:nth-child(7){ right: 1680px; }
#listchat .chatonline:nth-child(8){ right: 1960px; }
#listchat .chatonline:nth-child(9){ right: 2240px; }
#listchat .panel-heading{ cursor: pointer; padding: 8px 10px; position: relative; display: flex; justify-content: space-between; align-content: center; background: #dcdcdc; border-radius: 10px 10px 0 0; }
#listchat .panel-heading .panel-title{ flex: 1; display: flex; justify-content: space-between; align-content: center; padding-right: 50px; }
#listchat .panel-heading.hiden.active{ -webkit-animation: changebackground 2s infinite; animation: changebackground 2s infinite; }
#listchat .panel-heading .titleText{ animation: marquee 5s linear infinite; white-space: nowrap; overflow: hidden; flex: 1; margin-right: 5px; font-family: RobotoB; }
#listchat .closechat{ font-size: 15px; position: absolute; right: 10px; top: 5px; }
#listchat .hidechat{ font-size: 15px; position: absolute; right: 30px; top: 6px; }
#listchat .time{ color: #90949c; font-size: 9px; font-weight: normal; margin-top: 5px; }
#listchat ::-webkit-scrollbar{ height: 8px; width: 8px; }
#listchat ::-webkit-scrollbar-track{ -webkit-box-shadow: inset 0 0 4px rgba(0, 0, 0, 0.3); background: #fff; }
#listchat ::-webkit-scrollbar-thumb{ -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5); background: #dadada; }
#listchat ::-webkit-scrollbar-thumb:window-inactive{ -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5); background: rgba(53, 152, 220, 0.5); }
#listchat .discussion:before{ background: url(../icon/loadmessage.gif) center no-repeat; background-size: auto 20px; content: ""; display: block; height: 20px; margin-bottom: 10px; width: 100%; }
#listacount .group{ padding-bottom: 10px; margin-bottom: 10px; border-bottom: 1px solid #ccc; padding: 10px 0; display: flex; flex-direction: column; }
#listacount .group:last-child{ padding-bottom: 0; margin-bottom: 0; border-bottom: none; }
#listacount .title{ display: table; padding: 0 10px; background: var(--clr); color: #fff; line-height: 25px; margin: auto; border-radius: 5px; margin-bottom: 10px; }
#listchat .discussion.lastMes:before{ display: none; }
.chatonline .ctext-wrap p{ margin: 0 !important; }
.chatonline .ctext-wrap .completed{ margin-top: 0; }
.chatonline .ctext-wrap img{ margin-bottom: 2px; max-width: 100%; }
.chatonline .countchat{ background: var(--clr); color: #fff !important; display: inline-block; display: none; margin-left: 7px; padding: 0 10px; }
.contacts-list .list-group-item,
.list-group-item{ padding: 7px 10px; }
.list-group-item > a{ display: flex; align-items: center; }
.contacts-list .avatar{ border-radius: 50%; box-shadow: 0 0 5px rgba(0, 0, 0, 0.2); float: left; width: 35px; margin-right: 5px; position: relative; height: 35px; }
.contacts-list .avatar .countchat{ background: var(--clr); border-radius: 50%; bottom: -6px; color: #fff; display: inline-block; font-size: 11px; height: 20px; line-height: 20px; position: absolute; right: -5px; text-align: center; width: 20px; }
.contacts-list .avatar .thumb-md,
.chatonline .chat-avatar img{ border-radius: 50%; object-fit: cover; width: 100%; height: 100%; }
.chatonline .emojionearea .emojionearea-editor{ max-height: 50px; min-height: 50px; }
.chucnangchat ul{ list-style: none; margin: 0; padding: 3px 20px; }
.chucnangchat ul li{ display: inline-block; font-size: 20px; margin-right: 7px; }
.chucnangchat ul li label{ cursor: pointer; margin-bottom: 0; }
#listchat .listchathide{ background: #dadada; bottom: 0; cursor: pointer; display: inline-block; display: none; height: 30px; margin-right: 5px; position: absolute; vertical-align: bottom; width: 30px; }
#listchat .listchathide .fa{ display: block; line-height: 30px; text-align: center; }
#listchat .listchathide:hover ul{ display: block; }
#listchat .listchathide ul{ bottom: 100%; display: none; list-style: none; margin: 0; padding: 0; position: absolute; right: 0; }
#listchat .listchathide ul li{ background: #dadada; box-sizing: border-box; line-height: 30px; position: static !important; width: 170px; margin: 0; }
#listchat .listchathide ul li div{ display: table; width: 100%; }
#listchat .listchathide ul li div:hover{ background: #fff; }
#listchat .listchathide ul li div a{ color: #000; overflow: hidden; }
#listchat .listchathide ul li div a:last-child{ display: inline-block; float: right; height: 30px; width: 30px; }
#listchat .listchathide ul li div a:first-child{ display: inline-block; float: left; height: 30px; padding: 0 10px; width: calc(100% - 30px); }
.chatonline{ border: 1px solid transparent; }
.chatonline.active{ border: 1px solid var(--clr); }
.chatonline.active .panel-heading{ background: var(--clr) !important; color: #fff; }
.chatonline.active .panel-heading .closechat,
.chatonline.active .panel-heading .hidechat{ color: #fff; }
.searchacount{ height: 30px; width: calc(100% - 20px); padding: 10px 0; box-sizing: content-box; margin-left: 10px; display: flex; justify-content: space-between; }
.searchacount input{ box-sizing: border-box; float: left; height: 30px; padding: 0 10px; width: 100%; margin-right: 5px; }
.searchacount #addGroup{ flex: 1; }
.slideThree{ -webkit-box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.5), 0px 1px 0px rgba(255, 255, 255, 0.2); background: var(--clr); border-radius: 50px; box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.5), 0px 1px 0px rgba(255, 255, 255, 0.2); display: inline-block; height: 26px; margin: auto; position: relative; }
.slideThree:after{ color: #fff; content: "Trực tuyến"; display: inline-block; font-size: 12px; font-family: "RobotoB"; text-align: center; text-shadow: 1px 1px 0px rgba(255, 255, 255, 0.15); width: 70px; z-index: 0; }
.slideThree:before{ color: #fff; content: "Tất cả"; display: inline-block; font-size: 12px; font-family: "RobotoB"; text-align: center; width: 70px; z-index: 0; }
.slideThree label{ -webkit-box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.3); -webkit-transition: all 0.4s ease; background: #fcfff4; background: -webkit-gradient(linear, left top, left bottom, from(#fcfff4), color-stop(40%, #dfe5d7), to(#b3bead)); background: linear-gradient(to bottom, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%); border-radius: 50px; box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.3); cursor: pointer; display: block; height: 20px; left: 3px; position: absolute; top: 3px; transition: all 0.4s ease; width: 70px; z-index: 1; }
.slideThree input[type="checkbox"]{ height: 100%; opacity: 0; position: absolute; visibility: hidden; width: 100%; }
.slideThree input[type="checkbox"]:checked + label{ left: 70px; }
.list-group-item:hover .list-btn{ display: flex; }
.list-btn{ display: none; margin-top: 5px; justify-content: space-between; }
.btn-chat{ -moz-transition: 0.3s all ease-in-out; background: rgba(255, 0, 0, 0.8); border-radius: 5px; color: #fff; display: block; padding: 3px 0; text-align: center; transition: 0.3s all ease-in-out; flex: 1; margin: 0 1px; font-size: 11px; }
.btn-chat:hover{ background: var(--clr); color: #fff; }
.btn-chat .fa{ color: inherit; float: none; font-size: inherit; line-height: inherit; }
.infoacount img{ float: left; max-width: 30%; padding-bottom: 10px; padding-right: 10px; }
.infoacount .item{ line-height: 22px; margin-bottom: 2px; }
.infoacount .item span:first-child{ display: inline-block; font-family: "RobotoB"; width: 100px; }
#listchat .panel-body{ padding: 10px 10px 0 10px; }
.conversation-list li.seen:after{ content: "Đã xem"; font-size: 11px; font-style: italic; color: #999; margin-top: 3px; padding-left: 45px; width: 100%; }
.conversation-list li.seen.odd:after{ text-align: right; padding-right: 50px; padding-left: 0; }
.conversation-list li.mid{ font-size: 12px; text-align: center; display: block; color: #666 !important; font-style: italic; }
.chatonline .ctext-wrap .emojioneemoji{ width: 18px; }
@keyframes changebackground{
    0%{ background: #fafafa; }
    50%{ background: #dadada; }
    75%{ background: #fafafa; }
    100%{ background: #dadada; }
}
@-webkit-keyframes changebackground{
    0%{ background: #fafafa; }
    50%{ background: #dadada; }
    75%{ background: #fafafa; }
    100%{ background: #dadada; }
}
@-moz-keyframes changebackground{
    0%{ background: #fafafa; }
    50%{ background: #dadada; }
    75%{ background: #fafafa; }
    100%{ background: #dadada; }
}
@keyframes marquee{
    0%{ left: 0; }
    100%{ left: -100%; }
}
#lstThanhVien{ padding: 0; margin: 0; list-style: none; display: flex; flex-wrap: wrap; }
#lstThanhVien li{ width: calc((100% - 30px) / 3); margin-right: 15px; display: flex; margin-bottom: 15px; padding: 5px 10px; background: #dcdcdc; align-items: center; transition: 0.3s all ease-in-out; cursor: pointer; }
#lstThanhVien li:nth-child(3n){ margin-right: 0; }
#lstThanhVien li .wImage{ width: 30px; height: 30px; border-radius: 50%; overflow: hidden; margin-right: 10px; }
#lstThanhVien li a,
#lstThanhVien li span{ transition: none; }
#lstThanhVien li .name{ flex: 1; line-height: 21px; }
#lstThanhVien li:hover{ background: red; }
#lstThanhVien li:hover *{ color: #fff; }
#lstThanhVien li .deleteTV{ margin: 0 5px; font-size: 15px; }
/*End Chat*/
/*FAQ*/
#container{ display: flex; justify-content: space-between; padding: 20px 0; }
#container .colleft{ width: 73%; }
#container .titleModule{ text-transform: uppercase; font-family: RobotoB; text-align: center; margin-bottom: 10px; font-size: 18px; }
#container .groupModule{ padding: 20px; border: 1px solid #ccc; border-radius: 4px; background: #fff; }
.cauhoiList{ margin: 0; padding: 0; list-style: none; }
.cauhoiList .hoten{ color: #999; }
.modal-footer{ position: sticky; bottom: 0; }
.modal-footer > *{ margin: 0 1px !important; }
#lstQA .group .item{ display: flex; padding-bottom: 10px; margin-bottom: 10px; border-bottom: 1px solid #888; }
#lstQA .group .item .wImage{ width: 50px; border-radius: 50%; overflow: hidden; height: 50px; }
#lstQA .group .item .info{ flex: 1; }
#lstQA .group .item .info .name{ color: #666; font-size: 13px; font-style: italic; line-height: 20px; }
#lstQA .group .item .info .titleQA{ font-family: RobotoB; font-size: 16px; line-height: 23px; margin: 5px 0; display: block; }
#lstQA .group .item .info .ques{ margin-bottom: 10px; }
#lstQA .group .item .info .ans,
#lstQA .group .item .info .ques{ line-height: 19px; text-align: justify; }
#lstQA .icon,
#lstQA .icon img{ display: inline-block; max-height: 20px; vertical-align: top; margin-left: 1px; }
#lstQA .group .item .info .ans{ box-sizing: border-box; background: #dff0d8; padding: 10px; }
#lstQA .read_more{ color: red; font-size: 12px; font-style: italic; }
#container .colright{ width: 27%; margin-left: 20px; }
#container .colright #basicForm{ position: sticky; top: 10px; }
#container .colright #nutGui{ margin: auto; display: table; }
/*End FAQ*/
.table-uploadvx .name{ word-break: break-all; }
.select2-container-multi .select2-choices .select2-search-choice > div,
.select2-results .select2-result-label{ display: flex; align-items: center; }
.select2-container-multi .select2-choices .select2-search-choice .wImage,
.select2-results .select2-result-label .wImage{ width: 30px; height: 30px; margin-right: 5px; border-radius: 50%; overflow: hidden; }
#searchForm.thongke{ position: fixed; left: 0; width: 500px; z-index: 100; background: #fff; box-shadow: 0 0 10px #dcdcdc; padding: 10px; padding-top: 30px; transition: 1s all ease-in, 1s 0.1s all ease-out; top: 70px; overflow-y: auto; }
#searchForm.thongke .item{ margin-bottom: 7px; display: flex; }
#searchForm.thongke .item > *{ margin: 0 5px; }
#searchForm.thongke .item > p:first-child{ white-space: nowrap; line-height: 34px; flex: 1; }
#searchForm.thongke .item > p:first-child a{ display: block; color: var(--clr); margin-top: -12px; font-size: 13px; font-family: RobotoB; font-style: italic; }
#searchForm.thongke .item > p:first-child a:before{ content: "Chọn tất cả"; display: inline-block; margin-right: 5px; }
#searchForm.thongke .item > p:first-child a.active:before{ content: "Hủy tất cả"; }
#searchForm.thongke .item > p:first-child a i{ font-size: 12px; }
#searchForm.thongke .item > p:first-child ~ *{ width: 330px; }
#searchForm.thongke .listConfig{ height: 200px; overflow: auto; border: 1px solid #dcdcdc; border-radius: 4px; }
#searchForm.thongke .listConfig ul{ padding: 0; margin: 0; list-style: none; }
#searchForm.thongke .listConfig ul li{ padding: 4px 10px; cursor: pointer; border-bottom: 1px solid #dcdcdc; }
#searchForm.thongke .listConfig ul li.active{ background: var(--clr) !important; color: #fff; }
#searchForm.thongke .listConfig ul li:hover{ background: #dcdcdc; }
.openSearch{ line-height: 30px; background: var(--clr); display: inline-block; color: #fff; position: fixed; left: -30px; text-align: center; top: 150px; border-radius: 0 4px 4px 0; transition: 0.1s all ease-out, 0.1s 0.6s all ease-in; writing-mode: vertical-rl; text-orientation: sideways; padding: 10px 0; }
.openSearch i{ margin-left: 3px; }
#searchForm.thongke .close{ position: absolute; right: 10px; top: 8px; font-size: 17px; }
#searchForm.thongke.active{ left: -100%; }
#searchForm.thongke.active .openSearch{ display: block; left: 0; }
a span{ transition: none; }
#lstStatus{ display: flex; flex-wrap: wrap; padding: 20px; background: #fff; border-radius: 6px; margin-bottom: 20px; }
#lstStatus a{ width: calc((100% - 100px) / 6); margin-right: 20px; background: #fbe9d5; border: 1px solid #f5c28b; border-radius: 6px; padding: 10px 0; color: #c96412; display: flex; justify-content: center; align-items: center; }
#lstStatus a:hover,
#lstStatus a.active{ color: #fff; background: #e79b5d; }
#lstStatus a:nth-child(6n){ margin-right: 0; }
#lstStatus a span:first-child{ font-family: UTMHelvetIns; font-size: 30px; line-height: 25px; }
#lstStatus a span:last-child{ text-transform: uppercase; font-family: Arial; margin-left: 12px; font-weight: bold; margin-top: 4px; font-size: 13px; }
#lstCheckStatus{ display: flex; flex-wrap: wrap; padding: 20px; background: #fff; border-radius: 6px; margin-bottom: 20px; }
#lstCheckStatus a{ width: calc((100% - 100px) / 6); margin-right: 20px; background: #fbe9d5; border: 1px solid #f5c28b; border-radius: 6px; padding: 10px 0; color: #c96412; display: flex; justify-content: center; align-items: center; }
#lstCheckStatus a:hover,
#lstCheckStatus a.active{ color: #fff; background: #e79b5d; }
#lstCheckStatus a:nth-child(6n){ margin-right: 0; }
#lstCheckStatus a span:first-child{ font-family: UTMHelvetIns; font-size: 30px; line-height: 25px; }
#lstCheckStatus a span:last-child{ text-transform: uppercase; font-family: Arial; margin-left: 12px; font-weight: bold; margin-top: 4px; font-size: 13px; }
.badge{ border-radius: 20px; padding: 4px 13px; text-transform: none; font-size: 80%; }
table .btn{ line-height: 25px; padding: 0 10px; border-radius: 20px; font-size: 12px; margin: 2px 2px 2px 0; }
table{ background: #fff !important; }
#UserScreen{ display: flex; justify-content: space-between; width: 100%; padding: 0 15px; }
#UserScreen .colleft{ width: 54%; }
#UserScreen .colright{ width: 45%; }
#UserScreen .parent{ margin-bottom: 33px; }
#UserScreen .parent .group{ background: #fff; padding: 5px; border-radius: 6px; position: relative; z-index: 2; }
#UserScreen .parent:last-child{ margin-bottom: 0; }
#UserScreen .parent .title{ display: flex; width: 100%; margin-bottom: -5px; justify-content: space-between; align-items: baseline; margin-right: 1px; }
#UserScreen .parent .title #inputYear{ position: relative; top: -4px; }
#UserScreen .parent .title span.text{ background: #e79b5d; color: #fff; display: inline-block; font-family: SwissCB; font-size: 16px; border-radius: 6px; padding: 8px 30px 10px 30px; }
#UserScreen .parent .dsbaocao{ max-height: 400px; }
#UserScreen .parent .nav-tabs{ display: flex; }
#UserScreen .parent .nav-tabs li{ width: auto; margin-right: 2px; }
#UserScreen .parent .nav-tabs li span{ padding: 5px 15px 8px 15px !important; }
#UserScreen .parent .nav-tabs a span{ background: #a9a4a4 !important; }
#UserScreen .parent .nav-tabs a.active span{ background: #e79b5d !important; }
#UserScreen .parent .btnViewAll{ float: right; margin-top: 10px; }
#UserScreen .parent .btnViewAll:hover{ color: #e79b5d; }
#UserScreen #notifications{ overflow-y: auto; min-width: 0; padding: 0; margin: 0; max-height: 600px; }
#UserScreen #notifications.active{ right: 0; }
#UserScreen #notifications li{ padding: 15px 20px; }
#UserScreen #notifications li .timestamp{ font-size: 12px; color: #666666; margin-top: 5px; }
#UserScreen #notifications li:nth-child(odd){ background: #f5e6cd; }
#UserScreen #notifications li .text{ white-space: normal; }
#UserScreen #notifications .media{ margin-bottom: 0; padding: 5px 0; box-sizing: border-box; display: flex; }
#UserScreen #notifications .media .media-left img{ width: 37px; height: 37px; display: block; }
#UserScreen #notifications .media .media-body{ color: #333; text-transform: none; font-weight: normal; font-family: RobotoR; line-height: 20px; padding-left: 15px; }
#UserScreen #notifications .footer{ position: sticky; bottom: 0; left: 0; background: #fff; }
#UserScreen #notifications .footer a{ text-align: center; color: #333; font-family: RobotoB; display: block; }
#UserScreen #notifications li:hover{ background: var(--clr) !important; }
#UserScreen #notifications li:hover .media-body,
#UserScreen #notifications li.footer:hover a,
#UserScreen #notifications li:hover span.timestamp{ color: #fff; }
#UserScreen #notifications li span,
#notifications a{ transition: none; -moz-transition: none; }
#thongkeHome{ position: relative; height: 400px; }
#thongkeHome #searchForm.thongke{ position: absolute; max-height: 400px; overflow-y: auto; top: 0; }
#thongkeHome #searchForm.thongke .btn.btn-primary.fr{ position: sticky; bottom: 0; }
#thongkeHome #searchForm.thongke .openSearch{ display: none; }
#thongkeHome .openSearch{ position: absolute; transform: none; top: -30px; left: 200px; writing-mode: inherit; text-orientation: inherit; padding: 0 10px; }
#thongkeHome .card{ position: static; }
/*#thongkeHome #searchForm.thongke .open { position: absolute; }*/
@media (min-width: 1367px){
    #baocaochitiet.nhap{ width: calc(100vw - 385px); }
    #notifications.nhap{ right: 0; }
    #UserScreen .parent .title{ font-size: 18px; }
    #menuMain{ padding-left: 80px; }
}
#loginForm{ background: url(../icon/bgLogin.jpg) center no-repeat; background-size: cover; position: fixed; width: 100vw; height: 100vh; overflow: auto; display: flex; align-items: center; justify-content: center; }
#loginForm .wrap{ width: 1000px; margin: auto; display: flex; justify-content: space-between; max-width: 100%; align-items: flex-start; }
#loginForm .wrap .left{ width: 450px; color: #fff; }
#loginForm .wrap .left .logo img{ display: block; margin: auto; max-height: 125px; }
#loginForm .wrap .left .logo span{ font-family: UTMHelvetIns; text-align: center; font-size: 30px; display: block; }
#loginForm .wrap .left .info ul{ padding: 0; margin: 0; list-style: none; font-size: 16px; line-height: 25px; }
#loginForm .wrap .left .info ul li{ margin-bottom: 5px; font-family: SwissC; }
#loginForm .wrap .left .info ul li i{ width: 15px; display: inline-block; text-align: center; margin-right: 3px; }
#loginForm .wrap .right{ flex: 1; margin-left: 20px; border: 1px dashed #f5c28b; border-radius: 10px; padding: 7px; }
#loginForm .wrap .right #basic-form{ background: #f5dac4; padding: 30px 40px; border-radius: 10px; }
#loginForm .wrap .right .form-group{ margin-bottom: 13px; }
#loginForm .wrap .right .btn-primary{ background: #fbe9d5; border: 2px solid #f5c28b; color: #c96412; font-family: SwissCB; font-size: 14px; text-transform: uppercase; }
#loginForm .wrap .right .btn-primary:hover{ background: #c96412; color: #fff; }
#loginForm .wrap .right .title{ color: #c96412; text-align: center; text-transform: uppercase; font-family: UTMHelvetIns; font-size: 22px; position: relative; padding-bottom: 10px; margin-bottom: 10px; }
#loginForm .wrap .right .title:after{ content: ""; height: 3px; width: 80px; display: block; background: #c96412; position: absolute; left: 50%; bottom: 0; transform: translateX(-50%) translateY(-50%); }
#menuLeft{ position: fixed; top: 70px; left: -100%; z-index: 99; background: #f9eee2; overflow-y: auto; width: 300px; padding: 10px 15px 10px 15px; display: block; transition: 1s all ease-in, 1s 0.1s all ease-out; display: flex; flex-direction: column}
#menuLeft .open{ line-height: 30px; background: var(--clr); display: inline-block; color: #fff; position: fixed; left: 0; text-align: center; top: 250px; border-radius: 4px; transition: 0.1s all ease-out, 0.1s 0.6s all ease-in; writing-mode: vertical-rl; text-orientation: sideways; padding: 10px 0; white-space: nowrap}
#menuLeft .close{ position: sticky; right: 0px; top: 5px; font-size: 17px; text-align: right; }
#leftMenuUnit{ margin-top: 10px; flex: 1; margin-bottom: 10px; }
#leftMenuUnit .tree-title{ font-size: 14px; }
#leftMenuUnit .hide{ display: none; }
#leftMenuUnit .tree-node-hover,
.tree-node-selected{ background: #c96412; color: #fff; }
#leftMenuUnit span{ transition: none; }
#menuLeft.active{ left: 0; }
#menuLeft.active .open{ left: -30px; }
.lstSign{ margin-bottom: 7px; background: #fff; }
.lstSign:hover{ background: #fff; }
.lstSign .title{ text-align: center; margin-bottom: 10px; text-transform: uppercase; font-family: RobotoB; }
.lstSign .btnItem{ display: inline-block; text-align: center; font-size: 13px; font-family: RobotoB; position: relative; line-height: 17px; margin-top: 30px; padding: 0 20px; margin-right: -4px; }
.lstSign .btnItem i{ position: absolute; top: -32px; left: 50%; transform: translateX(-50%); font-size: 15px; width: 30px; height: 30px; border-radius: 50%; background: #666; color: #fff; line-height: 30px; text-align: center; z-index: 3; }
.lstSign .btnItem i:before{ margin-right: -2px; }
.lstSign .btnItem:before,
.lstSign .btnItem:after{ content: ""; width: 50%; height: 3px; display: block; position: absolute; top: -20px; background: #dadada; left: 0; z-index: 1; }
.lstSign .btnItem:after{ left: inherit; right: 0; }
.lstSign .btnItem:first-child:before,
.lstSign .btnItem:last-child:after{ display: none; }
.lstSign .btnItem.active{ color: #21B632; }
.lstSign .btnItem.active i{ background: #21B632; }
.lstSign .btnItem.active:after{ background: #21B632; }
.lstSign .btnItem.active + .btnItem:before{ background: #21B632; }
#body-sign-view .BieuDB.table_print tr th[rowspan]:last-child,
#body-sign-view .BieuDB tr td:last-child{ display: none; }
#body-sign-view .BieuDB.TableBieu0104 tr th:last-child,
#body-sign-view .BieuDB.TableBieu0104 tr td:last-child{ display: table-cell; }
#body-sign-view .form-control{ border: none; background: none; }
.searchUnit{ position: sticky; bottom: 0; }
#myimg{ height: 35px; float: left; margin-left: -20px; }
#imgChange{ width: 20px; height: 20px; float: right; position: relative; top: 8px; right: 5px; }
.validation-summary-errors ul{ margin-bottom: 0px; list-style: none; padding: 5px 10px; text-align: center; font-weight: bold; }
#PrPDF.bieubosung table{ table-layout: auto !important; }
#PrPDF.bieubosung th,
#PrPDF.bieubosung td{ min-width: 130px; }
.dropdown-xuatin{ left: auto; right: 0; }
.dropdown-xuatin a:hover{ color: #28a745; }
.openList{ display: none; }
.activefile{ color: #dc3545 !important; }
.activefile i{ background: #dc3545 !important; }
.bgdc3545 .name{ background: #dc3545 !important; color: #fff; }
.btn_39ceb2{ background: #39ceb2; border-color: #39ceb2; color: #fff; }
.btn_b443bb{ background: #b443bb; border-color: #b443bb; color: #fff; }
.btn_d43e83{ background: #d43e83; border-color: #d43e83; color: #fff; }
.btn_6200ff{ background: #6200ff; border-color: #6200ff; color: #fff; }
.btn_3096a7{ background: #3096a7; border-color: #3096a7; color: #fff; }
.btn_39ceb2:hover,
.btn_b443bb:hover,
.btn_d43e83:hover,
.btn_6200ff:hover,
.btn_3096a7:hover{ color: #fff; -webkit-filter: brightness(110%); -filter: brightness(110%); }
.nutchucnangbt .lstBtn{ display: flex; }
.nutchucnangbt .lstBtn > *{ margin: 0 1px; }
.dropdown-menu{ padding: 0; top: inherit; bottom: 100%; }
.dropdown-item{ font-size: 14px; padding: 5px 10px; }
tr.canhbao{ background: rgba(228, 56, 56, 0.18); }
tr.canhbao td{ border-color: #fefefe; }
#history b{ font-weight: normal; font-family: RobotoB; }
.lstPage{ display: flex; }
.pagination-container{ text-align: right; float: right; }
.toiTrang{ width: 130px; float: right; display: flex; margin-right: 10px; line-height: 32px; }
.toiTrang span.text{ margin-right: 10px; color: #337ab7; white-space: nowrap; }
.toiTrang .select2-chosen{ text-align: left; }
.toiTrang.socoso{ width: 180px; }
#PrPDF.bieu03 th:first-child,
#PrPDF.bieu03 td:first-child{ min-width: 0; width: 50px; text-align: center; }
.pt10{ padding-top: 10px; }
.bieu03 #TableBieu thead, .bieu03 .TableBieu thead{ display: contents; }
#UserChat,
#GroupChat{ overflow-y: hidden; height: 100%; }
#UserChat.loading ul.list-group:after,
#GroupChat.loading ul.list-group:after{ content: " "; display: table; background: url(../icon/loadmessage.gif) center no-repeat; height: 20px; background-size: contain; width: 100%; }
#listacount .tab-pane,
#listacount.tab-content{ padding: 0; margin: 0; border: 0; }
#listacount{ flex: 1; overflow-y: hidden; }
#listacount .list-group{ flex: 1; overflow-y: auto; height: 100%; }
#listFriend .nav.nav-tabs{ display: flex; justify-content: center; padding: 10px 0; }
#listFriend .nav.nav-tabs li{ margin: 0 5px; text-transform: uppercase; font-size: 12px; }
#listFriend .nav.nav-tabs li a.active{ background: var(--clr); color: #fff; padding: 3px 10px; border-radius: 3px; }
#listFriend .tab-pane:not(.active){ display: none; }
.tac{ text-align: center; }
#ChooseType{ position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background: rgba(0, 0, 0, 0.7); display: none; z-index: 100; }
#ChooseType .wrap{ position: fixed; background: #fff; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); padding: 20px; border-radius: 5px; box-shadow: 0 2px 5px rgba(255, 255, 255, 0.7); display: flex; flex-direction: column; }
#ChooseType .wrap .item{ width: 300px; line-height: 30px; border: 1px solid var(--clr); margin-bottom: 10px; text-align: center; border-radius: 3px; cursor: pointer; }
#ChooseType .wrap .item:hover{ background: var(--clr); color: #fff; }
#ChooseType .tac{ text-transform: uppercase; margin-bottom: 10px; }
.closeType{ font-size: 12px; position: absolute; top: 5px; right: 10px; cursor: pointer; }
#ChooseType .pb10{ padding-bottom: 0; }
.fa,
.fas,
.far,
.fal,
.fad,
.fab{ font-family: RobotoR !important; font-weight: normal; font-size: 14px; font-weight: normal !important; }
.fa:before,
.fas:before,
.far:before,
.fal:before,
.fad:before,
.fab:before{ font-family: FontAwesome !important; }
.fal:before,
.fad:before{ font-weight: 300; }
.far:before{ font-weight: 400; }
.fa:before,
.fas:before{ font-weight: 900; }
.popover-header{ width: 100%; }
.inputYear *{ font-size: 15px; }
table .rotate{ vertical-align: bottom !important; }
#PrPDF table th span{ /*writing-mode: vertical-rl;*/ font-size: 13px; max-height: 100%; text-align: center; max-height: 150px; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical;  display: -moz-box; -moz-box-orient: vertical;  overflow: hidden}
#PrPDF table th:not(.rotate) .th-inner span  {text-align: center}
#PrPDF{ width: 100%; margin-bottom: 20px; overflow: auto; background: url(/assets/custom/icon/loadingnew.gif) center no-repeat; background-size: 200px auto}
#PrPDF .table{ max-width: none; margin-bottom: 0; table-layout: fixed; width: unset;}
#PrPDF .table th {vertical-align: middle!important}
#PrPDF .table th,
#PrPDF .table td{ padding: 0.35rem; min-width: 80px; }
#PrPDF .table .nameRow{ min-width: 250px; text-align: left; width: 250px; }
#PrPDF .table input.form-control{ padding: 0.25rem; }
.datesign{ border: none; border-bottom: 1px dashed #ccc; resize: none; height: 23px; text-align: center; margin: 0 10px; width: 30px; outline: none; } 
#namsign{ width: 42px; }
#TableBieu, .TableBieu {opacity: 0}
#diadanhsign{ min-width: 100px; }
/*.fixed-table-body {border-top: 1px solid #ddd}*/
.fixed-table-body-columns .IsLabel {min-height: 30px}
.fixed-table-body-columns .IsLabel > td { position: relative; }
.fixed-table-body-columns .IsLabel span {width: 100%; overflow: hidden; white-space: nowrap;}
/*.fixed-table-body-columns { border-top: 1px solid #ddd}*/
.fixed-table-body-columns table {width: 100%!important}

.modal .card {box-shadow: none}
.fixed-table-container {border: none}

.fancy-checkbox label { display: inline-flex; align-items: center}
.fancy-checkbox label input[type="radio"] {margin-right: 5px}

#TimebyType ul { padding: 0; margin: 0; list-style: none; display: flex; margin-bottom: 20px}
#TimebyType ul li { flex: 1; margin: 0 5px; }
#TimebyType ul li a { display: block; text-align: center; font-size: 14px; padding: 7px 10px; background: #fff; border-radius: 4px;     border: 1px solid #f5c28b;color: #c96412; background: #fbe9d5} 
#TimebyType ul li a:hover,#TimebyType ul li.active a {color: #fff;background: #e79b5d;}
.select2-container-multi .select2-choices .select2-search-field input {height: 25px!important}
.select2-results .select2-result-label { display: block !important; }
.select2-results .select2-result-label span {transition: none} 
.select2-container.select2-allowclear .select2-choice .select2-chosen {display: block;/* overflow: visible; *//* white-space: normal; */}
.select2-container .select2-choice {line-height: 23px!important; height: auto!important} 
.fixed-table-body { position: relative; z-index: 9}

#mathCondition { display: flex; justify-content: space-between}
#mathCondition .left {flex: 1}
#mathCondition .right { display: flex; list-style: none; width: 130px; flex-wrap: wrap; padding: 0; margin: 0}
#mathCondition .right li { width: calc(50% - 6px); margin: 0 3px; margin-bottom: 10px;}
#mathCondition .right li:last-child { width: 100%; margin-bottom: 0;}
#mathCondition .right .btnMath { height: 40px; display: block; border-radius: 3px; border-color: #ccc; font-size: 17px; width: 100%;}


#congthuc .content { display: flex; margin-top: 10px; align-items: center}
#congthuc .content .item { margin: 0 7px; font-size: 30px;}
#congthuc .content .item.itemBieu { font-size: 14px; border: 1px solid #ccc; background: #f2f2f2; width: 250px; border-radius: 5px; overflow: hidden}
#congthuc .content .item.itemBieu .nameBC { padding: 3px 10px; border-bottom: 1px solid #ccc; text-align: center}
#congthuc .content .item.itemBieu .bot { display: flex;}
#congthuc .content .item.itemBieu .bot >*{ flex: auto; text-align: center; display: flex; align-items: center; padding: 5px 10px; border-right: 1px solid #ccc;} 
#congthuc .content .item.itemBieu .bot >*:last-child {border-right: none}
#basicForm .hide{display:none !important;}
.viewBieu .leftDetail input:not([type=checkbox]){pointer-events: none;}
.viewBieu .fileupload-buttonbar{display:none;}

#notifications { display: flex; flex-direction: column;}
#notifications .lstNofi { flex: 1; overflow-y: auto}
#notifications .lstNofi ul { padding: 0; margin: 0; list-style: none}
#notifications .headerNoti { border: none; height: 0; }
#notifications .headerNoti .hideNotiBtn{padding: 0; margin: 0; height: 0; border: none; position: fixed; color: red; right: 329px; margin-top: -8px; z-index: 9;}
#notifications .headerNoti .hideNotiBtn i{background: #fff; padding: 1px 5px;}

#notifications li:hover li:not(.active){ background: #fff;}
#notifications li:hover li.active .media-body, #notifications li:hover li.active span.timestamp{ color: #fff !important;}
#notifications li:hover li:hover span.timestamp{ color: var(--clr) !important;}
#notifications li li{ position: relative; }
#notifications li .trashAlert{ display: none; position: absolute; right: 3px; bottom: 0; }
#notifications li:hover li:hover .trashAlert{ display: block;}
.openNoti{line-height: 23px; background: var(--clr); display: inline-block; color: #fff; position: fixed; right: 0; text-align: center; top: 250px; transition: 0.1s all ease-out, 0.1s 0.6s all ease-in; writing-mode: vertical-rl; text-orientation: sideways; padding: 10px 0; white-space: nowrap; z-index: 999; border-radius: 4px 0 0 4px; font-size: 14px; cursor: pointer; }
.searchAlertCls{ border: none; border-bottom: 1px dashed #ccc; border-radius: 0; }
.tkfixtable thead{position: sticky; top: 0;}
.tkfixtable thead tr th{background: #fff;}

#tableValue { max-height: 600px; overflow: auto}
.colTong, .colTong input{ font-weight: bold;}