.userAccess{
	min-height:100vh;
	display:grid; grid-template-columns:calc(100% - 500px) 500px;
}

/* ======== */
.leftPanel{
	padding-left:50px;
	background:url('../../images/login-left-bg.png');
	background-repeat:no-repeat;
	background-size:100%;
	background-position:bottom center;
}

.leftPanel .logo{padding: 30px 0px;}
/* ======== */
.rightPanel{
	background:#F8FAFB; padding:10px 50px 0px;
	box-shadow: -7px 4px 25px rgba(0, 0, 0, 0.06);
}

.rightPanel h2{
	font-weight: 400;
	font-size: 32px;
	line-height: 48px;
	text-align: center;
	color: #353049;
	margin-bottom: 12px;
}
.rightPanel h4{
	font-weight: 400;
	font-size: 16px;
	line-height: 24px;
	text-align: center;
	color: #9D97B5;
	margin-bottom:40px;
}

.rightPanel nav{text-align:right; padding-top:18px; margin-bottom:25px}
.rightPanel nav .border{font-size:14px; font-weight:600; color:#252A5E;}
.rightPanel nav .border:after{
	content:"";
	display:block;
	border-bottom:3px solid #252A5E;
	width:20px;
	position:absolute;
	left:14px; bottom:-12px;
}
.rightPanel nav .btn{
	font-size: 14px; font-weight:600;
	color: #FFFFFF;
	background: #64DDBB;
	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.05);
	border-radius: 45px;
	padding:10px 20px;
	margin-left: 40px;
}


/* ======== */
.userForm form{
	background:#fff;
	border-radius:15px;
	border:2px solid #EEE;
	overflow:hidden;
	margin:45px 0px 0px; padding:30px;
}
.userForm ul li .validation{height:auto;}
.userForm ul li input[type="email"],
.userForm ul li input[type="password"],
.userForm ul li input[type="text"]{
	border:1px solid #f3f3f3;
	width:100%; 
	font-weight:400; font-size:15px; color:#5c718e;
	/* background:none; */
	padding:13px 58px;
	letter-spacing:0.5px;
	border-radius:6px;
}
.userForm ul li input[type="email"]:focus,
.userForm ul li input[type="password"]:focus,
.userForm ul li input[type="text"]:focus{border-bottom-color:#2671ce;}

.userForm ul li .validation{text-align:left; padding:0pxpx; min-height:22px;}

.userForm ul li .emailIcon{
	background:url('../../images/login-mail.svg');
	background-color:#FBFBFB;
	background-repeat:no-repeat;
	background-size:21px;
    background-position:20px;
}
.userForm ul li .passwordIcon{
	background:url('../../images/login-lock.svg');
	background-color: #FBFBFB;
	background-repeat:no-repeat;
	background-size:21px;
    background-position:20px;
}

/*========*/
.loginButtonPanel{padding:10px 0px 10px;}

.loginButtonPanel .submitBtn .btn{
	background-color: #64DDBB;
	box-shadow: -5px 15px 10px #DEEDE9;
	border-radius: 6px;
	background-image:none;
}
/*========*/
.forgotPassword {
	width:100%;
	font-weight: 400;
	font-size: 12px;
	line-height: 18px;
	text-decoration-line: underline;
	color: #AEA8C6;
	text-align: right;
	padding: 20px 0px 0px 0px;
}




/* 
	===============================	
	For Mobile
	===============================	
*/
@media only screen and (max-width:767px){
	
	/*==============*/
	.userAccess{display:block;}
	.rightPanel {padding:10px 30px 0px;}
	.rightPanel nav{text-align:center;}
	
	/*==============*/
	.leftPanel{background:none; padding-left:0px;}
	.leftPanel .logo{text-align:center;}
	
}