@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.13.1/font/bootstrap-icons.min.css");
*{
  box-sizing: border-box;
}
body{
  font-family: "Poppins", sans-serif;
  background-color: #0F0F0F;
  margin: 0 auto;
}
.geral{
  display: flex;
  width: 100%;
}
.lado-esquerdo {
  height: 100vh;
  width: 50%;
  background-size: cover;
  background-repeat: no-repeat;
}
.lado-direito {
  width: 50%;
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
  background-image: url(https://estudanteead.com/oficial/ava/frontend/image/presets/luz-branca.webp);
  background-repeat: no-repeat;
  background-size: 65%;
}
.box-login {
  background-color: #181818;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 20px;
  border-radius: 10px;
  flex-direction: column;
  border: solid 1px #212121;
  width: 70%;
}
img.logo-login {
  height: 100px;
}
.formulario-login {
  width: 100%;
  background: #0f0f0f;
  padding: 15px 10px;
  border: none;
  margin-bottom: 10px;
  margin-top: 10px;
  color: white!important;
  font-size: 17px;
  border-radius: 5px;
  outline: none !important;
}
.formulario-login:focus{
  outline: none !important;
}
.formulario-login:active{
  outline: none !important;
}
.formulario-login:-webkit-autofill,
.formulario-login:-webkit-autofill:hover,
.formulario-login:-webkit-autofill:focus,
.formulario-login:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 1000px #0f0f0f inset !important;
    box-shadow: 0 0 0 1000px #0f0f0f inset !important;
    -webkit-text-fill-color: #ffffff !important;
    caret-color: #ffffff;
    transition: background-color 9999s ease-in-out 0s;
    font-size: 17px;
}
label{
  color: white;
  font-size: 17px;
}
.parte-baixo {
  width: 100%;
}
button.botao-login {
  border: none;
  background: #373737;
  color: white;
  font-size: 20px;
  padding: 12px 20px;
  border-radius: 5px;
  width: 100%;
  margin: 10px 0;
  cursor: pointer;
  transition: 0.40s;
}
button.botao-login:hover {
  background: #2b2b2b;
}
button.botao-login:active {
  transform: translateY(4px);
  transition: none;
}
button.botao-login:focus {
  outline: none;
}
.infos {
  display: flex;
  gap: 10px;
  justify-content: space-between;
  border: solid 1px #373737;
  border-radius: 5px;
  padding: 10px;
}
.infos-title:nth-child(1),
.infos-title:nth-child(2) {
  border-right: 1px solid 373737;
  padding-right: 10px;
}
.infos-title {
  color: #747474;
  cursor: pointer;
  transition: 0.40s;
  font-size: 15px;
}
.infos-title:hover {
  color: #5d5d5d;
}
.link{
  text-decoration: none;
}
.errorlogin {
  background: #cf1f491f;
  padding: 11px;
  border-radius: 5px;
  margin-top: 10px;
  margin-bottom: 10px;
  color: #cf1f49;
  text-align: center;
  font-weight: 600;
  border: solid 2px #3c2127;
  display: none;
}
/* RESPONSIVO */
@media only screen and (max-width: 650px) {
  .geral {
    display: flex;
    width: 100%;
    flex-direction: column;
    height: 100vh;
  }
  .lado-esquerdo {
    height: 40vh;
    width: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    background-position-y: 35%;
    top: 0;
    position: fixed;
    z-index: -1;
  }
  .lado-direito {
    width: 100%;
  }
  .box-login {
    width: 90%;
  }
  .infos {
    flex-direction: column;
    align-items: center;
  }
}