﻿body {margin: 0; padding:0;  position:relative;overflow:hidden; width:100%; height:100%; font-family: Roboto, Tahoma}
#MasterPage_Form{width:100%; height:100%; float:left;}

[class^="flaticon-"]:before, [class*=" flaticon-"]:before,
[class^="flaticon-"]:after, [class*=" flaticon-"]:after {  margin-left: 0px; font-size:14px; font-weight:normal;}

 #loader-wrapper{display:inline-block;position:fixed;z-index:9999;top:0;left:0;right:0;bottom:0;background-color:#fff;text-align:center;height:100vh;padding-top:40vh;}#loader-wrapper .dots{display:inline-block;position:relative;}#loader-wrapper .dots:not(:last-child){margin-right:9px;}#loader-wrapper .dots:before,#loader-wrapper .dots:after{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;position:absolute;}#loader-wrapper .dots:nth-child(1):before{-webkit-transform:translateY(-200%);transform:translateY(-200%);-webkit-animation:animBefore 1s linear infinite;animation:animBefore 1s linear infinite;-webkit-animation-delay:-0.9s;animation-delay:-0.9s;background-color:#0074bb;}#loader-wrapper .dots:nth-child(1):after{-webkit-transform:translateY(200%);transform:translateY(200%);-webkit-animation:animAfter 1s linear infinite;animation:animAfter 1s linear infinite;-webkit-animation-delay:-0.9s;animation-delay:-0.9s;background-color:#fe9835;}#loader-wrapper .dots:nth-child(2):before{-webkit-transform:translateY(-200%);transform:translateY(-200%);-webkit-animation:animBefore 1s linear infinite;animation:animBefore 1s linear infinite;-webkit-animation-delay:-1.8s;animation-delay:-1.8s;background-color:#0074bb;}#loader-wrapper .dots:nth-child(2):after{-webkit-transform:translateY(200%);transform:translateY(200%);-webkit-animation:animAfter 1s linear infinite;animation:animAfter 1s linear infinite;-webkit-animation-delay:-1.8s;animation-delay:-1.8s;background-color:#fe9835;}#loader-wrapper .dots:nth-child(3):before{-webkit-transform:translateY(-200%);transform:translateY(-200%);-webkit-animation:animBefore 1s linear infinite;animation:animBefore 1s linear infinite;-webkit-animation-delay:-2.7s;animation-delay:-2.7s;background-color:#0074bb;}#loader-wrapper .dots:nth-child(3):after{-webkit-transform:translateY(200%);transform:translateY(200%);-webkit-animation:animAfter 1s linear infinite;animation:animAfter 1s linear infinite;-webkit-animation-delay:-2.7s;animation-delay:-2.7s;background-color:#fe9835;}#loader-wrapper .dots:nth-child(4):before{-webkit-transform:translateY(-200%);transform:translateY(-200%);-webkit-animation:animBefore 1s linear infinite;animation:animBefore 1s linear infinite;-webkit-animation-delay:-3.6s;animation-delay:-3.6s;background-color:#0074bb;}#loader-wrapper .dots:nth-child(4):after{-webkit-transform:translateY(200%);transform:translateY(200%);-webkit-animation:animAfter 1s linear infinite;animation:animAfter 1s linear infinite;-webkit-animation-delay:-3.6s;animation-delay:-3.6s;background-color:#fe9835;}#loader-wrapper .dots:nth-child(5):before{-webkit-transform:translateY(-200%);transform:translateY(-200%);-webkit-animation:animBefore 1s linear infinite;animation:animBefore 1s linear infinite;-webkit-animation-delay:-4.5s;animation-delay:-4.5s;background-color:#0074bb;}#loader-wrapper .dots:nth-child(5):after{-webkit-transform:translateY(200%);transform:translateY(200%);-webkit-animation:animAfter 1s linear infinite;animation:animAfter 1s linear infinite;-webkit-animation-delay:-4.5s;animation-delay:-4.5s;background-color:#fe9835;}#loader-wrapper .dots:nth-child(6):before{-webkit-transform:translateY(-200%);transform:translateY(-200%);-webkit-animation:animBefore 1s linear infinite;animation:animBefore 1s linear infinite;-webkit-animation-delay:-5.4s;animation-delay:-5.4s;background-color:#0074bb;}#loader-wrapper .dots:nth-child(6):after{-webkit-transform:translateY(200%);transform:translateY(200%);-webkit-animation:animAfter 1s linear infinite;animation:animAfter 1s linear infinite;-webkit-animation-delay:-5.4s;animation-delay:-5.4s;background-color:#fe9835;}#loader-wrapper .dots:nth-child(7):before{-webkit-transform:translateY(-200%);transform:translateY(-200%);-webkit-animation:animBefore 1s linear infinite;animation:animBefore 1s linear infinite;-webkit-animation-delay:-6.3s;animation-delay:-6.3s;background-color:#0074bb;}#loader-wrapper .dots:nth-child(7):after{-webkit-transform:translateY(200%);transform:translateY(200%);-webkit-animation:animAfter 1s linear infinite;animation:animAfter 1s linear infinite;-webkit-animation-delay:-6.3s;animation-delay:-6.3s;background-color:#fe9835;}#loader-wrapper .dots:nth-child(8):before{-webkit-transform:translateY(-200%);transform:translateY(-200%);-webkit-animation:animBefore 1s linear infinite;animation:animBefore 1s linear infinite;-webkit-animation-delay:-7.2s;animation-delay:-7.2s;background-color:#0074bb;}#loader-wrapper .dots:nth-child(8):after{-webkit-transform:translateY(200%);transform:translateY(200%);-webkit-animation:animAfter 1s linear infinite;animation:animAfter 1s linear infinite;-webkit-animation-delay:-7.2s;animation-delay:-7.2s;background-color:#fe9835;}#loader-wrapper .dots:nth-child(9):before{-webkit-transform:translateY(-200%);transform:translateY(-200%);-webkit-animation:animBefore 1s linear infinite;animation:animBefore 1s linear infinite;-webkit-animation-delay:-8.1s;animation-delay:-8.1s;background-color:#0074bb;}#loader-wrapper .dots:nth-child(9):after{-webkit-transform:translateY(200%);transform:translateY(200%);-webkit-animation:animAfter 1s linear infinite;animation:animAfter 1s linear infinite;-webkit-animation-delay:-8.1s;animation-delay:-8.1s;background-color:#fe9835;}#loader-wrapper .dots:nth-child(10):before{-webkit-transform:translateY(-200%);transform:translateY(-200%);-webkit-animation:animBefore 1s linear infinite;animation:animBefore 1s linear infinite;-webkit-animation-delay:-9s;animation-delay:-9s;background-color:#0074bb;}#loader-wrapper .dots:nth-child(10):after{-webkit-transform:translateY(200%);transform:translateY(200%);-webkit-animation:animAfter 1s linear infinite;animation:animAfter 1s linear infinite;-webkit-animation-delay:-9s;animation-delay:-9s;background-color:#fe9835;}@-webkit-keyframes animBefore{0%{-webkit-transform:scale(1) translateY(-200%);z-index:1;}25%{-webkit-transform:scale(1.3) translateY(0);z-index:1;}50%{-webkit-transform:scale(1) translateY(200%);z-index:-1;}75%{-webkit-transform:scale(0.7) translateY(0);z-index:-1;}100%{-webkit-transform:scale(1) translateY(-200%);z-index:-1;}}@keyframes animBefore{0%{transform:scale(1) translateY(-200%);z-index:1;}25%{transform:scale(1.3) translateY(0);z-index:1;}50%{transform:scale(1) translateY(200%);z-index:-1;}75%{transform:scale(0.7) translateY(0);z-index:-1;}100%{transform:scale(1) translateY(-200%);z-index:-1;}}@-webkit-keyframes animAfter{0%{-webkit-transform:scale(1) translateY(200%);z-index:-1;}25%{-webkit-transform:scale(0.7) translateY(0);z-index:-1;}50%{-webkit-transform:scale(1) translateY(-200%);z-index:1;}75%{-webkit-transform:scale(1.3) translateY(0);z-index:1;}100%{-webkit-transform:scale(1) translateY(200%);z-index:1;}}@keyframes animAfter{0%{transform:scale(1) translateY(200%);z-index:-1;}25%{transform:scale(0.7) translateY(0);z-index:-1;}50%{transform:scale(1) translateY(-200%);z-index:1;}75%{transform:scale(1.3) translateY(0);z-index:1;}100%{transform:scale(1) translateY(200%);z-index:1;}}

/* ********************************************************** 
                     CSS Checkbox & Radio
************************************************************ */

.checkbox {padding-left: 20px; float:left; margin:0;  white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
.checkbox label { display: inline-block; vertical-align: middle; position: relative;  padding-left: 5px; padding-right:0; white-space:initial  }
.checkbox label::before { content: ""; display: inline-block; position: absolute; width: 15px; height: 15px; left: 0; margin:2px 0 0 -16px; border: 1px solid #d5dae4;  border-radius: 3px;  background-color: #fff; -webkit-transition: border 0.15s ease-in-out, color 0.15s ease-in-out; -o-transition: border 0.15s ease-in-out, color 0.15s ease-in-out;  transition: border 0.15s ease-in-out, color 0.15s ease-in-out; }
.checkbox label::after {display: inline-block;position: absolute;width: 14px; height: 14px; left: 0;top: 1px; margin-left: -16px; padding-left: 3px; padding-top: 1px;  font-size: 10px;  color: #000; }
.checkbox input[type="checkbox"],
.checkbox input[type="radio"] { opacity: 0;  z-index: 1; }
.checkbox input[type="checkbox"]:focus + label::before,
.checkbox input[type="radio"]:focus + label::before { outline: none;}
.checkbox input[type="checkbox"]:checked + label::after,
.checkbox input[type="radio"]:checked + label::after {font-family: "FontAwesome";content: "\f00c";}
.checkbox input[type="checkbox"]:indeterminate + label::after,
.checkbox input[type="radio"]:indeterminate + label::after { display: block; content: ""; width: 10px; height: 3px; background-color: #555555; border-radius: 2px; margin-left: -16.5px; margin-top: 7px;}
.checkbox input[type="checkbox"]:disabled + label,
.checkbox input[type="radio"]:disabled + label {   opacity: 0.65; }
.checkbox input[type="checkbox"]:disabled + label::before,
.checkbox input[type="radio"]:disabled + label::before { background-color: #eeeeee; cursor: not-allowed; }

.radio { padding-left: 20px; float:left; margin:0; }
.radio label { display: inline-block; vertical-align: middle; position: relative; padding-left: 5px; }
.radio label::before { content: ""; display: inline-block; position: absolute; width: 16px; height: 16px; left: 0; margin:1px 0 0 -16px; border: 1px solid #d5dae4; border-radius: 50%; background-color: #fff; -webkit-transition: border 0.15s ease-in-out; -o-transition: border 0.15s ease-in-out; transition: border 0.15s ease-in-out; }
.radio label::after {display: inline-block; position: absolute; content: " "; width: 6px; height: 6px;left: 5px;top: 6px;margin-left: -16px; border-radius: 50%; background-color: #000; -webkit-transform: scale(0, 0); -ms-transform: scale(0, 0); -o-transform: scale(0, 0);transform: scale(0, 0); -webkit-transition: -webkit-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33); -moz-transition: -moz-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33); -o-transition: -o-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33); transition: transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33); }
.radio input[type="radio"] {opacity: 0; z-index: 1; }
.radio input[type="radio"]:focus + label::before {outline:none;}
.radio input[type="radio"]:checked + label::after {-webkit-transform: scale(1, 1);-ms-transform: scale(1, 1);-o-transform: scale(1, 1); transform: scale(1, 1); }
.radio input[type="radio"]:disabled + label { opacity: 0.65; }
.radio input[type="radio"]:disabled + label::before {cursor: not-allowed; }
.checkbox+.checkbox, .radio+.radio{margin:0;}

/* ********************************************************** 
                     Header
************************************************************ */

header{width: 100%; padding: 0; height: 50px; background: #00afef; box-shadow: 0 1px 1px rgba(0,0,0,0), inset 0 -1px 2px rgba(0,0,0,.03); display: block; position: relative; z-index: 20; transition:.3s;}
header .nav-menu {width: 50px;height: 50px; text-align: center;line-height: 50px;display: block; font-size: 19px;color: rgba(255,255,255,.9); text-decoration: none;float: left; transition: .3s; box-shadow: inset -1px 0 rgba(0,0,0,.1); background: rgba(255,255,255,.15);}
header .nav-menu:hover{color:#fff;}
header .nav-fullscreen {display: block;line-height: 50px;width: 50px; display: block; float: left; text-decoration: none;color: rgba(255,255,255,.9); font-size: 19px; text-align: center; transition: .3s;}
header .nav-fullscreen:hover {color: #fff;}
header .wrap-user {float: right; position: relative; margin-right: 10px; margin-left: 10px;}
header .wrap-user .nav-user { float: left; height: 50px; position: relative; display: block; padding: 0;}
header .wrap-btn{float:left; position:absolute; top:0; left:0; z-index:5;}
header #right_ui{padding: 0 0 0 100px;}
header .wrap-property{width:100%; height:50px; position:relative;}
header .wrap-mainsearch { position: relative;}
header .wrap-mainsearch .nav-search {line-height: 50px;width: 50px;display: none;float: left;text-decoration: none; color: rgba(255,255,255,.9);font-size: 19px;text-align: center; transition: .3s; margin: 0 0px;}
header .wrap-mainsearch .nav-search:hover{color:#fff;}
header .wrap-mainsearch .main-search { width: 330px; float: left; position: relative; margin: 8px 0 0 0px; display: block; border: none; box-shadow: none; border-radius: 0;  padding: 0; background: none;}
header .wrap-mainsearch .main-search input[type='text'] {width: 100%;height: 34px;background: rgba(255,255,255,.9);box-shadow: 0 1px 1px rgba(0,0,0,.15); border: none; transition: .3s; padding: 0 34px 0 10px; font-size: 14px; border-radius: 3px 0 0 3px;}
header .wrap-mainsearch .main-search input[type='text']:focus{outline:none; background:#fff;}
header .wrap-mainsearch .main-search:before { font-family: 'FontAwesome'; content: "\f002"; width: 34px; height: 34px; line-height: 34px; text-align: center; position: absolute; top: 0; right: 0;font-size: 15px; color:rgba(0,0,0,.5)}
header .wrap-mainsearch .main-search .ui-helper-hidden-accessible{display:none;}
header .wrap-input { float: left; position: relative; border-radius: 0 3px 3px 0; box-shadow: 0 1px 1px rgba(0,0,0,.15);}
header .wrap-input a { display: block; line-height: 34px; height: 34px; margin-top: 8px; background: rgba(255,255,255,.5); padding: 0 11px; display: block; float: left; text-decoration: none; color: #0c77bb; font-size: 17px; text-align: center; position: relative; transition: .3s; position: relative;}
header .wrap-input a:hover{color:#fff;}
header .wrap-input a:before{font-size:22px;}
header .wrap-input a:first-child {}
header .wrap-input a:last-child {border-radius: 0 3px 3px 0;}
header .wrap-user { float: right; position: relative;  margin-right: 10px;}
header .wrap-user .nav-user {float: left; height: 50px; position: relative; display: block; padding: 0;}
header .wrap-user .nav-user .avatar{width: 36px; height: 36px; border-radius: 50%; float: left; display: block; margin: 7px 0; position:relative;}
header .wrap-user .nav-user .avatar i{position:absolute; top:0; left:0; z-index:1; width:36px; height:36px; text-align:center; line-height:36px; color:rgba(0,0,0,.5); transition:.3s;}
header .wrap-user .nav-user:hover .avatar i{color:rgba(255,255,255,.9)}
header .wrap-user.open .nav-user .avatar i{color:#fff;}
header .wrap-user .nav-user .avatar i:before{font-size:36px;}
header .wrap-user .nav-user .avatar img { width: 38px; height: 38px; border-radius: 50%; float: left; display: block; margin: 6px 0; position:relative; z-index:5;}
header .wrap-user .nav-user label {font-size: 15px; color: #fff; float: left; cursor: pointer; font-weight: 500; margin-left: 10px;line-height: 50px; font-family: 'Roboto Condensed', sans-serif;}
header .wrap-user .dropdown-user {left: initial;right: 0; min-width: 155px; background: #fff; margin: 5px 0 0 0; border-radius: 4px 0 4px 4px; border: none; box-shadow: 0 1px 1px rgba(0,0,0,.1); padding: 0; background: #EFA34E;}
header .wrap-user .dropdown-user:before {content: '';border-bottom: 10px solid #EFA34E; border-left: 10px solid transparent;position: absolute; right: 0; top: -10px;}
header .wrap-user .dropdown-user li {padding: 0 15px; position: relative; display: block; width: 100%; float: left;}
header .wrap-user .dropdown-user li a {float: left; margin: 0; padding: 5px 0 5px 20px; width: 100%; position: relative; font-size: 12px; display: block; transition: .3s; color:rgba(0,0,0,.75); transition: .3s;}
header .wrap-user .dropdown-user li a:before{font-family: 'FontAwesome'; position:absolute; top:4px; left:0; font-size:14px;}
header .wrap-user .dropdown-user li.accountInfo a:before{content: "\f21b";}
header .wrap-user .dropdown-user li.changePass a:before{content: "\f084";}
header .wrap-user .dropdown-user li.logOut a:before{content: "\f08b";}
header .wrap-user .dropdown-user li a:hover{color:#fff; background:none;}
header .wrap-user .dropdown-user li:first-child {margin-top: 10px;}
header .wrap-user .dropdown-user li:last-child { background: rgba(0,0,0,.05); padding: 5px 15px; margin-top: 8px; box-shadow: 0 -1px rgba(0,0,0,.05);}


header .wrap-event{float:right; position:relative; }
header .wrap-event .nav-event{display:block; line-height:32px; width:32px; width:32px; text-align:center; background:rgba(255,255,255,.2); box-shadow: 0 0 1px rgba(0,0,0,.1); margin:9px 10px 0 0; border-radius:3px; display:block; float:left; text-decoration:none; color:rgba(255,255,255,1); font-size:15px; text-align:center; position:relative; transition:.3s;}
header .wrap-event .nav-event:hover{color:#fff;}
header .wrap-event.open .nav-event{background:#e4d100; color:#fff; box-shadow: inset 0 1px rgba(255,255,255,.15), 0 1px rgba(0,0,0,.1)} 
header .wrap-event .nav-event .label-num{font-family: 'Roboto Condensed', sans-serif; font-weight:bold; position: absolute; top: -5px; left: -5px; padding:0 1px 0 0; width:18px; height:18px; text-align:center; line-height:17px; background:#e4d100; color:#fff; border-radius: 2px; font-size:11px; letter-spacing:normal; transition:.3s;}
header .wrap-event .nav-event:hover .label-num{left:50%; top:50%; margin:-9px 0 0 -9px;}
header .wrap-event.open .nav-event .label-num{display:none;}
header .wrap-event .dropdown-event{left:initial; right:0; min-width:200px; margin:15px 10px 0 0; border-radius:4px 4px 3px 3px; border:none; box-shadow:0 1px 1px rgba(0,0,0,.1); padding:0 15px 10px 15px;background:#fff9b4; }
header .wrap-event .dropdown-event li{padding: 0 0px; position:relative; display:block; width:100%; float:left; border-bottom: 1px solid rgba(0,0,0,.04)}
header .wrap-event .dropdown-event li:last-child{border:none;}
header .wrap-event .dropdown-event li .label-num{position: absolute; top: 50%; margin-top:-9px; right: 0px; padding:0 4px 0 3px;height:18px; min-width:18px; text-align:center; line-height:18px; background:#e4d100; color:#fff; border-radius: 2px; font-size:11px; letter-spacing:normal; transition:.3s;}
header .wrap-event .dropdown-event li.title{background:#e4d100; margin-left:-15px; margin-right:-15px; width:initial; float:initial;  padding: 8px 15px 6px 15px; margin-bottom:5px; border-radius: 3px 0px 0 0; position:relative; border-bottom:none;}
header .wrap-event .dropdown-event li.title:before{content:''; border-bottom:10px solid #e4d100; border-left: 10px solid transparent; position:absolute; right:0; top:-10px;}
header .wrap-event .dropdown-event li.title b{ color:#fff; font-weight:400; font-size:15px;}
header .wrap-event .dropdown-event li.title .label-num{background:none; color:#fff; width:initial;font-weight:bold; font-family: 'Roboto Condensed', sans-serif; font-size:14px; right:15px;}
header .wrap-event .dropdown-event li a{float:left; margin:0; padding:7px 0; width:100%;  position:relative; font-size:12px; display:block; transition:.3s; color:rgba(0,0,0,.75)}
header .wrap-event .dropdown-event li a:hover{background:none; color:#e4d100;  }

header .wrap-event.catelog{}
header .wrap-event.catelog .nav-event{font-size:16px;}
header .wrap-event.catelog.open .nav-event{background:#7fd7f7}
header .wrap-event.catelog .dropdown-event{background:#7fd7f7; border-radius:4px 0 4px 4px; min-width:150px; padding:10px 15px;}
header .wrap-event.catelog .dropdown-event li{border:none;}
header .wrap-event.catelog .dropdown-event a{color:rgba(0,0,0,.75); padding: 5px 0 5px 20px;}
header .wrap-event.catelog .dropdown-event a:before{font-family: 'FontAwesome'; position:absolute; top:4px; left:0; font-size:14px;}
header .wrap-event.catelog .dropdown-event li.help a:before{content:"\f1cd"}
header .wrap-event.catelog .dropdown-event li.register a:before{content:"\f091"}
header .wrap-event.catelog .dropdown-event li.exportjs a:before{content:"\f0ad"}
header .wrap-event.catelog .dropdown-event a:hover{color:#fff}
header .wrap-event.catelog .dropdown-event a i{margin-right:5px; font-size:14px;}
header .wrap-event.catelog .dropdown-event:before{content:''; border-bottom:10px solid #7fd7f7; border-left: 10px solid transparent;   position:absolute; right:0; top:-10px;}


/* ********************************************************** 
                     Left menu
************************************************************ */
#leftmenu-page{position: fixed; top:50px; bottom: 0; left: 0; overflow: hidden; width: 50px; background-color: #fff; transform: translateX(-50px); transition: transform 0.3s, width 0.3s; z-index:2; border-right:1px solid rgba(0,0,0,.08) }
#leftmenu-page.open-thumb,#leftmenu-page.open-thumb-all{ transform: translateX(0px);}
#leftmenu-page.open-thumb-all{width:320px;}
#leftmenu-page .col-module{position: absolute; overflow-x:hidden; overflow-y: scroll;  width: 340px; height: 100%; }
#leftmenu-page .logo{width:50px; height:49px; display:block; background: url(vbos-thumb.png) no-repeat center; background-size: auto 32px; position:relative; z-index:5; float:left; transition:.3s; margin-left:-1px;}
#leftmenu-page.open-thumb-all .logo{background: url(vhro.png) no-repeat center; background-size: auto 32px; width:90px;}
#leftmenu-page .col-module .dropdown-module{ float:right; width: 180px; position:absolute; top:8px; right:14px; z-index:4; margin: 0;  background: #fafafa; border:1px solid rgba(0,0,0,.08); border-radius:5px; transition:.3s;  overflow:hidden}
#leftmenu-page .col-module .dropdown-module.open{box-shadow: 0 2px 10px rgba(0,0,0,.2); border-color:transparent; border:1px solid #0c77bb}
#leftmenu-page .col-module .dropdown-module .nav-module{ font-weight:bold; width: 100%; padding: 0 40px 0 10px; text-transform: uppercase; line-height: 32px; display: block; white-space: nowrap; overflow: hidden; text-decoration: none;font-size: 13px;  letter-spacing:1px;}
#leftmenu-page .col-module .dropdown-module .nav-module span{white-space:nowrap; overflow:hidden; text-overflow:ellipsis; width:100%; float:left; color:#0c77bb; font-size:13px; }
#leftmenu-page .col-module .dropdown-module .nav-module i{position:absolute; font-size:14px; color:#0c77bb; top:1px; right:0px; width:32px; height:32px; line-height:32px; border-radius:0px; text-align:center;border-left:1px solid rgba(0,0,0,.08); }
#leftmenu-page .col-module .dropdown-module.open .nav-module{background:#fff; border-bottom:1px solid rgba(0,0,0,.08)}
#leftmenu-page .col-module .dropdown-module.open .nav-module span{color:#0c77bb;}
#leftmenu-page .col-module .dropdown-module.open .nav-module i:before{content: "\f00d"; color:#0c77bb; }

#leftmenu-page .col-module .dropdown-module .dropdown-menu{width:100%;  padding:0; position:relative; float:left; box-shadow:none; margin:0; top:0; left:0px; min-width:initial; display:block; visibility:visible; opacity:0; transition:.3s; z-index:1;  height:0; overflow:hidden; background:none; border:none; border-radius:0; box-shadow:none; }
#leftmenu-page .col-module .dropdown-module.open .dropdown-menu{visibility:initial; opacity:1; height:auto;}
#leftmenu-page .col-module .dropdown-module .dropdown-menu ul{width:100%; margin:0; padding:10px 0; list-style:none; float:left;}
#leftmenu-page .col-module .dropdown-module .dropdown-menu ul li{float:left; position:relative; width:100%;}
#leftmenu-page .col-module .dropdown-module .dropdown-menu ul li:nth-child(2n){margin-right:0;}
#leftmenu-page .col-module .dropdown-module .dropdown-menu ul li a{width: 100% ;float: left; font-family: Roboto, Tahome; padding: 3px 15px;  display: block; position: relative; z-index: 1; margin: 0; color:#43465f; font-size: 14px; text-align: left; overflow: hidden; text-overflow:ellipsis; white-space:nowrap; cursor: pointer; transition: .3s; text-decoration:none;}
#leftmenu-page .col-module .dropdown-module .dropdown-menu ul li a:hover{color:#0c77bb;}
#leftmenu-page .col-module .dropdown-module .dropdown-menu ul li a.tabactive{color: #0c77bb;  }
#leftmenu-page .col-module .dropdown-module .dropdown-menu:hover{overflow-y:auto;}
#leftmenu-page .col-module .dropdown-module .dropdown-menu::-webkit-scrollbar { width: 5px;}
#leftmenu-page .col-module .dropdown-module .dropdown-menu::-webkit-scrollbar-track {background:none; padding: 0 ;  border-right:1px solid #454f6b;}
#leftmenu-page .col-module .dropdown-module .dropdown-menu::-webkit-scrollbar-thumb {background-color:rgba(255,255,255,.3); border-right:1px solid #454f6b; transition:.3s;}
#leftmenu-page .col-module .dropdown-module .dropdown-menu::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.7)}

#leftmenu-page .col-module .dropdown-module .tabcontent ul{display:none;}
#leftmenu-page .col-module #menu_left_parent{width:100%; float:left; color:#43465f;}

#leftmenu-page .col-module #menu_left_parent #menu_left{width:100%; padding: 0px; float:left;}
#leftmenu-page .col-module #menu_left_parent #menu_left h1{width: 100%; min-height:50px; line-height:50px; font-family: Roboto, Tahoma, sans-serif; font-weight:bold; float: left; clear: both;display: block; position: relative; z-index: 1; margin: 0; padding:0px 0;color:#43465f;  font-size:14px; letter-spacing:1px; text-transform:uppercase; text-align:center; white-space:nowrap; overflow:hidden; cursor:pointer; transition:.3s; border-top:1px solid rgba(0,0,0,.07); transition:.3s;}
#leftmenu-page .col-module #menu_left_parent #menu_left h1:hover{color:#0c77bb;}
#leftmenu-page .col-module #menu_left_parent #menu_left h1.current{ color:#0c77bb;}
#leftmenu-page .col-module #menu_left_parent #menu_left h1 span{display:block; float:left; text-align:center; line-height:50px;}
#leftmenu-page .col-module #menu_left_parent #menu_left ul{width:100%;float:left; margin:-10px 0 0 0; padding:0 20px 0 50px; list-style:none;}
#leftmenu-page .col-module #menu_left_parent #menu_left h1.current ul{height:auto;}
#leftmenu-page .col-module #menu_left_parent #menu_left ul li{width:100%; float:left; }
#leftmenu-page .col-module #menu_left_parent #menu_left ul li a{color:#43465f; font-size:14px; line-height:0; height:0; opacity:0; visibility:hidden; letter-spacing:normal; text-transform:none; font-weight:normal; font-family:Roboto, Tahoma; text-decoration:none; padding:0 0 0 15px; float:left; position:relative; width:100%; transition:.3s; overflow:hidden;}
#leftmenu-page .col-module #menu_left_parent #menu_left ul li a:hover,
#leftmenu-page .col-module #menu_left_parent #menu_left ul li a.active{color:#0c77bb; padding-left:25px; font-weight:bold; letter-spacing:1px;}
#leftmenu-page .col-module #menu_left_parent #menu_left ul li a:before {content: ''; width: 8px; height: 8px; border:2px solid rgba(0,0,0,.1); position: absolute;left: 0; top: 11px; transition: .3s;}
#leftmenu-page .col-module #menu_left_parent #menu_left ul li a:hover:before{border-color:#0c77bb}
#leftmenu-page .col-module #menu_left_parent #menu_left ul li a.active:before{border-color:#0c77bb} 

#leftmenu-page.open-thumb-all .col-module #menu_left_parent #menu_left h1.current{padding-bottom:15px;}
#leftmenu-page.open-thumb-all .col-module #menu_left_parent #menu_left h1.current ul li a{height:30px; line-height:30px; opacity:1; visibility:inherit;}


/******************************************************************
                             icon 
  *****************************************************************  */

#leftmenu-page .col-module #menu_left_parent #menu_left h1 span.qldanhmuc{height:0 !important; margin:0;}
#leftmenu-page .col-module #menu_left_parent #menu_left h1:before{width:50px; content:''; height:50px; margin:0 2px 0 -2px; float:left; text-align:center; transition:.3s; }
#leftmenu-page .col-module #menu_left_parent #menu_left h1:after{transition:.3s;}
#leftmenu-page .col-module #menu_left_parent #menu_left h1.current:before,
#leftmenu-page .col-module #menu_left_parent #menu_left h1.current:after,
#leftmenu-page .col-module #menu_left_parent #menu_left h1:hover:before,
#leftmenu-page .col-module #menu_left_parent #menu_left h1:hover:after{opacity:1;}


/* Lõi Vitda */
#leftmenu-page .col-module #menu_left_parent #menu_left h1.loiVtda_heThong:before{background:url(icon/phanHe/ph_loiVitda/loiVtda_heThong.svg) no-repeat center;  background-size: auto 24px;}
#leftmenu-page .col-module #menu_left_parent #menu_left h1.loiVitda_tuDien:before{background:url(icon/phanHe/ph_loiVitda/loiVitda_tuDien.svg) no-repeat center;  background-size: auto 22px;}
#leftmenu-page .col-module #menu_left_parent #menu_left h1.loiVitda_cauHinh:before{background:url(icon/phanHe/ph_loiVitda/loiVitda_cauHinh.svg) no-repeat center;  background-size: auto 24px;}
#leftmenu-page .col-module #menu_left_parent #menu_left h1.loiVitda_capPhepSanPham:before{background:url(icon/phanHe/ph_loiVitda/loiVitda_capPhepSanPham.svg) no-repeat center;  background-size: auto 26px;}

/* Hệ Thống */
#leftmenu-page .col-module #menu_left_parent #menu_left h1.heThong_thongTinCongTy:before{background:url(icon/phanHe/ph_heThong/heThong_thongTinCongTy.svg) no-repeat center;  background-size: auto 24px;}
#leftmenu-page .col-module #menu_left_parent #menu_left h1.heThong_cauHinhChamCong:before{background:url(icon/phanHe/ph_heThong/heThong_cauHinhChamCong.svg) no-repeat center;  background-size: auto 26px;}
#leftmenu-page .col-module #menu_left_parent #menu_left h1.heThong_congThucLuong:before{background:url(icon/phanHe/ph_heThong/heThong_congThucLuong.svg) no-repeat center;  background-size: auto 24px;}
#leftmenu-page .col-module #menu_left_parent #menu_left h1.heThong_cauHinhBacLuong:before{background:url(icon/phanHe/ph_heThong/heThong_cauHinhBacLuong.svg) no-repeat center;  background-size: auto 24px;}
#leftmenu-page .col-module #menu_left_parent #menu_left h1.heThong_cauHinhPhuCap:before{background:url(icon/phanHe/ph_heThong/heThong_cauHinhPhuCap.svg) no-repeat center;  background-size: auto 24px;}
#leftmenu-page .col-module #menu_left_parent #menu_left h1.heThong_cauHinhBaoHiem:before{background:url(icon/phanHe/ph_heThong/heThong_cauHinhBaoHiem.svg) no-repeat center;  background-size: auto 24px;}
#leftmenu-page .col-module #menu_left_parent #menu_left h1.heThong_cauHinhPhep:before{background:url(icon/phanHe/ph_heThong/heThong_cauHinhPhep.svg) no-repeat center;  background-size: auto 24px;}
#leftmenu-page .col-module #menu_left_parent #menu_left h1.heThong_cauHinhThue:before{background:url(icon/phanHe/ph_heThong/heThong_cauHinhThue.svg) no-repeat center;  background-size: auto 22px;}
#leftmenu-page .col-module #menu_left_parent #menu_left h1.heThong_danhMucTuDien:before{background:url(icon/phanHe/ph_heThong/heThong_danhMucTuDien.svg) no-repeat center;  background-size: auto 24px;}
#leftmenu-page .col-module #menu_left_parent #menu_left h1.heThong_phanQuyenNguoiDung:before{background:url(icon/phanHe/ph_heThong/heThong_phanQuyenNguoiDung.svg) no-repeat center;  background-size: auto 24px;}

/* Nhân Sự */
#leftmenu-page .col-module #menu_left_parent #menu_left h1.nhanSu_hoSo:before{background:url(icon/phanHe/ph_nhanSu/nhanSu_hoSo.svg) no-repeat center;  background-size: auto 24px;}
#leftmenu-page .col-module #menu_left_parent #menu_left h1.nhanSu_theoDoi:before{background:url(icon/phanHe/ph_nhanSu/nhanSu_theoDoi.svg) no-repeat center;  background-size: auto 24px;}
#leftmenu-page .col-module #menu_left_parent #menu_left h1.nhanSu_baoHiemThue:before{background:url(icon/phanHe/ph_nhanSu/nhanSu_baoHiemThue.svg) no-repeat center;  background-size: auto 24px;}
#leftmenu-page .col-module #menu_left_parent #menu_left h1.nhanSu_chamCong:before{background:url(icon/phanHe/ph_nhanSu/nhanSu_chamCong.svg) no-repeat center;  background-size: auto 26px;}
#leftmenu-page .col-module #menu_left_parent #menu_left h1.nhanSu_diTreVeSom:before{background:url(icon/phanHe/ph_nhanSu/nhanSu_diTreVeSom.svg) no-repeat center;  background-size: auto 22px;}
#leftmenu-page .col-module #menu_left_parent #menu_left h1.nhanSu_tinhLuong:before{background:url(icon/phanHe/ph_nhanSu/nhanSu_tinhLuong.svg) no-repeat center;  background-size: auto 24px;}
#leftmenu-page .col-module #menu_left_parent #menu_left h1.nhanSu_tuyenDung:before{background:url(icon/phanHe/ph_nhanSu/nhanSu_tuyenDung.svg) no-repeat center;  background-size: auto 24px;}
#leftmenu-page .col-module #menu_left_parent #menu_left h1.nhanSu_daoTao:before{background:url(icon/phanHe/ph_nhanSu/nhanSu_daoTao.svg) no-repeat center;  background-size: auto 24px;}
#leftmenu-page .col-module #menu_left_parent #menu_left h1.nhanSu_danhGia:before{background:url(icon/phanHe/ph_nhanSu/nhanSu_danhGia.svg) no-repeat center;  background-size: auto 24px;}
#leftmenu-page .col-module #menu_left_parent #menu_left h1.nhanSu_deNghi:before{background:url(icon/phanHe/ph_nhanSu/nhanSu_deNghi.svg) no-repeat center;  background-size: auto 24px;}

/* Công cụ */
#leftmenu-page .col-module #menu_left_parent #menu_left h1.congCu_congCu:before{background:url(icon/phanHe/ph_congCu/congCu_congCu.svg) no-repeat center;  background-size: auto 24px;}
#leftmenu-page .col-module #menu_left_parent #menu_left h1.congCu_deNghi:before{background:url(icon/phanHe/ph_congCu/congCu_deNghi.svg) no-repeat center;  background-size: auto 24px;}
#leftmenu-page .col-module #menu_left_parent #menu_left h1.congCu_tonKho:before{background:url(icon/phanHe/ph_congCu/congCu_tonKho.svg) no-repeat center;  background-size: auto 24px;}
#leftmenu-page .col-module #menu_left_parent #menu_left h1.congCu_nhapKho:before{background:url(icon/phanHe/ph_congCu/congCu_nhapKho.svg) no-repeat center;  background-size: auto 24px;}
#leftmenu-page .col-module #menu_left_parent #menu_left h1.congCu_capPhat:before{background:url(icon/phanHe/ph_congCu/congCu_capPhat.svg) no-repeat center;  background-size: auto 24px;}
#leftmenu-page .col-module #menu_left_parent #menu_left h1.congCu_thanhLyDieuChuyen:before{background:url(icon/phanHe/ph_congCu/congCu_thanhLyDieuChuyen.svg) no-repeat center;  background-size: auto 24px;}
#leftmenu-page .col-module #menu_left_parent #menu_left h1.congCu_tuDien:before{background:url(icon/phanHe/ph_congCu/congCu_tuDien.svg) no-repeat center;  background-size: auto 24px;}
#leftmenu-page .col-module #menu_left_parent #menu_left h1.congcU_Tonkho:before{background:url(icon/phanHe/ph_congCu/congCu_Tonkho.svg) no-repeat center;  background-size: auto 24px;}
/* ********************************************************** 
                     Content Page
************************************************************ */
#content-page{width:100%; float:left; position:relative; transition:.3s; background:#eef2f5; z-index:1;}
#content-page .content_tab{width:100%; float:left; position:relative;}
#content-page .ui-tabs{height:50px; position:absolute; top:0; left:0; width:100%; background: #fff;     box-shadow: inset 0 -1px rgba(0,0,0,.1); }
#content-page .ui-tabs .ui-tabs-nav li a:link{background:none; font-size: 16px; font-family: Roboto, sans-serif; margin: 0; padding: 0 0 0 15px; float: left; color: #54627c; height:50px; line-height: 50px; text-transform: uppercase; font-weight:bold}  
#content-page .content_tab{position:absolute; top:0; left:0;}
#swap_toolbar{ height:50px; width:100%; background:#fff; box-shadow: inset 0 -1px rgba(0,0,0,.07)}

ul.listButtonToolbar{float:right; margin:9px 10px 9px 10px; padding:0 85px 0 0 ; list-style:none;}
ul.listButtonToolbar li{position:relative}
ul.listButtonToolbar li a{ width: 38px; height: 32px;font-size: 14px; padding: 0;display: block; float: left; text-align: center;line-height: 30px; text-decoration: none; color: rgba(0,0,0,.7); transition: .3s; background: #e6f5ff; border: 1px solid #c6d8e4; box-shadow: 0 1px 1px rgba(0,0,0,.07); border-left:none; position:relative;}
ul.listButtonToolbar li a.first {border-radius: 3px 0 0 3px;  border-left: 1px solid #c6d8e4;}
ul.listButtonToolbar li a.last{border-radius: 0 3px 3px 0}
ul.listButtonToolbar li a:hover{background:#d9eaf5; color:#0c77bb; box-shadow: inset  0 0 10px rgba(0,0,0,.05)}
ul.listButtonToolbar li a.disable{display:none !important;}
ul.listButtonToolbar li.panelbtnPrintParent{float:right; position:absolute; top:0; right:0;}
ul.listButtonToolbar li a.btnPrint { border: 1px solid rgba(0,0,0,.12); border-left:none; border-radius: 0 3px 3px 0; float:right;  background:#fffde5; }
ul.listButtonToolbar li a.btnPrint:hover{ background:#f5f2d7; color:#a09302;}
#filter_right{position:absolute; top:-37px; right:52px; height:32px; z-index:5; cursor:pointer}
#filter_right .filter_right_setting{width: 38px;height: 32px;font-size: 14px;display: block;float: left;text-align: center;line-height: 32px;text-decoration: none;color: rgba(0,0,0,.7); transition: .3s; background:#fff; box-shadow: 0 1px 1px rgba(0,0,0,.07);border: 1px solid rgba(0,0,0,.12); background: #fffde5; border-radius:3px 0 0 3px;} 
#filter_right .filter_right_setting:before{font-size:12px; font-weight:normal}
#filter_right:hover .filter_right_setting{ background:#f5f2d7; color:#a09302;}
#filter_right .filter_right_panel{display:block; visibility:hidden; opacity:0; position:absolute; top:50px; right:-42px; background:#fff; border-radius: 3px; border:1px solid rgba(0,0,0,.1);box-shadow: 0 0 10px rgba(0,0,0,.07); width:220px; padding: 5px 0 10px 0; transition:.3s;}
#filter_right:hover .filter_right_panel{visibility:initial; opacity:1; top:32px; }
#filter_right .div_filter{width:100%; float:left; padding: 0 15px; margin-top:10px;}
#filter_right .div_filter select{width:100% !important}
#filter_right ul.group_status{width:100%; margin:15px 0 0 0; padding:6px 10px 0 10px; list-style:none; background:rgba(0,0,0,.03); float:left; box-shadow: inset 0 -1px rgba(0,0,0,.03) }
#filter_right ul.group_status li{width:50%; float:left; font-weight:normal; font-size:12px; cursor:pointer; padding: 8px 10px; color:rgba(0,0,0,.5); border: 1px solid transparent; border-bottom: none; border-radius: 3px 3px 0 0; text-transform:uppercase}
#filter_right ul.group_status li.active{background:#fff; color:#0c77bb; border-color:rgba(0,0,0,.07)}
#filter_right ul.group_status li i{-ms-transform: rotate(90deg); -webkit-transform: rotate(90deg); transform: rotate(90deg); float:left; margin:1px 5px 0 0;}
#filter_right ul.group_status li i:before{font-size:12px;}
#filter_right ul.custom_group{width:100%; padding:10px 15px 5px 15px; margin:0; list-style:none; float:left;}
#filter_right ul.custom_group li{width:100%; float:left; font-weight:normal; font-size:12px; color:rgba(0,0,0,.7); cursor:pointer; padding: 5px 0 5px 22px; margin:0; position:relative;}
#filter_right ul.custom_group li.active{color:#000;}
#filter_right ul.custom_group li:before{content:'';display: inline-block;  position: absolute; width: 16px; height: 16px; left: 15px; margin: 1px 0 0 -16px; border: 1px solid #d5dae4; border-radius: 50%; background-color: #fff;  -webkit-transition: border 0.15s ease-in-out; -o-transition: border 0.15s ease-in-out; transition: border 0.15s ease-in-out;}
#filter_right ul.custom_group li.active:after { display: inline-block; position: absolute; content: " "; width: 6px; height: 6px; left: 20px; top: 11px; margin-left: -16px; border-radius: 50%; background-color: #0c77bb;  }

/* ********************************************************** 
                     Layout
************************************************************ */

.left-open header,
.left-open #content-page{margin-left:100px;}
.left-open header .nav-menu{color:#fff;}
.left-open header .nav-menu:before{content:"\f03b"}

.left-open #leftmenu-page{left:0;}

.subleft-open header,
.subleft-open #content-page{margin-left:350px;}
.subleft-open #leftmenu-page{width:350px;} 
.subleft-open #leftmenu-page .col-module #menu_left_parent #menu_left div.current{visibility:initial; opacity:1;}

/* ********************************************************** 
                    jqgird
************************************************************ */

.ui-jqgrid .ui-jqgrid-hdiv{background:#fff; position:relative; overflow:hidden; box-shadow: inset 0 -1px rgba(0,0,0,.1);} 
.ui-jqgrid .ui-jqgrid-htable th {background: #fff; padding: 10px 5px; height:38px;  box-shadow: inset 0 -1px rgba(0,0,0,.1); color: #0c77bb; white-space: nowrap; font-size:12px; }
.ui-jqgrid .ui-jqgrid-htable th .ui-jqgrid-sortable{ overflow:hidden; text-overflow:ellipsis;}
.ui-jqgrid .ui-pager-control{background:#fff; height:35px; box-shadow: inset 0 1px rgba(0,0,0,.1); position:relative}
.ui-jqgrid tr.ui-row-ltr td{padding: 0px 5px;  box-shadow: inset 0 -1px rgba(0,0,0,.05); white-space: nowrap; font-size:12px; background: #f2f5f7; overflow:hidden; text-overflow:ellipsis; height:32px;}
.ui-jqgrid tr.ui-row-ltr td input[type='text']{height:24px;}
.ui-jqgrid tr.jqgrow.ui-priority-secondary td {background: #eef2f5;}
.ui-jqgrid tr.ui-row-ltr.jqgroup{z-index:3;}
.ui-jqgrid tr.ui-row-ltr.jqgroup td{background:#7fd7f7;  box-shadow: inset 0 -1px rgba(0,0,0,.05), 0 -1px #79cdeb; font-size:12px; }
.ui-jqgrid tr.ui-row-ltr.jqgroup td b{color:#2a303c; font-size:12px;}
.ui-jqgrid tr.ui-row-ltr.jqgroup td .ui-icon{background:none; position:relative; float:left; margin:2px 7px 0 0; text-indent:initial;}
.ui-jqgrid tr.ui-row-ltr.jqgroup td .ui-icon:before{font-family: 'FontAwesome'; width:16px; height:16px; text-align:center; line-height:16px; position:absolute; top:0; left:0; font-size:14px;}
.ui-jqgrid tr.ui-row-ltr.jqgroup td .ui-icon.ui-icon-circlesmall-minus:before{content:"\f147"}
.ui-jqgrid tr.ui-row-ltr.jqgroup td .ui-icon.ui-icon-circlesmall-plus:before{content:"\f196"}
.ui-jqgrid tr.ui-row-ltr.ui-state-highlight{z-index:2; }
.ui-jqgrid tr.ui-row-ltr.ui-state-highlight td{background:#e4d100;  box-shadow: inset 0 -1px rgba(0,0,0,.05), 0 -1px #d9c700;}

/* paging */
.ui-jqgrid .ui-pg-table{font-size:12px; line-height:36px;}
.ui-jqgrid .ui-paging-info{padding-right:10px;}
.ui-jqgrid .ui-pg-input{height:22px;width:25px; text-align:center; margin: 0 5px; font-size:11px; font-weight:bold; }
.ui-jqgrid .ui-pg-selbox{height:22px; line-height:20px; width:50px;text-align:center; margin: 0 5px;  font-size:11px; font-weight:bold; }  
.ui-jqgrid .ui-pager-control  span.ui-icon{background:none; width:20px; height:20px; border-radius:3px; position:relative; text-indent:initial; margin: 3px 0 0 5px; }
.ui-jqgrid .ui-pager-control  span.ui-icon:before{ font-family: 'FontAwesome'; width:20px; text-align:center; line-height:20px; height:20px; position:absolute; top:0; left:0; color:rgba(0,0,0,.4); font-size:12px; transition:.3s; }
.ui-jqgrid .ui-pager-control  span.ui-icon:hover:before{color:#0c77bb}
.ui-jqgrid .ui-pager-control  span.ui-icon.ui-icon-search:before{ content:"\f002"}
.ui-jqgrid .ui-pager-control  span.ui-icon.ui-icon-refresh:before{ content:"\f021"}
.ui-jqgrid .ui-pager-control  span.ui-icon.ui-icon-newwin:before{ content:"\f2d2"}
.ui-jqgrid .ui-pager-control  span.ui-icon.ui-icon-seek-first:before{content:"\f049"}
.ui-jqgrid .ui-pager-control  span.ui-icon.ui-icon-seek-prev:before{content:"\f04a"}
.ui-jqgrid .ui-pager-control  span.ui-icon.ui-icon-seek-next:before{content:"\f04e"}
.ui-jqgrid .ui-pager-control  span.ui-icon.ui-icon-seek-end:before{content:"\f050"}
.ui-jqgrid .ui-pager-control td span.ui-icon{margin:0;padding-left: 20px;}
.ui-jqgrid .ui-pager-control .ui-separator {height: 18px; border-left: 1px solid rgba(0,0,0,.5) ; margin: 1px; float: right;}


/* ********************************************************** 
                    dialog
************************************************************ */
.processing-dialog .ui-dialog-titlebar{background: #fff; height: 50px; padding: 14px 20px 11px 15px; border: none; box-shadow: 0 1px rgba(0,0,0,.05); position: relative; z-index: 2; display: block;  border-radius: 5px 5px 0 0; position:relative;}
.processing-dialog .ui-dialog-title{margin: 5px 0 0 0;}
.processing-dialog .ui-dialog-title ul.listButtonToolbar{margin-left:-14px;}
.ui-dialog .ui-dialog-titlebar-close{width: 25px; height: 25px; text-align: center; line-height: 25px; font-size: 14px; background: rgba(0,0,0,.03); border-radius: 4px; right: 8px; margin-top: -12px; color: rgba(0,0,0,.7); text-decoration: none; transition:.3s;} 
.ui-dialog .ui-dialog-titlebar-close:hover{color:#0c77bb}
.ui-dialog .ui-dialog-titlebar-close:before{font-size:10px;}

.ui-dialog .ui-dialog-content{padding: 5px 5px 15px 5px; background:#f7f8f8; border-radius: 0 0 5px 5px; float:left;}

.ui-dialog .ui-dialog-titlebar-close{width: 25px; height: 25px; text-align: center; line-height: 25px; font-size: 14px; background: rgba(0,0,0,.03); border-radius: 4px; right: 12px; margin-top: -12px; color: rgba(0,0,0,.7); text-decoration: none; transition:.3s;}  
.ui-dialog .ui-dialog-titlebar-close:hover{color:#0c77bb; background: rgba(0,0,0,.1);}
.ui-dialog .ui-dialog-titlebar-close:before{font-size:10px;}
.ui-dialog.ui-widget-content{background:#fff; border-radius:5px;}

.processing-dialog .ui-dialog-titlebar{background: #fff; height: 50px; line-height:50px; padding:0; border: none; position: relative; z-index: 2; display: block;  border-radius: 5px 5px 0 0; position:relative; box-shadow: inset 0 -1px rgba(0,0,0,.07)}
.processing-dialog .ui-dialog-title{font-family: "Roboto", "segoe ui", Helvetica, Arial, sans-serif; text-transform:uppercase; padding-left:15px; margin:0; font-size:14px; font-weight:bold; color:rgba(0,0,0,.85); position:relative; z-index:2; }
.processing-dialog .ui-dialog-title ul.listButtonToolbar{margin: 9px 0 0 -10px;}
.processing-dialog .ui-dialog-buttonpane{height:initial; margin-top:-3px;}

.ui-dialog .ui-dialog-content{padding: 0;padding-left:20px; background:rgba(0,0,0,.02); border-radius: 0 0 5px 5px; float:left;margin-bottom:20px; }
.ui-dialog .ui-dialog-buttonpane button{ font-family: "Roboto", "segoe ui", Helvetica, Arial, sans-serif; color:rgba(0,0,0,.85); border-radius:3px; padding:0 0px; height:30px;  font-size:12px; margin:0; text-shadow:none; margin-left:5px;}
.ui-dialog .ui-dialog-buttonpane button .ui-button-text{padding: 0 15px; line-height:28px;}

.warning-dialog .ui-dialog-titlebar{height:50px; background:#fffde5; float:left; width:100%; margin:0 0; padding:0; box-shadow: inset 0 -1px rgba(0,0,0,.08); position:relative; overflow:hidden}
.warning-dialog .ui-dialog-title{margin:0; padding:0 0 0 15px; font-family: "Roboto", "segoe ui", Helvetica, Arial, sans-serif; line-height:50px; font-size:14px; font-weight:bold; color:#bfb103; position:relative; z-index:2; }
.ui-dialog.warning-dialog .ui-dialog-content{background:#fff; width:100% !important; padding:10px 15px; float:left;}
.ui-dialog.warning-dialog .ui-dialog-titlebar-close{right:2px;}
.warning-dialog .ui-dialog-buttonpane{width:100%; height:initial; height:55px; padding-right:5px; }

/* Quản lý tệp tin */
.ui-dialog.ui-widget-content.ui-dialog-filemanagement{border-radius: 5px 5px 5px 7px;}
.ui-dialog-filemanagement .ui-dialog-content{position:relative; z-index:3; width:100%; padding:0!important; margin:0!important; }
.ui-dialog-filemanagement .ui-dialog-buttonpane{position:relative; z-index:4; margin-top:-40px; height:1px; padding:0; background:none; }

.ui-dialog-filemanagement .content-filemanagement{width:100%; min-height:400px; float:left; display:table; overflow:hidden}
.ui-dialog-filemanagement .content-filemanagement .swap_colleft{display: table-cell; width: 250px !important; margin: 10px 0 0 15px; border-right: 1px solid rgba(0,0,0,.05); vertical-align: top; position: relative;}
.ui-dialog-filemanagement .content-filemanagement .swap_colleft .title-top{float: left; padding-left: 35px; float: left;  margin: 15px 0 0 15px; background: url(cloud.png) no-repeat 0 center;font-weight: bold; font-size:14px; } 
.ui-dialog-filemanagement .content-filemanagement .swap_colleft .content-tree{width:100%; float:left; position:relative; height:480px; overflow-y:auto;}
.ui-dialog-filemanagement .content-filemanagement .swap_colleft .content{ width:100%; height:auto; position:absolute; left:0; bottom:0; background: url(images/bg-process-dialog.png) no-repeat 0px -139px; clear:both; float:left; overflow:auto; overflow-x:hidden;}
.ui-dialog-filemanagement .content-filemanagement .swap_colleft .title-sub{width:100%; position:absolute; left:0; bottom:0px; float:left; height:48px;}  
.ui-dialog-filemanagement .content-filemanagement .swap_colleft .title-sub form{display:none;}
.ui-dialog-filemanagement .content-filemanagement .swap_colleft .title-sub a{text-decoration:none; background:#4aa6ef; color:#fff; line-height:48px; width:50%; text-align:center; display:block; float:left; transition:.3s;}
.ui-dialog-filemanagement .content-filemanagement .swap_colleft .title-sub a:hover{background:#388bce}
.ui-dialog-filemanagement .content-filemanagement .swap_colleft .title-sub a:first-child{width:65%; border-radius: 0 0 0 5px;}
.ui-dialog-filemanagement .content-filemanagement .swap_colleft .title-sub a:last-child{width:35%; box-shadow: inset  1px 0 rgba(0,0,0,.15);}
.ui-dialog-filemanagement .content-filemanagement .swap_colleft .title-sub a label{margin:0; cursor:pointer;}
.ui-dialog-filemanagement .content-filemanagement .swap_colleft .title-sub a:focus{outline:none;}
.ui-dialog-filemanagement .content-filemanagement .swap_colleft .content-loading{width:100%; position:absolute; background:#fff; left:0; bottom:48px; background:#85c7fb; }
.ui-dialog-filemanagement .content-filemanagement .swap_colleft .content-loading tr{width:100%; float:left; padding-left: 10px; padding-right:10px;}
.ui-dialog-filemanagement .content-filemanagement .swap_colleft .content-loading tr td{padding: 0; color:rgba(0,0,0,.9);}
.ui-dialog-filemanagement .content-filemanagement .swap_colleft .content-loading tr:first-child{padding-top: 10px;}
.ui-dialog-filemanagement .content-filemanagement .swap_colleft .content-loading tr:last-child{padding-bottom: 10px;}

.ui-dialog-filemanagement .content-filemanagement .swap_colleft .treeview{margin-left:5px; margin-top:10px; margin-left:22px; float:left; position:relative;}
.ui-dialog-filemanagement .content-filemanagement .swap_colleft .treeview:before{content:''; width:1px; height:10px; background:rgba(0,0,0,.1); position:absolute; left:6px; top:-10px;}
.ui-dialog-filemanagement .content-filemanagement .swap_colleft .treeview li{padding:5px 0 5px 20px; position:relative; background:none; overflow:hidden; clear:both;}
.ui-dialog-filemanagement .content-filemanagement .swap_colleft .treeview li span.active{color:#ef9f22; font-weight:bold;} 
.ui-dialog-filemanagement .content-filemanagement .swap_colleft .treeview li:before{content:''; width:1px; height:100%; background:rgba(0,0,0,.1); position:absolute; left:6px; top:0;}
.ui-dialog-filemanagement .content-filemanagement .swap_colleft .treeview li.lastCollapsable:before, .ui-dialog-filemanagement .content-filemanagement .swap_colleft .treeview li.lastExpandable:before{height:15px;}
.ui-dialog-filemanagement .content-filemanagement .swap_colleft .treeview li.last:before{height:50%;}
.ui-dialog-filemanagement .content-filemanagement .swap_colleft .treeview span{background:url(folder-s.png) no-repeat 0 center; font-size:12px; position:relative; padding-left:22px; z-index:3; transition:.3s; float:left;}
.ui-dialog-filemanagement .content-filemanagement .swap_colleft .treeview span:before{content:''; width:12px; height:1px; background:rgba(0,0,0,.1); position:absolute; left:-13px; top:8px;}
.ui-dialog-filemanagement .content-filemanagement .swap_colleft .treeview li.expandable span{background:url(folder-s.png) no-repeat 0 center;}
.ui-dialog-filemanagement .content-filemanagement .swap_colleft .treeview .hitarea{background:none; position:relative; width:11px; height:11px; margin:0; position:absolute; left:0px; top:8px; z-index:5;}
.ui-dialog-filemanagement .content-filemanagement .swap_colleft .treeview .expandable-hitarea:before{ width:100%; height:100%; content:''; position:absolute; top:0; left:0; background:url(plus.png) no-repeat center }
.ui-dialog-filemanagement .content-filemanagement .swap_colleft .treeview .collapsable-hitarea:before{width:100%; height:100%; content:''; position:absolute; top:0; left:0; background:url(min.png) no-repeat center }
.ui-dialog-filemanagement .content-filemanagement .swap_colleft .treeview ul:before{content:''; display:none; width:1px; height:5px; background:rgba(0,0,0,.1); position:absolute; left:6px; top:-5px;}
.ui-dialog-filemanagement .content-filemanagement .swap_colleft .treeview .hover { color: #e99c1c; cursor: pointer; }
.ui-dialog-filemanagement .content-filemanagement .swap_colleft .treeview ul{background:none; position:relative}
.ui-dialog-filemanagement .content-filemanagement .swap_colleft .treeview li.lastCollapsable,
.ui-dialog-filemanagement .content-filemanagement .swap_colleft .treeview li.lastExpandable{background:none;}


.ui-dialog-filemanagement .content-filemanagement .swap_colright{display: table-cell; box-shadow:inset 0 -48px rgba(255,255,255,.5); padding-bottom: 48px; background: rgba(0,0,0,.035); vertical-align: top; position: relative; border-radius: 0 0 4px 0;}
.ui-dialog-filemanagement .content-filemanagement .swap_colright:before{content:''; width:100%; height:1px; background:rgba(0,0,0,.05); position:absolute; left:0; bottom:48px;}
.ui-dialog-filemanagement .content-filemanagement .swap_colright .title-top{width:100%; color:#353535; background:rgba(255,255,255,.5); font-weight:bold; position:relative; float:left; font-size:12px; padding: 7px 8px 7px 7px; border-bottom:1px solid rgba(0,0,0,.07)} 
.ui-dialog-filemanagement .content-filemanagement .swap_colright .title-top .swap_btn_View{float:left;}
.ui-dialog-filemanagement .content-filemanagement .swap_colright .title-top .swap_btn_View .active{background:#d9eaf5; color:#0c77bb; box-shadow: inset  0 0 10px rgba(0,0,0,.05)}



.ui-dialog-filemanagement .content-filemanagement .swap_colright .title-top .bt_choose{ height: 32px; line-height: 30px;  padding: 0 10px 0 29px; position:relative; font-size: 12px;color: rgba(0,0,0,.75); font-weight: bold;border-radius: 3px; border: 1px solid rgba(0,0,0,0.15); box-shadow: 0 1px 1px rgba(0,0,0,0.05);  display: block; float: right; background: #fff; transition:.3s;}
.ui-dialog-filemanagement .content-filemanagement .swap_colright .title-top .bt_choose:before{width:30px; height:32px; position:absolute; top:0; left:0; line-height:32px; text-align:center; font-size:14px; font-family: 'FontAwesome'; content:"\f046"; font-weight:normal;}
.ui-dialog-filemanagement .content-filemanagement .swap_colright .title-top .bt_choose:hover{color:#0c77bb;}
.ui-dialog-filemanagement .content-filemanagement .swap_colright .title-top .bt_choose:focus{outline:none;}
.ui-dialog-filemanagement .content-filemanagement .swap_colright .title-top .bt_choose label{margin:0; cursor:pointer;}
.ui-dialog-filemanagement .content-filemanagement .swap_colright .title-top .bt_choose span{display:none;}

.ui-dialog-filemanagement .content-filemanagement .swap_colright .title-top .bt_delete { height: 32px; line-height: 30px;  padding: 0 10px 0 29px; position:relative; font-size: 12px;color: rgba(0,0,0,.75); font-weight: bold;border-radius: 3px; border: 1px solid rgba(0,0,0,0.15); box-shadow: 0 1px 1px rgba(0,0,0,0.05);  display: block; float: right; background: #fff; transition:.3s; margin-left: 7px;}
.ui-dialog-filemanagement .content-filemanagement .swap_colright .title-top .bt_delete:before{width:30px; height:32px; position:absolute; top:0; left:0; line-height:32px; text-align:center; font-size:14px; font-family: 'FontAwesome'; content:"\f1f8"; font-weight:normal;}
.ui-dialog-filemanagement .content-filemanagement .swap_colright .title-top .bt_delete:hover{color:#0c77bb;}
.ui-dialog-filemanagement .content-filemanagement .swap_colright .title-top .bt_delete:focus{outline:none;}
.ui-dialog-filemanagement .content-filemanagement .swap_colright .title-top .bt_delete label{margin:0; cursor:pointer;}
.ui-dialog-filemanagement .content-filemanagement .swap_colright .title-top .bt_delete span{display:none;}

.ui-dialog-filemanagement .content-filemanagement .swap_colright .title-sub{width:100%; color:#353535; background:rgba(255,255,255,.5); font-weight:bold; position:relative; float:left; font-size:12px; padding: 7px 8px 7px 7px; border-bottom:1px solid rgba(0,0,0,.07); border-top:1px solid rgba(0,0,0,.07)}
.ui-dialog-filemanagement .content-filemanagement .swap_colright .title-sub label{line-height:32px; margin:0}
.ui-dialog-filemanagement .content-filemanagement .swap_colright .title-sub .bt_delete{ height: 32px; line-height: 30px;  padding: 0 10px 0 29px; position:relative; font-size: 12px;color: rgba(0,0,0,.75); font-weight: bold;border-radius: 3px; border: 1px solid rgba(0,0,0,0.15); box-shadow: 0 1px 1px rgba(0,0,0,0.05);  display: block; float: right; background: #fff; transition:.3s;}
.ui-dialog-filemanagement .content-filemanagement .swap_colright .title-sub .bt_delete:before{width:30px; height:32px; position:absolute; top:0; left:0; line-height:32px; text-align:center; font-size:14px; font-family: 'FontAwesome'; content:"\f046"; font-weight:normal;}
.ui-dialog-filemanagement .content-filemanagement .swap_colright .title-sub .bt_delete:hover{color:#0c77bb;}
.ui-dialog-filemanagement .content-filemanagement .swap_colright .title-sub .bt_delete:focus{outline:none;}
.ui-dialog-filemanagement .content-filemanagement .swap_colright .title-sub .bt_delete label{margin:0; cursor:pointer; line-height:30px;}
.ui-dialog-filemanagement .content-filemanagement .swap_colright .title-sub .bt_delete span{display:none;}

.ui-dialog-filemanagement .content-filemanagement .swap_colright .content{ width:100%; height:273px; float:left; overflow:auto; overflow-x:hidden; padding: 10px;}
.ui-dialog-filemanagement .content-filemanagement .swap_colright .content.sub{height:147px;}
.ui-dialog-filemanagement .content-filemanagement .swap_colright .content ul.thumb-file{margin:0; padding:0; float:left; list-style: none; width:100%; border-left:1px solid rgba(0,0,0,.07);}
.ui-dialog-filemanagement .content-filemanagement .swap_colright .content ul.thumb-file li{float:left; width:20%; text-align: center;transition: .3s; border-right:1px solid rgba(0,0,0,.07); border-bottom:1px solid rgba(0,0,0,.07); padding-bottom: 5px; position:relative; }
.ui-dialog-filemanagement .content-filemanagement .swap_colright .content ul.thumb-file li.active{background:rgba(255,255,255,.7);}
.ui-dialog-filemanagement .content-filemanagement .swap_colright .content ul.thumb-file li:hover{background:rgba(255,255,255,.5);}
.ui-dialog-filemanagement .content-filemanagement .swap_colright .content ul.thumb-file li:after{content:''; width: 14px; height:14px; border:1px solid rgba(0,0,0,.15); border-radius:2px; position:absolute; top:4px; left:4px; z-index:1;}
.ui-dialog-filemanagement .content-filemanagement .swap_colright .content ul.thumb-file li:before{font-family: 'FontAwesome'; content:"\f00c"; position:absolute; top:3px; left:6px; font-size:10px; opacity:1; transition:.3s; z-index:2; display:none;}
.ui-dialog-filemanagement .content-filemanagement .swap_colright .content ul.thumb-file li.active:before{display:block;}

.ui-dialog-filemanagement .content-filemanagement .swap_colright .content ul.thumb-file li:nth-child(1),.ui-dialog-filemanagement .content-filemanagement .swap_colright .content ul.thumb-file li:nth-child(2),.ui-dialog-filemanagement .content-filemanagement .swap_colright .content ul.thumb-file li:nth-child(3),.ui-dialog-filemanagement .content-filemanagement .swap_colright .content ul.thumb-file li:nth-child(4),.ui-dialog-filemanagement .content-filemanagement .swap_colright .content ul.thumb-file li:nth-child(5){ border-top:1px solid rgba(0,0,0,.07);}
.ui-dialog-filemanagement .content-filemanagement .swap_colright .content ul.thumb-file li a{width:90px; height:90px; margin-top:10px; display:inline-block; text-align:center; font-size:0; position:relative;}
.ui-dialog-filemanagement .content-filemanagement .swap_colright .content ul.thumb-file li a:before {content: "";  display: inline-block; vertical-align: middle; height: 100%;}
.ui-dialog-filemanagement .content-filemanagement .swap_colright .content ul.thumb-file li a.folder:after{content:''; width:72px; height:72px; background:url(folder-l.png) no-repeat center; top:50%; left:50%; margin: -36px 0 0 -36px; position:absolute; z-index:1;}
.ui-dialog-filemanagement .content-filemanagement .swap_colright .content ul.thumb-file li a img { display: inline-block; vertical-align: middle; max-height: 100%; max-width: 100%; border-bottom:2px solid rgba(255,255,255,.5); box-shadow:  0 1px 1px rgba(0,0,0,.3); border-radius: 0 0 1px 1px; z-index:5; position:relative;}
.ui-dialog-filemanagement .content-filemanagement .swap_colright .content ul.thumb-file li span{font-size:12px; clear:both; float:left; width:100%; padding: 0 10px; line-height:20px; white-space:nowrap; text-align:center; overflow:hidden; text-overflow:ellipsis; }


.ui-dialog-filemanagement .content-filemanagement .swap_colright .content ul.list-file{width:100%; margin:0; padding:0; list-style:none;}
.ui-dialog-filemanagement .content-filemanagement .swap_colright .content ul.list-file li{width:100%; position:relative; transition:.3s; padding: 5px; margin: 1px; float:left;}
.ui-dialog-filemanagement .content-filemanagement .swap_colright .content ul.list-file li:hover{background:rgba(255,255,255,.5);}
.ui-dialog-filemanagement .content-filemanagement .swap_colright .content ul.list-file li a{width:20px; height:20px; display:inline-block; text-align:center; font-size:0; position:relative; float:left; }
.ui-dialog-filemanagement .content-filemanagement .swap_colright .content ul.list-file li a:before {content: "";  display: inline-block; vertical-align: middle; height: 100%;}
.ui-dialog-filemanagement .content-filemanagement .swap_colright .content ul.list-file li a img { display: inline-block; vertical-align: middle; max-height: 100%; max-width: 100%; z-index:5; position:relative;}
.ui-dialog-filemanagement .content-filemanagement .swap_colright .content ul.list-file li span{float:left; line-height:20px; padding-left:5px;}
.ui-dialog-filemanagement .content-filemanagement .swap_colright .content ul.list-file li a.folder:after{content:''; width:20px; height:20px; background:url(folder-s.png) no-repeat center; top:0; left:0; position:absolute; z-index:1;} 
.ui-dialog-filemanagement .content-filemanagement .swap_colright .content ul.list-file li.active{background:rgba(255,255,255,.7); padding-left: 28px;}
.ui-dialog-filemanagement .content-filemanagement .swap_colright .content ul.list-file li.active:after{content:''; width: 14px; height:14px; border:1px solid rgba(0,0,0,.15); border-radius:2px; position:absolute; top:8px; left:8px; z-index:1;}
.ui-dialog-filemanagement .content-filemanagement .swap_colright .content ul.list-file li.active:before{font-family: 'FontAwesome'; content:"\f00c"; position:absolute; top:8px; left:10px; font-size:10px; opacity:1; transition:.3s; z-index:2; }








li.column{list-style:none; float:left; margin-right:15px;}
li.column span {margin: 0; color: rgba(0,0,0,.85);  padding: 10px 0px 5px 0px; clear: both; font-size: 12px; text-align: left; display: block; font-weight: bold; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
li.column input[type='text']{height:34px;}
li.column .textbox{font-size: 12px;border: 1px solid rgba(0,0,0,.1); height:30px; border-radius: 3px; padding: 0 5px; color: #6a6a6a;  box-shadow: none; text-indent: 0.01px; transition:.3s;}
li.column .textbox:focus{outline:none; border-color:#0c77bb}
li.column .notebox{font-size: 12px;border: 1px solid rgba(0,0,0,.1); min-height:30px; border-radius: 3px; padding: 5px; color: #6a6a6a;  box-shadow: none; text-indent: 0.01px; transition:.3s; resize:none}
li.column .notebox:focus{outline:none; border-color:#0c77bb}

li.column.has-list{}
li.column.has-list span{display:initial; padding:initial; margin:initial;}
li.column.has-list span.title-column{width:100%; display:block; padding-top:10px; box-shadow:none; text-transform:uppercase; font-size:14px;}
li.column.has-list span.title-column:before{display:none;}
li.column.has-list #filter_right{top:-41px;}

.ui-dialog .titlepanel{width:100%; float:left; margin-top:15px; border-bottom: 1px solid rgba(0,0,0,.2)}
.ui-dialog .titlepanel .titletab{display:block; float:left; height:32px; line-height:32px; border: 1px solid transparent; border-bottom:none; font-size:12px; color:rgba(0,0,0,.5); padding: 0 15px; cursor:pointer; position:relative;}
.ui-dialog .titlepanel .titletab.active{border-color:rgba(0,0,0,.2); font-weight:bold; color:#0c77bb; border-radius: 4px 4px 0 0; cursor:default; }
.ui-dialog .titlepanel .titletab.active:before{content:''; width:100%; height:2px;background:#f7f8f8; position:absolute; top:100%; left:0; }
.tabcontentpanel .contentpanel{width:100%; padding: 0 0;}

.success-dialog .ui-dialog-title{ padding-left:15px; line-height:50px; color:#0c77bb; text-transform:uppercase;}
.success-dialog .ui-dialog-titlebar{height:50px; width:100%; float:left; background:#fff; border-radius: 5px 5px 0 0; box-shadow: inset 0 -1px rgba(0,0,0,.07)}
.ui-dialog.success-dialog .ui-dialog-content{width:100% !important; border-radius:0;}
.success-dialog .ui-dialog-buttonpane{height:50px; border-radius:0 0 5px 5px; width:100%; float:left; margin: 0; padding:0 10px 10px 10px; background:#f7f8f8;}

#dialog_JSObjCreate{width:100%; padding: 0 0 0 7px;}
#dialog_JSObjCreate .titlepanel{margin-top:5px; border-bottom:none;}


/* ********************************************************** 
                            Form Input
************************************************************ */
input[type='text'] {font-size: 12px;border: 1px solid rgba(0,0,0,.1); height:30px; border-radius: 3px; padding: 0 5px; color: #6a6a6a;  box-shadow: none; text-indent: 0.01px; transition:.3s;}
input[type='text']:focus{outline:none; border-color:#0c77bb}
select {font-size: 12px;border: 1px solid rgba(0,0,0,.1); height:30px; font-weight:normal; border-radius: 3px; padding-right:15px; padding-left:5px; color: #6a6a6a;  box-shadow: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; background: url(arrow-search.png) no-repeat scroll right center ; text-indent: 0.01px; transition:.3s;}
select:focus{outline:none; border-color:#0c77bb}
textarea {font-size: 12px;border: 1px solid rgba(0,0,0,.1); min-height:30px; border-radius: 3px; padding: 5px; color: #6a6a6a;  box-shadow: none; text-indent: 0.01px; transition:.3s; resize:none}
textarea:focus{outline:none; border-color:#0c77bb}


/* ********************************************************** 
                           HR Desk
************************************************************ */
#div_list_hr_Desk_Employee{overflow-y:auto; overflow-x:hidden; transition:.3s;}
#div_list_ass_Desk_Asset{overflow-y:auto; overflow-x:hidden; transition:.3s;}

#Panel_Right_Desk{ background: #fff; width: 250px; float: right; font-size:12px; position:absolute; top:50px; right:-250px;box-shadow: -1px 0 1px rgba(0,0,0,.15); transition:.3s; font-size:12px;}
#content_page_desk .bt_close_Panel_Right_Desk{ width: 38px; height: 32px; font-size: 14px; display: block; float: left; text-align: center; line-height: 32px; text-decoration: none;border: 1px solid rgba(0,0,0,.12); box-shadow: 0 1px 1px rgba(0,0,0,.07); color: rgba(0,0,0,.7); transition: .3s; background: #fffde5; border-radius:3px 0 0 3px; position:absolute; top:9px; right:48px; cursor:pointer; }
#content_page_desk .bt_close_Panel_Right_Desk:hover{box-shadow: inset  0 0 10px rgba(0,0,0,.05); background:#f5f2d7; color:#a09302;}
#content_page_desk.is-open .bt_close_Panel_Right_Desk{box-shadow: inset  0 0 10px rgba(0,0,0,.05); background:#f5f2d7; color:#a09302;}
#content_page_desk.is-open #Panel_Right_Desk{right:0px;}



#Panel_Right_Desk #Content_Inside_Panel_Right_Desk{ width: 100%; padding: 0; position: relative; font-size:12px; }
#Panel_Right_Desk #Content_Inside_Panel_Right_Desk #lb_count{ float:right; padding: 10px 15px; font-weight:bold;  }
#Panel_Right_Desk #Content_Inside_Panel_Right_Desk #lb_Viewing{ padding:10px 15px; float:left;}

#Panel_Right_Desk #Content_Inside_Panel_Right_Desk #div_position{ width: 100%;overflow: auto; border-top: 1px solid #e5e5e5; font-size:12px; margin:0; padding-left: 15px; background:rgba(0,0,0,.02);}
#Panel_Right_Desk #Content_Inside_Panel_Right_Desk #div_position ul{ width: 100%; margin:0; padding:0; list-style: none; overflow:hidden; float:right;}
#Panel_Right_Desk #Content_Inside_Panel_Right_Desk #div_position ul li{ margin:0; padding:4px 0px 7px 0; border-top: 1px solid #efeff0; position: relative; float: left; width : 100%; margin-top: -1px; display:block; clear:both;}
#Panel_Right_Desk #Content_Inside_Panel_Right_Desk #div_position ul li a{ text-decoration: none;  float: left; padding-top: 1px; }
#Panel_Right_Desk #Content_Inside_Panel_Right_Desk #div_position ul li:hover a{ cursor: pointer; font-weight: bold;}
#Panel_Right_Desk #Content_Inside_Panel_Right_Desk #div_position ul li:hover .number{ cursor: pointer; font-weight: bold;}
#Panel_Right_Desk #Content_Inside_Panel_Right_Desk #div_position ul li a.active{font-weight: bold;}
#Panel_Right_Desk #Content_Inside_Panel_Right_Desk #div_position ul li .number{float: right; height: 18px; padding: 1px 2px 0 2px; text-align: center; min-width: 18px; line-height: 18px; font-size: 11px; font-weight: bold; position: absolute; text-decoration: none; background: #00afef; color: #fff; top: 5px; right: 10px;border-radius: 3px;}
#Panel_Right_Desk #Content_Inside_Panel_Right_Desk #div_position ul li .number span{display:none; }

#Panel_Right_Desk #Content_Inside_Panel_Right_Desk #div_search{margin: 8px 0 0 0;}


#Panel_Right_Desk #Content_Inside_Panel_Right_Desk #div_sdtc{margin: 8px 0 0 0;}
#Panel_Right_Desk #Content_Inside_Panel_Right_Desk #sdtc{ width: 100%; overflow: auto; border-top: 1px solid rgba(0,0,0,.1); font-size:12px; margin:0 ; padding: 10px 0 10px 10px;}
#Panel_Right_Desk #Content_Inside_Panel_Right_Desk #sdtccontrol{ position: absolute; bottom:-33px; left:0; display: none; height: 25px; background: url(panel_right_Desk.png) no-repeat -250px -81px; width:190px; padding-left: 10px;}
#Panel_Right_Desk #Content_Inside_Panel_Right_Desk #sdtccontrol ul{ margin: 8px 0 0 -11px;}
#Panel_Right_Desk #Content_Inside_Panel_Right_Desk #sdtccontrol a{width: 15px; height:16px; display:block; float:left; margin:5px 5px 0 0; background: url(panel_right_Desk.png) no-repeat }
#Panel_Right_Desk #Content_Inside_Panel_Right_Desk #sdtccontrol a.CollapseAll{ background-position: -280px -107px; }
#Panel_Right_Desk #Content_Inside_Panel_Right_Desk #sdtccontrol a.CollapseAll:hover{ background-position: -295px -107px; }
#Panel_Right_Desk #Content_Inside_Panel_Right_Desk #sdtccontrol a.ExpandAll{ background-position: -250px -107px;}
#Panel_Right_Desk #Content_Inside_Panel_Right_Desk #sdtccontrol a.ExpandAll:hover{ background-position: -265px -107px;}
#Panel_Right_Desk #Content_Inside_Panel_Right_Desk #sdtccontrol a.ToggleAll{background-position: -310px -107px; }
#Panel_Right_Desk #Content_Inside_Panel_Right_Desk #sdtccontrol a.ToggleAll:hover{background-position: -325px -107px; }


/* ********************************************************** 
                    EmployeeInformation
************************************************************ */
.content_EmployeeInformation_View{ overflow: auto; margin:0; height:100%; padding:0 20px 20px 20px; float: left; overflow-y:auto; overflow-x:hidden; width:100%; position:relative; top:50px;}
.wrap-profile-detail{margin: 0 -10px; padding:0;}
.wrap-profile-detail .profile-item{padding: 20px 10px 0 10px; z-index:1}
.wrap-profile-detail .profile-item .title-item{display:block; font-size:15px; padding-bottom:5px; text-transform:uppercase; font-weight:bold}
.wrap-profile-detail .profile-item .box{display:block; padding: 15px 15px 15px 15px; background: #fff; border-radius: 4px; box-shadow: 0 1px 1px rgba(0,0,0,.1); text-align: center;  position: relative; color: #222a3a; text-decoration: none; transition:.3s;  border:1px solid transparent; float:left; width:100%; overflow:hidden;}
.wrap-profile-detail .profile-item .box .foot-box{line-height: 35px; height: 50px; border-top:15px solid #fff; border-radius: 0 0 4px 4px;background: #f6f8f9; box-shadow: inset 0 1px 1px rgba(0,0,0,.04); position: absolute; left: 0; bottom: 0; width: 100%; overflow: hidden; text-align: center; cursor:pointer; display:none;}
.wrap-profile-detail .profile-item .box .foot-box:before{font-family: 'FontAwesome'; content: "\f065"; font-size:14px; margin: -5px 8px 0 0; opacity:.5; display:inline;}
.wrap-profile-detail .profile-item.large-item .box{height:247px; padding: 15px 15px 50px 15px;}
.wrap-profile-detail .profile-item.large-item .box .foot-box{display:block;}

.wrap-profile-detail .profile-item.profile-item-extend .box .foot-box:before{content: "\f066";}
.wrap-profile-detail .profile-item .box .foot-box:after{content:'Click để xem thêm'; opacity:.5}
.wrap-profile-detail .profile-item.profile-item-extend .box .foot-box:after{content:'Click để thu ngắn';}
.wrap-profile-detail .profile-item.profile-item-extend{z-index:2;}
.wrap-profile-detail .profile-item.profile-item-extend .box{height:auto; border-color:#00afef;}
.wrap-profile-detail .profile-item.profile-item-extend .title-item{color:#00afef}

.wrap-profile-detail .profile-item .box.file{}
.wrap-profile-detail .profile-item .box.file .avatar{width: 160px; height:160px; overflow:hidden; display:block; border-radius:5px; vertical-align:top ; position:absolute; top:20px; left:20px;}
.wrap-profile-detail .profile-item .box.file .avatar img{width:100%;}
.wrap-profile-detail .profile-item .box.file ul li:nth-child(1),
.wrap-profile-detail .profile-item .box.file ul li:nth-child(2),
.wrap-profile-detail .profile-item .box.file ul li:nth-child(3),
.wrap-profile-detail .profile-item .box.file ul li:nth-child(4),
.wrap-profile-detail .profile-item .box.file ul li:nth-child(5),
.wrap-profile-detail .profile-item .box.file ul li:nth-child(6){padding-left: 185px; border:none; background:none; box-shadow:none; }
.wrap-profile-detail .profile-item .box.file ul li:nth-child(6){margin-bottom:15px;}
.wrap-profile-detail .profile-item .box.file ul li:nth-child(1) label,
.wrap-profile-detail .profile-item .box.file ul li:nth-child(2) label,
.wrap-profile-detail .profile-item .box.file ul li:nth-child(3) label,
.wrap-profile-detail .profile-item .box.file ul li:nth-child(4) label,
.wrap-profile-detail .profile-item .box.file ul li:nth-child(5) label,
.wrap-profile-detail .profile-item .box.file ul li:nth-child(6) label{width:120px;}


.wrap-profile-detail .profile-item .box ul{width:100%; float:left; margin:0; padding:0; list-style:none; position:relative; }
.wrap-profile-detail .profile-item .box ul li{display:table; padding:5px 0px; width:100%; clear:left; transition:.3s; min-height:30px; box-shadow:inset 0 1px rgba(0,0,0,.05) }
.wrap-profile-detail .profile-item .box ul li:hover{background:#e4d100; box-shadow:none; padding: 5px 10px;}
.wrap-profile-detail .profile-item .box ul li:first-child{box-shadow:none;}
.wrap-profile-detail .profile-item .box ul li label{ display:table-cell; text-align:left; vertical-align:text-bottom; width:160px; opacity:.7; }
.wrap-profile-detail .profile-item .box ul li span{display:table-cell; text-align:left; vertical-align:text-bottom; font-size:14px; color:#000}

/* autocomplete search */
ul.ui-autocomplete{background:#fff; border-radius: 0 0 3px 3px; padding: 10px; box-shadow: 0 1px 2px rgba(0,0,0,.05) }
ul.ui-autocomplete li{width:100%; float:left; position:relative; padding:5px 0px !important; border-bottom: 1px solid rgba(0,0,0,.05)}
ul.ui-autocomplete li:last-child{border:none;}
ul.ui-autocomplete li a{width:100%; float:left; position:relative; min-height:40px; padding-left:50px !important; text-decoration:none; transition:.3s;}
ul.ui-autocomplete li a:hover{text-decoration:none !important;}
ul.ui-autocomplete li a img{position:absolute; top:0; left:0; width:40px; height:40px;}
ul.ui-autocomplete li a span{display:block; font-weight:bold; color:#0c77bb;}
ul.ui-autocomplete li a h4{margin:0; padding:0; font-size:12px; font-weight:normal; display:block;}