@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@200;300;400;500&display=swap");
body {
  font-family: "Poppins", sans-serif;
}

img {
  max-width: 100%;
}

.fs-8 {
  font-size: 0.8rem;
}

.fs-9 {
  font-size: 0.9rem;
}

.m-title {
  font-size: 1.4rem;
  font-weight: 500;
  margin-bottom: 0.2rem;
}

.sub-title {
  font-size: 0.8rem;
  text-transform: capitalize;
  margin-bottom: 1rem;
}

.alert {
  font-size: 0.8rem;
  font-weight: 500;
}

.text-danger {
  color: #dc3545 !important;
  font-size: 10px;
}

.btn-primary {
  background: #244e95;
}
.btn-primary:focus:active {
  box-shadow: none;
}

.btn-danger {
  background: #d51835;
}

.btn-l {
  padding: 0.35rem 0.5rem;
  font-size: 0.875rem;
  margin-bottom: 0.5rem;
}

.auth-l {
  background-color: black;
  height: 100vh;
  position: relative;
}
.auth-l .overlay-image {
  background-size: cover;
  opacity: 0.3;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
.auth-l .auth-content {
  width: 65%;
  border-radius: 10px;
  box-shadow: 0 0 12px rgba(0, 0, 0, 0.4);
  overflow: hidden;
}
@media screen and (max-width: 768px) {
  .auth-l .auth-content {
    width: 90%;
  }
}
@media screen and (min-width: 1024px) {
  .auth-l .auth-content {
    width: 55%;
  }
}

.auth-content.is-register-page {
  width: 80%;
}

.form-information-area {
  float: left;
  background-color: #244e95;
  width: 100%;
  height: 100%;
  padding: 20px;
  position: relative;
  overflow: hidden;
}
.form-information-area .b-area .b-logo-areaa {
  float: left;
  width: 63px;
  margin-right: 10px;
}
@media screen and (max-width: 1024px) {
  .form-information-area .b-area .b-logo-areaa {
    width: 57px;
  }
}
.form-information-area .b-area .b-description {
  padding: 5px 0;
}
.form-information-area .b-area .b-description h1 {
  font-size: 0.89em;
  color: white;
  text-transform: uppercase;
  font-weight: 600;
}
.form-information-area .b-area .b-description h1 span {
  display: block;
  font-size: 0.9rem;
  font-weight: bold;
}
.form-information-area .im-area-b {
  position: absolute;
  left: -12px;
  width: 68%;
  bottom: -71px;
}
@media screen and (max-width: 1024px) {
  .form-information-area .im-area-b {
    left: -4px;
    width: 71%;
    bottom: -53px;
  }
}
@media screen and (max-width: 720px) {
  .form-information-area .im-area-b {
    display: none;
  }
}
.form-information-area .im-area-b img {
  transform: rotate(355deg);
}

.b-from-area {
  padding: 25px;
  background: white;
  min-height: 350px;
}
@media screen and (max-width: 1024px) {
  .b-from-area {
    max-height: 79vh;
    overflow-y: auto;
  }
}
.b-from-area .l-r-links a {
  color: black !important;
  margin-right: 0.5rem;
}

.input-l-r {
  position: relative;
}
.input-l-r i {
  position: absolute;
  top: 36.8px;
  right: 10.6px;
  font-size: 1.2rem;
}

.f-pw i {
  top: 4px;
  left: 13px;
  width: 8px;
}
.f-pw input {
  padding: 0.175rem 3.15rem;
}

.form-control {
  background: none;
  box-shadow: none;
  transition: all 300ms;
  height: 2.2rem;
  padding: 0.175rem 0.75rem !important;
}
.form-control:focus {
  box-shadow: none;
  border-color: #ced4da;
}

.form-group {
  margin-bottom: 0.8rem !important;
}

.form-group:focus {
  box-shadow: none;
}

.form-label {
  font-size: 0.9rem;
  font-weight: 500;
}

.form-group input,
.form-group select,
.input-group input {
  font-size: 0.8rem;
}

.register .modal-dialog {
  max-width: 49%;
  margin: 10% auto;
}
@media screen and (max-width: 1024px) {
  .register .modal-dialog {
    max-width: 80%;
  }
}
.register .modal-dialog .modal-content {
  background: #244e95;
  border-radius: 0;
  border: none;
  overflow: hidden;
}
.register .modal-dialog .modal-content .modal-body {
  margin: 0;
  padding: 0;
}

.modal-backdrop.show {
  opacity: 1;
}

.r-form-area {
  padding: 5% 10% 1px;
  background: #ffffff;
  min-height: 346px;
  position: relative;
}
.r-form-area .lang-switch {
  position: absolute;
  bottom: 18px;
  left: 41%;
}

.im-area-b-modal img {
  transform: rotate(-12deg);
}

.im-area-b-modal {
  position: absolute;
  top: 0;
  width: 64%;
  margin-top: 149px;
  left: 0;
  margin-left: -16px;
}

.im-area-b {
  position: absolute;
  left: -12px;
  width: 68%;
  bottom: -71px;
}
.im-area-b img {
  transform: rotate(355deg);
}

#success_msg {
  position: absolute;
  top: 19px;
  background: green;
  color: white;
  padding: 10px;
  width: 40%;
  right: 17px;
  z-index: 9999;
}

.ajaxloading {
  position: absolute;
  z-index: 99999;
  top: 0;
  height: 100%;
  width: 100%;
  background: rgba(48, 48, 48, 0.6196078431);
  color: white;
  text-align: center;
  vertical-align: middle;
  margin: 0 auto;
  padding: 15%;
  font-size: 51px;
}

.alert-dismissible .close {
  top: -4px;
}