body {
        font-family:Roboto;
    }

    input[type="text"], input[type="password"] {
        font-size: 1em;
        background-color: #ffffff;
        appearance:none;
        -webkit-appearance:none;
        border:none;
        border-radius:3px;
        margin-bottom:0.5em;
        margin-top:0.5em;
    }

    #login_container {
        margin: auto;
        margin-top: 100px;
        border: 2px solid black;
        background-color: lightgray;
        width: 330px;
        position: relative;
        border-radius: 10px;
    }

    #show_password_container {
        font-size:90%;
    }
    table {
        padding:20px;
    }
    #warning {
        text-align: center;
        top: 10px;
        position: relative;
        color: red;
        display: block;
    }
input[type=text], input[type=password]{
            /* all:unset; */
            appearance:none;
            -webkit-appearance: none;
            padding-top: 2px;
            padding-bottom: 2px;
            padding-left: 4px;
            margin-bottom:10px;
            margin-top:4px;
            /* margin-left: 2px; */
            /* //margin: 0px 0px 22px 0; */
            border: none;
            background-color: #f1f1f1;
            border-radius:4px;
            width:96%;
        }
        input[type=text]:focus, input[type=password]:focus {
            outline: none;
            border: 2px solid var(--accent-color); /* or your custom border */
            box-shadow: none;       /* remove default focus ring if any */
            margin-bottom:6px;
        }

.text-align-right {
    text-align:right;
}