/*********************************** KERNEL *****************************************/
.moonlight_msgbox{
	padding:10px; 
}

.moonlight_desc{
	font-size:12px;
	font-weight:normal;
}

.moonglight_designer{
	display:none;
	text-align:left;
}

/*********************************** GENERAL *****************************************/
.login_card{
	box-shadow: 0px 0px 15px 5px #d3d8d7;
}

.nav_shadow{
	box-shadow: 0px 0px 5px 1px #000;
}

footer {
  height: 50px;
  margin-top: -50px;
}

/*********************************** ERROR *****************************************/
input.error{
}
div.error {
	margin-left:2px;
	margin-bottom:2px;
	display:block;
	padding: 5px;
}
span.error {
	display:inline;
	padding: 2px;
}

/*********************************** PAGE BREAK FOR WKTHMLTOPDF *****************************************/
@media print {
	.tb_footer {page-break-after: always;}
}

/*********************************** SIDE MENU *****************************************/
.side-menu-header {
	display:flex;
	justify-content: center;
	align-items: center;
	padding-right: 20px;
}

.side-menu-header img {
	margin: 0 5px;
	height: 28px;
}

/*********************************** SIDE MENU *****************************************/

.container-bg {
	background-repeat: no-repeat;
	background-attachment: fixed; 
	background-size: cover;
	background-position: 25% 50%;
	width: 100vw;
	height: 100vh;
}

.login-panel-side {
	display:flex; 
	flex-direction: column;
	width: 70vw;
	float: right;
}

.sidebar-mini
.layout-fixed
.sidebar-open,
.brand-text2{
	margin-top:-28px;
	margin-right:-20px;
	visibility:hidden;
}

.main-sidebar{
	overflow-x: hidden;
}

/* @media (min-width: 576px) { */
@media (min-width: 320px) {
	.container-bg {
		background-position: 30% 50%;
	}

	.login-panel-side {
		width: 100vw;
		float: none;
		transform: scale(0.8);
	}
}
  
@media (min-width: 768px) {
	.container-bg {
		background-position: 25% 50%;
	}

	.login-panel-side {
		transform: scale(0.8) translate(0px, -10vh);
		width: 70vw;
		float: right;
	}
}

@media (min-width: 992px) {
	.container-bg {
		background-position: 25% 50%;
	}
	
	.login-panel-side {
		transform: scale(1);
		width: 70vw;
		float: right;
	}
	
	.sidebar-mini.sidebar-collapse .brand-text2,
	.sidebar-mini.sidebar-collapse .nav-sidebar .nav-link p, .sidebar-mini.sidebar-collapse.sidebar .user-panel>.info{
		margin-top:-28px;
		margin-right:-20px;
		visibility:visible;
	}
	
	.sidebar-mini.sidebar-collapse .main-sidebar.sidebar-focused .brand-text2, .sidebar-mini.sidebar-collapse .main-sidebar.sidebar-focused .logo-xl, .sidebar-mini.sidebar-collapse .main-sidebar.sidebar-focused .nav-sidebar .nav-link p, .sidebar-mini.sidebar-collapse .main-sidebar.sidebar-focused .user-panel>.info, .sidebar-mini.sidebar-collapse .main-sidebar:hover .brand-text2, .sidebar-mini.sidebar-collapse .main-sidebar:hover .logo-xl, .sidebar-mini.sidebar-collapse .main-sidebar:hover .nav-sidebar .nav-link p, .sidebar-mini.sidebar-collapse .main-sidebar:hover .user-panel>.info{
		margin-top:-28px;
		margin-right:-20px;
		visibility:hidden;
	}
}

@media (max-height: 414px) and (max-width: 825px) {
	.login-panel-side {
		transform: scale(0.65);
		width: 70vw;
		float: right;
	}
}

@media (max-height: 375px) and (max-width: 825px) {
	.login-panel-side {
		transform: scale(0.5) translate(0px, -10vh);
		width: 70vw;
		float: right;
	}
}

@media (max-height: 320px) and (max-width: 825px) {
	.login-panel-side {
		transform: scale(0.5);
		width: 70vw;
		float: right;
	}
}


/* Amended design by SAINS */
.login_card {
    box-shadow: none !important;
}