:root {
  --main-color:#3d568a;  
  --main-color1: #ffffff;  

  --main-font: 'Saira';
  --main-font1: 'monda';  
}

/* Primary Button  */

.login-primary-button {
  width: 100px;
  color: var(--main-color1);
  font-size: 16px;
  font-weight: 600;
  font-family: var(--main-font);
  background-color: var(--main-color);
  border-color: var(--main-color);
}

.login-primary-button:hover {
  color: var(--main-color);
  background-color: var(--main-color1);
  border-color: var(--main-color1);
}

.login-primary-button:focus {
  color:var(--main-color);
  background-color: var(--main-color1);
  border-color: var(--main-color1);
  box-shadow: 0 0 0 0.2rem rgba(61,86,138,.5);
}

.login-primary-button:not(:disabled):not(.disabled).active , .login-primary-button:not(:disabled):not(.disabled):active {
  color:var(--main-color);
  background-color: var(--main-color1);
  border-color: var(--main-color1);
}

.login-primary-button:not(:disabled):not(.disabled):active:focus {
  box-shadow: 0 0 0 0.2rem rgba(61,86,138,.5);
}

/* Login As Media */

/* .login-as-facebook , .login-as-google  {
  font-size: 16px;
  border: 1px solid #fff;
  background-color: inherit;
}

.login-as-facebook:hover , .login-as-google:hover{
  background-color: inherit;
  border-color: #fff;
}

.login-as-facebook svg , .login-as-google svg  {
  fill: #fff;
}

.login-as-facebook:hover .login-as-facebook-1 {
  fill: #3c5a99;
  background-color: #fff;
  border-radius: 2px;
}

.login-as-google:hover .login-as-google-1 {
  fill: #4285f4;
}

.login-as-google:hover .login-as-google-2 {
  fill: #34a853;
}

.login-as-google:hover .login-as-google-3 {
  fill: #fbbc04;
}

.login-as-google:hover .login-as-google-4 {
  fill: #ea4335;
} */



.login-error-msg {
  color: red; 
  font-family: 'monda';
  font-weight: bold; 
  background-color: rgba(255,255,255,.1); 
  backdrop-filter: blur(10px); 
  padding: 20px 20px; 
  border-radius: 20px;
}




.forgot-password-link {
  color: #606060;
  font-size: 14px;
}

.forgot-password-link:hover {
  color: var(--main-color);
  text-decoration: none;
}

.signup-paragraph {
  color: #fff;
  font-size: 14px;
  font-family: 'Monda';
}

.signup-link {
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  font-family: 'Saira';
}

.signup-link:hover {
  color: #85DD86;
  text-decoration: none;
}

.signup-button:hover {
  text-decoration: none;
}

.form-control:focus {
  box-shadow: 0 0 0 0.2rem rgb(0 32 91 / 25%);
}

.login-footer a, .login-footer label {
  color: #606060;
}

.login-footer a:hover {
  color: var(--main-color);
  text-decoration: none;
}


/* Outer page Common Form */

.outer-page-form-1 {
  font-family: 'Monda';
}

/* Outer page Common Form Input Title */

.outer-page-form-1 .form-input-title {
  color: #4B6079;
  font-size: 14px;
}

/* Outer page Common Form Input */

.outer-page-form-1 .form-input {
  height: initial;
  color: #4B6079;
  background-color: #F2F2F2;
  font-size: 14px;
  border: 0px;
  padding: 1px 6px;
}

.outer-page-form-1 .login-input {
  height: 40px;
  color: #434343;
  font-size: 14px;
  background-color: rgba(61,86,138,0.1);
  border: 0px;
}

.outer-page-form-1 .login-input::placeholder {
  color: #434343;
}

.outer-page-form-1 .login-input:hover {
  background-color: rgba(61,86,138,0.3);
}