body {
  font-family: "Poppins", sans-serif;
  margin: 0;
  box-sizing: border-box;
  min-height: 100vh;
  width: 100%;
  background-color: hsl(218, 41%, 15%);
  background-image: radial-gradient(
      650px circle at 0% 0%,
      hsl(218, 41%, 35%) 15%,
      hsl(218, 41%, 30%) 35%,
      hsl(218, 41%, 20%) 75%,
      hsl(218, 41%, 19%) 80%,
      transparent 100%
    ),
    radial-gradient(
      1250px circle at 100% 100%,
      hsl(218, 41%, 45%) 15%,
      hsl(218, 41%, 30%) 35%,
      hsl(218, 41%, 20%) 75%,
      hsl(218, 41%, 19%) 80%,
      transparent 100%
    );
}

.bg-glass {
  background-color: hsla(0, 0%, 100%, 0.9) !important;
  backdrop-filter: saturate(200%) blur(25px);
}

.card {
  box-shadow: 0px 0px 10px rgba(0, 255, 255, 0.7);
}

.card-body {
  border: 2px dotted orange;
  border-radius: 8px;
}

.gradient-custom-2 {
  background: #fccb90;
  background: -webkit-linear-gradient(
    to right,
    #ee7724,
    #d8363a,
    #dd3675,
    #b44593
  );
  background: linear-gradient(to right, #ee7724, #d8363a, #dd3675, #b44593);
}

.gradient-custom {
  background-image: url("../assets/images/logo/login_image.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  border-bottom-right-radius: 0.375rem;
  border-top-right-radius: 0.375rem;
}

#login_btn {
  border: none;
  color: #fff;
  transition: all ease 0.2s;
}

#login_btn:hover {
  transform: translateY(-1px);
  box-shadow: 0px 2px 2px 0px rgba(0, 255, 255, 0.7);
}

.right_div h4 {
  display: none;
  font-family: "Kaushan Script", cursive;
}
#togglePassword {
  cursor: pointer;
}

@media (max-width: 991px) {
  .gradient-custom {
    background-image: none;
    background: #fccb90;
    background: -webkit-linear-gradient(
      to right,
      #ee7724,
      #d8363a,
      #dd3675,
      #b44593
    );
    background: linear-gradient(to right, #ee7724, #d8363a, #dd3675, #b44593);
    border-bottom-left-radius: 0.375rem;
    border-top-right-radius: 0px;
  }

  .right_div h4 {
    display: flex;
  }
}