*, ::after, ::before { box-sizing: unset}
body{margin:0; font-family: Arial;}
a{ text-decoration: none }
a:hover{ text-decoration: none }
p, b, strong, em, h1, h2, h3, h4, h5, h6 { margin:0; padding:0 }
ul, li{ list-style-type: none; margin:0; padding:0 }
.mg-r15{ margin-right:15px }
.flex{ display:flex }
.flex-1{ flex:1 }
.flex-wrp{ display:flex; flex-wrap: wrap; }
.cb{ clear: both;}
.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 { 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 }
::-webkit-scrollbar { width: 7px; height: 7px; }
::-webkit-scrollbar-track { background: #f1f1f1; }
::-webkit-scrollbar-thumb { background: rgba(42, 49, 90, 0.719);  border-radius:5px; }
::-webkit-scrollbar-thumb:hover { background: rgb(42, 49, 90); }

.wrp{ margin:auto!important; width:1170px; max-width:100%; }
.colleft{ width: 260px; margin-right:15px; display:flex; flex-direction: column; height: calc(100vh - 189px); position:sticky;top:0;}
.colright{ flex:1 }


#login{ position: fixed; width: 100%; min-height: 100%; overflow: auto;display: flex; justify-content: center; align-items: center; }
#login .background{ position: absolute; top:0; left:0; width:100%; height: 100%; }
#login .wrp{ position: relative;}
#login .title{ width: 100%; user-select: none; }
#login .title h1{ color:white; line-height: 48px}
#login .title h1 span{ display: block; text-transform: uppercase; text-align:center }
#login .title h1 span:first-child{ font-weight:400; font-family: 'UTM Avo'; font-size:30px }
#login .title h1 span:last-child{ font-family: 'UTM Swiss Condensed'; font-size: 40px; font-weight: bold }
#login-form, .foot{ position:relative; max-width: 405px ; margin: 0 auto; text-align: center; }
#login-form{ background: rgb(208,239,248); border-radius: 5px; border:1px dashed white; margin-top:6.2vh; margin-bottom:6.2vh; padding:65px 75px }
#login-form::before{ content: ""; position: absolute; pointer-events:none; border: 1px dashed white; border-radius:7px ;width: calc(100% + 26px); height: calc(100% + 26px);  top:-13px; left:-13px;  }
#login-form .title{ padding-top:0; margin-bottom:53px; user-select: none; }
#login-form .title h2{ position:relative; color:#1e85b5; display:inline-block; font-family: 'UTM HelvetIns'; font-size: 25px; font-weight: 400; line-height: 36px; padding-bottom: 5px; text-transform: uppercase; }
#login-form .title h2::after{ content:" "; position:absolute; width:75.3%; height: 2px; background: #1e85b5; bottom:0; left:12% }
#login-form .valid-field{ display:none }
#login-form .valid-field p{ font-family: 'UTM Avo'; color:red; font-size:16px }
#login-form form div{ margin:20px 0 }
#login-form form div:first-of-type{ margin-top: 0 }
#login-form form div label{ display:block; width:100%; text-align: left; font-size:13px; font-weight:bold; line-height: 18px; padding-bottom: 2px; margin: 0}
#login-form form div input{ font-family: 'UTM Avo'; display:block; width: calc(100% - 22px ); border:1px solid #cccccc; border-radius:3px; padding:10px; font-size:14px }
#login-form form div button{ border:none; display: inline-block; font-family: 'UTM Swiss Condensed'; width: 47%;  font-size:16px; line-height: 46px; text-transform: uppercase; border-radius:3px; background:#17c4bb; color:white}
#login-form form div button:hover{ background: #029e96 }
#login-form form div button:first-of-type{ margin-right:6%; background:#1c7aa4}
#login-form form div button:first-of-type:hover{ background: #13536f }
#login-form form a{ display:inline-block; width:100%; text-align: right ; font-size:13px; line-height:18px; color:#333333 }
#login-form form a:hover{ color: #1c7aa4 }
#login .foot p{ text-align: center; color:white; font-family: 'UTM Swiss Condensed'; font-size:16px; line-height:26px; user-select: none; }

body{ background:#f6f6f6; }
header{ background:#eceff5; padding-top:20px }
.wraper{ width: 1293px; margin-left:13.6%; max-width:100%; position:relative }
header .wImage{ width:100%; max-width:485px; margin:0 auto; margin-bottom: 15px; }
header .wImage::before{ padding-bottom:12.79% }

#user-info{ display:flex; position:absolute; right:0; top:10px }
#user-info a{ display:inline-block; padding:5px 15px; font-size:12px; font-weight:bold; border-radius:30px; color:white }
#user-info span{ display:inline-block; vertical-align: middle; text-transform: capitalize; }
#user-info .func-list{ display:none; top:100%; background:#5f81c7;border:1px solid white; border-bottom-width:0; margin-left:5px }
#user-info .func-list li{ border-bottom:1px solid white}
#user-info .func-list li:hover{ background:#023cb1; }
.user{ background:#fa5838; box-shadow: 0px 0px 2px 0px #5a5a5a  }
.user:hover{ background:#ee2901; }
#user-info>ul>li:hover .func-list{ display:block }

header#home { background:#0287d2;padding:0; position:relative}
header#home #user-info{ top:27%; right:14% }
header#home .title { width: 27%; max-width: 520px; margin:20px auto 0 55px; }
header#home .wImage{ margin:0; max-width:unset }
header .title .wImage::before { padding-bottom: 16.79%; }
header#home .floatImg{ max-width: 725px; width:37.7%; position: relative;}
header#home .floatImg .wImage::before{ padding-bottom: 18.75%; }

.nav-bar{ background: #02a9f7; }
.menu-bar{ width: calc(100% - 4px); padding:15px 1px; }
.menu-bar ul{ display:flex; justify-content:center; }
.menu-bar>ul>li:first-child{ margin-left:0}
.menu-bar li{ position: relative; width:auto; margin-left:15px}
.menu-bar>ul>li>a{ padding:10px 20px; background:#0287d2; border-radius: 3px; position: relative; font-weight: bold; height:calc(100% - 20px) }
.menu-bar>ul>li>a::before{ content: '' ; position: absolute; width:calc(100% + 2px); height: calc(100% + 2px); border:1px solid #0874b1; border-radius: 5px; top:-2px; left:-2px }
.menu-bar li a{ display: block; color:#fff; font-size: 12px; text-align: center; text-transform: uppercase }
.menu-bar li a span .fa{ font-size:30px }
.menu-bar li a span{ display:block; transition:all 0s }
.menu-bar li a span:first-child{ margin-bottom: 5px; }
.menu-bar li a span img{ max-height: 23px }
.menu-bar li:hover>a{ color:#cd3300; background: #ffc000 }
.menu-bar li:hover>a img{ filter: brightness(50%) sepia(100) saturate(100) hue-rotate(25deg); }
.menu-bar li:hover>a::before{ content: unset; }
.menu-bar li a.active{ color:#cd3300; background: #ffc000}
.menu-bar li a.active img{ filter: brightness(50%) sepia(100) saturate(100) hue-rotate(25deg); }
.menu-bar li a.active::before{ content: unset; }
.menu-bar li:hover .submenu{ display: block }

.menu-bar li .submenu{position: absolute; background: #02a9f7; display: none; max-width: 200px; width: 190px; left: 0; z-index: 100; box-shadow: -3px 3px 5px rgba(0,0,0,0.1); border-radius: 3px; border: 1px solid #cdd1d4;}
.menu-bar li .submenu li{margin-left:0}
.menu-bar li .submenu li a{ color:white; padding:10px 25px; border-radius: 0; text-align: unset; border-bottom: 1px solid #cdd1d4; }
.menu-bar li .submenu li:last-child a{ border-bottom:0 }
.menu-bar li .submenu li:hover a{ background:#015c86}
#container{ background: transparent; display:flex; flex-wrap: wrap; padding: 20px 0; flex:1; }

.panigation{ background:white; display:flex; border-bottom:1px solid #eaeaec }
.panigation ul{ display:flex; justify-content: flex-end;}
.panigation ul li{ margin-right: 8px; }
.panigation ul li:last-child{ margin-right: 10px; }
.panigation ul li a{ display:inline-block; font-weight:bold; text-align:center; border-radius: 3px; color:white; font-size:12px; padding:8px 10px; margin:7px 0; }
.panigation ul li a span{ vertical-align: middle; }
.panigation ul li a img{ vertical-align: middle; margin-left:5px }
.panigation ul li a{ background:#17c4bb }
.panigation ul li:first-child a:hover{ background:#018103 }
.panigation ul li:nth-child(2) a:hover{ background:#015c86 }
.panigation ul li:last-child a:hover{ background:#c21e01 }

.listTitle .title a{ background:#1c78a4; color:white; display:inline-block; text-transform: uppercase; font-weight:bold; font-size: 15px; width:100%; padding:15px 20px; padding-right:0; }
.listTitle .title a img{ margin-right:10px }
.listTitle .title a span{ display:inline-block; vertical-align: bottom; }
/* .colleft{ box-shadow:.listTitle ul li a 0 0 10px rgba(0, 0, 0, 0.3); } */
.search{ display:none }
.menu{ display:none }
.dropList{ display: none; }
.listTitle { background:#02a9f7 ; }
.listTitle ul li a{ font-size:12px; text-transform: uppercase; font-weight: bold;border-bottom:1px solid #57bbea; display:inline-block; color:#fff; width:100%; padding:12px 15px; line-height: 22px; }
.listTitle ul li a:hover{ background: #0e98d8; color:white }
.listTitle ul li a.active{ background: #0e98d8; border-color:white; color:white }

/* .searchForm{ padding:30px}
.searchForm form{display:flex}
.searchForm form input{ outline: none; padding:10px; font-size:13px; }
.searchForm form #keyword{ max-width: 350px; width:30% }
.searchForm form #keyword input{ width: calc(100% - 22px ); border-radius:4px; border:1px solid #999999 }
.searchForm form .dayStart,
 .searchForm form .dayEnd{ display:flex; border-radius:4px; border:1px solid #999999; margin-left:10px; max-width:275px; width:20% }
 .searchForm form .dayEnd{ margin-right:5px }
.searchForm form .dayStart input,
 .searchForm form .dayEnd input{ border:none; background: transparent; flex:1; width: 100%; }
.searchForm form .dayStart label,
 .searchForm form .dayEnd label{ padding:5px; margin:0 }
.searchForm form button{ border:none; outline:none; border-radius:4px; margin-left:auto; font-size:14px; font-weight: bold; color:white; background:#1c78a4; padding:0 25px }
.searchForm form button:hover{ background: #015e8a; }
.searchForm form button span{ display: inline-block; margin-left:5px; vertical-align: text-top; } */
/* .colright{ box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); } */
.colright .body{ overflow-y: auto; width: 100%; margin: auto; }
.colright .body table{ width:100%; min-width: 550px; border-collapse: collapse; }
.body table th {text-align: center}
.body table th, .body table td{border:1px solid #b7b7b7; font-size:14px; padding: 15px 8px; vertical-align: middle }
.body table th{ background:#0287d2; color:white; font-size:12px; text-transform: uppercase; cursor:pointer}
.body table th.stt{ cursor:default }
/*.body table thead th:nth-child(1){ width:4%; border-left-color:#afd4eb; border-top-color:#afd4eb }
.body table thead th:nth-child(2){ width:5%; border-top-color:#afd4eb }
.body table thead th:nth-child(3){ width:16%; border-top-color:#afd4eb }
.body table thead th:nth-child(4){ width:13%; border-top-color:#afd4eb }
.body table thead th:nth-child(5){ width:20%; border-top-color:#afd4eb }
.body table thead th:nth-child(6){ width:22%; border-top-color:#afd4eb }
.body table thead th:nth-child(7){ border-top-color:#afd4eb; border-right-color:#afd4eb  }*/
@media(max-width:1600px){
    .wraper{ margin:0 auto }
    /*.body table thead th:nth-child(2){ width:4%; border-top-color:#afd4eb }
    .body table thead th:nth-child(3){ width:14%; border-top-color:#afd4eb }
    .body table thead th:nth-child(4){ width:11%; border-top-color:#afd4eb }
    .body table thead th:nth-child(5){ width:16%; border-top-color:#afd4eb }
    .body table thead th:nth-child(6){ width:20%; border-top-color:#afd4eb }*/
}
#pageroad ul{ display:flex; margin:5px 0; }
#pageroad ul li a{ color: rgb(9, 129, 185)}
#pageroad ul li a.text{ font-weight:bold; cursor:default }
#pageroad ul li:after { color: #4a66a5; content: "\f0da"; font-family: 'FontAwesome'; font-style: normal; font-weight: 900; margin: 0 5px; }
#pageroad ul li:last-child:after { display: none; }

.body table tr .checker label,
 .body table tr .checkAll label{ cursor: pointer; margin: 0;}
.body table tr .checker input,
.body table tr .checkAll #chkall{ display: none; }
.body table tr .checker span,
 .body table tr .checkAll span{ position: relative; background:white; display:inline-block; width:20px; height: 20px; border:1px solid #cccccc}
.body table tr .checker span::after,
 .body table tr .checkAll span::after{ content:""; position:absolute; opacity: 0; transform: translateX(-50%) translateY(-50%) rotate(45deg); top:50%; left:50%; width:3px; height: 10px; border:1px solid white; border-width: 0 3px 3px 0 }
.body table tr .checker input:checked ~span,
 .body table tr .checkAll #chkall:checked ~span{ background:#1c78a4 }
.body table tr .checker input:checked ~span::after,
 .body table tr .checkAll #chkall:checked ~span::after{ opacity:1 }
.body table tbody tr:hover{ background: rgb(236, 226, 226); }
.body table .action a:not(.btn){transition: all 0s; display:inline-block; font-size:14px; padding:10px 15px; border-radius:4px; line-height: 18px; color:white }
.body table .action a img{ transition: all 0s; vertical-align: text-bottom; max-height: 17px;}

.body table .action .add{ background:#17c4bb}
.body table .action .add img{ filter: hue-rotate(180deg) brightness(10);}
.body table .action .add:hover{ background: #00aeef; color:white}

.body table .action .update{ background:#89c75a}
.body table .action .update:hover{ background: #fa8e00; color:white}
.body table .action .update img{ filter: hue-rotate(180deg) brightness(10);}

.body table .action .remove{ background:#d7521e}
.body table .action .remove:hover{ background: #b11b00; color:white}
.body table .action .remove img{ filter: brightness(10);}

.infomation{ background: white; flex:1; margin:0 20px; max-height:100%; box-shadow:0 0 15px rgba(0, 0, 0, 0.09) }
.infomation .wrp{ display:flex; flex-wrap: wrap; width:1328px}
@media(max-width:1368px){
    .infomation .wrp{ width:1170px}
}
.listInfo .summary .detail{ padding:25px 50px; padding-top:0 }
.listInfo .summary .detail .wImage{ border-radius:3px }
.listInfo .summary .detail .wImage::before{ padding-bottom: 108.34%; }
.listInfo .summary .detail p{ font-size:14px; color:#333333; line-height: 20px; }
.listInfo .summary .detail .name{ text-transform: capitalize; margin-top:20px }
.listInfo ul{ overflow: auto;}
.listInfo ul li a{ font-size:14px; text-transform: capitalize;  border-bottom:1px solid #eaeaec; display:flex; color:#333333; flex:1; padding:15px 0 15px 30px; font-weight: bold; font-size:14px; }
.listInfo ul li:first-child a{ border-top:1px solid #eaeaec }
.listInfo ul li a:hover{ background: #c5e8f8; border-color:#fff; }
.listInfo ul li a.active{ background: #c5e8f8; border-color:#fff; }

.updatingForm .title{ margin:80px 0 40px 0; user-select: none; }
.updatingForm .title p{ font-family: 'UTM HelvetIns'; text-align: center; color:#635f5f; font-size:25px; text-transform: uppercase; }
.updatingForm form{ width:calc(100% - 25px); margin:0 auto }

.updatingForm .wrap-item{border:1px solid #cccccc; border-radius: 2px; padding-top:40px; margin-bottom: 140px;}
.updatingForm .inlineInput{ display:flex; margin:auto 60px; margin-top: 14px; }
.updatingForm .inlineInput .optionInput:first-child .select{ margin-right:25px }
.updatingForm .inlineInput:last-child{ margin-bottom:60px }
.updatingForm .dotInput{ display:flex; flex:1; position: relative; }
.updatingForm .dotInput.job{ flex-grow:1.39 }
.updatingForm .dotInput label{ padding:15px 10px 0 0; font-weight: bold; font-size:14px }
.updatingForm .dotInput input{ position:relative; flex:1; border: none; outline: none; background: transparent; border-bottom: 1.8px dotted #7d7d7d; padding: 0px 10px; padding-top: 15px; font-size: 15px; height: 15px; }
.optionInput{ display: flex; width:42%; }
.optionInput.majority{ width:58.3% }
.optionInput label{ padding: 15px 10px 0 0; font-weight: bold; font-size:14px; margin-bottom:0 }
.optionInput .select-hidden{ display: none; visibility: hidden; padding-right: 10px; }
.optionInput .select{ cursor: pointer; display: inline-block; position: relative; font-size: 15px; color: black; flex:1; height: 30px; top:5px }
.optionInput .select-styled{ user-select: none; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-color: white; border:1px solid #cdcdcd; padding: 6px 0; text-indent: 15px; -moz-transition: all 0.2s ease-in; -o-transition: all 0.2s ease-in; -webkit-transition: all 0.2s ease-in; transition: all 0.2s ease-in;}
.optionInput .select-styled:after{ content: ""; width: 0; height: 0; border: 7px solid transparent; border-color: #cdcdcd transparent transparent transparent; position: absolute; top: 12px; right: 10px; }
.optionInput .select-styled:active:after,
 .select-styled.active:after { top: 4px; border-color: transparent transparent #cdcdcd transparent; }
.optionInput .select-options { display: none; position: absolute; top: 100%; right: 0; left: 0; z-index: 999; margin: 0; padding: 0; list-style: none; border:1px solid #cdcdcd; border-top:none; background-color: white; }
.optionInput .select-options li { user-select: none; margin: 0; font-size:15px; padding: 7px 0; text-indent: 15px; border-top: 1px solid #cdcdcd; -moz-transition: all 0.15s ease-in; -o-transition: all 0.15s ease-in; -webkit-transition: all 0.15s ease-in; transition: all 0.15s ease-in;}
.optionInput .select-options li:first-child{ border-top:none;}
.optionInput .select-options li:nth-child(2){ border-top:none;}
.optionInput .select-options li:hover { color: #353434; background: #cdcdcd;}
.optionInput .select-options li[rel="hide"] { display: none; }

.updatingForm .wrap-btn{ margin-top:50px; margin-bottom: 30px; text-align: center; }
.updatingForm .wrap-btn button{ border:none; outline: none; padding:8px 20px; border-radius:4px; color:white; font-size:14px; vertical-align: middle; cursor: pointer; margin-left:10px }
.updatingForm .wrap-btn button:first-child{ margin-left:0 }
.updatingForm .wrap-btn span{ display: inline-block; line-height: 21px; }
.updatingForm .wrap-btn button a{ color:white; font-size:14px; }
.updatingForm .wrap-btn button img{ vertical-align: bottom; margin-right: 5px; }
.updatingForm .wrap-btn .add{background:#1c78a4}
.updatingForm .wrap-btn .add:hover{ background: #01618d;}
.updatingForm .wrap-btn .back{background:#e2654f}
.updatingForm .wrap-btn .back:hover{background:#c92204}
.updatingForm .wrap-btn .exportFile{background:#469e47}
.updatingForm .wrap-btn .exportFile:hover{background:#038b05}

.DMcanbo{ width:100%; max-width: 430px; }
#DMcanbo{ height: 100%;}
#DMcanbo .title a{ display:flex; flex:1; width:65%; padding:5px 25px; background:#0287d2; border-radius:5px 5px 0 0  }
#DMcanbo .title a:hover{ background:#0279be }
#DMcanbo .title span{ display:inline-block; font-family: 'UTM Swiss Condensed'; font-weight:bold; text-transform: uppercase; font-size:18px; color:white; margin-left:8px; margin-top:3px}
#DMcanbo .title a img { vertical-align: middle; object-fit: contain; }
#DMcanbo .listDMcanbo{ position:relative; background:white; border-radius:10px; box-shadow:0 0 15px rgba(0, 0, 0, 0.09); padding:40px 45px; }
#DMcanbo .listDMcanbo::before{ content: ''; position: absolute; background:#0287d2; width:50%; height:20px; top:0; left:0; z-index:-1  }
#DMcanbo .listDMcanbo{ background:white; padding:25px 30px; border-radius:5px; box-shadow:0 0 15px rgba(0, 0, 0, 0.09); height: calc(100% - 90px ); }
#DMcanbo .listDMcanbo ul li{ border:1px solid #d5d8da; background:#f2f1f1; display:flex; padding:15px 50px; padding-left:80px; margin-bottom:25px; border-radius:6px }
#DMcanbo .listDMcanbo ul li:hover{ background:#cecccc }
#DMcanbo .listDMcanbo ul li .wImage{  max-width:62px; width:100%; }
#DMcanbo .listDMcanbo ul li .wImage::before{ padding-bottom:109.58% }
#DMcanbo .listDMcanbo ul li .info a{ display:block; text-align: left; margin-top:3px; padding-left:45px }
#DMcanbo .listDMcanbo ul li .info span{ display: block; font-family: 'UTM Avo'; font-weight:bold; font-size:17px; color:#666666 }
#DMcanbo .listDMcanbo ul li .info span::first-letter{ text-transform: uppercase; }

#TKbieudo .title a,
 #DSbaocao .title a{ display:inline-block; min-width:260px; padding:5px 25px; padding-right: 35px; background:#0287d2; border-radius:5px 5px 0 0  }
 #TKbieudo .title a:hover,
 #DSbaocao .title a:hover{ background:#0279be }
#TKbieudo .title img,
 #DSbaocao .title img{ vertical-align: middle; object-fit: contain; }
#TKbieudo .title span,
 #DSbaocao .title span{ display:inline-block; font-family: 'UTM Swiss Condensed'; font-weight:bold; text-transform: uppercase; font-size:18px; color:white; margin-left:8px; vertical-align: middle; }
#TKbieudo .detail,
 #DSbaocao .listdetail{ position:relative; background:white; border-radius:10px; box-shadow:0 0 15px rgba(0, 0, 0, 0.09); }
#TKbieudo .detail{ padding:40px 45px; }
#TKbieudo .detail::before,
 #DSbaocao .listdetail::before{ content: ''; position: absolute; background:#0287d2; width:50%; height:20px; top:0; left:0; z-index:-1  }

#TKbieudo{ margin-bottom:25px }
#TKbieudo .detail .statistic-type,
 #TKbieudo .detail .more-fillter .item{ width:100% }
#TKbieudo .detail .statistic-type .optionInput,
 #TKbieudo .detail .more-fillter .item .optionInput{ width:100% }
#TKbieudo .detail .statistic-type .optionInput .select,
 #TKbieudo .detail .more-fillter .item .optionInput .select{ top: 0; font-size:14px; height:40px }
#TKbieudo .detail .statistic-type .optionInput .select-styled,
 #TKbieudo .detail .more-fillter .item .optionInput .select-styled{ border-radius:3px; padding:12px 0; text-indent: 30px; color:#666666 }
#TKbieudo .detail .statistic-type .optionInput .select-styled:after,
 #TKbieudo .detail .more-fillter .item .optionInput .select-styled:after{ top :15px; border-color:#8d8d8d transparent transparent transparent }
#TKbieudo .detail .statistic-type .optionInput .select-options li,
 #TKbieudo .detail .more-fillter .item .optionInput .select-options li{ text-indent: 30px; font-size:14px; color:#666666; padding: 10px 0; }
#TKbieudo .detail .statistic-type .optionInput .select-options li:nth-child(2),
 #TKbieudo .detail .more-fillter .item .optionInput .select-options li:nth-child(2){ border-top: 1px solid #cdcdcd; }
#TKbieudo .detail .more-fillter .item .optionInput{ flex-wrap: wrap; margin-bottom: 25px; }
#TKbieudo .detail .more-fillter .item:last-child .optionInput{ margin-bottom:10px }
#TKbieudo .detail .more-fillter .item .optionInput label{ width:100%; padding-top:0; margin-bottom: 5px; font-size:14px; color:#666666 }
#TKbieudo .detail .more-fillter .item .optionInput .select-styled{ text-indent: 10px;}
#TKbieudo .detail .more-fillter .item .optionInput .select-options li{ text-indent: 10px;}

#TKbieudo .detail .statistic-left{ width:50% }
#TKbieudo .detail .statistic-right{ padding-top:35px; width:50% }

#TKbieudo .detail .statistic-left .note-classify{ margin-top:50px; margin-bottom: 35px; }
#TKbieudo .detail .statistic-left .note-classify li{ width:50%; margin-bottom: 15px; }
#TKbieudo .detail .statistic-left .note-classify li span{ display:inline-block; width:10px; height: 10px; border-radius:50%; background:black}
#TKbieudo .detail .statistic-left .note-classify li p{ display:inline-block; margin-left:10px; font-size: 14px; color:#666666 }
#TKbieudo .detail .statistic-left .note-classify li p::first-letter{ text-transform: uppercase; }
#TKbieudo .detail .more-fillter .item .optionInput .select-styled:after { right:15px; top:16px }
#TKbieudo .detail .more-fillter .item .optionInput .select-styled span{ display:inline-block; height: 38px; width:45px; position: absolute; right:0; top:0; border-radius:0 3px 3px 0; border-left:1px solid #dae2e6 ;background:#eee7e7 }
#TKbieudo .detail .more-fillter .item .optionInput .select-styled:hover span{ background:#d6cece }

#TKbieudo .detail .statistic-right .level{ padding-left:80px; position: relative; }
#TKbieudo .detail .statistic-right .level::after{ content: ''; position: absolute; width:1px; height: calc(100% - 8px); background:#7e7d82; right:0; top:8px; }
#TKbieudo .detail .statistic-right .level ul{ height: 100%; }
#TKbieudo .detail .statistic-right .level li{ position:relative; display:block; height: 12.5%; margin-right:15px; font-size: 14px; color:#666666; }
#TKbieudo .detail .statistic-right .level li::after{ content:''; position:absolute; width:8px; height: 1px; background:#7e7d82; right:-15px; top: 8px }
#TKbieudo .detail .statistic-right .level li:last-child{ height: 0;}
#TKbieudo .detail .statistic-right .level li:last-child::after{ top:-1px }
#TKbieudo .detail .statistic-right .chart{ border-bottom:1px solid #7e7d82; margin-right:80px }
#TKbieudo .detail .statistic-right .chart .chart-item { display:flex; flex-direction: column; justify-content: flex-end; max-width: 50px; width:100%; margin-right:6px; }
#TKbieudo .detail .statistic-right .chart .chart-item:first-child{ margin-left: 3px}
#TKbieudo .detail .statistic-right .chart .chart-item .statistic{ font-weight:bold; font-size:14px; text-align: center; }
#TKbieudo .detail .statistic-right .chart .chart-item .column{ height:0% }

#DSbaocao .listdetail{ padding:25px 0 }
#DSbaocao .listdetail .item{ padding:27px; padding-bottom:20px ;display:flex }
#DSbaocao .listdetail .item:nth-child(odd){ background:#e9eff2 }
#DSbaocao .listdetail .item:hover{ background:#c3c8ca }
#DSbaocao .listdetail .item .thumb{ max-width:37px; width:100%; margin-right: 25px }
#DSbaocao .listdetail .item .thumb .wImage::before{ padding-bottom: 102.5% }
#DSbaocao .listdetail .item .detail{ margin-top:-5px }
#DSbaocao .listdetail .item .detail .notification span{ font-size: 14px; line-height: 20px; color:#333333; vertical-align: text-top; }
#DSbaocao .listdetail .item .detail .notification .subject{ font-weight:bold; }
#DSbaocao .listdetail .item .detail .time span{ font-size:12px; color:#666666; line-height: 20px; }

.pagination>.active>a, .pagination>.active>span {color: #fff}
.mauhoso{ width: 1100px; font-size:16px ; margin: auto; padding: 30px 10px; max-width: 100%}
 
.maudon{ font-family:"Time New Roman"; text-indent: 15px; transition:all 0s; }
.maudon.QD{ text-indent:30px }
.mauhoso input{ flex:1; border:none; outline:none; border-bottom: 1px dotted black; height:21px; margin-left: 10px; width:calc(100% - 15px);color: #6078c1}
.mauhoso input[type=number]{width:40px; flex:0; text-align: center;}
.mauhoso .date,
 .mauhoso .month, 
  .mauhoso .year{width:40px; flex:unset; text-align: center;}
.mauhoso textarea{ border:none; outline:none; background: url(../icon/bgInputText.png) bottom left; resize:none; flex:1; padding:0; line-height: 25px; height: 25px; margin-left:5px; overflow: hidden; vertical-align: top; color: #6078c1}
.mauhoso p{ margin-bottom:10px; line-height:20px }
.mauhoso label{ white-space: nowrap; margin-bottom: 0;}
.mauhoso .bankhaicanhan .header{ display: block; }
.mauhoso .header{ display:flex; text-align: center; margin-bottom: 20px;}
.mauhoso .header .item{ margin:0 auto }
.mauhoso .header .item:first-child{ margin-left:15px }
.mauhoso .header .item:last-child{ margin-right:0 }
.mauhoso .header p{ font-weight:bold; margin:0 }
.mauhoso .QD .header p:first-child{ text-transform: uppercase; text-indent:15px}
.mauhoso .header .item{ position: relative; }
.mauhoso .header .item::after{ position: absolute; content: " ";width: 100px; height:1px; bottom:-10px; left:50%; border-bottom: 1px dashed black; transform: translateX(-50%); }
.mauhoso .header .item.UBND::after{ width: 40px; }
.mauhoso .DS .header .item.UBND::after{ width: 0px; }
.mauhoso .decideDay{ display:flex; font-size: 14px; padding-top:10px }
.mauhoso .decideDay #maudonid{ margin-right:auto; }
.mauhoso .decideDay #maudonid div{ display:inline-block; text-indent:5px }
.mauhoso .decideDay #maudonid textarea{ width:40px; border-bottom:none }
.mauhoso .decideDay .ngayQD div{ display:inline-block; text-indent:5px }
.mauhoso .decideDay .ngayQD textarea{ font-style: italic; padding:0; height: 16px; }
.mauhoso .decideDay .ngayQD textarea:first-child{ width:70px }
.mauhoso .tieude{ text-align: center; font-weight: bold; padding-top:15px; margin-bottom: 20px; }
.mauhoso .tieude p:first-child{ text-transform: uppercase; }
.mauhoso .tieude p:last-child::first-letter{ text-transform: uppercase; }
.mauhoso .DS .tieude p{ text-transform: uppercase; }
.mauhoso .DS .attach{ text-align: center;}
.mauhoso .from{ text-align: center; }
.mauhoso .from textarea{ width: 80px; text-align:left;  }

.mauhoso .content .item div{ font-style:italic }
.mauhoso .content .item{ display:flex; text-indent:15px; margin-bottom: 10px; }
.mauhoso .content .item label:first-child{ text-indent: 15px; }
.mauhoso .QD .content .item label:first-child{ text-indent: 30px; }
.mauhoso .content .item label:first-child::first-letter{ text-transform: uppercase; }
.mauhoso input[type=number]::-webkit-inner-spin-button, 
 .mauhoso input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0;}
.mauhoso .content>i,
 .mauhoso .content>p,
  .mauhoso .content>b{ display:block; text-indent: 15px; margin-bottom:8px }
.mauhoso .content .item textarea::-webkit-scrollbar { display: none; }
.mauhoso .content .item.aftercontent{ display: inline-block; line-height: 30px; }
.mauhoso .content .item.aftercontent label{ vertical-align: top; }
.mauhoso .content .item.aftercontent textarea{ vertical-align: top; max-width: 150px; flex: unset; }
.mauhoso .content .item div{ margin: 0 15px}
.mauhoso .QD .content .item { text-indent: 30px;}
.mauhoso .QD .content .item .total-inn{ width:100px; flex:unset }
.mauhoso .QD .content .item .total-inw{ width:200px; flex:unset }
.mauhoso .QD .content .item #nguoi-count{  width: 100px; flex:unset}
.mauhoso .QD .content .item #fund{  width: 150px; flex:unset }

.mauhoso .DS .content .table{ margin-top:15px }
.mauhoso .DS .content .table table{ border-collapse: collapse; width: 100% }
.mauhoso .DS .content .table textarea{ background: unset; }
.mauhoso .DS .content .table th{ border: 1px solid black; text-indent: 0; padding: 5px }
.mauhoso .DS .content .table td{ border: 1px solid black; border-width:0 0 1px 1px; line-height: 25px; padding: 5px 0; text-indent: 0; text-indent:5px; text-align: center;  }
.mauhoso .DS .content .table td textarea{ width: calc(100% - 10px); margin:0}
.mauhoso .DS .content .table td:last-child{ border-right-width: 1px; position:relative }
.mauhoso .DS .content .table td:last-child .removeBtn{ position:absolute; display: none;border:none; outline:none; cursor: pointer; border-radius:3px; padding:5px 10px; right: -44px; top:50%; transform: translateY(-50%); background:#ea391b; color:white;  }
.mauhoso .DS .content .table tbody tr:hover td:last-child .removeBtn{ display: block; animation: bounce-in 0.35s}
.mauhoso .DS .content .table #total td{ font-weight: bold; }
.mauhoso .DS .content .table #addRow{ text-align: right; }
.mauhoso .DS .content .table #addRow button{ border:none; outline: none; border-radius:0 0 3px 3px; padding:5px 10px; background: #23d123; color:white }

.mauhoso .aftercontent{ text-indent: 15px; margin-bottom: 20px;}
.mauhoso .aftercontent p{ margin-bottom:10px }
.mauhoso .QD .aftercontent{ text-indent: 30px; }
.mauhoso .signature { float: right; text-align:center; margin-top: 15px }
.mauhoso .DS .signature{ margin-top:30px }
.mauhoso .signature .sign-date{ font-style: italic;}
.mauhoso .signature .sign-date div{display:inline-block}
.mauhoso .signature .sign-date input{ width:40px; border:none; outline:none; border-bottom: 1px dotted black; height:18px; margin-left: 5px; text-align: center;}
.mauhoso .multi-sign{ display:flex; text-align: center; margin-top: 40px;}
.mauhoso .multi-sign .item{ margin:auto }
.mauhoso .multi-sign .item:first-child{ margin-left:0}
.mauhoso .multi-sign .item:last-child{ margin-right:0}
.mauhoso .QD .note .item{ font-size:13px }
.mauhoso .QD .note .item b,
 .mauhoso .QD .note .item i{ font-size:16px }
.mauhoso .QD .note .item.to{ text-indent: 0; margin-bottom:5px }


.mauhoso .nop-ho-so { text-align: center; margin-top: 50px; }
.mauhoso .nop-ho-so a{display:inline-block}
.mauhoso .nop-ho-so button,
 .mauhoso .nop-ho-so a{ border:none; border-radius:3px; outline:none; padding:5px 10px; color:white; font-size:15px; font-family: 'Times New Roman';; cursor: pointer;}
.mauhoso .nop-ho-so .luuHS{ background:#799a5a}
.mauhoso .nop-ho-so .nopHS{ background:#5cb85c}
.mauhoso .nop-ho-so .inHS{ background:#337ab7}
.mauhoso .nop-ho-so .xuatHS{ background:#f0ad4e}
.mauhoso .nop-ho-so .back{ background:#c42d13}
.mauhoso .nop-ho-so button i{ margin-right:5px}
.mauhoso .nop-ho-so .luuHS:hover{ background:#53a803}
.mauhoso .nop-ho-so .nopHS:hover{ background:#04b804}
.mauhoso .nop-ho-so .inHS:hover{ background:#0363b8}
.mauhoso .nop-ho-so .xuatHS:hover{ background:#f38f04}
.mauhoso .nop-ho-so .back:hover{ background:#a71c03}
.listTitle{height: 100%; display: flex; flex-direction: column;}
.tree-node,.tree li{background: #fff;}.tree-node-hover,.tree-node-selected{color: #cd3300;}
.wrapUnitLeft{flex: 1;overflow: auto;background: #fff;}
.colright1 .card{box-shadow: none;}
@keyframes bounce-in{
    0%{
        transform: translateY(-50%) translateX(0) scale(1);
        opacity: 0;
    }
    50%{
        transform: translateY(-50%) translateX(4px) scale(1.15);
    }
    100%{
        transform: translateY(-50%) translateX(0) scale(1);
        opacity:1
    }
}