/* --- Global --- */

/* --- SSO Login Box Begins --- */
.login-box {
    padding: 5rem 10rem;
}

.login-box h6 {
    font-size: 32px;
    font-weight: bold;
    color: #151515;
    margin-top: 40%;
    margin-bottom: 4rem;
}

/* .login-box .sub-heading {
    font-size: 16px;
    font-weight: bold;
    color: #abadc0;
    margin-bottom: 4rem;
} */

.login-box a
{
    text-decoration: none;
    font-weight: bold;
    font-size: 14px;
    color: #202970;
    display: inline-block;
    margin-top: 2rem;
}

.btn-sso
{
    background-color: #202970;
    margin-top: 2rem;
    padding-top: 1rem;
    padding-bottom: 1rem;
}

/* --- SSO Login Box Ends --- */

/* --- Banner Box Begins --- */
.banner-box {
    background-color: #002c77;
    height: 100vh;
}

.banner-box img{
    margin-top: 20%;
}

.banner-box h6
{
    font-size: 24px;
    font-weight: bold;
    color: #ffffff;
    margin-top: 2rem;
}

.banner-box p
{
    font-weight: bold;
    color: #abadc0;
    margin-top: 1rem;
}

/* --- Banner Box Ends --- */

/* --- Floating Input Box --- */

.form-group {
  position: relative;
  padding: 15px 0 0;
  margin-top: 10px;
}

.form-field {
  font-family: inherit;
  width: 100%;
  border: 0;
  border-bottom: 1px solid #d2d2d2;
  outline: 0;
  font-size: 16px;
  color: #212121;
  padding: 7px 0;
  background: transparent;
  transition: border-color 0.2s;
}

.form-field::placeholder {
  color: transparent;
}

.form-field:placeholder-shown ~ .form-label {
  font-size: 15px;
  cursor: text;
  top: 15px;
}

label,
.form-field:focus ~ .form-label {
  position: absolute;
  top: 0;
  display: block;
  transition: 0.2s;
  font-size: 12px;
  color: #9b9b9b;
}

.form-field:focus ~ .form-label {
  color: #202970;
}

.form-field:focus {
  padding-bottom: 6px;
  border-bottom: 2px solid #202970;
}

/* --- Floating Input Box Ends --- */

/* --- Mobile Resposive --- */

@media all and (max-width: 767px) {
	.login-box {
    padding: 5rem;
  }
  
  .login-box h6 {
    margin-top: 25%;
  }
}