:root {
  --button-width: 80px;
  --spinner-width: 20px;
  --blue: #0076d3;
  --btn-bg: #0076d3;
  --text-light: #fefefe;
}

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html,
body {
  min-height: 100vh;
}

body {
  background-image: url(../img/CADASTRO.webp);
  background-repeat: no-repeat;
  background-size: contain;
  color: white;
  font-family: 'Poppins', sans-serif;
}

main > .row {
  width: 25rem;
}


.login {
  background-color: var(--blue);
  border-radius: 10px;
  min-width: 30%;
  min-height: 100%;
}


.button {
  border: none;
  background-color: #fefefe;
  border-radius: 10px;
  color: #0076d3;
}


 @media only screen and (max-width:600px) {

  html,
  body {
    min-height: 80vh;
  }

      body {
        background-image: url("../img/background_azul_mobile.png");
        background-repeat: repeat;
      }

    main {
      margin: 0 !important;
      justify-content: center !important;

    }

    .acima_responsivo {
        display: flex;
        justify-content: center !important;
        align-items: center !important;
    }

      .responsivo {
        display: flex;
        justify-content: center !important;
        align-items: center !important;
      }

      .login {
        background-color: var(--text-light);
        color: var(--blue);
        margin-right: 1.2rem;
        width: 80% !important;
      }

      .thep {
        color: var(--blue) !important;
      }

      .button {
        background-color: var(--blue);
        color: var(--text-light) !important;
        font-weight: bold;
      }
    }
