/*custom style*/
.layout-wrapper {
    height: 100vh;
    position: relative;
    z-index: 900;
    display: flex;
    flex-direction: column;
}
.main-header {
    background: #eeeeee;
    padding: .75rem 2rem;
    margin: 0 0 1.25rem 0;
}
.top-bar {
    display: flex;
    justify-content: space-between;
}
.top-bar-userbox,
.top-bar-brand {
    display: flex;
    align-items: center;
}
.top-bar-brand .logo img {
    max-width: 240px;
    height: auto;
}
.top-bar-brand .logo .logo-dark {
    display: none;
}
.top-bar-user a,
.top-bar-brand a {
    color: #727272;
}
.top-bar-user a:hover,
.top-bar-brand a:hover {
    color: #bf0000;
}
.top-bar-brand i {
    font-size: 1.25rem;
    width: 1.25rem;
    text-align: center;
}
.top-bar-user i {
    font-size: 1.25rem;
    margin-right: .25rem;
}
.main-content  {
    padding: 0;
    margin: 0;
    display: flex;
    flex-grow: 1;
    min-height: 0;
}
.aside {
	width: 300px;
    flex: 0 0 auto;
    background-color: #fafafa;
    padding: 1rem 0;
	position: fixed;
	overflow: hidden;
	top: 80px;
	bottom: 0;
	left: 0;
	z-index: 1000;
	transition: all 0.3s ease;
}
.main {
	position: relative;
	flex: 1 1 auto;
	padding: 0 2rem 0 320px;
	min-width: 0;
	z-index: 900;
	transition: all 0.3s ease;
}
.sidebar-mini .aside {
	width: 78px;
	/*background-color: #eeeeee;*/
	transition: all 0.3s ease;
}
.sidebar-mini .aside:hover {
	width: 300px;
	box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.10);
	transition: all 0.3s ease;
}
.sidebar-mini .main {
	padding-left: 98px;
	transition: all 0.3s ease;
}

.content-box {
	display: flex;
	flex-direction: column;
	height: 100%;
}
.form-default {
	display: flex;
	flex-direction: column;
	min-height: 0;
	height: 100%;
}
.modal .form-default {
	max-height: 75vh;
}
.form-default .form-containar {
	overflow-y: auto;
	flex: 1;
}
.form-default .form-content {
	padding-right: 1rem;
	position: relative;
}
.bottom-buttons-line {
	background: #eeeeee;
	padding: 1.25rem 2rem 1.5rem 1.25rem;
	margin: 0 -2rem 0 -1.25rem;
	flex: 0 0 80px;
	display: flex;
}
.modal .bottom-buttons-line {
	margin: 0 -1rem -1rem -1rem;
	border-radius: 0 0 0.3rem 0.3rem;
	padding: 1rem 2rem 1rem 1.125rem;
	flex: 0 0 65px;
}
.modal .modal-table-container {
	height: 75vh;
}

.side-menu {
	height: 100%;
	overflow-y: auto;
}
.side-menu ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
}
.side-menu .menu.menu-root > li > a {
    text-transform: uppercase;
}
.side-menu .menu > .menu-item > .menu .menu-link {
    padding-left: 5.3rem;
    line-height: 1.15rem;
}
.side-menu .menu-link {
    padding: .5rem 2rem;
    font-size: 0.875rem;
    font-weight: 300;
    outline: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    position: relative;
    display: block;
    color: #727272;
    text-decoration: none;
}
.side-menu .menu .menu-item .menu-link:hover {
    color: #bf0000;
}
.side-menu .menu > .menu-item.has-active > .menu-link {
    color: #bf0000;
}
.side-menu .menu-item.has-active > .menu-link {
    color: #bf0000;
}
.side-menu .menu > .menu-item > .menu-link {
    color: #727272;
}
.side-menu .menu-item.has-active.has-child > .menu-link {
    /*color: #727272;*/
    font-weight: 400;
}
.side-menu .menu-link > i {
    width: 35px;
    text-align: center;
    font-size: 1.25rem;
	vertical-align: middle;
}
.side-menu .menu-link > i:before {
	display: block;
	width: 25px;
	text-align: center;
	height: 21px;
}
.side-menu .menu > .menu-item > .menu .menu-link > i {
    /*font-size: .5rem;
    vertical-align: calc(100% - 6px);*/
	display: none;
}
.side-menu .menu > .menu-item > .menu .menu-link {
    position: relative;
}
.side-menu .menu > .menu-item > .menu .menu-link:before {
	content: "";
	width: 6px;
	height: 6px;
	position: absolute;
	background-color: #727272;
	top: 14px;
	left: 4.5rem;
	border-radius: 1px;
}
.side-menu .menu > .menu-item.has-active > .menu-link:before {
	background-color: #bf0000;
}
.side-menu .menu .menu-item .menu-link:hover:before,
.side-menu .menu > .menu-item.has-active .menu-link:hover:before {
	background-color: #bf0000;
}
.side-menu .menu .menu-item .menu-link {
 display:flex;
 align-items:center
}
.side-menu .menu .menu-item .menu-link[data-toggle="collapse"]:after {
	font-family: 'Font Awesome 5 Free';
	font-weight: 900;
	display: block;
	margin-left: auto;
	content: "\f078";
	transition: transform .2s;
}
.side-menu .menu .menu-item .menu-link[data-toggle=collapse][aria-expanded=true]:after {
 transform:rotate(-180deg)
}
.sidebar-mini .aside .side-menu {
	overflow: hidden;
}
.sidebar-mini .side-menu .menu-text {
	display: none;
	transition: all 0.3s ease;
}
.sidebar-mini .side-menu .menu-link {
	padding: .5rem 0 .5rem 2rem;
}
.sidebar-mini .side-menu .menu .menu-item .menu-link[data-toggle="collapse"]:after,
.sidebar-mini .side-menu .menu .menu-item .menu-link[data-toggle=collapse][aria-expanded=true]:after {
	display: none;
}
.sidebar-mini .side-menu .menu > .menu-item > .menu {
	display: none;
}

.sidebar-mini .aside:hover .side-menu {
	overflow-y: auto;
}
.sidebar-mini .aside:hover .side-menu .menu-text {
	display: block;
	transition: all 0.3s ease;
}
.sidebar-mini .aside:hover .side-menu .menu-link {
	padding: .5rem 2rem;
}
.sidebar-mini .aside:hover .side-menu .menu > .menu-item > .menu .menu-link {
    padding-left: 5.3rem;
}
.sidebar-mini .aside:hover .side-menu .menu .menu-item .menu-link[data-toggle="collapse"]:after,
.sidebar-mini .aside:hover .side-menu .menu .menu-item .menu-link[data-toggle=collapse][aria-expanded=true]:after {
	display: block;
}
.sidebar-mini .aside:hover .side-menu .menu > .menu-item > .menu {
	display: inherit;
}
.sidebar-mini .aside:hover .side-menu .menu > .menu-item > .menu.collapse:not(.show) {
    display: none;
  }

.main-title {
    background: #fafafa;
    padding: .5rem 1rem;
    font-size: 1.5rem;
    font-weight: 400;
    color: #333333;
}
.buttons-line {
    display: flex;
    justify-content: space-between;
}
.left-buttons-box,
.right-buttons-box {
    display: flex;
    align-items: center;
}
.pagination-line {
    font-size: .875rem;
}
/*login page*/
.login-page .layout-wrapper {
	background: #a30000;
	background: -moz-linear-gradient(45deg, #a30000 0%, #ce1010 50%, #a30000 100%);
	background: -webkit-linear-gradient(45deg, #a30000 0%,#ce1010 50%,#a30000 100%);
	background: linear-gradient(45deg, #a30000 0%,#ce1010 50%,#a30000 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a30000', endColorstr='#a30000',GradientType=1 );
}
.login-page .container-fluid {
	width: 1140px;
	height: 600px;
	overflow: auto;
	margin-top: 10vh;
	margin-bottom: 5vh;
	border-radius: 20px;
	-webkit-box-shadow: 0px 0px 100px 0px rgba(0,0,0,0.5);
	-moz-box-shadow: 0px 0px 100px 0px rgba(0,0,0,0.5);
	box-shadow: 0px 0px 100px 0px rgba(0,0,0,0.5);
}
.login-box {
	height: 600px;
	background: #eeeeee;
	padding: 4rem 4rem 1rem 4rem;
	flex: 0 0 45%;
	max-width: 45%;
}
.login-logo {
	text-align: center;
	margin-bottom: 3rem;
}
.login-box .login-form {
}
.login-box .login-form h2 {
	text-align: center;
	margin-bottom: 1.75rem;
	text-transform: uppercase;
}
.login-notice {
	text-align: center;
	margin-top: 1.5rem;
	font-size: 0.8rem;
	color: #777777;
}
.login-bg {
    background-image: url(../img/loginImg.jpg);
	background-repeat: no-repeat;
	background-position: 0 0;
	flex: 0 0 55%;
	max-width: 55%;
}
.login-page .form-control {
	background-color: #eeeeee;
	border: 1px solid #c1c1c1;
}
.login-page .qrcode {
	display: inline-block;
	padding: 10px;
	background: #ffffff;
}
.pin-group small {
	text-align: center;
}


/*input pin code*/
.pin-code {
	width: 385px;
	height: 38px;
	padding: 0.375rem 0.75rem 0.375rem 127px;
	letter-spacing: 28px;
	text-align: left;
	font-size: 24px;
	font-weight: 400;
	line-height: 30px;
	background: url(../img/pinDots.png) no-repeat 130px 14px;
	font-family: "Fira Sans", "Roboto","Helvetica","Arial",sans-serif;
}
.pin-code.pinDots-4 {
	background-position: 130px 14px;
}
.pin-code.pinDots-3 {
	background-position: 130px -26px;
}
.pin-code.pinDots-2 {
	background-position: 130px -66px;
}
.pin-code.pinDots-1 {
	background-position: 130px -106px;
}
.pin-code.pinDots-0 {
	background-position: 130px -132px;
}

/* tile icons*/
.tile {
	display: inline-block;
	width: 1.75rem;
	height: 1.75rem;
	color: #ffffff;
	font-weight: 600;
	font-size: 1rem;
	background-color: #e4e4e4;
	line-height: 1.75rem;
	text-align: center;
	vertical-align: middle;
	border-radius: .2rem;
	margin: 0 0.125rem;
}
.tile i {
	width: 100%;
	height: 100%;
	text-align: center;
	font-size: 1.125rem;
	display: inline-block;
}
.tile i:before {
	line-height: 1.75rem;
}
.tile i.fa-pen {
	font-size: 1rem;
}
.tile i.fa-times {
	font-size: 1.4rem;
}
.tile i.fa-comment-alt:before {
	line-height: 2rem;
}

/*custom tree*/

.custom-content-block {
	flex: 1;
	overflow-y: auto;
	padding-right: 1rem;
	margin-bottom: 1rem;
}
.custom-tree-control {
	padding: 0;
	list-style-type: none;
}
.custom-tree-control li.collapsed > ul {
	display: none;
}
.custom-tree-control ul {
	list-style-type: none;
}
.custom-tree-control li .custom-tree-ico {
	width: 2.25rem;
	height: 2.25rem;
	background: #eeeeee;
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	font-family: 'Font Awesome 5 Free';
	font-weight: 900;
	display: block;
	margin-left: auto;
	transition: transform .2s;
	text-align: center;
	line-height: 2.25rem;
	color: #727272;
}
.custom-tree-control li.has-children.collapsed .custom-tree-ico {
	background: #eeeeee;
}
.custom-tree-control li.has-children .custom-tree-ico {
	background: #fef1d0;
}

.custom-tree-control li.has-children {
	background-color: #fefaf1;
	padding-bottom: 0.25rem;
}
.custom-tree-control li.has-children.collapsed {
	padding-bottom: 0;
}
.custom-tree-control li.has-children .custom-tree-ico:before,
.custom-tree-control li.has-children li.has-children .custom-tree-ico:before,
.custom-tree-control li.has-children li.has-children li.has-children .custom-tree-ico:before,
.custom-tree-control li.has-children li.has-children li.has-children li.has-children .custom-tree-ico:before {
	content: "\f068";
}
.custom-tree-control li.has-children.collapsed .custom-tree-ico:before,
.custom-tree-control li.has-children li.has-children.collapsed .custom-tree-ico:before,
.custom-tree-control li.has-children li.has-children li.has-children.collapsed .custom-tree-ico:before {
	content: "\f067";
}
.custom-tree-control li.has-children li .custom-tree-ico:before,
.custom-tree-control li.has-children li.has-children li .custom-tree-ico:before,
.custom-tree-control li.has-children li.has-children li.has-children li .custom-tree-ico:before {
	content: "";
}
.custom-tree-control ul li .custom-tree-ico {
	width: 1.2rem;
	height: 1.2rem;
	background: transparent;
	content: "";
	position: absolute;
	left: -1.75rem;
	top: 0.45rem;
	font-family: 'Font Awesome 5 Free';
	font-weight: 900;
	display: block;
	margin-left: auto;
	transition: transform .2s;
	text-align: center;
	line-height: 1.2rem;
	color: #727272;
}
.custom-tree-control li.has-children li .custom-tree-ico,
.custom-tree-control li.has-children li.has-children .custom-tree-ico,
.custom-tree-control li.has-children li.has-children.collapsed .custom-tree-ico {
	background: transparent;
}
.custom-tree-control li {
	padding: 0 0 0 2.25rem;
	position: relative;
}
.custom-tree-control .has-children ul {
	position: relative;
	padding: 0;
	margin-left: 2.8rem;
}
.custom-tree-control .has-children ul li {
	padding: 0;
	position: relative;
}
.custom-tree-control .custom-tree-item {
	display: flex;
	align-items: center;
	min-height: 2.25rem;
	padding: 0.25rem 0.5rem 0.25rem 1rem;
	background-color: #fafafa;
	margin: 0.5rem 0;
}
.custom-tree-control li.has-children.collapsed .custom-tree-item {
	background-color: #fafafa;
}
.custom-tree-control li.has-children .custom-tree-item {
	background-color: #fff7e3;
}
.custom-tree-control li.has-children li .custom-tree-item,
.custom-tree-control li.has-children li.has-children .custom-tree-item,
.custom-tree-control li.has-children li.has-children.collapsed .custom-tree-item {
	background-color: #fef1d0;
	margin: 0 0 0.25rem 0;
}
.custom-tree-control .custom-tree-item .custom-control,
.custom-tree-control .custom-tree-item .item-label {
	flex: 1 1 auto;
	min-height: auto;
}
.custom-tree-control .custom-control-label:before {
	background-color: #ffffff;
}
.custom-tree-control .custom-tree-item .tile {
	flex: 0 0 auto;
}


/*custom table*/
.floatThead-wrapper {
	display: flex;
	overflow-y: auto;
}



/*button + icon*/
.btn i {
	margin-right: 0.25rem;
}


/*dark skin*/
.skin-dark .main-header {
	background: #30343e;
}
.skin-dark .top-bar-user a,
.skin-dark .top-bar-brand a {
	color: #8d8d9e;
}
.skin-dark .top-bar-user a:hover,
.skin-dark .top-bar-brand a:hover {
	color: #f31b1b;
}
.skin-dark .top-bar-brand .logo .logo-dark {
    display: block;
}
.skin-dark .top-bar-brand .logo .logo-light {
    display: none;
}
.skin-dark .main-title {
	background: #30343e;
	color: #ffffff;
}
.skin-dark .aside {
	background: #30343e;
}
.skin-dark .side-menu .menu-link, 
.skin-dark .side-menu .menu > .menu-item > .menu-link {
	color: #cfd2da;
}
.skin-dark .side-menu .menu > .menu-item > .menu .menu-link:before {
	background-color: #cfd2da;
}
.skin-dark .side-menu .menu .menu-item .menu-link:hover:before, 
.skin-dark .side-menu .menu > .menu-item.has-active .menu-link:hover:before {
	background-color: #f31b1b;
}
.skin-dark .side-menu .menu > .menu-item.has-active > .menu-link:before {
	background-color: #f31b1b;
}
.skin-dark .side-menu .menu .menu-item .menu-link:hover {
	color: #f31b1b;
}
.skin-dark .side-menu .menu > .menu-item.has-active > .menu-link {
	color: #f31b1b;
}
.skin-dark .bottom-buttons-line {
	background: #1e2127;
}
.skin-dark .custom-tree-control li .custom-tree-ico {
	background: #3e424d;
	color: #cfd2da;
}
.skin-dark .custom-tree-control .custom-tree-item {
	background-color: #30343e;
}
.skin-dark .custom-tree-control li.has-children.collapsed .custom-tree-ico {
	background: #3e424d;
}
.skin-dark .custom-tree-control li.has-children.collapsed .custom-tree-item {
	background-color: #30343e;
}
.skin-dark .custom-control-label:before {
	background-color: transparent;
}
.skin-dark .custom-checkbox .custom-control-input:checked ~ .custom-control-label:before {
	background-color: #bf0000;
	border-color: #bf0000;
}
.skin-dark .custom-radio .custom-control-input:checked ~ .custom-control-label:before {
	background-color: #bf0000;
	border-color: #d4aaaa;
}
.skin-dark .custom-tree-control li.has-children {
	background-color: #626a7f;
}
.skin-dark .custom-tree-control li.has-children .custom-tree-ico {
	background: #3e4963;
}
.skin-dark .custom-tree-control li.has-children .custom-tree-item {
	background-color: #4d576f;
}
.skin-dark .custom-tree-control li.has-children li .custom-tree-item, 
.skin-dark .custom-tree-control li.has-children li.has-children .custom-tree-item, 
.skin-dark .custom-tree-control li.has-children li.has-children.collapsed .custom-tree-item {
	background-color: #3e4963;
}
.skin-dark .custom-tree-control li.has-children li .custom-tree-ico, 
.skin-dark .custom-tree-control li.has-children li.has-children .custom-tree-ico, 
.skin-dark .custom-tree-control li.has-children li.has-children.collapsed .custom-tree-ico {
	background: transparent;
}


