@import url('https://fonts.googleapis.com/css2?family=Arapey&display=swap');

body.login_bg {
  /* background: radial-gradient(circle at 1% 20%, rgb(232, 185, 66) 0%, rgb(31, 31, 31) 99.2%); */
  /* background: rgba(38, 38, 38, 1);
  background: -moz-linear-gradient(left, rgba(38, 38, 38, 1) 0%, rgba(138, 129, 60, 1) 50%, rgba(38, 38, 38, 1) 100%);
  background: -webkit-gradient(left top, right top, color-stop(0%, rgba(38, 38, 38, 1)), color-stop(50%, rgba(138, 129, 60, 1)), color-stop(100%, rgba(38, 38, 38, 1)));
  background: -webkit-linear-gradient(left, rgba(38, 38, 38, 1) 0%, rgba(138, 129, 60, 1) 50%, rgba(38, 38, 38, 1) 100%);
  background: -o-linear-gradient(left, rgba(38, 38, 38, 1) 0%, rgba(138, 129, 60, 1) 50%, rgba(38, 38, 38, 1) 100%);
  background: -ms-linear-gradient(left, rgba(38, 38, 38, 1) 0%, rgba(138, 129, 60, 1) 50%, rgba(38, 38, 38, 1) 100%);
  background: linear-gradient(to right, rgba(38, 38, 38, 1) 0%, rgba(138, 129, 60, 1) 50%, rgba(38, 38, 38, 1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#262626', endColorstr='#262626', GradientType=1); */
  background: rgba(38, 38, 38, 1);
  background-image: radial-gradient(circle, #cddad9, #c7d3d4, #c2cbce, #bdc4c8, #b8bdc1, #a6aaae, #94979b, #828588, #616466, #434546, #272828, #0a0b0b);
  background: -webkit-gradient(left top, right top, color-stop(0%, rgba(38, 38, 38, 1)), color-stop(45%, rgb(136, 136, 134)), color-stop(50%, rgb(172, 172, 171)), color-stop(55%, rgb(180, 180, 179)), color-stop(100%, rgba(38, 38, 38, 1)));
  background: -webkit-linear-gradient(circle, #cddad9, #b1bebf, #96a2a6, #7d878d, #666d74, #565c62, #464c51, #373c40, #2b3032, #212425, #171919, #0a0b0b);
  background: -o-linear-gradient(circle, #cddad9, #b1bebf, #96a2a6, #7d878d, #666d74, #565c62, #464c51, #373c40, #2b3032, #212425, #171919, #0a0b0b);
  background: -ms-linear-gradient(circle, #cddad9, #b1bebf, #96a2a6, #7d878d, #666d74, #565c62, #464c51, #373c40, #2b3032, #212425, #171919, #0a0b0b);
  background: linear-gradient(circle, #cddad9, #b1bebf, #96a2a6, #7d878d, #666d74, #565c62, #464c51, #373c40, #2b3032, #212425, #171919, #0a0b0b);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#262626', endColorstr='#262626', GradientType=1);
}

.card.card-transparent {
  width: 100%;
  background: rgba(231, 231, 231, 0.8) !important;
}

/* label {
  display: block;
  position: relative;
  margin: 40px 0px;
} */

.label-txt {
  font-family: 'Arapey', serif;
  position: absolute;
  top: -1.1em;
  padding: 10px;
  font-size: 1.2em;
  letter-spacing: 1px;
  color: rgb(241, 241, 241);
  transition: ease .3s;
}

/* .input {
  width: 100%;
  padding: 10px;
  background: transparent;
  border: none;
  outline: none;
  color: #f4ca34;
  background: transparent;
} */

.line-box {
  position: relative;
  width: 100%;
  height: 2px;
  background: #BCBCBC;
}

.line {
  position: absolute;
  width: 0%;
  height: 2px;
  top: 0px;
  left: 50%;
  transform: translateX(-50%);
  background: #f4ca34;
  transition: ease .6s;
}

/* .input:focus+.line-box .line {
  width: 95%;
} */

.label-active {
  top: -2em;
  color: #f4ca34;
}

/* button {
  display: inline-block;
  padding: 12px 24px;
  background: rgb(220, 220, 220);
  font-weight: bold;
  color: rgb(120, 120, 120);
  border: none;
  outline: none;
  border-radius: 3px;
  cursor: pointer;
  transition: ease .3s;
} */

/* button:hover {
  background: #08aadb;
  color: #ffffff;
} */

.line-danger {
  position: absolute;
  width: 0%;
  height: 2px;
  top: 0px;
  left: 50%;
  transform: translateX(-50%);
  background: #ff2a2a;
  transition: ease .6s;
}

#info-loading {
  display: none;
}

/* #btn-inline-form {
  position: absolute;
  top: 7px;
  right: 0px;
} */

/* #btn-inline-form2 {
  position: absolute;
  top: 7px;
  left: -20px;
} */

img.img-full {
  width: 100% !important;
}

.bg-dark-primary{
  background-color: rgb(26, 30, 53);
}

.bg-gold {
  background-color: rgb(182, 141, 9);
}

button#btn-inline-form{
  padding-top: 4px;
}