
body{
    margin: 0;
    padding: 0;
    font-family: sans-serif;
    background-color: #1f2a35;
}

.box{
    width: 300px;
    padding: 40px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #191919;
    text-align: center;
    border-radius: 25px;
}

#login-title{
    color: #045541;
    text-transform: uppercase;
    font-weight: 550;
}

#bienvenida-title{
    color: #045541;
    font-weight: 500;
}

input{
    border: 0;
    background: none;
    display: block;
    margin: 20px auto;
    text-align: center;
    border: 2px solid #045541;
    padding: 14px 10px;
    width: 200px;
    outline: none;
    color: white;
    border-radius: 20px;
    transition: 0.25s;
}

/* Change the white to any color */
input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus, 
input:-webkit-autofill:active{
    -webkit-box-shadow: 0 0 0 30px #191919 inset !important;
    color: white;
}

input:focus{
    width: 250px;
    border-color: #042a55;
}


input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus
{
    color: white;
}

.button{
    border: 0;
    background: none;
    display: block;
    margin: 20px auto;
    text-align: center;
    border: 2px solid #0c2c50;
    padding: 14px 40px;
    outline: none;
    color: white;
    border-radius: 20px;
    transition: 0.25s;
    cursor: pointer;
}

.button:hover{
    background-color: #0c2c50;
}

.box-dashboard{
    width: 500px;
    padding: 40px;
    position: absolute;
    top: 25%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #191919;
    text-align: center;
    border-radius: 25px;
}

.texto-dashboard{
    color: #ffffff;
    text-align: justify;
}

#mensaje{
    color: firebrick;
}