body{
  margin:0;
  height:auto;
  background:#020617;

}
body h1,
h2,
h3,
h4,
h5 {
    font-family: 'Playfair Display', serif;
}

body p,
a{
  font-family: 'poppins', sans-serif;
}
/* MAIN CARD */
.login-container{
  width:100%;
  height:auto;
  display:flex;
  border-radius:0; 
  box-shadow:none;
}
/* LEFT SIDE */
.login-left{
  flex:1;
  background:linear-gradient(135deg,#020f2097,#22c55e73) , url('https://i.pinimg.com/1200x/99/b5/5b/99b55bf72517cace04609230aeb89388.jpg')center/cover no-repeat;
  color:#fff;
  padding:0px 40px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-height: 100vh;
}

.login-left h1{
  font-weight:700;
  margin-bottom:15px;
}

/* RIGHT SIDE */
.login-right{
  flex:1;
  background:#020617;
  color:#fff;
  padding:40px 35px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-height: 100vh;
}

@media (max-width:900px) {
  .login-right{
    height:auto ;
  }
}
/* LOGO */
.login-logo{
  display:block;
  margin:0 auto 20px;
  width:160px;
}

/* TITLE */
.login-title{
  text-align:center;
  margin-bottom:20px;
}

/* INPUT */
.form-control{
  background:transparent;
  border:none;
  border:1px solid #334155;
  border-radius:10px;
  color:#fff;
  padding: 10px;
}

.form-control:focus{
  box-shadow:none;
  border-color:#22c55e;
  background: inherit;
  color: #FFF;
}
.form-control::placeholder{
  color: #a5a5a5;
}

/* BUTTON */
.login-btn{
  background: linear-gradient(135deg, #2F86D6, #5BB6FF);
  color: #fff;
  border:none;
  border-radius:30px;
  padding:12px;
  font-weight:600;
  margin-top:20px;
}
label{
  margin-bottom: 10px;
}

/* SOCIAL */
.social-login{
  text-align:center;
  margin-top:20px;
}

.social-btn{
  width:45px;
  height:45px;
  border-radius:50%;
  border:1px solid #334155;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin:0 5px;
  color:#fff;
  transition:.3s;
}

.social-btn:hover{
  background:#22c55e;
  border-color:#22c55e;
}

/* MOBILE */
@media(max-width:768px){
  .login-left{
    display:none;
  }
}

/* checkbox */
.form-check-input{
  background-color:transparent;
  border:1px solid #334155;
}

.form-check-input:checked{
  background-color:#22c55e;
  border-color:#22c55e;
}

/* label */
.form-check-label{
  font-size:14px;
}

/* forgot password */
.forgot-link{
  font-size:14px;
  text-decoration:none;
  color:#22c55e;
}

.forgot-link:hover{
  text-decoration:underline;
}

.hyper-link{
  text-decoration: none;
  color: #22c55e;
}