div.field{
    width: 100%;
    /* margin-top: 20%; */
    /* border: 1px solid; */
    border-radius: 5px;
    background: #f1f1f1;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
input.password{
    width: 80%;
    /* font-size: 110%; */
    padding: 1% 0% 1% 3%;
    background: none;
    border: none;
    outline: none;
}
div.show-pass, div.gen-pass{
    font-size: 90%;
    font-weight: 600;
    color: #A1A5B7;
    background-color: #f5f8fa;
    cursor: pointer;
    margin-right: 2%;
    display: flex;
    align-items: center;
}
i.material-icons{
    font-size: 200%;
}
div.show-pass::selection, div.gen-pass::selection, div.show-pass > *::selection, div.gen-pass > *::selection{
    background: none;
}

div.progress-bar{
    padding: 1% 0%;
    margin-top: 1%;
    display: flex;
    justify-content: space-between;
}
div.progress-bar > div {
    border: 1px solid lightgrey;
    width: 22%;
    height: 8px;
    border-radius: 5px;
}

div.percentage{
    border: 1px solid lightgrey;
    /* margin: 10% auto 0% auto; */
    /* width: 200px; */
    /* height: 200px; */
    /* border-radius: 20%; */
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 1.2em;
}
div.percentage > div.digit{
    font-size: 1.2em;
}