:root {
  --blue-color: #1E4382;
  --red-color: #E01c37;
  --green-color: #1ce0b2;
  --yellow-color: #FDBA4C;
  --color-white: #FFF;
  --color-black: #000;
  --color-purple:purple;
  --background-color: #F9FBFE;
  --table-light-blue-color: #F8F9FA;
  --Table-gray-color: #DBE0E6;
}

body {
  /* Track */
  /* Handle */
  /* Handle on hover */
}

body::-webkit-scrollbar {
  width: 10px;
}

body::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 5px var(--blue-color);
          box-shadow: inset 0 0 5px var(--blue-color);
  border-radius: 5px;
}

body::-webkit-scrollbar-thumb {
  background: #1e43828c;
  border-radius: 10px;
}

body::-webkit-scrollbar-thumb:hover {
  background: #1e4382d5;
}

#toggle-table .wdith-title {
  width: 100px;
}

#toggle-table .uk-tab > * > a {
  border: none;
  color: var(--blue-color);
  font-size: 18px;
  letter-spacing: 1.2px;
}

#toggle-table .uk-tab > .uk-active > a {
  border: none;
  background-color: var(--blue-color);
  font-size: 18px;
  color: var(--color-white);
  border-radius: 4px;
}

.home-main .mu-nopad .ha-card-pu {
  border: 3px solid transparent;
}

.home-main .mu-nopad .ha-card-pu:hover {
  border: 3px solid var(--color-purple);
}

.home-main .mu-nopad .ha-card-pu p {
  font-size: 20px;
  color: var(--color-purple);
  font-weight: 700;
}

.ha-btn-pu
{
  background-color: var(--color-purple);
  color: var(--color-white);
  -webkit-transition: all .3s;
  transition: all .3s;
  font-size: 14px;
  font-weight: 400;
  padding: 2px 10px;
  border: 1px solid var(--color-purple);
}
.ha-btn-pu:focus {
  background-color: var(--color-purple);
  color: var(--color-white);
  -webkit-transition: all .3s;
  transition: all .3s;
  font-size: 14px;
  font-weight: 400;
  padding: 2px 10px;
  border: 1px solid var(--color-purple);
}

#all_data{
  margin-top: 3%;
}

.ha-btn-pu:hover {
  background-color: var(--color-white);
  color: var(--color-purple);
  border: 1px solid var(--color-purple);
}

.mu-btn-rad {
  border-radius: 4px;
}

.mu-btn-blue {
  background-color: var(--blue-color);
  color: var(--color-white);
  -webkit-transition: all .3s;
  transition: all .3s;
  font-size: 18px;
  font-weight: 400;
  border: 1px solid var(--blue-color);
}

.mu-btn-blue:focus {
  background-color: var(--blue-color);
  color: var(--color-white);
  -webkit-transition: all .3s;
  transition: all .3s;
  font-size: 18px;
  font-weight: 400;
  border: 1px solid var(--blue-color);
}

.mu-btn-blue:hover {
  background-color: var(--color-white);
  color: var(--blue-color);
  border: 1px solid var(--blue-color);
}

.mu-btn-bl {
  background-color: var(--blue-color);
  color: var(--color-white);
  -webkit-transition: all .3s;
  transition: all .3s;
  font-size: 14px;
  font-weight: 400;
  padding: 2px 10px;
  border: 1px solid var(--blue-color);
}

.mu-btn-bl:focus {
  background-color: var(--blue-color);
  color: var(--color-white);
  -webkit-transition: all .3s;
  transition: all .3s;
  font-size: 14px;
  font-weight: 400;
  padding: 2px 10px;
  border: 1px solid var(--blue-color);
}

.mu-btn-bl:hover {
  background-color: var(--color-white);
  color: var(--blue-color);
  border: 1px solid var(--blue-color);
}

.mu-btn-gr {
  background-color: var(--green-color);
  color: var(--color-white);
  -webkit-transition: all .3s;
  transition: all .3s;
  font-size: 14px;
  font-weight: 400;
  padding: 2px 10px;
  border: 1px solid var(--green-color);
}

.mu-btn-gr:focus {
  background-color: var(--green-color);
  color: var(--color-white);
  -webkit-transition: all .3s;
  transition: all .3s;
  font-size: 14px;
  font-weight: 400;
  padding: 2px 10px;
  border: 1px solid var(--green-color);
}

.mu-btn-gr:hover {
  background-color: var(--color-white);
  color: var(--green-color);
  border: 1px solid var(--green-color);
}

.mu-btn-re {
  background-color: var(--red-color);
  color: var(--color-white);
  -webkit-transition: all .3s;
  transition: all .3s;
  font-size: 14px;
  font-weight: 400;
  padding: 2px 10px;
  border: 1px solid var(--red-color);
}

.mu-btn-re:focus {
  background-color: var(--red-color);
  color: var(--color-white);
  -webkit-transition: all .3s;
  transition: all .3s;
  font-size: 14px;
  font-weight: 400;
  padding: 2px 10px;
  border: 1px solid var(--red-color);
}

.mu-btn-re:hover {
  background-color: var(--color-white);
  color: var(--red-color);
  border: 1px solid var(--red-color);
}

.mu-btn-ya {
  background-color: var(--yellow-color);
  color: var(--color-white);
  -webkit-transition: all .3s;
  transition: all .3s;
  font-size: 14px;
  font-weight: 400;
  padding: 2px 10px;
  border: 1px solid var(--yellow-color);
}

.mu-btn-ya:focus {
  background-color: var(--yellow-color);
  color: var(--color-white);
  -webkit-transition: all .3s;
  transition: all .3s;
  font-size: 14px;
  font-weight: 400;
  padding: 2px 10px;
  border: 1px solid var(--yellow-color);
}

.mu-btn-ya:hover {
  background-color: var(--color-white);
  color: var(--yellow-color);
  border: 1px solid var(--yellow-color);
}

.mu-btn-tran {
  background-color: transparent;
  color: var(--blue-color);
  -webkit-transition: all .3s;
  transition: all .3s;
  font-size: 16px;
  font-weight: 400;
  padding: 4px 10px;
  border: 1px solid transparent;
}

.mu-btn-tran:hover {
  background-color: var(--blue-color);
  color: var(--color-white);
  border: 1px solid transparent;
}

.mu-card {
  padding: 20px 4px;
  text-align: center;
  border-radius: 6px;
}

.mu-nopad {
  padding: 0px;
}

.mu-nopad .mu-menu {
  padding: 0px 40px;
}

.mu-nopad .mu-menu .mu-icon-menu {
  margin: 4px 20px 0px;
}

.mu-nopad .mu-menu .mu-icon-menu svg {
  width: 30px;
  color: var(--blue-color);
}

.mu-nopad .uk-navbar-container:not(.uk-navbar-transparent) {
  background-color: transparent;
}

.mu-nopad .uk-navbar-container:not(.uk-navbar-transparent) .pg-name p {
  font-size: 22px;
  font-weight: 600;
  margin: 25px 15px 25px;
  color: var(--blue-color);
}

.mu-nopad .uk-navbar-container:not(.uk-navbar-transparent) .mu-btn-noti {
  color: var(--blue-color);
}

.mu-nopad .uk-navbar-container:not(.uk-navbar-transparent) .img-pro {
  width: 50px;
}

.mu-nopad .bg-light {
  background-color: var(--background-color);
  padding: 30px 0px;
  border-radius: 70px 0px 0px 0px;
}

.mu-nopad .mu-card-re {
  border: 3px solid transparent;
}

.mu-nopad .mu-card-re:hover {
  border: 3px solid var(--red-color);
}

.mu-nopad .mu-card-re p {
  font-size: 20px;
  color: var(--red-color);
  font-weight: 700;
}

.uk-offcanvas-bar .uk-nav-parent-icon > .uk-parent > a::after {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2214%22%20height%3D%2214%22%20viewBox%3D%220%200%2014%2014%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Cpolyline%20fill%3D%22none%22%20stroke%3D%22%23666%22%20stroke-width%3D%221.1%22%20points%3D%2210%201%204%207%2010%2013%22%20%2F%3E%0A%3C%2Fsvg%3E");
  background-size: 60%;
}

.uk-offcanvas-bar .uk-nav-parent-icon > .uk-parent.uk-open > a::after {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2214%22%20height%3D%2214%22%20viewBox%3D%220%200%2014%2014%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Cpolyline%20fill%3D%22none%22%20stroke%3D%22%23666%22%20stroke-width%3D%221.1%22%20points%3D%221%204%207%2010%2013%204%22%20%2F%3E%0A%3C%2Fsvg%3E");
  background-size: 60%;
}

.uk-offcanvas-overlay::before {
  background-color: #ffffff00;
}

.uk-offcanvas-bar {
  background-color: var(--color-white);
  /* width */
  /* Track */
  /* Handle */
  /* Handle on hover */
}

.uk-offcanvas-bar::-webkit-scrollbar {
  width: 10px;
}

.uk-offcanvas-bar::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 5px var(--blue-color);
          box-shadow: inset 0 0 5px var(--blue-color);
  border-radius: 10px;
}

.uk-offcanvas-bar::-webkit-scrollbar-thumb {
  background: #1e43828c;
  border-radius: 10px;
}

.uk-offcanvas-bar::-webkit-scrollbar-thumb:hover {
  background: #1e4382d5;
}

.uk-offcanvas-bar .uk-close {
  color: var(--blue-color);
}

.uk-offcanvas-bar .uk-close svg {
  width: 18px;
}

.uk-offcanvas-bar .uk-close:hover {
  color: var(--blue-color);
}

.uk-offcanvas-bar .uk-nav-default .uk-nav-sub a {
  color: var(--blue-color);
  font-size: 14px;
  padding: 10px 0px;
}

.uk-offcanvas-bar .uk-nav-default .uk-nav-sub a:hover, .uk-offcanvas-bar .uk-nav-default .uk-nav-sub a:focus {
  color: var(--blue-color);
}

.uk-offcanvas-bar .mu-sidenav {
  margin: 40px 0px;
}

.uk-offcanvas-bar .mu-sidenav .icon-nav {
  width: 25px;
  margin: 0px 6px;
}

.uk-offcanvas-bar .mu-sidenav .mu-btn-nav {
  color: var(--blue-color);
  font-size: 19px;
  padding: 10px 0px;
}

.uk-offcanvas-bar .mu-sidenav .mu-btn-nav:hover, .uk-offcanvas-bar .mu-sidenav .mu-btn-nav:focus {
  color: var(--blue-color);
}

.uk-offcanvas-bar .mu-sidenav .active {
  font-weight: 700;
}

.bg-log-img {
  background-image: url("../img/login-bg.png");
  height: 100vh;
  background-size: cover;
}

.bg-log-img .lay-login {
  width: 25%;
}

.bg-log-img .lay-login .img-log {
  margin: 40px 0px 60px;
  width: 50%;
}

.bg-log-img .lay-login .mu-lable-fo {
  color: var(--blue-color);
  font-size: 26px;
  font-weight: 600;
  margin-bottom: 5px;
}

.bg-log-img .lay-login .mu-input-line {
  background-color: transparent;
  color: var(--blue-color);
  border: none;
  font-size: 19px;
  font-weight: 600;
  border-bottom: 2px solid #1e438291;
  margin-bottom: 20px;
}

.bg-log-img .lay-login .mu-input-line:active, .bg-log-img .lay-login .mu-input-line:focus {
  border-bottom-color: var(--blue-color);
}

.home-main .custom-nav {
  margin: 30px 0px 10px;
}

.home-main .custom-nav .mu-btn-nav {
  padding: 10px 20px;
  border: none;
  text-align: left;
  font-size: 16px;
}

.home-main .custom-nav .mu-btn-nav img {
  padding: 0px 10px;
  width: 45px;
}

.home-main .custom-nav li:hover {
  background-color: var(--background-color);
}

.home-main .custom-nav .mu-active {
  background-color: var(--background-color);
}

.home-main .mu-nopad {
  padding: 0px;
}

.home-main .mu-nopad .mu-card-re {
  border: 3px solid transparent;
}

.home-main .mu-nopad .mu-card-re:hover {
  border: 3px solid var(--red-color);
}

.home-main .mu-nopad .mu-card-re p {
  font-size: 20px;
  color: var(--red-color);
  font-weight: 700;
}

.home-main .mu-nopad .mu-card-gr {
  border: 3px solid transparent;
}

.home-main .mu-nopad .mu-card-gr:hover {
  border: 3px solid var(--green-color);
}

.home-main .mu-nopad .mu-card-gr p {
  font-size: 20px;
  color: var(--green-color);
  font-weight: 700;
}

.home-main .mu-nopad .mu-card-bl {
  border: 3px solid transparent;
}

.home-main .mu-nopad .mu-card-bl:hover {
  border: 3px solid var(--blue-color);
}

.home-main .mu-nopad .mu-card-bl p {
  font-size: 20px;
  color: var(--blue-color);
  font-weight: 700;
}

.home-main .mu-nopad .mu-card-ya {
  border: 3px solid transparent;
}

.home-main .mu-nopad .mu-card-ya:hover {
  border: 3px solid var(--yellow-color);
}

.home-main .mu-nopad .mu-card-ya p {
  font-size: 20px;
  color: var(--yellow-color);
  font-weight: 700;
}

.home-main .mu-nopad .mu-card-tran {
  padding: 0px;
  margin-top: 25px;
}

.home-main .bg-img-home {
  margin-top: 80px;
}

.home-main .table-view {
  margin: 50px 0px 15px;
}

.home-main .table-view .uk-table-striped tbody tr:nth-of-type(odd), .home-main .table-view .uk-table-striped > tr:nth-of-type(odd) {
  background: var(--color-white);
  border-top: 1px solid #e5e5e5;
  border-bottom: 1px solid #e5e5e5;
}

.home-main .table-view .uk-table th {
  color: var(--color-black);
}

.home-main .table-view .uk-table-hover tbody tr:hover, .home-main .table-view .uk-table-hover > tr:hover {
  background: #1e438265;
}

.home-main .table-view .uk-table-hover tbody tr:hover td, .home-main .table-view .uk-table-hover > tr:hover td {
  color: var(--color-black);
}

.mu-can-form {
  background-color: var(--background-color);
  border-radius: 60px 0px 0px 0px;
  width: 40%;
  /* Hide the browser's default radio button */
  /* Create a custom radio button */
  /* On mouse-over, add a grey background color */
  /* When the radio button is checked, add a blue background */
  /* Create the indicator (the dot/circle - hidden when not checked) */
  /* Show the indicator (dot/circle) when checked */
  /* Style the indicator (dot/circle) */
}

.mu-can-form .mu-btn-res {
  background-color: transparent;
  color: #cccccc;
}

.mu-can-form hr {
  border-top: 2px solid var(--blue-color);
  margin: 40px 0px 30px;
}

.mu-can-form h2 {
  position: absolute;
  z-index: 1000;
  top: 10px;
  left: 20px;
  padding: 5px;
  color: var(--blue-color);
}

.mu-can-form h4 {
  color: var(--blue-color);
  font-size: 20px;
  font-weight: 600;
}

.mu-can-form .cust-rad {
  display: block;
  position: relative;
  padding-left: 35px;
  padding-top: 3px;
  margin-bottom: 12px;
  cursor: pointer;
  color: var(--blue-color);
  font-size: 18px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.mu-can-form .cust-rad input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}

.mu-can-form .checkmark {
  position: absolute;
  top: 6px;
  left: 10px;
  height: 20px;
  width: 20px;
  background-color: transparent;
  border: 2px solid var(--blue-color);
  border-radius: 50%;
}

.mu-can-form .cust-rad:hover input ~ .checkmark {
  background-color: transparent;
}

.mu-can-form .cust-rad input:checked ~ .checkmark {
  background-color: transparent;
}

.mu-can-form .checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

.mu-can-form .cust-rad input:checked ~ .checkmark:after {
  display: block;
}

.mu-can-form .cust-rad .checkmark:after {
  top: 4px;
  left: 4px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--yellow-color);
}

.mu-can-form .uk-select:not([multiple]):not([size]) {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2224%22%20height%3D%2216%22%20viewBox%3D%220%200%2024%2016%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Cpolygon%20fill%3D%22%23666%22%20points%3D%2212%201%209%206%2015%206%22%20%2F%3E%0A%20%20%20%20%3Cpolygon%20fill%3D%22%23666%22%20points%3D%2212%2013%209%208%2015%208%22%20%2F%3E%0A%3C%2Fsvg%3E%0A");
}

.mu-can-form .mu-form {
  background-color: var(--color-white);
  border: 1px solid #ccccccbc;
  -webkit-transition: all .3s;
  transition: all .3s;
  border-radius: 4px;
  color: var(--color-black);
}

.mu-can-form .mu-form:focus {
  background-color: var(--color-white);
  border: 1px solid #cccccc;
  color: var(--color-black);
}

.mu-can-form .mu-form::-webkit-input-placeholder {
  color: var(--color-black);
}

.mu-can-form .mu-form:-ms-input-placeholder {
  color: var(--color-black);
}

.mu-can-form .mu-form::-ms-input-placeholder {
  color: var(--color-black);
}

.mu-can-form .mu-form::placeholder {
  color: var(--color-black);
}

.mu-can-form .avatar-upload {
  position: relative;
  max-width: 205px;
  margin: 30px auto;
}

.mu-can-form .avatar-upload .avatar-edit {
  position: absolute;
  right: 12px;
  z-index: 1;
  top: 10px;
}

.mu-can-form .avatar-upload .avatar-edit input {
  display: none;
}

.mu-can-form .avatar-upload .avatar-edit input + label {
  display: inline-block;
  width: 34px;
  height: 34px;
  margin-bottom: 0;
  border-radius: 100%;
  background: var(--blue-color);
  border: 1px solid transparent;
  -webkit-box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.12);
          box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.12);
  cursor: pointer;
  font-weight: normal;
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}

.mu-can-form .avatar-upload .avatar-edit input + label svg {
  margin: 4px;
}

.mu-can-form .avatar-upload .avatar-edit input + label:hover {
  background-color: #1e4382d5;
}

.mu-can-form .avatar-upload .avatar-preview {
  width: 192px;
  height: 192px;
  position: relative;
  border-radius: 100%;
  border: 6px solid #ccccccbc;
  -webkit-box-shadow: 0px 4px 6px 2px #1e4382ab;
          box-shadow: 0px 4px 6px 2px #1e4382ab;
}

.mu-can-form .avatar-upload .avatar-preview > div {
  width: 100%;
  height: 100%;
  border-radius: 100%;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}

@media (min-width: 960px) {
  .mu-can-form {
    width: 420px;
  }
}




.contact h4 {
  color: var(--blue-color);
  font-size: 20px;
  padding-top: 5px;
  font-weight: 600;
}

.contact .uk-margin {
  margin-bottom: 40px;
}

.contact .mu-nop {
  padding: 0px;
}

.contact .mu-nop .uk-input {
  background-color: var(--blue-color);
  color: var(--color-white);
  font-size: 16px;
  width: 100%;
}

.contact .mu-nop .uk-input::-webkit-input-placeholder {
  color: var(--color-white);
}

.contact .mu-nop .uk-input:-ms-input-placeholder {
  color: var(--color-white);
}

.contact .mu-nop .uk-input::-ms-input-placeholder {
  color: var(--color-white);
}

.contact .mu-nop .uk-input::placeholder {
  color: var(--color-white);
}

.contact .uk-input, .contact .uk-select, .contact .uk-textarea {
  background-color: var(--color-white);
  color: var(--color-black);
  border-color: #cccccc;
  border-radius: 4px;
  padding: 0px 4px;
}

.contact .uk-input::-webkit-input-placeholder, .contact .uk-select::-webkit-input-placeholder, .contact .uk-textarea::-webkit-input-placeholder {
  color: #a3a3a3;
}

.contact .uk-input:-ms-input-placeholder, .contact .uk-select:-ms-input-placeholder, .contact .uk-textarea:-ms-input-placeholder {
  color: #a3a3a3;
}

.contact .uk-input::-ms-input-placeholder, .contact .uk-select::-ms-input-placeholder, .contact .uk-textarea::-ms-input-placeholder {
  color: #a3a3a3;
}

.contact .uk-input::placeholder, .contact .uk-select::placeholder, .contact .uk-textarea::placeholder {
  color: #a3a3a3;
}

.contact .uk-input:focus, .contact .uk-select:focus, .contact .uk-textarea:focus {
  border-color: var(--blue-color);
  color: var(--color-black);
}

#btn-dele {
  display: none;
}





/*# sourceMappingURL=main.css.map */