html, body{
  height: 100%;
  background-image: url("../img/bg_login.jpg"); /* The image used */
  background-color: #ffffff; /* Used if the image is unavailable */
  background-position: left 0px bottom 50px;
  background-repeat: no-repeat; /* Do not repeat the image */
  background-size: auto auto; /* Resize the background image to cover the entire container */
}

#login {
    position: absolute;
    top: calc(50% - 200px);
    right: 10%;
    max-height: 300px;
    width: 320px;
}

.page#login img{
    height: 40px;
    width: auto;
    margin-top: 15px;
}

.input-field .prefix {
    font-size: 1.5rem;
    top: 1.0rem;
}

a.btn-link{
  display: block;
  margin-top: 20px;
  font-size: 12px;
  color: #333;
}

#toast-container {
    bottom: auto !important;
    left: auto !important;
    right: 50px;
    top: 10%;
}



@media only screen and (max-width: 600px){
  #login {
    right: calc(50% - 160px);
  }

  #toast-container {
      min-width: auto;
  }
}