input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus
input:-webkit-autofill, 
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
  -webkit-text-fill-color: inherit !important;
   -moz-text-fill-color: inherit !important;
  -webkit-box-shadow: 0 0 0px 1000px #FFFFFF inset;
  transition:background-color 5000s ease-in-out 0s;
}

/*===========*/
.accessSystem{
  background:#fff;
  display:grid; grid-template-columns:65% 35%; min-height:100vh;
  overflow-y:scroll;
}
.graphic{
	background:url('../../images/bottom_graphic.png');
	background-repeat:no-repeat;
	background-position:bottom;
	background-size:100%;
	max-width:450px;
}

.graphic h1{
  font-family: 'Segoe UI';
  font-weight:900; font-size:24px; line-height:32px;
  color:#48378A;
  padding-left:50px; padding-top:46px;
}
.graphic .logo h1{
	font-weight:500; font-size:25px; line-height:35px;
	text-align:center;
	color:#0D0D0D;
	padding-top:10px;
}
.graphic .logo img{width:45%;}

.graphicText{
  width:515px;
  display:grid;
  align-content:center;
  padding-left:45px; margin-top:60px;
}

.graphicText h2{
  font-family: 'Poppins';
  font-style:normal; font-weight:700; font-size:40px; line-height:52px;
  color:#0D0D0D;
}

/* ============= */    
.rightPanel {background-color:#FF5A00;}
.userForm.gradientBox {
  border-radius: 10px;
  background-color: #fff;
  box-shadow: 0px 0px 40px rgba(0, 0, 0, 0.08);
  padding: 40px 40px;
  text-align: center;
  margin-top: 40px;
  min-height: calc(100vh - 80px);
}

.userForm {
  position: relative;
  top: 0px;
  right: 50%;
}
.userForm .alert{text-align:center;}

.userForm h3{
  font-weight:400; font-size:32px; line-height:48px;
  text-align:center;
  letter-spacing:0.01em;
  color:#0D0D0D;
}
.userForm h4{
	font-size:16px; font-weight:400;
	color:#535353;
	letter-spacing:0.5px;
	padding:15px 0px; margin-bottom:20px;
}

.userForm ul li {margin-bottom:20px;}
.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-bottom:1px solid #efefef;
	width:100%;
	font-weight:400; font-size:16px;
	color:#0D0D0D;
	padding:12px 58px;
}
.passwordField a span{top:calc(50% - 13px);}
.userForm ul li input[type="email"]:focus,
.userForm ul li input[type="password"]:focus,
.userForm ul li input[type="text"]:focus{border:1px solid #efefef;}
.userForm ul li .validation{text-align:left;}

.userForm ul li .emailIcon {
	background:url('../../images/mail_icon.svg');
	background-repeat:no-repeat;
	background-size:22px;
    background-position:20px;
}
.userForm ul li .passwordIcon {
	background:url('../../images/lock_icon.svg');
	background-repeat:no-repeat;
	background-size:22px;
    background-position:20px;
 }

/*========*/
.loginButtonPanel:after{content:" "; display:block; clear:both;}
.loginButtonPanel .buttonLeft{text-align:right; font-size:13px; margin-bottom:24px;}
.loginButtonPanel .buttonLeft label{font-size:13px; margin-top:0px; float:left;}
.loginButtonPanel .buttonLeft a{color:#535353; text-decoration:underline; font-size:13px;font-weight:400;padding-bottom: 10px;}

/*================*/
.privacyPolicy{text-align:right; padding:15px 0px;}
.privacyPolicy a {
	font-size:14px; font-weight:400;
	color:rgb( 255, 255, 255); opacity:0.7;
	letter-spacing:0.5px;	
	text-decoration:underline;
}

.ipAddress P{color:#535353;}

/* 
	===============================	
	FOR IPAD  1024
	===============================
*/
@media only screen and (max-width:1050px)
{
	
}

/* 
	===============================	
	FOR IPAD 768
	===============================	
*/
@media only screen and (max-width:980px){
	.accessSystem{display:block;}
	.graphic{max-width:100%; background-image:none;}
	.graphic .logo{display:block; text-align:center;}
	.graphicText{margin-top:10px;}
	.userForm.gradientBox {padding:15px; margin:0px;box-shadow:none;}
	.userForm h4{margin-bottom:0px;}
	.gradientBox{min-height:100vh; display:grid; align-items:center; overflow:hidden;}
	.userForm .gradientBox{min-height:100vh;}
	.userForm{right:0px;}
	.rightPanel{background:#fff;}
	.submitBtn{max-width:100%!important;}
}	

/* 
	===============================	
	For Mobile
	===============================	
*/

@media only screen and (max-width:767px){
	
	/*==============*/
	.graphic{background-image:none;}
	.graphic h1{padding-left:0px;}
	.graphicText{margin-top:10px;}
	.graphic .logo{display:block; text-align:center;}
	.userForm.gradientBox {padding:15px; margin:0px;box-shadow:none;}
	.userForm h4{margin-bottom:0px;}
	
}