.password-strength-message {
    display: inline-block;
    padding-left: 5px;
}

.very-weak {
    color: #ff0000;
    background-color: whitesmoke;
    padding: 5px;
}

.weak {
    color: #fd397a;
    background-color: whitesmoke;
    padding: 5px;
}

.mediocre {
    color: #ff8f00;
    background-color: whitesmoke;
    padding: 5px;
}

.strong {
    color: #008000;
    background-color: whitesmoke;
    padding: 5px;
}

.awesome {
    color: #5867dd;
    background-color: whitesmoke;
    padding: 5px;
}
#QRmodel {
    background-color: #1a4866;
    color: white;
    width: 339px;
    margin-left: 89px;
    margin-top: 144px
}

@media only screen and (max-width:767px) {
    #QRmodel {
        background-color: #1a4866;
        color: white;
        width: 339px;
        margin-left: 0px;
        margin-top: 144px
    }
}

@media(max-width:360px) {
    #QRmodel {
        background-color: #1a4866;
        color: white;
        width: 339px;
        margin-left: 0px;
        margin-top: 144px
    }
}

@media(max-width:411px) {
    #QRmodel {
        background-color: #1a4866;
        color: white;
        width: 339px;
        margin-left: 0px;
        margin-top: 144px
    }
}

@media(max-width:414px) {
    #QRmodel {
        background-color: #1a4866;
        color: white;
        width: 339px;
        margin-left: 0px;
        margin-top: 144px
    }
}



@media(max-width:1024px) {
    #QRmodel {
        background-color: #1a4866;
        color: white;
        width: 339px;
        margin-left: 0px;
        margin-top: 144px
    }
}