html,
body {
  height: 100%;
}

body {
  align-items: center;
  background-color: #f5f5f5;
}


.form-signin {
  width: 100%;
  max-width: 380px;
  padding: 80px 0px 60px 0px;
  margin: auto;
}

.form-signin .checkbox {
  font-weight: 400;
}

.form-signin .form-floating:focus-within {
  z-index: 2;
}

.form-signin input[type="email"] {
  margin-bottom: -1px;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}

.form-signin input[type="password"] {
  margin-bottom: 10px;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}


/* Settings for screens with a max width of 1600px. */
@media (max-width: 1600px)
{
  /* default values for all objects on 1300px or less screens */ 
  :root 
  {
    font-size: 16px;    
  }    
    
  #miupi_image  
  {
    width: 80%;
  }
    
  #portal_de_servicios_text
  {
    font-size: 30px;
    line-height: 42px;
    font-weight: 200;
    color: #667; 
    text-shadow: 0 1px 1px rgb(255 255 255 / 60%);
    padding: 0px 0px 0px 0px;
  }
    
  #title  
  {
    font-size: 20px;;
  }    
    
}


/* Settings for screens with a max width of 1300px. */
@media (max-width: 1300px)
{
  /* default values for all objects on 1300px or less screens */ 
  :root 
  {
    font-size: 14px;    
  }      
    
  #miupi_image  
  {
    width: 60%;
  }
 
  #portal_de_servicios_text
  {
    font-size: 25px;
    line-height: 42px;
    font-weight: 200;
    color: #667; 
    text-shadow: 0 1px 1px rgb(255 255 255 / 60%);
    padding: 0px 0px 0px 0px;
  }    
    
  #title  
  {
    font-size: 18px;;
  }       
    
    
}
    
    
/* Settings for screens with a max width of 600px. */
@media (max-width: 600px)
{
  #miupi_image  
  {
    width: 40%;
  }    
    
    
}